Changed Main NAV

components/MainNav.vue

@@ -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>