78 lines
2.6 KiB
Vue
78 lines
2.6 KiB
Vue
<template>
|
|
<div class="min-h-screen text-neutral-900 grid grid-rows-[85px,1fr]">
|
|
<!-- HEADER -->
|
|
<header class="bg-primary-500 z-50 h-[85px]">
|
|
<div class="h-full w-full px-6 grid grid-cols-[auto,1fr,auto] items-center gap-8">
|
|
<NuxtLink to="/" class="grid place-items-center">
|
|
<span class="grid place-items-center bg-white text-xl font-bold uppercase text-primary-500 p-4">
|
|
LOGO
|
|
</span>
|
|
</NuxtLink>
|
|
|
|
<nav class="text-2xl font-bold uppercase text-white"></nav>
|
|
|
|
<NuxtLink
|
|
to="/"
|
|
class="text-xl font-bold uppercase text-white transition hover:opacity-80 justify-self-end"
|
|
>
|
|
Quitter le panel admin
|
|
</NuxtLink>
|
|
</div>
|
|
</header>
|
|
|
|
<div class="grid grid-cols-[16rem,1fr] h-[calc(100vh-85px)] min-h-0">
|
|
<aside class="bg-primary-500 text-white min-h-0 grid grid-rows-[auto,1fr,auto]">
|
|
<div class="p-4 font-semibold">Tableau de bord</div>
|
|
|
|
<div class="overflow-y-auto min-h-0 p-4 space-y-3">
|
|
<!-- Ici il faut une list des entite modifiable -->
|
|
<div>Réception</div>
|
|
<div>Expédition</div>
|
|
<div>Véhicule</div>
|
|
<div>Poids</div>
|
|
<div>Fournisseur</div>
|
|
<div>Bovin</div>
|
|
<div>Type de livraison</div>
|
|
<div>Client</div>
|
|
<div>Transporteur</div>
|
|
<div>Adresse</div>
|
|
<div>Utilisateur</div>
|
|
<div>Batiments</div>
|
|
<div>Driver</div>
|
|
<div>Toto</div>
|
|
<div>Toto</div>
|
|
<div>Toto</div>
|
|
</div>
|
|
|
|
<div class="p-4">
|
|
<button
|
|
@click="handleLogout"
|
|
class="w-full bg-red-600 hover:bg-red-700 py-2 rounded font-bold"
|
|
>
|
|
Déconnexion
|
|
</button>
|
|
</div>
|
|
</aside>
|
|
|
|
<!-- MAIN -->
|
|
<main class="min-h-0 overflow-auto px-6 py-6">
|
|
<div class="mx-auto w-full max-w-[1280px] py-6">
|
|
<slot />
|
|
</div>
|
|
</main>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
|
|
<script setup lang="ts">
|
|
|
|
const handleLogout = async () => {
|
|
try {
|
|
await auth.logout()
|
|
} finally {
|
|
await navigateTo('/login')
|
|
}
|
|
}
|
|
</script>
|