server-worklog/frontend/app/layouts/default.vue

52 lines
1.4 KiB
Vue

<script setup>
const { token, loadToken, logout } = useAuth()
const router = useRouter()
const showWorkMenu = ref(false)
if (process.client) {
loadToken()
}
function doLogout() {
logout()
router.push("/login")
}
</script>
<template>
<div>
<header class="p-4 bg-white shadow flex justify-between">
<nav class="flex gap-4 items-center">
<NuxtLink to="/">Dashboard</NuxtLink>
<NuxtLink to="/owners">Owners</NuxtLink>
<NuxtLink to="/servers">Servers</NuxtLink>
<div class="relative">
<button @click="showWorkMenu = !showWorkMenu" class="cursor-pointer">
Work Entries
</button>
<div v-if="showWorkMenu" class="absolute left-0 mt-2 bg-white shadow rounded p-2 space-y-1 z-50">
<NuxtLink @click="showWorkMenu = false" to="/workentries/create" class="block px-3 py-1 hover:bg-gray-100 rounded">
Neu erstellen
</NuxtLink>
<NuxtLink @click="showWorkMenu = false" to="/workentries/search" class="block px-3 py-1 hover:bg-gray-100 rounded">
Suchen
</NuxtLink>
</div>
</div>
</nav>
<div>
<button v-if="token" @click="doLogout" class="text-red-600 hover:underline">
Logout
</button>
</div>
</header>
<main class="p-6">
<NuxtPage />
</main>
</div>
</template>