flfeders/FEDEO
2
1
Fork 0
Code Issues 62 Pull Requests Actions Packages Projects 21 Releases Wiki Activity

Rebuild General Layout to Nuxt UI PRO Dashboard

Browse Source
This commit is contained in:
Florian Federspiel
2024-02-22 22:23:15 +01:00
parent c6e0854544
commit 96d4ee7356
14 changed files with 897 additions and 259 deletions
Download Patch File Download Diff File Expand all files Collapse all files

69
spaces/pages/index.vue
View File

@@ -1,26 +1,45 @@
<template>
<div class="cardHolder">
<div class="card">
<h1 class="text-center text-4xl">Aufgaben</h1>
<p class="text-center text-6xl mt-5">{{openTasks}}</p>
</div><div class="card">
<UDashboardPage>
<UDashboardPanel grow>
<UDashboardNavbar title="Home">
<template #right>
<UTooltip text="Notifications" :shortcuts="['N']">
<UButton color="gray" variant="ghost" square @click="isNotificationsSlideoverOpen = true">
<UChip color="red" inset>
<UIcon name="i-heroicons-bell" class="w-5 h-5" />
</UChip>
</UButton>
</UTooltip>
</div><div class="card">
<UDropdown :items="items">
<UButton icon="i-heroicons-plus" size="md" class="ml-1.5 rounded-full" />
</UDropdown>
</template>
</UDashboardNavbar>
</div><div class="card">
<!-- <UDashboardToolbar>
<template #left>
&lt;!&ndash; ~/components/home/HomeDateRangePicker.vue &ndash;&gt;
&lt;!&ndash; <HomeDateRangePicker v-model="range" class="-ml-2.5" />&ndash;&gt;
</div><div class="card">
&lt;!&ndash; ~/components/home/HomePeriodSelect.vue &ndash;&gt;
&lt;!&ndash; <HomePeriodSelect v-model="period" :range="range" />&ndash;&gt;
</template>
</UDashboardToolbar>-->
</div><div class="card">
<UDashboardPanelContent>
<!-- ~/components/home/HomeChart.vue -->
<!-- <HomeChart :period="period" :range="range" />
</div>
<br>
</div>
<div class="grid lg:grid-cols-2 lg:items-start gap-8 mt-8">
&lt;!&ndash; ~/components/home/HomeSales.vue &ndash;&gt;
<HomeSales />
&lt;!&ndash; ~/components/home/HomeCountries.vue &ndash;&gt;
<HomeCountries />
</div>-->
</UDashboardPanelContent>
</UDashboardPanel>
</UDashboardPage>
</template>
<script setup>
@@ -28,6 +47,18 @@ definePageMeta({
middleware: "auth"
})
const { isNotificationsSlideoverOpen } = useDashboard()
const items = [[{
label: 'Aufgabe',
icon: 'i-heroicons-paper-airplane',
to: '/tasks/create'
}, {
label: 'Kunde',
icon: 'i-heroicons-user-plus',
to: '/customers/create'
}]]
const {getOpenTasksCount} = useDataStore()
const openTasks = getOpenTasksCount
@@ -38,7 +69,7 @@ const user = useSupabaseUser()
</script>
<style scoped>
.cardHolder {
/*.cardHolder {
display: flex;
flex-direction: row;
flex-wrap: wrap;
@@ -49,5 +80,5 @@ const user = useSupabaseUser()
width: 22vw;
height: 40vh;
border: 1px solid white
}
}*/
</style>