[events] Structural and minor optical cleanup

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,

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,7 +24,6 @@
         </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"
@@ -42,7 +41,6 @@
       </q-tab-panel>
     </q-tab-panels>
   </q-page>
-  </div>
 </template>
 
 <script lang="ts">

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,
+};