53 lines
1.7 KiB
Vue
53 lines
1.7 KiB
Vue
<template>
|
|
<div class="min-h-screen bg-white text-neutral-900">
|
|
<header class="fixed top-0 left-0 right-0 z-50 border-b border-neutral-200 bg-primary-500 h-[85px]">
|
|
<div class="flex h-full w-full items-center px-6">
|
|
<NuxtLink to="/" class="flex items-center gap-3">
|
|
<span class="flex items-center justify-center bg-white text-xl font-bold uppercase text-primary-500 p-4">
|
|
LOGO
|
|
</span>
|
|
</NuxtLink>
|
|
|
|
<nav class="mx-8 flex flex-1 gap-8 text-2xl font-bold uppercase text-white"></nav>
|
|
|
|
<NuxtLink to="/" class="ml-auto text-xl font-bold uppercase text-white transition hover:opacity-80">
|
|
Quitter le panel admin
|
|
</NuxtLink>
|
|
</div>
|
|
</header>
|
|
|
|
<aside
|
|
class="fixed left-0 top-[85px] z-40 w-64 h-[calc(100vh-85px)] bg-primary-500 text-white flex flex-col"
|
|
>
|
|
<div class="flex-1 overflow-y-auto p-4 space-y-4">
|
|
Dashboard
|
|
</div>
|
|
|
|
<div class="p-4 border-t border-neutral-700">
|
|
<button
|
|
@click="handleLogout"
|
|
class="w-full bg-red-600 hover:bg-red-700 py-2 rounded font-bold"
|
|
>
|
|
Déconnexion
|
|
</button>
|
|
</div>
|
|
</aside>
|
|
|
|
<main class="pt-[85px] ml-64 px-6">
|
|
<div class="mx-auto w-full max-w-[1280px] py-6">
|
|
<slot/>
|
|
</div>
|
|
</main>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
const handleLogout = async () => {
|
|
try {
|
|
await auth.logout()
|
|
} finally {
|
|
await navigateTo('/login')
|
|
}
|
|
}
|
|
</script>
|