470 lines
13 KiB
Vue
470 lines
13 KiB
Vue
<script setup>
|
|
|
|
const route = useRoute()
|
|
const auth = useAuthStore()
|
|
|
|
const {has} = usePermission()
|
|
|
|
const links = computed(() => {
|
|
return [
|
|
...(auth.profile?.pinned_on_navigation || []).map(pin => {
|
|
if(pin.type === "external") {
|
|
return {
|
|
label: pin.label,
|
|
to: pin.link,
|
|
icon: pin.icon,
|
|
target: "_blank",
|
|
pinned: true
|
|
}
|
|
}else if(pin.type === "standardEntity") {
|
|
return {
|
|
label: pin.label,
|
|
to: `/standardEntity/${pin.datatype}/show/${pin.id}`,
|
|
icon: pin.icon,
|
|
pinned: true
|
|
}
|
|
}
|
|
}),
|
|
|
|
... false ? [{
|
|
label: "Support Tickets",
|
|
to: "/support",
|
|
icon: "i-heroicons-rectangle-stack",
|
|
}] : [],
|
|
{
|
|
id: 'dashboard',
|
|
label: "Dashboard",
|
|
to: "/",
|
|
icon: "i-heroicons-home"
|
|
}, {
|
|
id: 'historyitems',
|
|
label: "Logbuch",
|
|
to: "/historyitems",
|
|
icon: "i-heroicons-book-open",
|
|
disabled: true
|
|
},
|
|
{
|
|
label: "Organisation",
|
|
icon: "i-heroicons-rectangle-stack",
|
|
defaultOpen: false,
|
|
children: [
|
|
... has("tasks") ? [{
|
|
label: "Aufgaben",
|
|
to: "/standardEntity/tasks",
|
|
icon: "i-heroicons-rectangle-stack"
|
|
}] : [],
|
|
/*... true ? [{
|
|
label: "Plantafel",
|
|
to: "/calendar/timeline",
|
|
icon: "i-heroicons-calendar-days"
|
|
}] : [],
|
|
... true ? [{
|
|
label: "Kalender",
|
|
to: "/calendar/grid",
|
|
icon: "i-heroicons-calendar-days"
|
|
}] : [],
|
|
... true ? [{
|
|
label: "Termine",
|
|
to: "/standardEntity/events",
|
|
icon: "i-heroicons-calendar-days"
|
|
}] : [],*/
|
|
/*{
|
|
label: "Dateien",
|
|
to: "/files",
|
|
icon: "i-heroicons-document"
|
|
},*/
|
|
]
|
|
},
|
|
{
|
|
label: "Dokumente",
|
|
icon: "i-heroicons-rectangle-stack",
|
|
defaultOpen: false,
|
|
children: [
|
|
{
|
|
label: "Dateien",
|
|
to: "/files",
|
|
icon: "i-heroicons-document"
|
|
},{
|
|
label: "Anschreiben",
|
|
to: "/createdletters",
|
|
icon: "i-heroicons-document",
|
|
disabled: true
|
|
},{
|
|
label: "Boxen",
|
|
to: "/standardEntity/documentboxes",
|
|
icon: "i-heroicons-archive-box",
|
|
disabled: true
|
|
},
|
|
]
|
|
},
|
|
{
|
|
label: "Kommunikation",
|
|
icon: "i-heroicons-megaphone",
|
|
defaultOpen: false,
|
|
children: [
|
|
{
|
|
label: "Helpdesk",
|
|
to: "/helpdesk",
|
|
icon: "i-heroicons-chat-bubble-left-right",
|
|
disabled: true
|
|
},
|
|
{
|
|
label: "E-Mail",
|
|
to: "/email/new",
|
|
icon: "i-heroicons-envelope",
|
|
disabled: true
|
|
}/*, {
|
|
label: "Logbücher",
|
|
to: "/communication/historyItems",
|
|
icon: "i-heroicons-book-open"
|
|
}, {
|
|
label: "Chats",
|
|
to: "/chats",
|
|
icon: "i-heroicons-chat-bubble-left"
|
|
}*/
|
|
]
|
|
},
|
|
... (has("customers") || has("vendors") || has("contacts")) ? [{
|
|
label: "Kontakte",
|
|
defaultOpen: false,
|
|
icon: "i-heroicons-user-group",
|
|
children: [
|
|
... has("customers") ? [{
|
|
label: "Kunden",
|
|
to: "/standardEntity/customers",
|
|
icon: "i-heroicons-user-group"
|
|
}] : [],
|
|
... has("vendors") ? [{
|
|
label: "Lieferanten",
|
|
to: "/standardEntity/vendors",
|
|
icon: "i-heroicons-truck"
|
|
}] : [],
|
|
... has("contacts") ? [{
|
|
label: "Ansprechpartner",
|
|
to: "/standardEntity/contacts",
|
|
icon: "i-heroicons-user-group"
|
|
}] : [],
|
|
]
|
|
},] : [],
|
|
{
|
|
label: "Mitarbeiter",
|
|
defaultOpen:false,
|
|
icon: "i-heroicons-user-group",
|
|
children: [
|
|
... true ? [{
|
|
label: "Zeiten",
|
|
to: "/staff/time",
|
|
icon: "i-heroicons-clock",
|
|
}] : [],
|
|
/*... has("absencerequests") ? [{
|
|
label: "Abwesenheiten",
|
|
to: "/standardEntity/absencerequests",
|
|
icon: "i-heroicons-document-text"
|
|
}] : [],*/
|
|
/*{
|
|
label: "Fahrten",
|
|
to: "/trackingTrips",
|
|
icon: "i-heroicons-map"
|
|
},*/
|
|
]
|
|
},
|
|
... [{
|
|
label: "Buchhaltung",
|
|
defaultOpen: false,
|
|
icon: "i-heroicons-chart-bar-square",
|
|
children: [
|
|
{
|
|
label: "Ausgangsbelege",
|
|
to: "/createDocument",
|
|
icon: "i-heroicons-document-text"
|
|
},{
|
|
label: "Serienvorlagen",
|
|
to: "/createDocument/serialInvoice",
|
|
icon: "i-heroicons-document-text"
|
|
},{
|
|
label: "Eingangsbelege",
|
|
to: "/incomingInvoices",
|
|
icon: "i-heroicons-document-text",
|
|
},{
|
|
label: "Kostenstellen",
|
|
to: "/standardEntity/costcentres",
|
|
icon: "i-heroicons-document-currency-euro"
|
|
},{
|
|
label: "Buchungskonten",
|
|
to: "/accounts",
|
|
icon: "i-heroicons-document-text",
|
|
},{
|
|
label: "zusätzliche Buchungskonten",
|
|
to: "/standardEntity/ownaccounts",
|
|
icon: "i-heroicons-document-text"
|
|
},
|
|
{
|
|
label: "Bank",
|
|
to: "/banking",
|
|
icon: "i-heroicons-document-text",
|
|
},
|
|
]
|
|
}],
|
|
... has("inventory") ? [{
|
|
label: "Lager",
|
|
icon: "i-heroicons-puzzle-piece",
|
|
defaultOpen: false,
|
|
children: [
|
|
/*{
|
|
label: "Vorgänge",
|
|
to: "/inventory",
|
|
icon: "i-heroicons-square-3-stack-3d"
|
|
},{
|
|
label: "Bestände",
|
|
to: "/inventory/stocks",
|
|
icon: "i-heroicons-square-3-stack-3d"
|
|
},*/
|
|
... has("spaces") ? [{
|
|
label: "Lagerplätze",
|
|
to: "/standardEntity/spaces",
|
|
icon: "i-heroicons-square-3-stack-3d"
|
|
}] : [],
|
|
]
|
|
},] : [],
|
|
{
|
|
label: "Stammdaten",
|
|
defaultOpen: false,
|
|
icon: "i-heroicons-clipboard-document",
|
|
children: [
|
|
... has("products") ? [{
|
|
label: "Artikel",
|
|
to: "/standardEntity/products",
|
|
icon: "i-heroicons-puzzle-piece"
|
|
}] : [],
|
|
... has("productcategories") ? [{
|
|
label: "Artikelkategorien",
|
|
to: "/standardEntity/productcategories",
|
|
icon: "i-heroicons-puzzle-piece"
|
|
}] : [],
|
|
... has("services") ? [{
|
|
label: "Leistungen",
|
|
to: "/standardEntity/services",
|
|
icon: "i-heroicons-wrench-screwdriver"
|
|
}] : [],
|
|
... has("servicecategories") ? [{
|
|
label: "Leistungskategorien",
|
|
to: "/standardEntity/servicecategories",
|
|
icon: "i-heroicons-wrench-screwdriver"
|
|
}] : [],
|
|
{
|
|
label: "Mitarbeiter",
|
|
to: "/staff/profiles",
|
|
icon: "i-heroicons-user-group"
|
|
},
|
|
{
|
|
label: "Stundensätze",
|
|
to: "/standardEntity/hourrates",
|
|
icon: "i-heroicons-user-group"
|
|
},
|
|
... has("vehicles") ? [{
|
|
label: "Fahrzeuge",
|
|
to: "/standardEntity/vehicles",
|
|
icon: "i-heroicons-truck"
|
|
}] : [],
|
|
... has("inventoryitems") ? [{
|
|
label: "Inventar",
|
|
to: "/standardEntity/inventoryitems",
|
|
icon: "i-heroicons-puzzle-piece"
|
|
}] : [],
|
|
... has("inventoryitems") ? [{
|
|
label: "Inventargruppen",
|
|
to: "/standardEntity/inventoryitemgroups",
|
|
icon: "i-heroicons-puzzle-piece"
|
|
}] : [],
|
|
]
|
|
},
|
|
|
|
... has("projects") ? [{
|
|
label: "Projekte",
|
|
to: "/standardEntity/projects",
|
|
icon: "i-heroicons-clipboard-document-check"
|
|
},] : [],
|
|
... has("contracts") ? [{
|
|
label: "Verträge",
|
|
to: "/standardEntity/contracts",
|
|
icon: "i-heroicons-clipboard-document"
|
|
}] : [],
|
|
... has("plants") ? [{
|
|
label: "Objekte",
|
|
to: "/standardEntity/plants",
|
|
icon: "i-heroicons-clipboard-document"
|
|
},] : [],
|
|
/*... has("checks") ? [{
|
|
label: "Überprüfungen",
|
|
to: "/standardEntity/checks",
|
|
icon: "i-heroicons-magnifying-glass"
|
|
},] : [],*/
|
|
{
|
|
label: "Einstellungen",
|
|
defaultOpen: false,
|
|
icon: "i-heroicons-cog-8-tooth",
|
|
children: [
|
|
{
|
|
label: "Nummernkreise",
|
|
to: "/settings/numberRanges",
|
|
icon: "i-heroicons-clipboard-document-list",
|
|
},/*{
|
|
label: "Rollen",
|
|
to: "/roles",
|
|
icon: "i-heroicons-key"
|
|
},*/{
|
|
label: "E-Mail Konten",
|
|
to: "/settings/emailaccounts",
|
|
icon: "i-heroicons-envelope",
|
|
},{
|
|
label: "Bankkonten",
|
|
to: "/settings/banking",
|
|
icon: "i-heroicons-currency-euro",
|
|
},{
|
|
label: "Textvorlagen",
|
|
to: "/settings/texttemplates",
|
|
icon: "i-heroicons-clipboard-document-list",
|
|
},/*{
|
|
label: "Eigene Felder",
|
|
to: "/settings/ownfields",
|
|
icon: "i-heroicons-clipboard-document-list"
|
|
},*/{
|
|
label: "Firmeneinstellungen",
|
|
to: "/settings/tenant",
|
|
icon: "i-heroicons-building-office",
|
|
},{
|
|
label: "Projekttypen",
|
|
to: "/projecttypes",
|
|
icon: "i-heroicons-clipboard-document-list",
|
|
},{
|
|
label: "Export",
|
|
to: "/export",
|
|
icon: "i-heroicons-clipboard-document-list"
|
|
}
|
|
]
|
|
}
|
|
]
|
|
})
|
|
|
|
// nur Items mit Children → für Accordion
|
|
const accordionItems = computed(() =>
|
|
links.value.filter(item => Array.isArray(item.children) && item.children.length > 0)
|
|
)
|
|
|
|
// nur Items ohne Children → als Buttons
|
|
const buttonItems = computed(() =>
|
|
links.value.filter(item => !item.children || item.children.length === 0)
|
|
)
|
|
</script>
|
|
|
|
<template>
|
|
<!-- Standalone Buttons -->
|
|
<div class="flex flex-col gap-1">
|
|
<UButton
|
|
v-for="item in buttonItems"
|
|
:key="item.label"
|
|
:variant="item.pinned ? 'ghost' : 'ghost'"
|
|
:color="(item.to && route.path === item.to) ? 'primary' : (item.pinned ? 'amber' : 'gray')"
|
|
:icon="item.pinned ? 'i-heroicons-star' : item.icon"
|
|
class="w-full"
|
|
:to="item.to"
|
|
:target="item.target"
|
|
>
|
|
<UIcon
|
|
v-if="item.pinned"
|
|
:name="item.icon"
|
|
class="w-5 h-5 me-2"
|
|
/>
|
|
{{ item.label }}
|
|
</UButton>
|
|
</div>
|
|
<UDivider/>
|
|
<!-- Accordion für die Items mit Children -->
|
|
<UAccordion
|
|
:items="accordionItems"
|
|
:multiple="false"
|
|
class="mt-2"
|
|
>
|
|
<template #default="{ item, open }">
|
|
<UButton
|
|
:variant="'ghost'"
|
|
:color="(item.children?.some(c => route.path.includes(c.to))) ? 'primary' : 'gray'"
|
|
:icon="item.icon"
|
|
class="w-full"
|
|
>
|
|
{{ item.label }}
|
|
<template #trailing>
|
|
<UIcon
|
|
name="i-heroicons-chevron-right-20-solid"
|
|
class="w-5 h-5 ms-auto transform transition-transform duration-200"
|
|
:class="[open && 'rotate-90']"
|
|
/>
|
|
</template>
|
|
</UButton>
|
|
</template>
|
|
|
|
<template #item="{ item }">
|
|
<div class="flex flex-col">
|
|
<UButton
|
|
v-for="child in item.children"
|
|
:key="child.label"
|
|
variant="ghost"
|
|
:color="child.to === route.path ? 'primary' : 'gray'"
|
|
:icon="child.icon"
|
|
class="ml-4"
|
|
:to="child.to"
|
|
:target="child.target"
|
|
:disabled="child.disabled"
|
|
>
|
|
{{ child.label }}
|
|
</UButton>
|
|
</div>
|
|
</template>
|
|
</UAccordion>
|
|
<!-- <UAccordion
|
|
:items="links"
|
|
:multiple="false"
|
|
>
|
|
<template #default="{ item, index, open }">
|
|
<UButton
|
|
:variant="item.pinned ? 'ghost' : 'ghost'"
|
|
:color="(item.to && route.path === item.to) || (item.children?.some(c => route.path.includes(c.to))) ? 'primary' : (item.pinned ? 'amber' : 'gray')"
|
|
:icon="item.pinned ? 'i-heroicons-star' : item.icon"
|
|
class="w-full"
|
|
:to="item.to"
|
|
:target="item.target"
|
|
>
|
|
<UIcon
|
|
v-if="item.pinned"
|
|
:name="item.icon" class="w-5 h-5 me-2" />
|
|
{{ item.label }}
|
|
|
|
<template v-if="item.children" #trailing>
|
|
<UIcon
|
|
name="i-heroicons-chevron-right-20-solid"
|
|
class="w-5 h-5 ms-auto transform transition-transform duration-200"
|
|
:class="[open && 'rotate-90']"
|
|
/>
|
|
</template>
|
|
</UButton>
|
|
</template>
|
|
|
|
<template #item="{ item }">
|
|
<div class="flex flex-col" v-if="item.children?.length > 0">
|
|
<UButton
|
|
v-for="child in item.children"
|
|
:key="child.label"
|
|
variant="ghost"
|
|
:color="child.to === route.path ? 'primary' : 'gray'"
|
|
:icon="child.icon"
|
|
class="ml-4"
|
|
:to="child.to"
|
|
:target="child.target"
|
|
>
|
|
{{ child.label }}
|
|
</UButton>
|
|
</div>
|
|
</template>
|
|
</UAccordion>-->
|
|
|
|
</template> |