ClassHelper/packages/web-admin/src/router/index.ts

import { createRouter, createWebHistory, type RouteRecordRaw } from 'vue-router';
import { STORAGE_KEYS, type PermissionKey } from '@classhelper/shared';
import { useAuthStore } from '@/stores/auth';

const routes: RouteRecordRaw[] = [
  {
    path: '/login',
    name: 'login',
    component: () => import('@/views/LoginView.vue'),
    meta: { public: true, title: '登录' },
  },
  {
    path: '/',
    component: () => import('@/layouts/AdminLayout.vue'),
    redirect: '/dashboard',
    children: [
      {
        path: 'dashboard',
        name: 'dashboard',
        component: () => import('@/views/DashboardView.vue'),
        meta: { title: '仪表盘', icon: 'Odometer' },
      },
      {
        path: 'classes',
        name: 'classes',
        component: () => import('@/views/ClassesView.vue'),
        meta: { title: '班级管理', icon: 'School', roles: ['ADMIN'] },
      },
      {
        path: 'students',
        name: 'students',
        component: () => import('@/views/StudentsView.vue'),
        meta: { title: '学生管理', icon: 'User', roles: ['ADMIN'] },
      },
      {
        path: 'teachers',
        name: 'teachers',
        component: () => import('@/views/TeachersView.vue'),
        meta: { title: '教师管理', icon: 'UserFilled', roles: ['ADMIN'] },
      },
      {
        path: 'term-weeks',
        name: 'term-weeks',
        component: () => import('@/views/TermWeeksView.vue'),
        // 改周次会让全校/某班的课表口径整体变化，与「班级管理」同一档权限
        meta: { title: '学期周次', icon: 'Calendar', roles: ['ADMIN'] },
      },
      {
        path: 'archives',
        name: 'archives',
        component: () => import('@/views/ArchivesView.vue'),
        // 毕业归档会改动整届班级与学生的状态，与「班级管理」同一档权限
        meta: { title: '毕业归档', icon: 'FolderOpened', roles: ['ADMIN'] },
      },
      {
        path: 'schedules',
        name: 'schedules',
        component: () => import('@/views/SchedulesView.vue'),
        meta: { title: '课表管理', icon: 'Calendar' },
      },
      {
        path: 'homeworks',
        name: 'homeworks',
        component: () => import('@/views/HomeworksView.vue'),
        meta: { title: '作业发布', icon: 'Notebook' },
      },
      {
        path: 'notifications',
        name: 'notifications',
        component: () => import('@/views/NotificationsView.vue'),
        meta: { title: '通知发布', icon: 'Bell' },
      },
      {
        path: 'grades',
        name: 'grades',
        component: () => import('@/views/GradesView.vue'),
        meta: { title: '成绩录入', icon: 'Trophy' },
      },
      {
        path: 'assistant',
        name: 'assistant',
        component: () => import('@/views/AssistantView.vue'),
        // 按**生效权限**门控（教师默认就有 ai:use，见 shared/permissions.ts 的默认模板）：
        // 管理员把 ai:use 从某个权限组收回后，这一页同时从菜单与路由上消失
        meta: { title: 'AI 助手', icon: 'MagicStick', permission: 'ai:use' },
      },
      {
        path: 'integrations',
        name: 'integrations',
        component: () => import('@/views/IntegrationsView.vue'),
        // 与后端 requireRole('ADMIN','TEACHER') 对齐：这一页含"班级端在线状态"，教师要看自己的班
        meta: { title: 'ClassHelper 联动', icon: 'Connection', roles: ['ADMIN', 'TEACHER'] },
      },
      {
        path: 'ai-settings',
        name: 'ai-settings',
        component: () => import('@/views/AiSettingsView.vue'),
        // 与后端 requirePermission('ai:manage') 对齐：这一页能改密钥与开关，默认仅管理员
        meta: { title: '大模型设置', icon: 'Setting', permission: 'ai:manage' },
      },
      {
        path: 'database',
        name: 'database',
        component: () => import('@/views/DatabaseView.vue'),
        // 与后端 requireRole('ADMIN') 对齐：改动数据库是最高危操作，仅管理员
        meta: { title: '数据库管理', icon: 'Coin', roles: ['ADMIN'] },
      },
      {
        path: 'permissions',
        name: 'permissions',
        component: () => import('@/views/PermissionsView.vue'),
        // 这一页**按生效权限**门控而不是按角色：教师被某个权限组授予 permission:manage 后同样可用，
        // 与后端 requirePermission('permission:manage') 对齐（详见下方守卫）
        meta: { title: '权限组管理', icon: 'Lock', permission: 'permission:manage' },
      },
      {
        path: 'clients',
        name: 'clients',
        component: () => import('@/views/ClientsView.vue'),
        // 这一页同样**按生效权限**门控：远控关机、统一下发更新都是高危操作，
        // 后端三个接口分别要 client:manage / client:update-push / remote:control，
        // 但教师默认三个都没有（见 shared/permissions.ts 的默认模板），所以这里用
        // 最基础的 client:manage 当入口门禁，页面内的按钮再各自按权限显示/禁用。
        meta: { title: '客户端设备', icon: 'Monitor', permission: 'client:manage' },
      },
    ],
  },
  {
    path: '/:pathMatch(.*)*',
    name: 'not-found',
    component: () => import('@/views/NotFoundView.vue'),
    meta: { public: true, title: '页面不存在' },
  },
];

export const router = createRouter({
  history: createWebHistory(),
  routes,
});

/** 读取已保存的登录用户角色（路由守卫用；未登录/解析失败返回 null） */
function storedRole(): string | null {
  try {
    const raw = localStorage.getItem(STORAGE_KEYS.user);
    if (!raw) return null;
    const parsed = JSON.parse(raw) as { role?: string };
    return parsed?.role ?? null;
  } catch {
    return null;
  }
}

router.beforeEach(async (to) => {
  const token = localStorage.getItem(STORAGE_KEYS.token);
  if (to.meta.public) {
    if (to.name === 'login' && token) return { name: 'dashboard' };
    return true;
  }
  if (!token) {
    return { name: 'login', query: { redirect: to.fullPath } };
  }
  // 仅管理员可见的页面（班级/学生/教师管理）：直接输网址也要挡回去，
  // 不能依赖"菜单隐藏"——菜单隐藏只是看不见，不是权限。
  const roles = to.meta.roles;
  if (Array.isArray(roles) && roles.length > 0) {
    const role = storedRole();
    if (!role || !(roles as string[]).includes(role)) {
      return { name: 'dashboard' };
    }
  }
  // 按**生效权限**门控的页面（权限组管理）：角色判不出来 —— 教师被权限组授予
  // permission:manage 后同样该放行，所以这里异步取一次生效权限。
  // `ensurePermissions()` 在 store 内是幂等的（本次会话只真拉一次），不会每次跳转都打接口。
  const permission = to.meta.permission;
  if (typeof permission === 'string') {
    const auth = useAuthStore();
    await auth.ensurePermissions();
    if (!auth.can(permission as PermissionKey)) return { name: 'dashboard' };
  }
  return true;
});

router.afterEach((to) => {
  const title = typeof to.meta.title === 'string' ? to.meta.title : '';
  document.title = title ? `${title} · ClassHelper` : 'ClassHelper · 管理端';
});

export default router;