import { defineStore } from 'pinia'
import type { RouteRecordNormalized } from 'vue-router'
import defaultSettings from '@/config/settings.json'
import { userPmn } from '@/api/module/user'
import { isMenuPermission, transformMenuToRoutes, type ServerMenuItem } from '@/router/menu-data'
import { buildTree } from '@/utils/tree'
import SafeStorage, { AppStorageKey } from '@/utils/safeStorage'
import router from '@/router'
import { AppState } from './types'

const useAppStore = defineStore('app', {
  state: (): AppState => ({ ...defaultSettings, permissionCodes: [] }),

  getters: {
    appCurrentSetting(state: AppState): AppState {
      return { ...state }
    },
    appDevice(state: AppState) {
      return state.device
    },
    appAsyncMenus(state: AppState): RouteRecordNormalized[] {
      return state.serverMenu as unknown as RouteRecordNormalized[]
    },
  },

  actions: {
    // Update app settings
    updateSettings(partial: Partial<AppState>) {
      // @ts-ignore-next-line
      this.$patch(partial)
    },

    // Change theme color
    toggleTheme(dark: boolean) {
      if (dark) {
        this.theme = 'dark'
        document.body.setAttribute('arco-theme', 'dark')
      } else {
        this.theme = 'light'
        document.body.removeAttribute('arco-theme')
      }
    },
    toggleDevice(device: string) {
      this.device = device
    },
    toggleMenu(value: boolean) {
      this.hideMenu = value
    },
    async fetchServerMenuConfig() {
      const userInfo = SafeStorage.get(AppStorageKey.USER_INFO) as any
      try {
        // 使用本地菜单数据（接口未准备好）
        // TODO: 接口准备好后，取消下面的注释，使用真实接口数据
        const res = await userPmn({ id: userInfo.user_id, workspace: import.meta.env.VITE_APP_WORKSPACE })
        if (res.code === 0 && res?.details?.length) {
          const permissions = (res.details[0].permissions ?? []) as ServerMenuItem[]

          this.permissionCodes = [
            ...new Set(
              permissions.map((permission) => permission.code).filter((code): code is string => typeof code === 'string' && code.length > 0)
            ),
          ]

          const menuPermissions = permissions.filter(isMenuPermission)

          // 使用 buildTree 将扁平数据构建为树结构
          const treeResult = buildTree(menuPermissions, {
            orderKey: 'order',
          })

          // 使用 transformMenuToRoutes 将树结构转换为路由配置
          const routes = transformMenuToRoutes(treeResult.rootItems as ServerMenuItem[])

          // 动态注册路由
          routes.forEach((route) => {
            // 打印路由结构以便调试
            // console.log('Registering route:', JSON.stringify(route, (key, value) => {
            //   if (typeof value === 'function') return '[Function]'
            //   return value
            // }, 2))
            router.addRoute(route as any)
          })

          this.serverMenu = routes as unknown as RouteRecordNormalized[]
        } else {
          // 如果接口返回数据为空，使用本地数据
          // localMenuData.forEach((route) => {
          //   router.addRoute(route as any)
          // })
          // this.serverMenu = localMenuData as unknown as RouteRecordNormalized[]
        }
      } catch (error) {
        // 接口失败时使用本地数据
        console.error('fetchServerMenuConfig error:', error)
        // localMenuData.forEach((route) => {
        //   router.addRoute(route as any)
        // })
        // this.serverMenu = localMenuData as unknown as RouteRecordNormalized[]
      }
    },
    clearServerMenu() {
      // 清除动态注册的路由
      if (this.serverMenu && this.serverMenu.length > 0) {
        this.serverMenu.forEach((route) => {
          const routeName = (route as any).name
          if (routeName && typeof routeName === 'string') {
            router.removeRoute(routeName)
          }
        })
      }
      this.serverMenu = []
      this.permissionCodes = []
    },
  },
})

export default useAppStore
