Files
analiticaNucleo/nuxt4-app/app/layouts/dashboard.vue

46 lines
1.4 KiB
Vue

<template>
<div class="brand-shell min-h-screen text-[#fef9f0]">
<UDashboardGroup storage-key="analytics-dashboard" class="h-full">
<AppSidebar v-model:open="sidebarOpen" v-model:collapsed="sidebarCollapsed" />
<UDashboardPanel class="bg-transparent">
<template #header>
<div class="flex flex-col gap-4 px-4 py-4 lg:px-6">
<UDashboardNavbar :title="pageTitle" icon="i-lucide-pie-chart" toggle-side="left">
<template #leading>
<UDashboardSidebarCollapse variant="subtle" />
</template>
<template #toggle>
<UDashboardSidebarToggle variant="subtle" />
</template>
<template #trailing>
<UBadge variant="subtle" label="Supabase" class="uppercase tracking-wide" />
<UBadge variant="subtle" label="Solo lectura" class="uppercase tracking-wide" />
<UserMenu />
</template>
</UDashboardNavbar>
</div>
</template>
<template #body>
<div class="px-4 pb-10 lg:px-8">
<slot />
</div>
</template>
</UDashboardPanel>
</UDashboardGroup>
</div>
</template>
<script setup lang="ts">
import { computed, ref } from 'vue'
import { useRoute } from 'vue-router'
const route = useRoute()
const sidebarOpen = ref(true)
const sidebarCollapsed = ref(false)
const pageTitle = computed(() => (route.meta.title as string) || 'Panel')
</script>