65 lines
2.5 KiB
Vue
65 lines
2.5 KiB
Vue
<template>
|
|
<div class="min-h-screen">
|
|
<div class="flex min-h-screen">
|
|
<aside class="flex w-64 flex-col border-r border-neutral-200 bg-tertiary-500 no-print">
|
|
<div>
|
|
<img src="/malio.png" alt="Logo" class="w-auto"/>
|
|
</div>
|
|
<nav class="flex-1 px-4 pb-6">
|
|
<NuxtLink
|
|
to="/"
|
|
class="flex items-center gap-3 px-4 pb-3 pt-6 text-md font-semibold text-neutral-700 hover:bg-primary-50 hover:text-primary-600 border-t border-secondary-500"
|
|
active-class="bg-primary-50 text-primary-600"
|
|
>
|
|
Tableau de bord
|
|
</NuxtLink>
|
|
<NuxtLink
|
|
to="/calendar"
|
|
class="flex items-center gap-3 px-4 py-3 text-md font-semibold text-neutral-700 hover:bg-primary-50 hover:text-primary-600"
|
|
active-class="bg-primary-50 text-primary-600"
|
|
>
|
|
Calendrier
|
|
</NuxtLink>
|
|
<NuxtLink
|
|
to="/employees"
|
|
class="flex items-center gap-3 px-4 py-3 text-md font-semibold text-neutral-700 hover:bg-primary-50 hover:text-primary-600"
|
|
active-class="bg-primary-50 text-primary-600"
|
|
>
|
|
Employés
|
|
</NuxtLink>
|
|
<NuxtLink
|
|
to="/absence-types"
|
|
class="flex items-center gap-3 px-4 py-3 text-md font-semibold text-neutral-700 hover:bg-primary-50 hover:text-primary-600"
|
|
active-class="bg-primary-50 text-primary-600"
|
|
>
|
|
Types d'absence
|
|
</NuxtLink>
|
|
</nav>
|
|
|
|
<div class="p-4">
|
|
<button
|
|
type="button"
|
|
class="w-full rounded-lg px-4 py-2 text-md font-semibold text-white bg-primary-500"
|
|
@click="handleLogout"
|
|
>
|
|
Déconnexion
|
|
</button>
|
|
</div>
|
|
</aside>
|
|
|
|
<main class="flex-1 px-8 py-8">
|
|
<slot/>
|
|
</main>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
const auth = useAuthStore()
|
|
|
|
const handleLogout = async () => {
|
|
await auth.logout()
|
|
await navigateTo('/login')
|
|
}
|
|
</script>
|