// 創(chuàng)建路由實(shí)例
const router = createRouter({
  history: createWebHistory(import.meta.env.BASE_URL),
  routes: allRoutes
})

// 所有路由定義（靜態(tài)+動(dòng)態(tài)）
const allRoutes = [
  // 基礎(chǔ)路由
  {
    path: '/',
    name: 'login',
    component: () => import("@/views/LoginView.vue")
  },
  {
    path: '/404',
    name: '404',
    component: () => import('@/views/Error/404View.vue')
  },
  // 動(dòng)態(tài)路由容器（登錄后內(nèi)容）
  {
    path: '/layout',
    name: 'layout',
    component: () => import('@/Layout/MainLayout.vue'),
    children: [] // 初始為空，動(dòng)態(tài)注入路由
  },
]

// 需要權(quán)限控制的路由配置（扁平化結(jié)構(gòu)更易管理）
const dynamicRouteConfigs = [
  {
    path: '/home', // 注意使用相對(duì)路徑
    name: 'home',
    component: () => import('@/views/HomeView.vue'),
    meta: { 
      title: '首頁', 
      icon: 'House',
      roles: ['*'] // *表示所有登錄用戶
    }
  },
  {
    path: 'user/list',
    name: 'UserList',
    component: () => import('@/views/user/ListView.vue'),
    meta: { 
      title: '用戶列表',
      roles: ['1','2']
    }
  },
  {
    path: 'user/role',
    name: 'UserRole',
    component: () => import('@/views/user/RoleView.vue'),
    meta: { 
      title: '角色管理',
      roles: ['1']
    }
  }
]

// 權(quán)限過濾方法修正
const filterRoutes = (routes, roles) => {
  // 遞歸處理每個(gè)路由節(jié)點(diǎn)
  return routes.filter(route => {
    // 獲取當(dāng)前路由需要的權(quán)限角色
    const requiredRoles = route.meta?.roles || []
    // 檢查當(dāng)前路由是否滿足權(quán)限要求
    const hasPermission = requiredRoles.includes('*') || requiredRoles.includes(roles + '')
    // 遞歸處理子路由（關(guān)鍵修改點(diǎn)）
    if (route.children) {
      const filteredChildren = filterRoutes(route.children, roles)
      // 保留有效子路由：只有當(dāng)子路由存在時(shí)才保留children
      route.children = filteredChildren.length ? filteredChildren : undefined
    }
    /* 
      路由保留條件（核心邏輯）：
      1. 當(dāng)前路由自身有權(quán)限 或 
      2. 存在有效的子路由（即使當(dāng)前路由沒有權(quán)限，但子路由有權(quán)限時(shí)保留父級(jí)容器）
    */
    return hasPermission || (route.children && route.children.length > 0)
  })
}

// 動(dòng)態(tài)添加路由到layout
const addDynamicRoutes = (roles) => {
  // 清空已有動(dòng)態(tài)路由
  const layout = router.getRoutes().find(r => r.name === 'layout')
  layout.children.forEach(child => {
    router.removeRoute(child.name)
  })
  // 過濾并添加新路由
  const allowedRoutes = filterRoutes(dynamicRouteConfigs, loginStore().roles); 
  allowedRoutes.forEach(route => { router.addRoute('layout', route); });
  console.log(allowedRoutes);
  sessionStorage.setItem('menuPath',JSON.stringify(allowedRoutes));//存儲(chǔ)的篩選過的動(dòng)態(tài)路由
  sessionStorage.setItem('menuName',JSON.stringify(router.getRoutes()));//存儲(chǔ)的所有動(dòng)態(tài)路由
  console.log(router.getRoutes());
  // 確保404最后處理
  router.addRoute({ 
    path: '/:pathMatch(.*)*',
    redirect: '/404'
  })
}

// 路由守衛(wèi)修改部分（router/index.ts）
router.beforeEach(async (to, from, next) => {
  const store = loginStore()
  const isLogin = !!store.id
  // 未登錄狀態(tài)處理
  if (!isLogin) {
    return to.path === '/' ? next() : next('/')
  }
  // 已登錄但訪問登錄頁時(shí)重定向
  if (to.path === '/') {
    return next('/home')
  }
  // 動(dòng)態(tài)路由加載邏輯
  if (!store.routesLoaded) {
    try {
      // 直接從store獲取已保存的角色信息
      const userRoles = store.roles
      console.log(userRoles);
      // 如果角色信息不存在則拋出錯(cuò)誤
      if (!userRoles || userRoles.length === 0) {
        throw new Error('用戶角色信息未獲取')
      }
      // 添加動(dòng)態(tài)路由
      addDynamicRoutes(userRoles)
      // 在添加路由后打印
      console.log('當(dāng)前所有路由:', router.getRoutes().map(r => r.path))
      // 更新加載狀態(tài)
      store.setRoutesLoaded(true)
      // 使用replace方式跳轉(zhuǎn)避免重復(fù)記錄歷史
      return next({ ...to, replace: true })
    } catch (error) {
      console.error('路由加載失敗:', error)
      // 清除用戶狀態(tài)并跳轉(zhuǎn)登錄頁
      store.$reset()
      return next('/')
    }
  }
  next()
})