added main navigation

resources/js/components/MainNav.vue

@@ -0,0 +1,61 @@
+<template>
+    <n-menu v-model:value="activeKey" mode="horizontal" :options="menuOptions" />
+</template>
+
+<script setup>
+    import { Link } from '@inertiajs/vue3'
+    import { h, ref } from 'vue';
+    import { NIcon, NButton } from 'naive-ui'
+    import {
+        GroupsFilled as Users,
+        EventNoteFilled as Events,
+        LogOutFilled as Logout
+    } from '@vicons/material'
+
+    const activeKey = ref(null)
+
+    const menuOptions = ref([
+        {
+            label: () =>
+                h(
+                    Link, {
+                        href: "/Events",
+                        methode: "get"
+                    },
+                    "Veranstaltungen"
+                ),
+                key: 'go-to-events',
+                icon: renderIcon(Events)
+        },
+        {
+            label: () =>
+                h(
+                    Link, {
+                        href: "/Users",
+                        method: "get"
+                    },
+                    "Benutzer"
+                ),
+                key: 'go-to-users',
+                icon: renderIcon(Users)
+        },
+        {
+            label: () =>
+                h(
+                    Link, {
+                        href: "/Login",
+                        method: "get"
+                    },
+                    "Abmelden"
+                ),
+                key: 'go-to-logout',
+                icon: renderIcon(Logout)
+        }
+    ])
+
+    function renderIcon(icon) {
+        return () => h(NIcon, null, { default: () => h(icon) })
+
+    }
+
+</script>