props added
This commit is contained in:
@@ -3,7 +3,7 @@ import type { NavigationMenuItem } from '@nuxt/ui'
|
|||||||
//import Logo from '@nuxt/ui'
|
//import Logo from '@nuxt/ui'
|
||||||
|
|
||||||
|
|
||||||
const items: NavigationMenuItem[][] = [
|
const items_def: NavigationMenuItem[][] = [
|
||||||
[{
|
[{
|
||||||
label: 'Home',
|
label: 'Home',
|
||||||
icon: 'i-lucide-house',
|
icon: 'i-lucide-house',
|
||||||
@@ -37,13 +37,20 @@ const items: NavigationMenuItem[][] = [
|
|||||||
to: 'https://github.com/nuxt/ui',
|
to: 'https://github.com/nuxt/ui',
|
||||||
target: '_blank'
|
target: '_blank'
|
||||||
}]]
|
}]]
|
||||||
|
|
||||||
|
const props = defineProps<{
|
||||||
|
items? : NavigationMenuItem[][]
|
||||||
|
}>()
|
||||||
|
|
||||||
|
const items: NavigationMenuItem[][] = props.items ?? items_def;
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<UDashboardSidebar collapsed resizable :ui="{ footer: 'border-t border-default' }">
|
|
||||||
|
<UDashboardSidebar collapsible resizable :ui="{ footer: 'border-t border-default' }">
|
||||||
<template #header="{ collapsed }">
|
<template #header="{ collapsed }">
|
||||||
<UIcon v-if="!collapsed" name="i-simple-icons-nuxtdotjs" class="h-5 w-auto shrink-0" />
|
<AppLogo icon="i-simple-icons-nuxtdotjs" text="Nuxt" v-if="!collapsed" name="i-simple-icons-nuxtdotjs" class="h-5 w-auto shrink-0" />
|
||||||
<UIcon v-else name="i-simple-icons-nuxtdotjs" class="size-5 text-primary mx-auto" />
|
<UIcon v-else name="i-simple-icons-nuxtdotjs" class="size-5 text-primary mx-auto" />
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|||||||
@@ -1,11 +1,33 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import type { NavigationMenuItem } from '@nuxt/ui'
|
||||||
|
|
||||||
|
const nav : NavigationMenuItem[][] = [[
|
||||||
|
{
|
||||||
|
label: 'Home',
|
||||||
|
icon: 'i-lucide-house',
|
||||||
|
active: true,
|
||||||
|
to: "/dashboard"
|
||||||
|
}, {
|
||||||
|
label: 'Inbox',
|
||||||
|
icon: 'i-lucide-inbox',
|
||||||
|
badge: '4',
|
||||||
|
to: "/inbox"
|
||||||
|
}, {
|
||||||
|
label: 'Contacts',
|
||||||
|
icon: 'i-lucide-users',
|
||||||
|
to: "/inbox"
|
||||||
|
}]];
|
||||||
|
/*[
|
||||||
|
{
|
||||||
|
label: "Feedback"
|
||||||
|
}
|
||||||
|
]];*/
|
||||||
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<UDashboardGroup>
|
<UDashboardGroup>
|
||||||
<DashboardSidebar />
|
<DashboardSidebar collapsible resizable :items="nav"/>
|
||||||
|
|
||||||
<UDashboardSidebarCollapse />
|
<UDashboardSidebarCollapse />
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<slot />
|
<slot />
|
||||||
</UDashboardGroup>
|
</UDashboardGroup>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@@ -27,9 +27,10 @@
|
|||||||
|
|
||||||
<template>
|
<template>
|
||||||
<UContainer>
|
<UContainer>
|
||||||
<UDashboardSidebarToggle variant="subtle" />
|
|
||||||
|
|
||||||
<div class="mt-1 mb-2 flex flex-col w-full">
|
<UDashboardSidebarToggle variant="subtle" class="absolute z-20 top-3 left-2.5"/>
|
||||||
|
|
||||||
|
<div class="mt-1 mb-2 flex flex-col w-full relative z-0">
|
||||||
<ProseH2 class="text-center m-0.5 w-full">Hey there, user!</ProseH2>
|
<ProseH2 class="text-center m-0.5 w-full">Hey there, user!</ProseH2>
|
||||||
<ProseP class="text-center text-muted m-0.5">Welcome to the UI!</ProseP>
|
<ProseP class="text-center text-muted m-0.5">Welcome to the UI!</ProseP>
|
||||||
<UBadge variant="subtle" class="inline mx-auto">It's cool, isn't it ?</UBadge>
|
<UBadge variant="subtle" class="inline mx-auto">It's cool, isn't it ?</UBadge>
|
||||||
|
|||||||
Reference in New Issue
Block a user