Korrigiert Kassenbuch Navbar Struktur
Die Kassenbuch-Listenansicht rendert die DashboardNavbar nun wie andere Listenseiten direkt oben. Die Detailansicht nutzt dieselbe Struktur und hält den Inhalt im PanelContent.
This commit is contained in:
@@ -239,28 +239,28 @@ onMounted(loadData)
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<UDashboardPanelContent>
|
||||
<UDashboardNavbar :title="selectedCashbook ? selectedCashbook.name : 'Kassenbuch'">
|
||||
<template #left>
|
||||
<UButton icon="i-heroicons-arrow-left" variant="ghost" color="neutral" @click="router.push('/accounting/cashbooks')">
|
||||
Kassenbücher
|
||||
</UButton>
|
||||
</template>
|
||||
<template #right>
|
||||
<div v-if="selectedCashbook" class="flex flex-wrap items-center justify-end gap-2">
|
||||
<UBadge color="neutral" variant="subtle">
|
||||
{{ selectedCashbook.name }}
|
||||
</UBadge>
|
||||
<UBadge color="neutral" variant="subtle">
|
||||
Konto {{ selectedCashbook.datevNumber }}
|
||||
</UBadge>
|
||||
<UBadge :color="currentBalance < 0 ? 'error' : 'success'" variant="subtle">
|
||||
Bestand {{ displayCurrency(currentBalance) }}
|
||||
</UBadge>
|
||||
</div>
|
||||
</template>
|
||||
</UDashboardNavbar>
|
||||
<UDashboardNavbar :title="selectedCashbook ? selectedCashbook.name : 'Kassenbuch'">
|
||||
<template #left>
|
||||
<UButton icon="i-heroicons-arrow-left" variant="ghost" color="neutral" @click="router.push('/accounting/cashbooks')">
|
||||
Kassenbücher
|
||||
</UButton>
|
||||
</template>
|
||||
<template #right>
|
||||
<div v-if="selectedCashbook" class="flex flex-wrap items-center justify-end gap-2">
|
||||
<UBadge color="neutral" variant="subtle">
|
||||
{{ selectedCashbook.name }}
|
||||
</UBadge>
|
||||
<UBadge color="neutral" variant="subtle">
|
||||
Konto {{ selectedCashbook.datevNumber }}
|
||||
</UBadge>
|
||||
<UBadge :color="currentBalance < 0 ? 'error' : 'success'" variant="subtle">
|
||||
Bestand {{ displayCurrency(currentBalance) }}
|
||||
</UBadge>
|
||||
</div>
|
||||
</template>
|
||||
</UDashboardNavbar>
|
||||
|
||||
<UDashboardPanelContent>
|
||||
<div v-if="loading" class="py-10 text-center text-gray-500">Lade Kassenbuch...</div>
|
||||
<div v-else-if="selectedCashbook" class="space-y-6">
|
||||
<UCard>
|
||||
|
||||
@@ -85,81 +85,79 @@ onMounted(loadCashbooks)
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<UDashboardPanelContent>
|
||||
<UDashboardNavbar title="Kassenbücher" :badge="filteredRows.length">
|
||||
<template #right>
|
||||
<UInput
|
||||
id="searchinput"
|
||||
v-model="searchString"
|
||||
icon="i-heroicons-magnifying-glass"
|
||||
autocomplete="off"
|
||||
placeholder="Suche..."
|
||||
class="hidden lg:block"
|
||||
@keydown.esc="$event.target.blur()"
|
||||
@change="tempStore.modifySearchString('cashbooks', searchString)"
|
||||
/>
|
||||
<UButton
|
||||
v-if="searchString.length > 0"
|
||||
icon="i-heroicons-x-mark"
|
||||
variant="outline"
|
||||
color="error"
|
||||
@click="clearSearchString"
|
||||
/>
|
||||
<UButton icon="i-heroicons-plus" @click="createCashbookModalOpen = true">
|
||||
Barkasse
|
||||
</UButton>
|
||||
</template>
|
||||
</UDashboardNavbar>
|
||||
<UDashboardNavbar title="Kassenbücher" :badge="filteredRows.length">
|
||||
<template #right>
|
||||
<UInput
|
||||
id="searchinput"
|
||||
v-model="searchString"
|
||||
icon="i-heroicons-magnifying-glass"
|
||||
autocomplete="off"
|
||||
placeholder="Suche..."
|
||||
class="hidden lg:block"
|
||||
@keydown.esc="$event.target.blur()"
|
||||
@change="tempStore.modifySearchString('cashbooks', searchString)"
|
||||
/>
|
||||
<UButton
|
||||
v-if="searchString.length > 0"
|
||||
icon="i-heroicons-x-mark"
|
||||
variant="outline"
|
||||
color="error"
|
||||
@click="clearSearchString"
|
||||
/>
|
||||
<UButton icon="i-heroicons-plus" @click="createCashbookModalOpen = true">
|
||||
Barkasse
|
||||
</UButton>
|
||||
</template>
|
||||
</UDashboardNavbar>
|
||||
|
||||
<UTable
|
||||
:data="filteredRows"
|
||||
:columns="normalizeTableColumns(templateColumns)"
|
||||
:loading="loading"
|
||||
class="w-full"
|
||||
:ui="{ divide: 'divide-gray-200 dark:divide-gray-800' }"
|
||||
:on-select="(row) => router.push(`/accounting/cashbooks/${row.original?.id || row.id}`)"
|
||||
:empty="{ icon: 'i-heroicons-banknotes', label: 'Keine Kassenbücher angelegt' }"
|
||||
>
|
||||
<template #datevNumber-cell="{ row }">
|
||||
<span class="font-mono">{{ row.original.datevNumber }}</span>
|
||||
</template>
|
||||
<template #balance-cell="{ row }">
|
||||
{{ displayCurrency(row.original.balance) }}
|
||||
</template>
|
||||
<template #syncedAt-cell="{ row }">
|
||||
{{ row.original.createdAt ? new Date(row.original.createdAt).toLocaleDateString("de-DE") : "-" }}
|
||||
</template>
|
||||
</UTable>
|
||||
<UTable
|
||||
:data="filteredRows"
|
||||
:columns="normalizeTableColumns(templateColumns)"
|
||||
:loading="loading"
|
||||
class="w-full"
|
||||
:ui="{ divide: 'divide-gray-200 dark:divide-gray-800' }"
|
||||
:on-select="(row) => router.push(`/accounting/cashbooks/${row.original?.id || row.id}`)"
|
||||
:empty="{ icon: 'i-heroicons-banknotes', label: 'Keine Kassenbücher angelegt' }"
|
||||
>
|
||||
<template #datevNumber-cell="{ row }">
|
||||
<span class="font-mono">{{ row.original.datevNumber }}</span>
|
||||
</template>
|
||||
<template #balance-cell="{ row }">
|
||||
{{ displayCurrency(row.original.balance) }}
|
||||
</template>
|
||||
<template #syncedAt-cell="{ row }">
|
||||
{{ row.original.createdAt ? new Date(row.original.createdAt).toLocaleDateString("de-DE") : "-" }}
|
||||
</template>
|
||||
</UTable>
|
||||
|
||||
<UModal v-model:open="createCashbookModalOpen">
|
||||
<template #content>
|
||||
<UCard>
|
||||
<template #header>
|
||||
<div class="text-lg font-semibold">Barkasse anlegen</div>
|
||||
</template>
|
||||
<UModal v-model:open="createCashbookModalOpen">
|
||||
<template #content>
|
||||
<UCard>
|
||||
<template #header>
|
||||
<div class="text-lg font-semibold">Barkasse anlegen</div>
|
||||
</template>
|
||||
|
||||
<UForm :state="newCashbook" class="space-y-4" @submit.prevent="createCashbook">
|
||||
<UFormField label="Bezeichnung">
|
||||
<UInput v-model="newCashbook.name" placeholder="z. B. Hauptkasse" />
|
||||
</UFormField>
|
||||
<UFormField label="Kontennummer">
|
||||
<UInput v-model="newCashbook.datevNumber" placeholder="1000" />
|
||||
</UFormField>
|
||||
<UFormField label="Anfangsbestand">
|
||||
<UInput v-model="newCashbook.openingBalance" type="number" step="0.01" />
|
||||
</UFormField>
|
||||
<UForm :state="newCashbook" class="space-y-4" @submit.prevent="createCashbook">
|
||||
<UFormField label="Bezeichnung">
|
||||
<UInput v-model="newCashbook.name" placeholder="z. B. Hauptkasse" />
|
||||
</UFormField>
|
||||
<UFormField label="Kontennummer">
|
||||
<UInput v-model="newCashbook.datevNumber" placeholder="1000" />
|
||||
</UFormField>
|
||||
<UFormField label="Anfangsbestand">
|
||||
<UInput v-model="newCashbook.openingBalance" type="number" step="0.01" />
|
||||
</UFormField>
|
||||
|
||||
<div class="flex justify-end gap-3 pt-2">
|
||||
<UButton color="gray" variant="soft" @click="createCashbookModalOpen = false">
|
||||
Abbrechen
|
||||
</UButton>
|
||||
<UButton type="submit" color="primary" :loading="savingCashbook">
|
||||
Barkasse anlegen
|
||||
</UButton>
|
||||
</div>
|
||||
</UForm>
|
||||
</UCard>
|
||||
</template>
|
||||
</UModal>
|
||||
</UDashboardPanelContent>
|
||||
<div class="flex justify-end gap-3 pt-2">
|
||||
<UButton color="gray" variant="soft" @click="createCashbookModalOpen = false">
|
||||
Abbrechen
|
||||
</UButton>
|
||||
<UButton type="submit" color="primary" :loading="savingCashbook">
|
||||
Barkasse anlegen
|
||||
</UButton>
|
||||
</div>
|
||||
</UForm>
|
||||
</UCard>
|
||||
</template>
|
||||
</UModal>
|
||||
</template>
|
||||
|
||||
Reference in New Issue
Block a user