Changes

spaces/pages/absenceRequests/[mode]/[[id]].vue

@@ -1,5 +1,6 @@
 <script setup>
 import dayjs from "dayjs";
+import HistoryDisplay from "~/components/HistoryDisplay.vue";
 
 definePageMeta({
   middleware: "auth"
@@ -49,9 +50,9 @@ const editItem = async () => {
 
 const cancelEditorCreate = () => {
   if(currentItem.value) {
-    router.push(`/tasks/show/${currentItem.value.id}`)
+    router.push(`/absenceRequests/show/${currentItem.value.id}`)
   } else {
-    router.push(`/tasks/`)
+    router.push(`/absenceRequests/`)
   }
 }
 setupPage()
@@ -62,13 +63,13 @@ setupPage()
     <template #right>
       <UButton
           v-if="mode === 'edit'"
-          @click="dataStore.updateItem('tasks',itemInfo)"
+          @click="dataStore.updateItem('absencerequests',itemInfo)"
       >
         Speichern
       </UButton>
       <UButton
           v-else-if="mode === 'create'"
-          @click="dataStore.createNewItem('tasks',itemInfo)"
+          @click="dataStore.createNewItem('absencerequests',itemInfo)"
       >
         Erstellen
       </UButton>
@@ -103,7 +104,7 @@ setupPage()
     </template>
   </UDashboardNavbar>
   <UTabs
-      :items="[{label: 'Informationen'}]"
+      :items="[{label: 'Informationen'}, {label: 'Logbuch'}]"
       v-if="currentItem && mode == 'show'"
       class="p-5"
   >
@@ -118,6 +119,13 @@ setupPage()
             <p>Notizen: {{currentItem.notes}}</p>
           </div>
         </div>
+        <div v-else-if="item.label === 'Logbuch'">
+          <HistoryDisplay
+              type="absencerequest"
+              v-if="currentItem"
+              :element-id="currentItem.id"
+          />
+        </div>
       </UCard>
     </template>
   </UTabs>
@@ -159,7 +167,11 @@ setupPage()
 
     <UFormGroup label="Start:">
       <UPopover :popper="{ placement: 'bottom-start' }">
-        <UButton icon="i-heroicons-calendar-days-20-solid" :label="itemInfo.start ? dayjs(itemInfo.start).format('DD.MM.YYYY') : 'Datum auswählen'" />
+        <UButton
+            icon="i-heroicons-calendar-days-20-solid"
+            :label="itemInfo.start ? dayjs(itemInfo.start).format('DD.MM.YYYY') : 'Datum auswählen'"
+            variant="outline"
+        />
 
         <template #panel="{ close }">
           <LazyDatePicker v-model="itemInfo.start" @close="close" />
@@ -169,7 +181,11 @@ setupPage()
 
     <UFormGroup label="Ende:">
       <UPopover :popper="{ placement: 'bottom-start' }">
-        <UButton icon="i-heroicons-calendar-days-20-solid" :label="itemInfo.end ? dayjs(itemInfo.end).format('DD.MM.YYYY') : 'Datum auswählen'" />
+        <UButton
+            variant="outline"
+            icon="i-heroicons-calendar-days-20-solid"
+            :label="itemInfo.end ? dayjs(itemInfo.end).format('DD.MM.YYYY') : 'Datum auswählen'"
+        />
 
         <template #panel="{ close }">
           <LazyDatePicker v-model="itemInfo.end" @close="close" />