From 0a5e40d7cb08a6cbcae273489b92f66d8f1688d4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torsten=20L=C3=BCcke?= <privat@torsten-hettstedt.de>
Date: Mon, 12 Apr 2021 14:11:00 +0200
Subject: [PATCH] =?UTF-8?q?Es=20gibt=20ein=20Objekt=20'Controller',=20dass?=
 =?UTF-8?q?=20die=20Funktionen=20f=C3=BCr=20die=20Tasten-Aktionen=20sammel?=
 =?UTF-8?q?t.=20Es=20gibt=20nun=20eine=20Initialisierung-Funktion.=20Wenn?=
 =?UTF-8?q?=20eine=20Bearbeitung=20abgebrochen=20wird,=20wird=20nicht=20je?=
 =?UTF-8?q?des=20mal=20die=20Liste=20neu=20geladen.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ui/src/routes/WorkingHours.svelte | 54 ++++++++++++++++++++-----------
 1 file changed, 36 insertions(+), 18 deletions(-)

diff --git a/ui/src/routes/WorkingHours.svelte b/ui/src/routes/WorkingHours.svelte
index 442da7f..aae1de7 100644
--- a/ui/src/routes/WorkingHours.svelte
+++ b/ui/src/routes/WorkingHours.svelte
@@ -24,7 +24,7 @@
                     return res.json();
                 })
                 .then(data => {
-                    activeRecord = null;
+                    Controller.cancelActiveRecord();
                     params.records = data;
                     params.isLoading = false;
                 })
@@ -45,7 +45,7 @@
                 .then(data => {
                     activeRecord = data;
                     if (date === null) {
-                        Records.browse();
+                        Controller.listRecords();
                     }
                 })
                 .catch(err => {
@@ -73,8 +73,7 @@
                     }
                 })
                 .then(() => {
-                    newRecord = false;
-                    Records.browse();
+                    Controller.listRecords();
                 })
                 .catch(err => {
                     console.log(err);
@@ -101,14 +100,39 @@
                     }
                 })
                 .then(() => {
-                    Records.browse();
+                    Controller.listRecords();
                 })
                 .catch(err => {
                     console.log(err);
                 });
         }
     };
-    Records.browse();
+    const Controller = {
+        'listRecords': () => {
+            Controller.cancelActiveRecord();
+            Records.browse();
+        },
+        'newRecord': () => {
+            activeRecord = {workingTime: '00:00:00'};
+            newRecord = true;
+        },
+        'saveRecord': () => {
+            if (newRecord === true) {
+                Records.add(activeRecord);
+            } else {
+                Records.update(activeRecord.workingDay, activeRecord);
+            }
+        },
+        'selectActiveRecord': record => Records.read(record.workingDay),
+        'cancelActiveRecord': () => {
+            activeRecord = null;
+            newRecord = false;
+        }
+    };
+    const initSite = () => {
+        Controller.listRecords()
+    };
+    initSite()
 </script>
 
 <svelte:head>
@@ -127,7 +151,7 @@
                 <!--suppress HtmlUnknownTarget -->
                 <form action="/working-hours">
                     <fieldset>
-                        <button on:click={() => {activeRecord = {workingTime: '00:00:00'}; newRecord = true}}>Neuer Eintrag
+                        <button on:click={Controller.newRecord}>Neuer Eintrag
                             <IconifyIcon icon={documentIcon}/>
                         </button>
                     </fieldset>
@@ -146,7 +170,7 @@
                             <td>{record.workingDay}</td>
                             <td>{record.workingTime}</td>
                             <td>
-                                <button on:click={() => Records.read(record.workingDay)}>Bearbeiten
+                                <button on:click={() => Controller.selectActiveRecord(record)}>Bearbeiten
                                     <IconifyIcon icon={wrenchIcon}/>
                                 </button>
                             </td>
@@ -178,16 +202,10 @@
                     </div>
                 </fieldset>
                 <fieldset name="buttons">
-                    {#if newRecord === true}
-                        <button on:click={() => Records.add(activeRecord)}>Übernehmen
-                            <IconifyIcon icon={checkIcon} color="green"/>
-                        </button>
-                    {:else}
-                        <button on:click={() => Records.update(activeRecord.workingDay, activeRecord)}>Übernehmen
-                            <IconifyIcon icon={checkIcon} color="green"/>
-                        </button>
-                    {/if}
-                    <button on:click={() => Records.read(null)}>Abbrechen
+                    <button on:click={Controller.saveRecord}>Übernehmen
+                        <IconifyIcon icon={checkIcon} color="green"/>
+                    </button>
+                    <button on:click={Controller.cancelActiveRecord}>Abbrechen
                         <IconifyIcon icon={xIcon}/>
                     </button>
                 </fieldset>