120 lines
3.7 KiB
Vue
120 lines
3.7 KiB
Vue
<script setup lang="ts">
|
|
import NavFooter from '@/components/NavFooter.vue';
|
|
import NavMain from '@/components/NavMain.vue';
|
|
import { Sidebar, SidebarContent, SidebarFooter, SidebarHeader, SidebarTrigger } from '@/components/ui/sidebar';
|
|
import { dashboard, crm, offers, invoices, newInvoice, timesheets, customers, leads, achievements } from '@/routes';
|
|
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip'
|
|
import { Kbd, KbdGroup } from '@/components/ui/kbd'
|
|
import { edit } from '@/routes/profile';
|
|
import { type NavItem, type NavGroup } from '@/types';
|
|
import { Link } from '@inertiajs/vue3';
|
|
import { Kanban, Euro, Contact, Trophy, Calculator, Settings, Target, BookUser, Timer, Headset, IdCard, Plus } from 'lucide-vue-next';
|
|
import AppLogo from './AppLogo.vue';
|
|
|
|
const mainNavGroups: NavGroup[] = [
|
|
{
|
|
title: 'CRM',
|
|
items: [
|
|
{
|
|
title: 'Pipeline',
|
|
href: crm(),
|
|
icon: Kanban,
|
|
color: 'text-pink-500',
|
|
},
|
|
{
|
|
title: 'Akquise',
|
|
href: leads(),
|
|
icon: Headset,
|
|
color: 'text-blue-500',
|
|
},
|
|
{
|
|
title: 'Kunden',
|
|
href: customers(),
|
|
icon: BookUser,
|
|
color: 'text-lime-500',
|
|
},
|
|
{
|
|
title: 'Erfolge',
|
|
href: achievements(),
|
|
icon: Trophy,
|
|
color: 'text-amber-500',
|
|
},
|
|
],
|
|
},
|
|
{
|
|
title: 'Finanzvorgänge',
|
|
items: [
|
|
{
|
|
title: 'Angebote',
|
|
href: offers(),
|
|
icon: Calculator,
|
|
color: 'text-cyan-600',
|
|
},
|
|
{
|
|
title: 'Rechnungen',
|
|
href: invoices(),
|
|
icon: Euro,
|
|
color: 'text-pink-700',
|
|
action: {
|
|
title: "Neue Rechnung",
|
|
icon: Plus,
|
|
color: 'text-foreground',
|
|
href: newInvoice()
|
|
}
|
|
},
|
|
{
|
|
title: 'Zeiterfassung',
|
|
href: timesheets(),
|
|
icon: Timer,
|
|
color: 'text-lime-600',
|
|
},
|
|
],
|
|
}
|
|
];
|
|
|
|
const footerNavItems: NavItem[] = [
|
|
{
|
|
title: 'Einstellungen',
|
|
href: edit(),
|
|
icon: Settings,
|
|
color: 'text-gray-500',
|
|
}
|
|
];
|
|
</script>
|
|
|
|
<template>
|
|
<Sidebar collapsible="icon" variant="sidebar">
|
|
|
|
<SidebarHeader>
|
|
<Link :href="dashboard()" class="flex row items-center mt-6">
|
|
<AppLogo />
|
|
</Link>
|
|
|
|
<TooltipProvider>
|
|
<Tooltip>
|
|
<TooltipTrigger class="w-fit absolute top-11 right-3 group-data-[collapsible=icon]:right-5">
|
|
<SidebarTrigger class="hidden md:flex text-primary-foreground" />
|
|
</TooltipTrigger>
|
|
<TooltipContent>
|
|
<span>Seitenleiste schließen</span>
|
|
<KbdGroup class="ml-2">
|
|
<Kbd class="visible-mac">⌘</Kbd>
|
|
<Kbd class="visible-pc">Ctrl</Kbd>
|
|
<Kbd>B</Kbd>
|
|
</KbdGroup>
|
|
</TooltipContent>
|
|
</Tooltip>
|
|
</TooltipProvider>
|
|
|
|
</SidebarHeader>
|
|
|
|
<SidebarContent>
|
|
<NavMain :groups="mainNavGroups" />
|
|
</SidebarContent>
|
|
|
|
<SidebarFooter>
|
|
<NavFooter :items="footerNavItems" />
|
|
</SidebarFooter>
|
|
</Sidebar>
|
|
<slot />
|
|
</template> |