From f712bfd4f9e36210766cec117ed8504669556a75 Mon Sep 17 00:00:00 2001
From: Ferdinand Thiessen <rpm@fthiessen.de>
Date: Sun, 28 Mar 2021 03:26:11 +0200
Subject: [PATCH] [events] Structural and minor optical cleanup

---
 .../schedule/components/management/Job.vue    | 10 +++--
 src/plugins/schedule/pages/Management.vue     | 38 +++++++++----------
 .../schedule/{store.ts => store/index.ts}     |  0
 src/plugins/schedule/store/models.ts          | 27 +++++++++++++
 4 files changed, 51 insertions(+), 24 deletions(-)
 rename src/plugins/schedule/{store.ts => store/index.ts} (100%)
 create mode 100644 src/plugins/schedule/store/models.ts

diff --git a/src/plugins/schedule/components/management/Job.vue b/src/plugins/schedule/components/management/Job.vue
index 95f05ca..e0d16bf 100644
--- a/src/plugins/schedule/components/management/Job.vue
+++ b/src/plugins/schedule/components/management/Job.vue
@@ -1,5 +1,5 @@
 <template>
-  <q-card-section class="fit row justify-start content-center items-center">
+  <q-card class="fit row justify-start content-center items-center">
     <q-card-section class="fit row justify-start content-center items-center">
       <IsoDateInput
         v-model="job.start"
@@ -45,8 +45,10 @@
         filled
       />
     </q-card-section>
-    <q-btn label="Schicht löschen" color="negative" :disabled="jobCanDelete" @click="removeJob" />
-  </q-card-section>
+    <q-card-actions>
+      <q-btn label="Schicht löschen" color="negative" :disabled="canDelete" @click="removeJob" />
+    </q-card-actions>
+  </q-card>
 </template>
 
 <script lang="ts">
@@ -63,7 +65,7 @@ export default defineComponent({
       required: true,
       type: Object as PropType<FG.Job>,
     },
-    jobCanDelete: Boolean,
+    canDelete: Boolean,
   },
   emits: {
     'remove-job': () => true,
diff --git a/src/plugins/schedule/pages/Management.vue b/src/plugins/schedule/pages/Management.vue
index 200b038..b6aeff0 100644
--- a/src/plugins/schedule/pages/Management.vue
+++ b/src/plugins/schedule/pages/Management.vue
@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <q-page padding class="fit row justify-center content-start items-start q-gutter-sm">
     <q-tabs v-if="$q.screen.gt.sm" v-model="tab">
       <q-tab
         v-for="(tabindex, index) in tabs"
@@ -24,25 +24,23 @@
         </q-item>
       </q-list>
     </q-drawer>
-    <q-page padding class="fit row justify-center content-start items-start q-gutter-sm">
-      <q-tab-panels
-        v-model="tab"
-        style="background-color: transparent"
-        class="q-ma-none q-pa-none fit row justify-center content-start items-start"
-        animated
-      >
-        <q-tab-panel name="create">
-          <EditEvent />
-        </q-tab-panel>
-        <q-tab-panel name="eventtypes">
-          <EventTypes />
-        </q-tab-panel>
-        <q-tab-panel name="jobtypes">
-          <JobTypes v-if="canEditJobTypes" />
-        </q-tab-panel>
-      </q-tab-panels>
-    </q-page>
-  </div>
+    <q-tab-panels
+      v-model="tab"
+      style="background-color: transparent"
+      class="q-ma-none q-pa-none fit row justify-center content-start items-start"
+      animated
+    >
+      <q-tab-panel name="create">
+        <EditEvent />
+      </q-tab-panel>
+      <q-tab-panel name="eventtypes">
+        <EventTypes />
+      </q-tab-panel>
+      <q-tab-panel name="jobtypes">
+        <JobTypes v-if="canEditJobTypes" />
+      </q-tab-panel>
+    </q-tab-panels>
+  </q-page>
 </template>
 
 <script lang="ts">
diff --git a/src/plugins/schedule/store.ts b/src/plugins/schedule/store/index.ts
similarity index 100%
rename from src/plugins/schedule/store.ts
rename to src/plugins/schedule/store/index.ts
diff --git a/src/plugins/schedule/store/models.ts b/src/plugins/schedule/store/models.ts
new file mode 100644
index 0000000..2a6f7d1
--- /dev/null
+++ b/src/plugins/schedule/store/models.ts
@@ -0,0 +1,27 @@
+import { date } from 'quasar';
+
+/** An new event does not contain an id and the type might be unset */
+export type EditableEvent = Omit<Omit<Omit<FG.Event, 'jobs'>, 'type'>, 'id'> & {
+  type?: FG.EventType | number;
+  id?: number;
+  jobs: EditableJob[];
+};
+
+/** A new job does not have an id or type assigned */
+export type EditableJob = Omit<Omit<FG.Job, 'type'>, 'id'> & {
+  type?: FG.EventType | number;
+  id?: number;
+};
+
+export const emptyJob: EditableJob = {
+  start: new Date(),
+  end: date.addToDate(new Date(), { hours: 1 }),
+  services: [],
+  required_services: 2,
+};
+
+export const emptyEvent: EditableEvent = {
+  start: new Date(),
+  jobs: [Object.assign({}, emptyJob)],
+  is_template: false,
+};