58 lines
1.9 KiB
Vue
58 lines
1.9 KiB
Vue
<script setup lang="ts">
|
|
import { Link } from '@inertiajs/vue3';
|
|
import {
|
|
SidebarGroup,
|
|
SidebarGroupLabel,
|
|
SidebarMenu,
|
|
SidebarMenuButton,
|
|
SidebarMenuItem,
|
|
SidebarMenuSub,
|
|
SidebarMenuSubButton,
|
|
SidebarMenuSubItem,
|
|
} from '@/components/ui/sidebar';
|
|
import { useCurrentUrl } from '@/composables/useCurrentUrl';
|
|
import type { NavItem } from '@/types';
|
|
|
|
defineProps<{
|
|
items: NavItem[];
|
|
}>();
|
|
|
|
const { isCurrentOrParentUrl, isCurrentUrl } = useCurrentUrl();
|
|
</script>
|
|
|
|
<template>
|
|
<SidebarGroup class="px-2 py-0">
|
|
<SidebarGroupLabel>Platform</SidebarGroupLabel>
|
|
<SidebarMenu>
|
|
<SidebarMenuItem v-for="item in items" :key="item.title">
|
|
<SidebarMenuButton
|
|
as-child
|
|
:is-active="item.items?.length ? isCurrentOrParentUrl(item.href) : isCurrentUrl(item.href)"
|
|
:tooltip="item.title"
|
|
>
|
|
<Link :href="item.href">
|
|
<component :is="item.icon" />
|
|
<span>{{ item.title }}</span>
|
|
</Link>
|
|
</SidebarMenuButton>
|
|
|
|
<SidebarMenuSub v-if="item.items?.length">
|
|
<SidebarMenuSubItem
|
|
v-for="subItem in item.items"
|
|
:key="subItem.title"
|
|
>
|
|
<SidebarMenuSubButton
|
|
as-child
|
|
:is-active="isCurrentUrl(subItem.href)"
|
|
>
|
|
<Link :href="subItem.href">
|
|
<span>{{ subItem.title }}</span>
|
|
</Link>
|
|
</SidebarMenuSubButton>
|
|
</SidebarMenuSubItem>
|
|
</SidebarMenuSub>
|
|
</SidebarMenuItem>
|
|
</SidebarMenu>
|
|
</SidebarGroup>
|
|
</template>
|