mirror of
https://github.com/nuxt/ui.git
synced 2026-09-14 19:51:10 +08:00
Hugo
42 lines
903 B
Vue
42 lines
903 B
Vue
<script setup lang="ts">
|
|
import type { NavigationMenuItem } from '@nuxt/ui'
|
|
|
|
defineProps<{
|
|
mode: 'drawer' | 'slideover' | 'modal'
|
|
}>()
|
|
|
|
const items: NavigationMenuItem[] = [{
|
|
label: 'Home',
|
|
icon: 'i-lucide-house',
|
|
active: true
|
|
}, {
|
|
label: 'Inbox',
|
|
icon: 'i-lucide-inbox'
|
|
}, {
|
|
label: 'Contacts',
|
|
icon: 'i-lucide-users'
|
|
}]
|
|
</script>
|
|
|
|
<template>
|
|
<UDashboardGroup>
|
|
<UDashboardSidebar :mode="mode">
|
|
<template #header="{ collapsed }">
|
|
<Logo v-if="!collapsed" class="h-5 w-auto" />
|
|
<UIcon v-else name="i-simple-icons-nuxtdotjs" class="size-5 text-primary mx-auto" />
|
|
</template>
|
|
|
|
<UNavigationMenu
|
|
:items="items"
|
|
orientation="vertical"
|
|
/>
|
|
</UDashboardSidebar>
|
|
|
|
<UDashboardPanel>
|
|
<template #header>
|
|
<UDashboardNavbar title="Dashboard" />
|
|
</template>
|
|
</UDashboardPanel>
|
|
</UDashboardGroup>
|
|
</template>
|