feat(admin): 新增题库、排行榜、实时结果和模板管理功能

- 添加题库管理页面及相关组件 - 实现排行榜管理功能，包括列表和详情页 - 新增实时结果展示页面 - 添加模板制作和管理功能 - 完善路由配置和国际化支持 - 新增阿里云OSS文件上传服务 - 添加多种工具函数和类型定义 - 优化表格和表单组件 - 调整布局和样式细节
2026-01-22 17:55:35 +08:00
parent d950bb4018
commit 697d606611
47 changed files with 3810 additions and 685 deletions
--- a/apps/admin/src/store/modules/route/index.ts
+++ b/apps/admin/src/store/modules/route/index.ts
@ -30,27 +30,26 @@ export const useRouteStore = defineStore(SetupStoreId.Route, () => {
  const { bool: isInitAuthRoute, setBool: setIsInitAuthRoute } = useBoolean()

  /**
-   * Auth route mode
+   * 权限路由模式
   *
-   * It recommends to use static mode in the development environment, and use dynamic mode in the production
-   * environment, if use static mode in development environment, the auth routes will be auto generated by plugin
-   * "@elegant-router/vue"
+   * 建议在开发环境中使用静态模式，在生产环境中使用动态模式
+   * 如果在开发环境中使用静态模式，权限路由将由插件 "@elegant-router/vue" 自动生成
   */
  const authRouteMode = ref(import.meta.env.VITE_AUTH_ROUTE_MODE)

-  /** Home route key */
+  /** 首页路由 key */
  const routeHome = ref(import.meta.env.VITE_ROUTE_HOME)

  /**
-   * Set route home
+   * 设置首页路由
   *
-   * @param routeKey Route key
+   * @param routeKey 路由 key
   */
  function setRouteHome(routeKey: LastLevelRouteKey) {
    routeHome.value = routeKey
  }

-  /** constant routes */
+  /** 常量路由 */
  const constantRoutes = shallowRef<ElegantConstRoute[]>([])

  function addConstantRoutes(routes: ElegantConstRoute[]) {
@ -63,7 +62,7 @@ export const useRouteStore = defineStore(SetupStoreId.Route, () => {
    constantRoutes.value = Array.from(constantRoutesMap.values())
  }

-  /** auth routes */
+  /** 权限路由 */
  const authRoutes = shallowRef<ElegantConstRoute[]>([])

  function addAuthRoutes(routes: ElegantConstRoute[]) {
@ -78,44 +77,51 @@ export const useRouteStore = defineStore(SetupStoreId.Route, () => {

  const removeRouteFns: (() => void)[] = []

-  /** Global menus */
+  /** 全局菜单 */
  const menus = ref<App.Global.Menu[]>([])
+  const menusForBreadcrumb = ref<App.Global.Menu[]>([])
  const searchMenus = computed(() => transformMenuToSearchMenus(menus.value))

-  /** Get global menus */
+  /**
+   * 获取全局菜单
+   *
+   * @param routes 路由
+   */
  function getGlobalMenus(routes: ElegantConstRoute[]) {
-    menus.value = getGlobalMenusByAuthRoutes(routes)
+    menus.value = getGlobalMenusByAuthRoutes(routes, true, false)
+    menusForBreadcrumb.value = getGlobalMenusByAuthRoutes(routes, false, true)
  }

-  /** Update global menus by locale */
+  /** 根据语言更新全局菜单 */
  function updateGlobalMenusByLocale() {
    menus.value = updateLocaleOfGlobalMenus(menus.value)
+    menusForBreadcrumb.value = updateLocaleOfGlobalMenus(menusForBreadcrumb.value)
  }

-  /** Cache routes */
+  /** 缓存路由 */
  const cacheRoutes = ref<RouteKey[]>([])

  /**
-   * Exclude cache routes
+   * 排除缓存路由
   *
-   * for reset route cache
+   * 用于重置路由缓存
   */
  const excludeCacheRoutes = ref<RouteKey[]>([])

  /**
-   * Get cache routes
+   * 获取缓存路由
   *
-   * @param routes Vue routes
+   * @param routes Vue 路由
   */
  function getCacheRoutes(routes: RouteRecordRaw[]) {
    cacheRoutes.value = getCacheRouteNames(routes)
  }

  /**
-   * Reset route cache
+   * 重置路由缓存
   *
   * @default
-   * @param routeKey
+   * @param routeKey 路由 key
   */
  async function resetRouteCache(routeKey?: RouteKey) {
    const routeName = routeKey || (router.currentRoute.value.name as RouteKey)
@ -127,10 +133,10 @@ export const useRouteStore = defineStore(SetupStoreId.Route, () => {
    excludeCacheRoutes.value = []
  }

-  /** Global breadcrumbs */
-  const breadcrumbs = computed(() => getBreadcrumbsByRoute(router.currentRoute.value, menus.value))
+  /** 全局面包屑 */
+  const breadcrumbs = computed(() => getBreadcrumbsByRoute(router.currentRoute.value, menusForBreadcrumb.value))

-  /** Reset store */
+  /** 重置 store */
  async function resetStore() {
    const routeStore = useRouteStore()

@ -138,34 +144,35 @@ export const useRouteStore = defineStore(SetupStoreId.Route, () => {

    resetVueRoutes()

-    // after reset store, need to re-init constant route
+    // 重置 store 后，需要重新初始化常量路由
    await initConstantRoute()
  }

-  /** Reset vue routes */
+  /** 重置 vue 路由 */
  function resetVueRoutes() {
    removeRouteFns.forEach(fn => fn())
    removeRouteFns.length = 0
  }

-  /** init constant route */
+  /** 初始化常量路由 */
  async function initConstantRoute() {
    if (isInitConstantRoute.value)
      return

+    // 静态路由
    const staticRoute = createStaticRoutes()

-    if (authRouteMode.value === 'static') {
+    // 如果是静态路由模式，直接添加静态常量路由
+    if (authRouteMode.value === 'static') { // 静态路由模式
      addConstantRoutes(staticRoute.constantRoutes)
-    }
-    else {
+    }else {// 动态路由模式
      const { data, error } = await fetchGetConstantRoutes()

      if (!error) {
        addConstantRoutes(data)
      }
      else {
-        // if fetch constant routes failed, use static constant routes
+        // 如果获取常量路由失败，使用静态常量路由
        addConstantRoutes(staticRoute.constantRoutes)
      }
    }
@ -177,9 +184,9 @@ export const useRouteStore = defineStore(SetupStoreId.Route, () => {
    tabStore.initHomeTab()
  }

-  /** Init auth route */
+  /** 初始化权限路由 */
  async function initAuthRoute() {
-    // check if user info is initialized
+    // 检查用户信息是否已初始化
    if (!authStore.userInfo.userId) {
      await authStore.initUserInfo()
    }
@ -194,7 +201,7 @@ export const useRouteStore = defineStore(SetupStoreId.Route, () => {
    tabStore.initHomeTab()
  }

-  /** Init static auth route */
+  /** 初始化静态权限路由 */
  function initStaticAuthRoute() {
    const { authRoutes: staticAuthRoutes } = createStaticRoutes()

@ -212,7 +219,7 @@ export const useRouteStore = defineStore(SetupStoreId.Route, () => {
    setIsInitAuthRoute(true)
  }

-  /** Init dynamic auth route */
+  /** 初始化动态权限路由 */
  async function initDynamicAuthRoute() {
    const { data, error } = await fetchGetUserRoutes()

@ -230,12 +237,12 @@ export const useRouteStore = defineStore(SetupStoreId.Route, () => {
      setIsInitAuthRoute(true)
    }
    else {
-      // if fetch user routes failed, reset store
+      // 如果获取用户路由失败，重置 store
      authStore.resetStore()
    }
  }

-  /** handle constant and auth routes */
+  /** 处理常量路由和权限路由 */
  function handleConstantAndAuthRoutes() {
    const allRoutes = [...constantRoutes.value, ...authRoutes.value]

@ -253,9 +260,9 @@ export const useRouteStore = defineStore(SetupStoreId.Route, () => {
  }

  /**
-   * Add routes to vue router
+   * 添加路由到 vue router
   *
-   * @param routes Vue routes
+   * @param routes Vue 路由
   */
  function addRoutesToVueRouter(routes: RouteRecordRaw[]) {
    routes.forEach((route) => {
@ -265,18 +272,18 @@ export const useRouteStore = defineStore(SetupStoreId.Route, () => {
  }

  /**
-   * Add remove route fn
+   * 添加删除路由函数
   *
-   * @param fn
+   * @param fn 删除函数
   */
  function addRemoveRouteFn(fn: () => void) {
    removeRouteFns.push(fn)
  }

  /**
-   * Update root route redirect when auth route mode is dynamic
+   * 当权限路由模式为动态时，更新根路由重定向
   *
-   * @param redirectKey Redirect route key
+   * @param redirectKey 重定向路由 key
   */
  function handleUpdateRootRouteRedirect(redirectKey: LastLevelRouteKey) {
    const redirect = getRoutePath(redirectKey)
@ -293,9 +300,9 @@ export const useRouteStore = defineStore(SetupStoreId.Route, () => {
  }

  /**
-   * Get is auth route exist
+   * 获取权限路由是否存在
   *
-   * @param routePath Route path
+   * @param routePath 路由路径
   */
  async function getIsAuthRouteExist(routePath: RouteMap[RouteKey]) {
    const routeName = getRouteName(routePath)
@ -315,20 +322,20 @@ export const useRouteStore = defineStore(SetupStoreId.Route, () => {
  }

  /**
-   * Get selected menu key path
+   * 获取选中的菜单 key 路径
   *
-   * @param selectedKey Selected menu key
+   * @param selectedKey 选中的菜单 key
   */
  function getSelectedMenuKeyPath(selectedKey: string) {
    return getSelectedMenuKeyPathByKey(selectedKey, menus.value)
  }

  async function onRouteSwitchWhenLoggedIn() {
-    // some global init logic when logged in and switch route
+    // 登录并切换路由时的一些全局初始化逻辑
  }

  async function onRouteSwitchWhenNotLoggedIn() {
-    // some global init logic if it does not need to be logged in
+    // 如果不需要登录时的一些全局初始化逻辑
  }

  return {
--- a/apps/admin/src/store/modules/route/shared.ts
+++ b/apps/admin/src/store/modules/route/shared.ts
@ -4,28 +4,28 @@ import { useSvgIcon } from '@/hooks/common/icon'
 import { $t } from '@/locales'

 /**
- * Filter auth routes by roles
+ * 根据角色过滤权限路由
 *
- * @param routes Auth routes
- * @param roles Roles
+ * @param routes 权限路由
+ * @param roles 角色
 */
 export function filterAuthRoutesByRoles(routes: ElegantConstRoute[], roles: string[]) {
  return routes.flatMap(route => filterAuthRouteByRoles(route, roles))
 }

 /**
- * Filter auth route by roles
+ * 根据角色过滤权限路由
 *
- * @param route Auth route
- * @param roles Roles
+ * @param route 权限路由
+ * @param roles 角色
 */
 function filterAuthRouteByRoles(route: ElegantConstRoute, roles: string[]): ElegantConstRoute[] {
  const routeRoles = (route.meta && route.meta.roles) || []

-  // if the route's "roles" is empty, then it is allowed to access
+  // 如果路由的 "roles" 为空，则允许访问
  const isEmptyRoles = !routeRoles.length

-  // if the user's role is included in the route's "roles", then it is allowed to access
+  // 如果用户的角色包含在路由的 "roles" 中，则允许访问
  const hasPermission = routeRoles.some(role => roles.includes(role))

  const filterRoute = { ...route }
@ -34,7 +34,7 @@ function filterAuthRouteByRoles(route: ElegantConstRoute, roles: string[]): Eleg
    filterRoute.children = filterRoute.children.flatMap(item => filterAuthRouteByRoles(item, roles))
  }

-  // Exclude the route if it has no children after filtering
+  // 如果过滤后没有子路由，则排除该路由
  if (filterRoute.children?.length === 0) {
    return []
  }
@ -43,9 +43,9 @@ function filterAuthRouteByRoles(route: ElegantConstRoute, roles: string[]): Eleg
 }

 /**
- * sort route by order
+ * 根据 order 对路由进行排序
 *
- * @param route route
+ * @param route 路由
 */
 function sortRouteByOrder(route: ElegantConstRoute) {
  if (route.children?.length) {
@ -57,9 +57,9 @@ function sortRouteByOrder(route: ElegantConstRoute) {
 }

 /**
- * sort routes by order
+ * 根据 order 对路由进行排序
 *
- * @param routes routes
+ * @param routes 路由
 */
 export function sortRoutesByOrder(routes: ElegantConstRoute[]) {
  routes.sort((next, prev) => (Number(next.meta?.order) || 0) - (Number(prev.meta?.order) || 0))
@ -69,19 +69,30 @@ export function sortRoutesByOrder(routes: ElegantConstRoute[]) {
 }

 /**
- * Get global menus by auth routes
- *
- * @param routes Auth routes
+ * 根据权限路由获取全局菜单
+ * 当嵌套路由里面，有且仅有一个子路由时，将其提升到一级菜单，点击一级菜单时，跳转到子路由
+ * @param routes 权限路由
+ * @param shouldHoist 是否提升
+ * @param includeHidden 是否包含隐藏路由
 */
-export function getGlobalMenusByAuthRoutes(routes: ElegantConstRoute[]) {
+export function getGlobalMenusByAuthRoutes(routes: ElegantConstRoute[], shouldHoist = false, includeHidden = false) {
  const menus: App.Global.Menu[] = []

  routes.forEach((route) => {
-    if (!route.meta?.hideInMenu) {
+    if (includeHidden || !route.meta?.hideInMenu) {
      const menu = getGlobalMenuByBaseRoute(route)

-      if (route.children?.some(child => !child.meta?.hideInMenu)) {
-        menu.children = getGlobalMenusByAuthRoutes(route.children)
+      if (route.children?.some(child => includeHidden || !child.meta?.hideInMenu)) {
+        menu.children = getGlobalMenusByAuthRoutes(route.children, shouldHoist, includeHidden)
+      }
+
+      // 如果只有一个子菜单，将其提升
+      if (shouldHoist && menu.children?.length === 1) {
+        const singleChild = menu.children[0]
+        menu.key = singleChild.key
+        menu.routeKey = singleChild.routeKey
+        menu.routePath = singleChild.routePath
+        menu.children = singleChild.children
      }

      menus.push(menu)
@ -92,7 +103,7 @@ export function getGlobalMenusByAuthRoutes(routes: ElegantConstRoute[]) {
 }

 /**
- * Update locale of global menus
+ * 更新全局菜单的国际化
 *
 * @param menus
 */
@ -120,7 +131,7 @@ export function updateLocaleOfGlobalMenus(menus: App.Global.Menu[]) {
 }

 /**
- * Get global menu by route
+ * 根据路由获取全局菜单
 *
 * @param route
 */
@ -145,15 +156,15 @@ function getGlobalMenuByBaseRoute(route: RouteLocationNormalizedLoaded | Elegant
 }

 /**
- * Get cache route names
+ * 获取缓存路由名称
 *
- * @param routes Vue routes (two levels)
+ * @param routes Vue 路由 (两级)
 */
 export function getCacheRouteNames(routes: RouteRecordRaw[]) {
  const cacheNames: LastLevelRouteKey[] = []

  routes.forEach((route) => {
-    // only get last two level route, which has component
+    // 只获取最后两级有组件的路由
    route.children?.forEach((child) => {
      if (child.component && child.meta?.keepAlive) {
        cacheNames.push(child.name as LastLevelRouteKey)
@ -165,7 +176,7 @@ export function getCacheRouteNames(routes: RouteRecordRaw[]) {
 }

 /**
- * Is route exist by route name
+ * 根据路由名称判断路由是否存在
 *
 * @param routeName
 * @param routes
@ -175,7 +186,7 @@ export function isRouteExistByRouteName(routeName: RouteKey, routes: ElegantCons
 }

 /**
- * Recursive get is route exist by route name
+ * 递归判断路由名称是否存在
 *
 * @param route
 * @param routeName
@ -195,7 +206,7 @@ function recursiveGetIsRouteExistByRouteName(route: ElegantConstRoute, routeName
 }

 /**
- * Get selected menu key path
+ * 获取选中的菜单 key 路径
 *
 * @param selectedKey
 * @param menus
@ -219,10 +230,10 @@ export function getSelectedMenuKeyPathByKey(selectedKey: string, menus: App.Glob
 }

 /**
- * Find menu path
+ * 查找菜单路径
 *
- * @param targetKey Target menu key
- * @param menu Menu
+ * @param targetKey 目标菜单 key
+ * @param menu 菜单
 */
 function findMenuPath(targetKey: string, menu: App.Global.Menu): string[] | null {
  const path: string[] = []
@ -255,7 +266,7 @@ function findMenuPath(targetKey: string, menu: App.Global.Menu): string[] | null
 }

 /**
- * Transform menu to breadcrumb
+ * 将菜单转换为面包屑
 *
 * @param menu
 */
@ -274,7 +285,7 @@ function transformMenuToBreadcrumb(menu: App.Global.Menu) {
 }

 /**
- * Get breadcrumbs by route
+ * 根据路由获取面包屑
 *
 * @param route
 * @param menus
@ -316,9 +327,9 @@ export function getBreadcrumbsByRoute(
 }

 /**
- * Transform menu to searchMenus
+ * 将菜单转换为搜索菜单
 *
- * @param menus - menus
+ * @param menus - 菜单
 * @param treeMap
 */
 export function transformMenuToSearchMenus(menus: App.Global.Menu[], treeMap: App.Global.Menu[] = []) {