build: 测试路由功能

src/router/modules/role.management.ts

@@ -0,0 +1,30 @@
+import type { RouteRecordRaw } from 'vue-router'
+
+function Layout() {
+  return import('@/layouts/index.vue')
+}
+
+const routes: RouteRecordRaw = {
+  path: '/role_management',
+  component: Layout,
+  name: 'roleManagement',
+  meta: {
+    title: 'Role Management',
+    icon: 'i-file-icons:jsx',
+  },
+  children: [
+    {
+      path: '',
+      name: 'roleManagementIndex',
+      component: () => import('@/views/role-management/index.vue'),
+      meta: {
+        title: 'Role Management',
+        menu: false,
+        breadcrumb: false,
+        activeMenu: '/role_management',
+      },
+    },
+  ],
+}
+
+export default routes

src/router/routes.ts

@@ -15,6 +15,7 @@ import MultilevelMenuExample from './modules/multilevel.menu.example'
 import PermissionExample from './modules/permission.example'
 import PluginExample from './modules/plugin.example'
 import TabExample from './modules/tab.example'
+import RoleManagement from './modules/role.management'
 
 // 固定路由（默认路由）
 const constantRoutes: RouteRecordRaw[] = [
@@ -70,6 +71,15 @@ const systemRoutes: RouteRecordRaw[] = [
 
 // 动态路由（异步路由、导航栏路由）
 const asyncRoutes: Route.recordMainRaw[] = [
+  {
+    meta: {
+      title: 'Role Management',
+      icon: 'i-uim:box',
+    },
+    children: [
+      RoleManagement,
+    ],
+  },
   {
     meta: {
       title: '演示',

src/views/role-management/index.vue

@@ -0,0 +1,28 @@
+<route lang="yaml">
+meta:
+  title: Role Management
+</route>
+
+<script setup lang="ts">
+
+defineOptions({
+  name: 'Role Management',
+})
+
+const router = useRouter()
+
+const settingsStore = useSettingsStore()
+const userStore = useUserStore()
+
+</script>
+
+<template>
+  <div>
+    <FaPageHeader title="Role Management" />
+    <FaPageMain>
+      <ElTable>
+        <ElTableColumn label="Role Name" prop="name" />
+      </ElTable>
+    </FaPageMain>
+  </div>
+</template>