import { useRouterStore } from './router'
import { useThemeStore } from './theme'

export const useMenuStore = defineStore('menu', () => {
  const routerStore = useRouterStore()

  const collapse = ref(false)
  const setCollapse = (flag: boolean) => {
    collapse.value = flag
  }

  const allMenuList = computed(() => routerStore.menuRouter)
  const activeRoutePath: any = useSessionStorage('activeRoutePath', '')

  const activeTopMenu: any = useSessionStorage('activeTopMenu', {})
  const setActiveTopMenu = (menu: any) => {
    activeTopMenu.value = menu
  }

  const leftMenuList = computed(() => {
    const themeStore = useThemeStore()
    if (themeStore.themeNav === 'top') {
      return activeTopMenu.value?.children || []
    } else {
      return allMenuList.value
    }
  })

  return {
    collapse,
    setCollapse,
    allMenuList,
    leftMenuList,
    activeRoutePath,
    activeTopMenu,
    setActiveTopMenu
  }
})
