/**
/**
 * 应用路由配置文件
 * 定义应用的路由结构、组件映射和权限控制规则
 */

// 导入Vue Router核心函数
import { createRouter, createWebHistory } from 'vue-router'

// 导入页面组件
import LoginView from '../views/LoginView.vue' // 登录页面组件
import LayoutView from '../views/LayoutView.vue' // 主布局组件
import HomeView from '../views/HomeView.vue' // 首页组件
import KeyManager from '../views/Key/KeyManager.vue' // 钥匙管理组件

// 导入用户状态管理
import { useUserStore } from '../stores/user'

/**
 * 创建路由实例
 * 使用HTML5 History模式管理路由，需要服务器端配置支持
 */
const router = createRouter({
  history: createWebHistory(import.meta.env.BASE_URL),
  routes: [
    {
      path: '/login',
      name: 'login',
      component: LoginView // 登录页面，无需身份验证即可访问
    },
    {
      path: '/',
      name: 'layout',
      component: LayoutView, // 主布局页面，包含侧边栏、顶栏等公共布局元素
      meta: { requiresAuth: true }, // 标记此路由需要登录权限
      children: [
        {
          path: '',
          name: 'home',
          components: {
            map: HomeView // 默认视图，渲染首页组件到map视图容器
          }
        },
        {
          path: '/Key/KeyManager',
          name: 'keyManager',
          components: {
            map: HomeView, // 左侧显示地图视图
            right: KeyManager // 右侧显示钥匙管理视图
          }
        }
        // 可以在这里添加更多子路由
      ]
    }
  ]
})

/**
 * 全局前置路由守卫
 * 用于拦截所有路由跳转请求，实现基于角色的权限控制
 */
router.beforeEach((to, from, next) => {
  const userStore = useUserStore() // 获取用户状态管理实例
  const isLoggedIn = userStore.isLoggedIn // 检查用户是否已登录
  
  // 检查路由是否需要身份验证
  if (to.matched.some(record => record.meta.requiresAuth)) {
    // 需要身份验证的路由
    if (!isLoggedIn) {
      // 未登录时重定向到登录页面
      next('/login')
    } else {
      // 已登录用户允许访问
      next()
    }
  } else {
    // 不需要身份验证的路由直接放行
    next()
  }
})

export default router