Changed Main NAV

This commit is contained in:
2025-09-07 19:09:15 +02:00
parent 45741a6295
commit 01e3d878d3

View File

@@ -262,11 +262,7 @@ const links = computed(() => {
}] : [],
]
},
... has("checks") ? [{
label: "Überprüfungen",
to: "/standardEntity/checks",
icon: "i-heroicons-magnifying-glass"
},] : [],
... has("projects") ? [{
label: "Projekte",
to: "/standardEntity/projects",
@@ -282,7 +278,11 @@ const links = computed(() => {
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,
@@ -304,11 +304,13 @@ const links = computed(() => {
},{
label: "E-Mail Konten",
to: "/settings/emailAccounts",
icon: "i-heroicons-envelope"
icon: "i-heroicons-envelope",
disabled: true
},{
label: "Bankkonten",
to: "/settings/banking",
icon: "i-heroicons-currency-euro"
icon: "i-heroicons-currency-euro",
disabled: true
},{
label: "Textvorlagen",
to: "/settings/texttemplates",
@@ -334,10 +336,83 @@ const links = computed(() => {
}
]
})
// 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"
>
@@ -381,6 +456,6 @@ const links = computed(() => {
</UButton>
</div>
</template>
</UAccordion>
</UAccordion>-->
</template>