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