95 lines
2.6 KiB
Vue
95 lines
2.6 KiB
Vue
|
<script setup lang="ts">
|
||
|
|
import NavFooter from '@/components/NavFooter.vue';
|
||
|
|
import NavMain from '@/components/NavMain.vue';
|
||
|
|
import { Sidebar, SidebarContent, SidebarFooter, SidebarHeader, SidebarMenu, SidebarMenuButton, SidebarMenuItem } from '@/components/ui/sidebar';
|
||
|
|
import { dashboard, crm, offers, invoices, timesheets, customers, leads, achievements } from '@/routes';
|
||
|
|
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 } 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-yellow-500',
|
||
|
|
},
|
||
|
|
],
|
||
|
|
},
|
||
|
|
{
|
||
|
|
title: 'Finanzvorgänge',
|
||
|
|
items: [
|
||
|
|
{
|
||
|
|
title: 'Angebote',
|
||
|
|
href: offers(),
|
||
|
|
icon: Calculator,
|
||
|
|
color: 'text-cyan-500',
|
||
|
|
},
|
||
|
|
{
|
||
|
|
title: 'Rechnungen',
|
||
|
|
href: invoices(),
|
||
|
|
icon: Euro,
|
||
|
|
color: 'text-pink-700',
|
||
|
|
},
|
||
|
|
{
|
||
|
|
title: 'Zeiterfassung',
|
||
|
|
href: timesheets(),
|
||
|
|
icon: Timer,
|
||
|
|
color: 'text-green-500',
|
||
|
|
},
|
||
|
|
],
|
||
|
|
}
|
||
|
|
];
|
||
|
|
|
||
|
|
const footerNavItems: NavItem[] = [
|
||
|
|
{
|
||
|
|
title: 'Einstellungen',
|
||
|
|
href: edit(),
|
||
|
|
icon: Settings,
|
||
|
|
color: 'text-gray-400',
|
||
|
|
}
|
||
|
|
];
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<template>
|
||
|
|
<Sidebar collapsible="icon" variant="inset">
|
||
|
|
|
||
|
|
<SidebarHeader>
|
||
|
|
<Link :href="dashboard()" class="flex row items-center gap-1 h-12 mb-4">
|
||
|
|
<AppLogo />
|
||
|
|
</Link>
|
||
|
|
</SidebarHeader>
|
||
|
|
|
||
|
|
<SidebarContent>
|
||
|
|
<NavMain :groups="mainNavGroups" />
|
||
|
|
</SidebarContent>
|
||
|
|
|
||
|
|
<SidebarFooter>
|
||
|
|
<NavFooter :items="footerNavItems" />
|
||
|
|
</SidebarFooter>
|
||
|
|
</Sidebar>
|
||
|
|
<slot />
|
||
|
|
</template>
|