tristan
c766e76624
Auto Tag Develop / tag (push) Successful in 8s
## Objectif Remplacer la sidebar maison par le composant `MalioSidebar` de `@malio/layer-ui` (alignement avec Starseed). ## Changements - **Backend** : `config/sidebar.php` re-catégorisé en **3 groupes** (Général / Outils / Administration). Tous les gates permission/rôle/module **préservés côté serveur** (rien déplacé côté client). - **Frontend** : `app/layouts/default.vue` migré vers `<MalioSidebar>`. Un computed `mergedSections` mappe les sections backend et y fusionne les items contextuels (Kanban/Groupes/Archives sous « Projets », Mes absences, Messagerie avec compteur `(N)`, Documents). - **Footer** : timer (`SidebarTimer`) + version de l'app (masquée en mode replié). - **Logo** : logos Malio repris de Starseed (`LOGO_MALIO.png` / `LOGO_MALIO_COLLAPSED.png`). - **Mobile** : `MalioSidebar` étant toujours visible (pas de tiroir off-canvas), le hamburger pilote désormais le repli ; suppression du code de tiroir mobile mort (`sidebarOpen`/`openMobileSidebar`/`closeMobileSidebar`). - **Nettoyage** : suppression de `SidebarLink.vue` et `LOGO_CARRE.png` (obsolètes). `malio.png` conservé (utilisé par la page login). - **i18n** : nouvelles clés `sidebar.tools.section`, `sidebar.general.myAbsences`, `sidebar.project.kanban|groups|archives` ; `sidebar.general.section` → « Général ». ## Compromis (limites du composant, lib non modifiée) - Pas d'icône par item (uniquement icône de section) — design malioUI, comme Starseed. - Badge mail → suffixe `(N)` dans le libellé. ## Vérifications - Build Nuxt OK (`✨ Build complete!`, exit 0). - Revue par task + revue finale whole-branch : aucun Critical/Important. - Sécurité : filtrage des permissions inchangé (côté serveur). Specs/plan : `docs/superpowers/specs/2026-06-25-malio-sidebar-migration-design.md`, `docs/superpowers/plans/2026-06-25-malio-sidebar-migration.md`. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Reviewed-on: #26 Co-authored-by: tristan <tristan@yuno.malio.fr> Co-committed-by: tristan <tristan@yuno.malio.fr>
74 lines
2.6 KiB
Vue
74 lines
2.6 KiB
Vue
<template>
|
|
<header class="border-b border-neutral-200 bg-primary-500 px-3 py-2 text-white sm:px-5 sm:py-2 max-h-[60px]">
|
|
<div class="flex h-full items-center justify-between">
|
|
<MalioButtonIcon
|
|
icon="mdi:menu"
|
|
aria-label="Replier ou déplier le menu"
|
|
variant="ghost"
|
|
icon-size="24"
|
|
button-class="lg:hidden text-white hover:bg-primary-600"
|
|
@click="ui.toggleSidebar()"
|
|
/>
|
|
<div class="hidden items-center gap-2 lg:flex">
|
|
<h1 class="text-lg font-bold tracking-tight">Lesstime</h1>
|
|
</div>
|
|
<div class="ml-auto flex items-center gap-4 text-xl text-white sm:gap-8">
|
|
<MalioButtonIcon
|
|
icon="mdi:help-circle-outline"
|
|
aria-label="Centre d'aide"
|
|
variant="ghost"
|
|
icon-size="22"
|
|
button-class="text-white/70 hover:bg-primary-600 hover:text-white"
|
|
@click="navigateTo('/help')"
|
|
/>
|
|
<MalioButtonIcon
|
|
:icon="ui.darkMode ? 'mdi:weather-sunny' : 'mdi:weather-night'"
|
|
:aria-label="ui.darkMode ? 'Mode clair' : 'Mode sombre'"
|
|
variant="ghost"
|
|
icon-size="22"
|
|
button-class="text-white/70 hover:bg-primary-600 hover:text-white"
|
|
@click="ui.toggleDarkMode()"
|
|
/>
|
|
<NotificationBell />
|
|
<div class="group relative flex gap-2 sm:gap-4">
|
|
<UserAvatar v-if="user" :user="user" size="md" class="cursor-pointer" />
|
|
<Icon v-else name="mdi:account-circle-outline" class="self-center cursor-pointer" size="36" />
|
|
<p class="hidden self-center cursor-pointer sm:block">{{ user?.username }}</p>
|
|
<div class="invisible absolute right-0 top-full z-50 mt-2 w-44 rounded-md border border-neutral-200 bg-white py-1 text-sm text-neutral-800 opacity-0 shadow-lg transition-all group-hover:visible group-hover:opacity-100">
|
|
<button
|
|
type="button"
|
|
class="block w-full px-3 py-2 text-left hover:bg-neutral-100"
|
|
@click="navigateTo('/profile')"
|
|
>
|
|
{{ $t('profile.title') }}
|
|
</button>
|
|
<button
|
|
type="button"
|
|
class="block w-full px-3 py-2 text-left hover:bg-neutral-100"
|
|
@click="handleLogout"
|
|
>
|
|
Déconnexion
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import type { UserData } from '~/services/dto/user-data'
|
|
|
|
defineProps<{
|
|
user?: UserData
|
|
}>()
|
|
|
|
const auth = useAuthStore()
|
|
const ui = useUiStore()
|
|
|
|
async function handleLogout() {
|
|
await auth.logout()
|
|
await navigateTo('/login')
|
|
}
|
|
</script>
|