fix aside expanded when load page

src/components/Navigation/Aside/Aside.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
-import { watch } from 'vue'
-import { useRoute, RouterLink } from 'vue-router'
+import { onMounted, watch } from 'vue'
+import { useRoute, RouterLink, useRouter } from 'vue-router'
 import {
     Dialog,
     DialogPanel,
@@ -13,15 +13,31 @@ import { IconApp } from '@/utils/icons'
 import AsideMenuSingle from '@/components/Navigation/Aside/AsideMenuSingle.vue'
 import AsideMenuMultiple from '@/components/Navigation/Aside/AsideMenuMultiple.vue'
 import { Bars3BottomLeftIcon } from '@heroicons/vue/20/solid'
+import { splitRoutePath } from '@/utils/texts'
 
 const menu = useMenuStore()
 const route = useRoute()
+const router = useRouter()
 
 watch(route, (to, _) => {
     menu.menuSelected = to.fullPath
+    console.log('path', menu.menuSelected);
     closeSideBar()
 })
 
+onMounted(() => {
+    menu.menuSelected = router.currentRoute.value.fullPath
+    if (menu.menuSelected !== '/' && menu.menuSelected !== '/home' && menu.menuSelected.includes('/home')) {
+        const result = splitRoutePath(menu.menuSelected)
+
+        for (const route of result) {
+            if (route !== '/home') {
+                menu.toggleSidebarMenu(route, true)
+            }
+        }
+    }
+})
+
 const isMenu = (name: string) => {
     return menu.menuSelected === name
 }
@@ -115,3 +131,4 @@ const closeSideBar = () => menu.toggleSidebar()
     </div>
 </template>
 
+@/utils/text@/utils/texts

src/components/Navigation/Aside/AsideMenuMultiple.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { computed, defineProps } from 'vue'
+import { computed, defineProps, onMounted } from 'vue'
 import type { MenuItemModel } from '@/utils/interfaces'
 import { Disclosure, DisclosureButton, DisclosurePanel } from '@headlessui/vue'
 import { useMenuStore } from '@/stores/menu'

src/stores/menu.ts

@@ -10,7 +10,7 @@ import {
     Swap
 } from '@/utils/icons'
 import type { MenuItemModel } from '@/utils/interfaces'
-import { useRoute } from 'vue-router'
+import { useRoute, useRouter } from 'vue-router'
 
 export const useMenuStore = defineStore('menu', () => {
     const route = useRoute()
@@ -635,7 +635,6 @@ export const useMenuStore = defineStore('menu', () => {
         toggleItemExpanded(navigation.value)
     }
     const toggleSidebarDesktop = () => (sidebarShowed.value = !sidebarShowed.value)
-
     return {
         navigation,
         toggleSidebar,

src/utils/texts.ts

@@ -0,0 +1,17 @@
+const splitRoutePath = (routePath: string): string[] => {
+    const routeParts = routePath.split('/').filter((part) => part !== '')
+
+    const routeArray: string[] = []
+    let currentRoute = ''
+
+    for (const part of routeParts) {
+        currentRoute += `/${part}`
+        routeArray.push(currentRoute)
+    }
+
+    return routeArray
+}
+
+export {
+    splitRoutePath
+}