matthieu
c7b1e62037
Add admin page with tabs for managing task statuses, efforts, priorities and types, with CRUD drawers and color picker. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
69 lines
3.0 KiB
Vue
69 lines
3.0 KiB
Vue
<template>
|
|
<div class="h-screen overflow-hidden">
|
|
<div class="flex h-full">
|
|
<aside class="flex h-full w-64 flex-shrink-0 flex-col border-r border-neutral-200 bg-tertiary-500">
|
|
<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-black hover:bg-tertiary-500 hover:text-primary-500 border-t border-secondary-500"
|
|
active-class="bg-tertiary-500 text-primary-500"
|
|
>
|
|
<Icon name="mdi:question-mark" size="24"/>
|
|
<span class="self-baseline text-md">Tableau de bord</span>
|
|
</NuxtLink>
|
|
<NuxtLink
|
|
to="/projects"
|
|
class="flex gap-3 px-4 py-3 text-md font-semibold text-black hover:bg-tertiary-500 hover:text-primary-500"
|
|
active-class="bg-tertiary-500 text-primary-500"
|
|
>
|
|
<Icon name="mdi:folder-outline" size="24"/>
|
|
<span class="self-baseline text-md">Projets</span>
|
|
</NuxtLink>
|
|
<NuxtLink
|
|
to="/clients"
|
|
class="flex gap-3 px-4 py-3 text-md font-semibold text-black hover:bg-tertiary-500 hover:text-primary-500"
|
|
active-class="bg-tertiary-500 text-primary-500"
|
|
>
|
|
<Icon name="mdi:account-group-outline" size="24"/>
|
|
<span class="self-baseline text-md">Clients</span>
|
|
</NuxtLink>
|
|
<NuxtLink
|
|
to="/admin"
|
|
class="flex gap-3 px-4 py-3 text-md font-semibold text-black hover:bg-tertiary-500 hover:text-primary-500"
|
|
active-class="bg-tertiary-500 text-primary-500"
|
|
>
|
|
<Icon name="mdi:cog-outline" size="24"/>
|
|
<span class="self-baseline text-md">Administration</span>
|
|
</NuxtLink>
|
|
</nav>
|
|
|
|
<div class="flex flex-col gap-2 items-center p-4">
|
|
<p class="font-bold">v 0.0.0</p>
|
|
</div>
|
|
</aside>
|
|
|
|
<div class="h-full flex-1 overflow-hidden flex flex-col">
|
|
<AppTopNav :user="auth.user" />
|
|
<main class="flex-1 overflow-y-auto px-8 py-12">
|
|
<slot/>
|
|
</main>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import {useAppVersion} from "~/composables/useAppVersion";
|
|
|
|
const auth = useAuthStore()
|
|
const {version} = useAppVersion()
|
|
|
|
const handleLogout = async () => {
|
|
await auth.logout()
|
|
await navigateTo('/login')
|
|
}
|
|
</script>
|