71 lines
1.6 KiB
Vue
71 lines
1.6 KiB
Vue
<template>
|
|
<n-menu
|
|
v-model:value="activeKey"
|
|
mode="horizontal"
|
|
:options="menuOptions"
|
|
class="-mx-4"
|
|
/>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { Link, usePage } from '@inertiajs/vue3'
|
|
import { h, ref, watch } from 'vue';
|
|
import { NIcon, NButton } from 'naive-ui'
|
|
import {
|
|
GroupsFilled as Users,
|
|
EventNoteFilled as Events,
|
|
LogOutFilled as Logout
|
|
} from '@vicons/material'
|
|
|
|
const { request, isAdmin } = usePage().props
|
|
const activeKey = ref(request.url)
|
|
|
|
const menuOptions = ref([])
|
|
menuOptions.value.push({
|
|
label: () =>
|
|
h(
|
|
Link, {
|
|
href: "/events",
|
|
methode: "get"
|
|
},
|
|
() => "Veranstaltungen"
|
|
),
|
|
key: '/events',
|
|
icon: renderIcon(Events)
|
|
})
|
|
|
|
if(isAdmin) menuOptions.value.push({
|
|
label: () =>
|
|
h(
|
|
Link, {
|
|
href: "/users",
|
|
method: "get"
|
|
},
|
|
() => "Benutzer"
|
|
),
|
|
key: '/users',
|
|
icon: renderIcon(Users)
|
|
})
|
|
|
|
menuOptions.value.push({
|
|
label: () =>
|
|
h(
|
|
Link, {
|
|
href: "/logout",
|
|
method: "post",
|
|
as: "button"
|
|
},
|
|
() => "Abmelden"
|
|
),
|
|
key: '/logout',
|
|
icon: renderIcon(Logout)
|
|
})
|
|
|
|
|
|
|
|
function renderIcon(icon) {
|
|
return () => h(NIcon, null, { default: () => h(icon) })
|
|
|
|
}
|
|
|
|
</script> |