diff --git a/apps/web/src/layouts/AppLayout.vue b/apps/web/src/layouts/AppLayout.vue index 12700eb..20f1c7c 100644 --- a/apps/web/src/layouts/AppLayout.vue +++ b/apps/web/src/layouts/AppLayout.vue @@ -18,6 +18,63 @@ const roleLabel = computed(() => auth.user?.role ? USER_ROLE_LABELS[auth.user.role] : '', ); +const salesOpen = ref(false); +const moreOpen = ref(false); +const settingsOpen = ref(false); + +const salesPaths = [ + '/quotes', + '/invoices', + '/sales/forecast', + '/reports', +]; +const morePaths = [ + '/activities/calendar', + '/projects', + '/project-cards', + '/loyalty', +]; +const settingsPaths = [ + '/settings/team', + '/settings/automations', + '/settings/lead-forms', + '/settings/custom-fields', + '/settings/products', + '/settings/currencies', + '/settings/faq', +]; + +function pathIn(prefixes: string[]) { + return prefixes.some( + (p) => route.path === p || route.path.startsWith(`${p}/`), + ); +} + +const salesActive = computed(() => pathIn(salesPaths)); +const moreActive = computed(() => pathIn(morePaths)); +const settingsActive = computed(() => pathIn(settingsPaths)); + +watch( + () => route.path, + () => { + if (salesActive.value) salesOpen.value = true; + if (moreActive.value) moreOpen.value = true; + if (settingsActive.value) settingsOpen.value = true; + }, + { immediate: true }, +); + +function toggleGroup( + key: 'sales' | 'more' | 'settings', + event: Event, +) { + event.preventDefault(); + event.stopPropagation(); + if (key === 'sales') salesOpen.value = !salesOpen.value; + if (key === 'more') moreOpen.value = !moreOpen.value; + if (key === 'settings') settingsOpen.value = !settingsOpen.value; +} + const menuOpen = ref(false); const notifOpen = ref(false); const loading = ref(false); @@ -185,29 +242,89 @@ onUnmounted(() => { -