Zwischenstand

This commit is contained in:
2026-03-21 22:13:19 +01:00
parent b009ac845f
commit 68b2cbb0ee
64 changed files with 739 additions and 596 deletions

View File

@@ -29,7 +29,16 @@ const platformIsNative = ref(false)
const selectedPresetRange = ref("Dieser Monat bis heute")
const selectedStartDay = ref("")
const selectedEndDay = ref("")
const openTab = ref(0)
const openTab = ref("0")
const presetRangeItems = [
'Dieser Monat bis heute',
'Diese Woche',
'Dieser Monat',
'Dieses Jahr',
'Letzte Woche',
'Letzter Monat',
'Letztes Jahr'
]
const showDocument = ref(false)
const uri = ref("")
@@ -131,7 +140,7 @@ async function loadWorkingTimeInfo() {
workingTimeInfo.value = data;
openTab.value = 0
openTab.value = "0"
}
// 📄 PDF generieren
@@ -172,12 +181,12 @@ async function saveFile() {
toast.add({title:"Auswertung erfolgreich gespeichert"})
fileSaved.value = true
} catch (error) {
toast.add({title:"Fehler beim Speichern der Auswertung", color: "rose"})
toast.add({title:"Fehler beim Speichern der Auswertung", color: "error"})
}
}
async function onTabChange(index: number) {
if (index === 1) await generateDocument()
async function onTabChange(index: string | number) {
if (String(index) === "1") await generateDocument()
}
// Initialisierung
@@ -204,52 +213,44 @@ await setupPage()
</template>
</UDashboardNavbar>
<UDashboardToolbar>
<UDashboardToolbar class="py-3">
<template #left>
<UFormGroup label="Zeitraum:">
<UFormField label="Zeitraum:">
<USelectMenu
:options="[
'Dieser Monat bis heute',
'Diese Woche',
'Dieser Monat',
'Dieses Jahr',
'Letzte Woche',
'Letzter Monat',
'Letztes Jahr'
]"
:items="presetRangeItems"
v-model="selectedPresetRange"
@change="changeRange"
/>
</UFormGroup>
</UFormField>
<UFormGroup label="Start:">
<UPopover :popper="{ placement: 'bottom-start' }">
<UFormField label="Start:">
<UPopover :content="{ side: 'bottom', align: 'start' }">
<UButton
icon="i-heroicons-calendar-days-20-solid"
:label="selectedStartDay ? $dayjs(selectedStartDay).format('DD.MM.YYYY') : 'Datum wählen'"
/>
<template #panel="{ close }">
<template #content>
<LazyDatePicker v-model="selectedStartDay" @close="loadWorkingTimeInfo" />
</template>
</UPopover>
</UFormGroup>
</UFormField>
<UFormGroup label="Ende:">
<UPopover :popper="{ placement: 'bottom-start' }">
<UFormField label="Ende:">
<UPopover :content="{ side: 'bottom', align: 'start' }">
<UButton
icon="i-heroicons-calendar-days-20-solid"
:label="selectedEndDay ? $dayjs(selectedEndDay).format('DD.MM.YYYY') : 'Datum wählen'"
/>
<template #panel="{ close }">
<template #content>
<LazyDatePicker v-model="selectedEndDay" @close="loadWorkingTimeInfo" />
</template>
</UPopover>
</UFormGroup>
</UFormField>
</template>
<template #right>
<UTooltip
:text="fileSaved ? 'Bericht bereits gespeichert' : 'Bericht speichern'"
v-if="openTab === 1 && uri"
v-if="openTab === '1' && uri"
>
<UButton
icon="i-mdi-content-save"
@@ -265,9 +266,9 @@ await setupPage()
<UTabs
:items="[{ label: 'Information' }, { label: 'Bericht' }]"
v-model="openTab"
@change="onTabChange"
@update:model-value="onTabChange"
>
<template #item="{ item }">
<template #content="{ item }">
<div v-if="item.label === 'Information'">
<UCard v-if="workingTimeInfo && workingTimeInfo.summary" class="my-5">
@@ -294,8 +295,8 @@ await setupPage()
<UDashboardPanel>
<UTable
v-if="workingTimeInfo"
:rows="workingTimeInfo.spans"
:empty-state="{ icon: 'i-heroicons-circle-stack-20-solid', label: 'Keine Anwesenheiten' }"
:data="workingTimeInfo.spans"
:empty="{ icon: 'i-heroicons-circle-stack-20-solid', label: 'Keine Anwesenheiten' }"
:columns="normalizeTableColumns([
{ key: 'status', label: 'Status' },
{ key: 'startedAt', label: 'Start' },
@@ -303,30 +304,30 @@ await setupPage()
{ key: 'duration', label: 'Dauer' },
{ key: 'type', label: 'Typ' }
])"
@select="(row) => router.push(`/workingtimes/edit/${row.sourceEventIds[0]}`)"
:on-select="(row) => router.push(`/workingtimes/edit/${row.original.sourceEventIds[0]}`)"
>
<template #status-data="{row}">
<span v-if="row.status === 'approved'" class="text-primary-500">Genehmigt</span>
<span v-else-if="row.status === 'submitted'" class="text-cyan-500">Eingereicht</span>
<span v-else-if="row.status === 'factual'" class="text-gray-500">Faktisch</span>
<span v-else-if="row.status === 'draft'" class="text-red-500">Entwurf</span>
<span v-else>{{ row.status }}</span>
<template #status-cell="{ row }">
<span v-if="row.original.status === 'approved'" class="text-primary-500">Genehmigt</span>
<span v-else-if="row.original.status === 'submitted'" class="text-cyan-500">Eingereicht</span>
<span v-else-if="row.original.status === 'factual'" class="text-gray-500">Faktisch</span>
<span v-else-if="row.original.status === 'draft'" class="text-error-500">Entwurf</span>
<span v-else>{{ row.original.status }}</span>
</template>
<template #startedAt-data="{ row }">
{{ $dayjs(row.startedAt).format('HH:mm DD.MM.YY') }} Uhr
<template #startedAt-cell="{ row }">
{{ $dayjs(row.original.startedAt).format('HH:mm DD.MM.YY') }} Uhr
</template>
<template #endedAt-data="{ row }">
{{ $dayjs(row.endedAt).format('HH:mm DD.MM.YY') }} Uhr
<template #endedAt-cell="{ row }">
{{ $dayjs(row.original.endedAt).format('HH:mm DD.MM.YY') }} Uhr
</template>
<template #duration-data="{ row }">
{{ formatSpanDuration(row.startedAt, row.endedAt) }}
<template #duration-cell="{ row }">
{{ formatSpanDuration(row.original.startedAt, row.original.endedAt) }}
</template>
<template #type-data="{ row }">
{{ row.type.charAt(0).toUpperCase() + row.type.slice(1).replace('_', ' ') }}
<template #type-cell="{ row }">
{{ row.original.type.charAt(0).toUpperCase() + row.original.type.slice(1).replace('_', ' ') }}
</template>
</UTable>
</UDashboardPanel>
@@ -360,15 +361,7 @@ await setupPage()
<div class="p-4 space-y-4 border-b bg-white dark:bg-gray-900">
<USelectMenu
v-model="selectedPresetRange"
:options="[
'Dieser Monat bis heute',
'Diese Woche',
'Dieser Monat',
'Dieses Jahr',
'Letzte Woche',
'Letzter Monat',
'Letztes Jahr'
]"
:items="presetRangeItems"
@change="changeRange"
placeholder="Zeitraum wählen"
class="w-full"
@@ -377,13 +370,13 @@ await setupPage()
<div class="grid grid-cols-2 gap-3">
<div>
<p class="text-xs text-gray-500 mb-1">Start</p>
<UPopover :popper="{ placement: 'bottom-start' }">
<UPopover :content="{ side: 'bottom', align: 'start' }">
<UButton
icon="i-heroicons-calendar"
class="w-full"
:label="$dayjs(selectedStartDay).format('DD.MM.YYYY')"
/>
<template #panel>
<template #content>
<LazyDatePicker v-model="selectedStartDay" @close="loadWorkingTimeInfo" />
</template>
</UPopover>
@@ -391,13 +384,13 @@ await setupPage()
<div>
<p class="text-xs text-gray-500 mb-1">Ende</p>
<UPopover :popper="{ placement: 'bottom-start' }">
<UPopover :content="{ side: 'bottom', align: 'start' }">
<UButton
icon="i-heroicons-calendar"
class="w-full"
:label="$dayjs(selectedEndDay).format('DD.MM.YYYY')"
/>
<template #panel>
<template #content>
<LazyDatePicker v-model="selectedEndDay" @close="loadWorkingTimeInfo" />
</template>
</UPopover>
@@ -408,12 +401,11 @@ await setupPage()
<UTabs
:items="[{ label: 'Information' }, { label: 'Bericht' }]"
v-model="openTab"
@change="onTabChange"
@update:model-value="onTabChange"
class="mt-3 mx-3"
>
<template #item="{ item }">
<div v-if="item.label === 'Information'" class="space-y-4">
<template #content="{ item }">
<div v-if="item.label === 'Information'" class="space-y-4">
<UCard v-if="workingTimeInfo && workingTimeInfo.summary" class="mt-3">
<template #header>
@@ -459,7 +451,7 @@ await setupPage()
<div v-else-if="item.label === 'Bericht'">
<UButton
v-if="uri && !fileSaved"
v-if="openTab === '1' && uri && !fileSaved"
icon="i-mdi-content-save"
color="primary"
class="w-full mb-3"