import { defineStore } from 'pinia'
import { computed, ref } from 'vue'
import { useRoute } from 'vue-router'
import { navigationConfig } from '@/config/navigation'

export const useNavigationStore = defineStore('navigation', () => {
  // Status
  const route = useRoute()
  const drawer = ref(false)

  // 当前选中的菜单项
  const selectedIndex = computed(() => {
    return navigationConfig.findIndex(item => item.to === route.path)
  })

  // Actions
  function toggleDrawer () {
    drawer.value = !drawer.value
  }

  function setDrawerOpen (open: boolean) {
    drawer.value = open
  }

  return {
    selectedIndex,
    drawer,
    toggleDrawer,
    setDrawerOpen,
  }
})