d219ed1b3b
- Retrait de l'entrée "Calendrier" du menu et de sa route Vue Router - isActive inclut désormais les sous-items (fix: groupe Mangas actif sur /import) - Chevron déplacé dans un <button> séparé du RouterLink (plus de double toggle/nav) - Hover harmonisé : hover:bg-gray-700 + hover:text-white sur parent et sous-items
104 lines
3.1 KiB
Vue
104 lines
3.1 KiB
Vue
<template>
|
|
<aside
|
|
:class="[
|
|
'fixed top-16 left-0 w-60 bg-gray-600 text-white transform transition-transform duration-300 ease-in-out z-40 h-full',
|
|
isOpen ? 'translate-x-0' : '-translate-x-full',
|
|
!forceMobileBehavior ? 'md:translate-x-0' : ''
|
|
]"
|
|
role="navigation"
|
|
aria-label="Menu principal">
|
|
<nav class="h-full overflow-y-auto">
|
|
<ul class="h-full flex flex-col">
|
|
<li v-for="(item, index) in menuItems" :key="index" class="mb-2">
|
|
<MenuGroup
|
|
:id="item.id"
|
|
:icon="item.icon"
|
|
:text="item.text"
|
|
:sub-items="item.subItems"
|
|
:to="item.to" />
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
</aside>
|
|
</template>
|
|
|
|
<script setup>
|
|
import {
|
|
ArrowDownTrayIcon,
|
|
ArrowsRightLeftIcon,
|
|
BookOpenIcon,
|
|
ClockIcon,
|
|
Cog6ToothIcon,
|
|
ComputerDesktopIcon,
|
|
GlobeAltIcon,
|
|
PlusIcon
|
|
} from '@heroicons/vue/24/solid';
|
|
import MenuGroup from './sidebar/MenuGroup.vue';
|
|
|
|
const props = defineProps({
|
|
isOpen: {
|
|
type: Boolean,
|
|
required: true
|
|
},
|
|
forceMobileBehavior: {
|
|
type: Boolean,
|
|
default: false
|
|
}
|
|
});
|
|
|
|
const menuItems = [
|
|
{
|
|
icon: BookOpenIcon,
|
|
text: 'Mangas',
|
|
to: '/manga',
|
|
id: 'manga',
|
|
subItems: [
|
|
{ icon: PlusIcon.render, text: 'Ajouter un nouveau', to: '/manga/add' },
|
|
{
|
|
icon: ArrowDownTrayIcon,
|
|
text: 'Import bibliothèque',
|
|
to: '/import'
|
|
},
|
|
{ icon: GlobeAltIcon, text: 'Découvrir', to: '/manga/discover' }
|
|
]
|
|
},
|
|
{
|
|
icon: ArrowsRightLeftIcon,
|
|
text: 'Convertir CBR en CBZ',
|
|
to: '/convert',
|
|
id: 'convert'
|
|
},
|
|
{
|
|
icon: ClockIcon,
|
|
text: 'Activité',
|
|
to: '/activity',
|
|
id: 'activity',
|
|
badge: '3'
|
|
},
|
|
{
|
|
icon: Cog6ToothIcon,
|
|
text: 'Paramètres',
|
|
to: '/settings',
|
|
id: 'settings',
|
|
subItems: [
|
|
{ icon: null, text: 'Général', to: '/settings/general' },
|
|
{ icon: null, text: 'Dossiers', to: '/settings/folders' },
|
|
{ icon: null, text: 'Scrappers', to: '/settings/scrappers' },
|
|
{ icon: null, text: 'UI', to: '/settings/ui' }
|
|
]
|
|
},
|
|
{
|
|
icon: ComputerDesktopIcon,
|
|
text: 'Système',
|
|
to: '/system',
|
|
id: 'system',
|
|
subItems: [
|
|
{ icon: null, text: 'Status', to: '/system/status' },
|
|
{ icon: null, text: 'Backup', to: '/system/backup' },
|
|
{ icon: null, text: 'Logs', to: '/system/logs' },
|
|
{ icon: null, text: 'Updates', to: '/system/updates' }
|
|
]
|
|
}
|
|
];
|
|
</script>
|