From 30cd6b483dd69d9196ee493f29573f8a54ccbbca Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=90=91=E6=96=87=E5=8F=AF?= <1041367524@qq.com>
Date: Thu, 17 Mar 2022 17:36:40 +0800
Subject: [PATCH] =?UTF-8?q?feat:=E5=AF=BC=E8=88=AA=E6=A8=A1=E5=9D=97?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/layouts/components/aside.vue              |  17 +-
 src/layouts/components/menu-item.vue          |   2 +-
 src/layouts/components/menu.vue               |   9 +-
 src/layouts/components/profile.vue            |   4 +-
 src/router/index.js                           | 754 ++----------------
 src/router/modules/demo.js                    |   1 -
 src/router/modules/education.js               | 286 +++++++
 src/router/modules/system.js                  |  49 ++
 src/router/modules/user.js                    |  49 ++
 src/store/modules/auth.js                     |  47 +-
 src/store/modules/layout.js                   |  24 +
 src/views/global/404.vue                      |  75 ++
 src/views/{global/home.vue => home/index.vue} |   3 +
 13 files changed, 616 insertions(+), 704 deletions(-)
 delete mode 100644 src/router/modules/demo.js
 create mode 100644 src/router/modules/education.js
 create mode 100644 src/router/modules/system.js
 create mode 100644 src/router/modules/user.js
 create mode 100644 src/store/modules/layout.js
 create mode 100644 src/views/global/404.vue
 rename src/views/{global/home.vue => home/index.vue} (90%)

diff --git a/src/layouts/components/aside.vue b/src/layouts/components/aside.vue
index 9e114ac..7396eda 100644
--- a/src/layouts/components/aside.vue
+++ b/src/layouts/components/aside.vue
@@ -1,7 +1,12 @@
 <template>
     <el-scrollbar class="layout-aside">
-        <el-menu collapse>
-            <el-menu-item v-for="(item, index) in handleRoutes" :key="index" :index="item.name">
+        <el-menu collapse :default-active="activeAside" router>
+            <el-menu-item
+                v-for="(item, index) in asideList"
+                :key="index"
+                :index="item.name"
+                :route="{ name: item.name }"
+            >
                 <XIcon :name="item.meta.icon" size="30" />
                 <p>{{ item.meta.title }}</p>
             </el-menu-item>
@@ -10,11 +15,11 @@
 </template>
 
 <script setup>
-    import routes from '@/router/route.json';
     const router = useRouter();
-    router.getRoutes();
-    const handleRoutes = computed(() => routes);
-    const handleClick = () => {};
+    const store = useStore();
+
+    const asideList = computed(() => store.getters['layout/asideList']);
+    const activeAside = computed(() => store.state.layout.activeAside);
 </script>
 
 <style lang="less" scoped>
diff --git a/src/layouts/components/menu-item.vue b/src/layouts/components/menu-item.vue
index e97e155..7475311 100644
--- a/src/layouts/components/menu-item.vue
+++ b/src/layouts/components/menu-item.vue
@@ -1,5 +1,5 @@
 <template>
-    <el-menu-item v-if="!menuItem.children?.length" :index="props.menuItem.name">
+    <el-menu-item v-if="!menuItem.children?.length" :index="props.menuItem.name" :route="{ name: props.menuItem.name }">
         <XIcon :name="props.menuItem.meta.icon" size="20" />
         <p>{{ props.menuItem.meta.title }}</p>
     </el-menu-item>
diff --git a/src/layouts/components/menu.vue b/src/layouts/components/menu.vue
index 1c36ef5..3937464 100644
--- a/src/layouts/components/menu.vue
+++ b/src/layouts/components/menu.vue
@@ -2,16 +2,17 @@
     <el-scrollbar class="layout-menu">
         <div class="title">马士兵严选后台管理平台</div>
         <el-divider>test</el-divider>
-        <el-menu>
-            <MenuItem v-for="(item, index) in handleRoutes" :key="index" :menu-item="item" />
+        <el-menu router :default-active="activeMenu">
+            <MenuItem v-for="(item, index) in menuList" :key="index" :menu-item="item" />
         </el-menu>
     </el-scrollbar>
 </template>
 
 <script setup>
-    import routes from '@/router/route.json';
     import MenuItem from './menu-item.vue';
-    const handleRoutes = computed(() => routes[2].children);
+    const store = useStore();
+    const menuList = computed(() => store.getters['layout/menuList']);
+    const activeMenu = computed(() => store.state.layout.activeMenu);
     const handleClick = () => {};
 </script>
 
diff --git a/src/layouts/components/profile.vue b/src/layouts/components/profile.vue
index 8eaf6d2..54bf890 100644
--- a/src/layouts/components/profile.vue
+++ b/src/layouts/components/profile.vue
@@ -1,9 +1,9 @@
 <template>
     <div class="layout-profile">
-        <el-avatar :src="userInfo.avatar" />
+        <el-avatar :src="userInfo?.avatar" />
         <el-dropdown size="middle" @command="handleCommand">
             <span class="el-dropdown-link">
-                <span>{{ userInfo.username }}</span>
+                <span>{{ userInfo?.username }}</span>
                 <XIcon class="el-icon--right" name="ArrowDown" />
             </span>
             <template #dropdown>
diff --git a/src/router/index.js b/src/router/index.js
index 71daad5..03c9c38 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -1,710 +1,65 @@
 import { createRouter, createWebHistory } from 'vue-router';
 
-// 静态路由
-const routes = [
+// 全局路由
+export const globalRoutes = [
     {
         path: '/login',
         name: 'Login',
         component: () => import('@/views/global/login.vue'),
         meta: {
-            layout: false,
             global: true,
         },
     },
+    {
+        path: '/404',
+        name: '404',
+        component: () => import('@/views/global/404.vue'),
+        meta: {
+            global: true,
+        },
+    },
+];
+
+// 动态模块
+const dynamicRoutes = [];
+const modules = import.meta.globEager('./modules/*.js');
+Object.values(modules).forEach((mod) => {
+    dynamicRoutes.push(...mod.default);
+});
+
+export const routes = [
+    ...globalRoutes,
     {
         path: '/',
         name: 'App',
         redirect: { name: 'Home' },
         component: () => import('@/layouts/default.vue'),
+        meta: {
+            layout: true,
+        },
         children: [
             {
                 path: '/home',
                 name: 'Home',
-                component: () => import('@/views/global/home.vue'),
+                component: () => import('@/views/home/index.vue'),
                 meta: {
                     title: '首页',
                     icon: 'home-line',
                 },
             },
-            {
-                path: '/user',
-                name: 'UserManagement',
-                component: () => import('@/views/global/home.vue'),
-                meta: {
-                    title: '用户管理',
-                    icon: 'folder-user-fill',
-                },
-                children: [
-                    {
-                        path: 'consult',
-                        name: 'ConsultManagement',
-                        meta: {
-                            title: '咨询管理',
-                            icon: 'kakao-talk-fill',
-                        },
-                    },
-                    {
-                        path: 'course',
-                        name: 'CourseConsultManagement',
-                        meta: {
-                            title: '咨询课程',
-                            icon: 'chat-smile-2-fill',
-                        },
-                    },
-                    {
-                        path: 'account',
-                        name: 'AccountManagement',
-                        meta: {
-                            title: '账号课程',
-                            icon: 'account-box-fill',
-                        },
-                    },
-                    {
-                        path: 'feedback',
-                        name: 'FeedbackManagement',
-                        meta: {
-                            title: '意见反馈',
-                            icon: 'feedback-fill',
-                        },
-                    },
-                ],
-            },
-            {
-                path: '/system',
-                name: 'SystemManagement',
-                component: () => import('@/views/global/home.vue'),
-                meta: {
-                    title: '系统管理',
-                    icon: 'settings-3-fill',
-                },
-                children: [
-                    {
-                        path: 'log',
-                        name: 'LogManagement',
-                        meta: {
-                            title: '日志管理',
-                            icon: 'file-chart-fill',
-                        },
-                    },
-                    {
-                        path: 'app',
-                        name: 'AppManagement',
-                        meta: {
-                            title: 'APP包管理',
-                            icon: 'app-store-fill',
-                        },
-                    },
-                    {
-                        path: 'notify',
-                        name: 'NotifyManagement',
-                        meta: {
-                            title: '通知管理',
-                            icon: 'alarm-warning-fill',
-                        },
-                    },
-                    {
-                        path: 'file',
-                        name: 'FileManagement',
-                        meta: {
-                            title: '文件中台',
-                            icon: 'file-copy-fill',
-                        },
-                    },
-                ],
-            },
-            {
-                path: '/personal',
-                name: 'Personal',
-                component: () => import('@/views/global/home.vue'),
-                meta: {
-                    title: '个人面板',
-                    icon: 'user-2-fill',
-                },
-                children: [
-                    {
-                        path: 'answer/:tab?',
-                        name: 'MineAnswer',
-                        meta: {
-                            title: '我的答疑',
-                            icon: 'question-answer-fill',
-                        },
-                    },
-                    {
-                        path: 'file',
-                        name: 'MineFile',
-                        meta: {
-                            title: '我的文件',
-                            icon: 'file-3-line',
-                        },
-                    },
-                    {
-                        path: 'data',
-                        name: 'MineData',
-                        meta: {
-                            title: '数据面板',
-                            icon: 'file-chart-line',
-                        },
-                    },
-                ],
-            },
-            {
-                path: '/operation',
-                name: 'Operation',
-                component: () => import('@/views/global/home.vue'),
-                meta: {
-                    title: '运营管理',
-                    icon: 'briefcase-4-fill',
-                },
-                children: [
-                    {
-                        path: 'banner',
-                        name: 'BannerManagement',
-                        meta: {
-                            title: '轮播图',
-                            icon: 'image-fill',
-                        },
-                    },
-                    {
-                        path: 'activity',
-                        name: 'ActivityManagement',
-                        component: () => import('@/views/global/home.vue'),
-                        meta: {
-                            title: '活动管理',
-                            icon: 'gift-2-fill',
-                        },
-                        children: [
-                            {
-                                path: 'course',
-                                name: 'CourseActivity',
-                                meta: {
-                                    title: '课程活动',
-                                    icon: 'git-repository-line',
-                                },
-                            },
-                            {
-                                path: 'poster',
-                                name: 'PosterShare',
-                                meta: {
-                                    title: '海报分享',
-                                    icon: 'dashboard-fill',
-                                },
-                            },
-                            {
-                                path: 'punch',
-                                name: 'PunchActivity',
-                                meta: {
-                                    title: '打卡活动',
-                                    icon: 'fingerprint-line',
-                                },
-                            },
-                        ],
-                    },
-                    {
-                        path: 'distribution',
-                        name: 'DistributionManagement',
-                        meta: {
-                            title: '分销管理',
-                            icon: 'mind-map',
-                        },
-                    },
-                    {
-                        path: 'integral',
-                        name: 'IntegralManagement',
-                        meta: {
-                            title: '积分管理',
-                            icon: 'bubble-chart-fill',
-                        },
-                    },
-                    {
-                        path: 'news',
-                        name: 'GoodNewsManagement',
-                        meta: {
-                            title: '喜报管理',
-                            icon: 'newspaper-fill',
-                        },
-                    },
-                    {
-                        path: 'lottery',
-                        name: 'LotteryActivity',
-                        meta: {
-                            title: '抽奖活动',
-                            icon: 'star-smile-fill',
-                        },
-                    },
-                    {
-                        path: 'promotion',
-                        name: 'promotionActivity',
-                        meta: {
-                            title: '弹窗活动配置',
-                            icon: 'e-bike-2-fill',
-                        },
-                    },
-                    {
-                        path: 'promotion/:id',
-                        name: 'promotionActivityDetail',
-                        meta: {
-                            title: '弹窗活动详情',
-                            icon: 'e-bike-2-fill',
-                            hidden: true,
-                        },
-                    },
-                    {
-                        path: 'landing',
-                        name: 'landingActivity',
-                        meta: {
-                            title: '落地页列表',
-                            icon: 'arrow-left-right-fill',
-                        },
-                    },
-                    {
-                        path: 'landing/:id',
-                        name: 'landingActivityDetail',
-                        meta: {
-                            title: '落地页详情',
-                            icon: 'arrow-left-right-fill',
-                            hidden: true,
-                        },
-                    },
-                    {
-                        path: 'supernatant',
-                        name: 'supernatantActivity',
-                        meta: {
-                            title: '浮窗配置',
-                            icon: 'bring-forward',
-                        },
-                    },
-                    {
-                        path: 'supernatant/:id',
-                        name: 'supernatantActivityDetail',
-                        meta: {
-                            title: '浮窗详情',
-                            icon: 'bring-forward',
-                            hidden: true,
-                        },
-                    },
-                    {
-                        path: 'marketing',
-                        name: 'MarketingActivities',
-                        meta: {
-                            title: '咨询组管理',
-                            icon: 'bar-chart-fill',
-                        },
-                    },
-                    {
-                        path: 'marketing/edit/:id?',
-                        name: 'ActivityEdit',
-                        meta: {
-                            hidden: true,
-                            title: '营销活动-编辑',
-                            icon: 'bar-chart-fill',
-                        },
-                    },
-                    {
-                        path: 'marketing/visitor/:id?',
-                        name: 'MarketingLogs',
-                        meta: {
-                            hidden: true,
-                            title: '营销活动-数据',
-                            icon: 'bar-chart-fill',
-                        },
-                    },
-                ],
-            },
-            {
-                path: '/finance',
-                name: 'Finance',
-                component: () => import('@/views/global/home.vue'),
-                meta: {
-                    title: '财务管理',
-                    icon: 'money-cny-circle-fill',
-                },
-                children: [
-                    {
-                        path: 'order',
-                        name: 'OrderManagement',
-                        meta: {
-                            title: '订单管理',
-                            icon: 'auction-fill',
-                        },
-                    },
-                    {
-                        path: 'refund',
-                        name: 'RefundManagement',
-                        meta: {
-                            title: '退款管理',
-                            icon: 'refund-2-fill',
-                        },
-                    },
-                    {
-                        path: 'reconciliation',
-                        name: 'FinanceReconciliation',
-                        meta: {
-                            title: '财务对账',
-                            icon: 'money-dollar-box-fill',
-                        },
-                    },
-                ],
-            },
-            {
-                path: '/education',
-                name: 'Education',
-                component: () => import('@/views/global/home.vue'),
-                meta: {
-                    title: '教务教学',
-                    icon: 'book-open-fill',
-                },
-                children: [
-                    {
-                        path: 'teacher',
-                        name: 'TeacherManagement',
-                        meta: {
-                            title: '老师管理',
-                            icon: 'user-shared-fill',
-                        },
-                    },
-                    {
-                        path: 'student',
-                        name: 'StudentManagement',
-                        meta: {
-                            title: '学生管理',
-                            icon: 'user-received-fill',
-                        },
-                        children: [
-                            {
-                                path: 'list',
-                                name: 'StudentManagementList',
-                                meta: {
-                                    title: '学生列表',
-                                    icon: 'user-received-line',
-                                },
-                            },
-                            {
-                                path: 'grade',
-                                name: 'GradeManagement',
-                                meta: {
-                                    title: '年级管理',
-                                    icon: 'account-pin-box-fill',
-                                },
-                            },
-                            {
-                                path: 'class',
-                                name: 'ClassManagement',
-                                meta: {
-                                    title: '班级管理',
-                                    icon: 'account-pin-circle-fill',
-                                },
-                            },
-                        ],
-                    },
-                    {
-                        path: 'admission',
-                        name: 'AdmissionManagement',
-                        component: () => import('@/views/global/home.vue'),
-                        meta: {
-                            title: '入学',
-                            icon: 'award-fill',
-                        },
-                        children: [
-                            {
-                                path: 'evaluation',
-                                name: 'AdmissionEvaluation',
-                                meta: {
-                                    title: '入学评测',
-                                    icon: 'file-paper-2-fill',
-                                },
-                            },
-                            {
-                                path: 'way',
-                                name: 'StudyWay',
-                                meta: {
-                                    title: '学习路线',
-                                    icon: 'send-plane-fill',
-                                },
-                            },
-                        ],
-                    },
-                    {
-                        path: 'answer',
-                        name: 'Answer',
-                        component: () => import('@/views/global/home.vue'),
-                        meta: {
-                            title: '答疑',
-                            icon: 'question-answer-fill',
-                        },
-                        children: [
-                            {
-                                path: 'management',
-                                name: 'AnswerManagement',
-                                component: () => import('@/views/global/home.vue'),
-                                meta: {
-                                    title: '答疑管理',
-                                    icon: 'question-answer-fill',
-                                },
-                                children: [
-                                    {
-                                        path: 'list',
-                                        name: 'AnswerManagementList',
-                                        meta: {
-                                            title: '答疑管理列表',
-                                            icon: 'question-answer-line',
-                                        },
-                                    },
-                                    {
-                                        path: 'invalid',
-                                        name: 'InvalidQuestionManagement',
-                                        meta: {
-                                            title: '无效追问管理',
-                                            icon: 'questionnaire-fill',
-                                        },
-                                    },
-                                    {
-                                        path: 'lock',
-                                        name: 'UserLockManagement',
-                                        meta: {
-                                            title: '用户锁定管理',
-                                            icon: 'lock-fill',
-                                        },
-                                    },
-                                ],
-                            },
-                            {
-                                path: 'assign/:questionId',
-                                name: 'AssignAnswerTeacher',
-                                meta: {
-                                    title: '指派老师',
-                                    icon: 'account-box-fill',
-                                    hidden: true,
-                                    activeMenu: '/education/answer/management',
-                                },
-                            },
-                            {
-                                path: 'teacher',
-                                name: 'AnswerTeacher',
-                                component: () => import('@/views/global/home.vue'),
-                                meta: {
-                                    title: '答疑老师管理',
-                                    icon: 'book-line',
-                                },
-                                children: [
-                                    {
-                                        path: 'summary',
-                                        name: 'AnswerTeacherSummary',
-                                        meta: {
-                                            title: '答疑老师统计',
-                                            icon: 'book-2-line',
-                                        },
-                                    },
-                                    {
-                                        path: 'management',
-                                        name: 'AnswerTeacherManagement',
-                                        meta: {
-                                            title: '答疑老师管理',
-                                            icon: 'book-3-line',
-                                        },
-                                    },
-                                    {
-                                        path: 'bind/:teacher?',
-                                        name: 'AnswerTeacherUpdateBind',
-                                        meta: {
-                                            title: '编辑课程绑定',
-                                            icon: 'book-fill',
-                                            hidden: true,
-                                            activeMenu: '/education/answer/teacher/management',
-                                        },
-                                    },
-                                    {
-                                        path: 'course',
-                                        name: 'AnswerTeacherBindCourse',
-                                        meta: {
-                                            title: '绑定课程管理',
-                                            icon: 'book-fill',
-                                        },
-                                    },
-                                ],
-                            },
-                        ],
-                    },
-                    {
-                        path: 'question',
-                        name: 'QuestionManagement',
-                        meta: {
-                            title: '题库管理',
-                            icon: 'brush-fill',
-                        },
-                    },
-                    {
-                        path: 'note',
-                        name: 'NoteManagement',
-                        meta: {
-                            title: '笔记管理',
-                            icon: 'sticky-note-2-fill',
-                        },
-                    },
-                    {
-                        path: 'research',
-                        name: 'CourseResearch',
-                        component: () => import('@/views/global/home.vue'),
-                        meta: {
-                            title: '课研更新',
-                            icon: 'contacts-book-upload-fill',
-                        },
-                        children: [
-                            {
-                                path: 'plan',
-                                name: 'CourseResearchPlan',
-                                meta: {
-                                    title: '课研计划',
-                                    icon: 'contacts-book-upload-line',
-                                },
-                            },
-                            {
-                                path: 'log',
-                                name: 'CourseResearchLog',
-                                meta: {
-                                    title: '课研更新日志',
-                                    icon: 'file-copy-2-line',
-                                },
-                            },
-                        ],
-                    },
-                    {
-                        path: 'live',
-                        name: 'LiveManagement',
-                        meta: {
-                            title: '直播管理',
-                            icon: 'live-fill',
-                        },
-                    },
-                    {
-                        path: 'material',
-                        name: 'MaterialManagement',
-                        meta: {
-                            title: '老师资料管理',
-                            icon: 'database-2-fill',
-                        },
-                    },
-                    {
-                        path: 'shift',
-                        name: 'ShiftTable',
-                        meta: {
-                            title: '排班表',
-                            icon: 'calendar-check-line',
-                        },
-                    },
-                    {
-                        path: 'course',
-                        name: 'CourseTable',
-                        meta: {
-                            title: '课程表管理',
-                            icon: 'calendar-todo-fill',
-                        },
-                    },
-                ],
-            },
-            {
-                path: '/course',
-                name: 'Course',
-                component: () => import('@/views/global/home.vue'),
-                meta: {
-                    title: '课程管理',
-                    icon: 'checkbox-multiple-fill',
-                },
-                children: [
-                    {
-                        path: 'management',
-                        name: 'CourseManagement',
-                        meta: {
-                            title: '课程列表',
-                            icon: 'book-2-fill',
-                        },
-                    },
-                    {
-                        path: 'category',
-                        name: 'CourseCategory',
-                        meta: {
-                            title: '课程分类',
-                            icon: 'book-read-fill',
-                        },
-                    },
-                    {
-                        path: 'system',
-                        name: 'SystemCourseManagement',
-                        meta: {
-                            title: '体系课',
-                            icon: 'book-3-fill',
-                        },
-                    },
-                    {
-                        path: 'authorize',
-                        name: 'CourseAuthorize',
-                        meta: {
-                            title: '课程授权',
-                            icon: 'book-fill',
-                        },
-                    },
-                    {
-                        path: 'package',
-                        name: 'CoursePackage',
-                        meta: {
-                            title: '课程包',
-                            icon: 'archive-drawer-fill',
-                        },
-                    },
-                    {
-                        path: 'live',
-                        name: 'LiveCourse',
-                        meta: {
-                            title: '直播课',
-                            icon: 'live-fill',
-                        },
-                    },
-                ],
-            },
-            {
-                path: '/audit',
-                name: 'Audit',
-                component: () => import('@/views/global/home.vue'),
-                meta: {
-                    title: '审核管理',
-                    icon: 'checkbox-multiple-fill',
-                },
-                children: [
-                    {
-                        path: 'course',
-                        name: 'CourseAudit',
-                        meta: {
-                            title: '课程审核',
-                            icon: 'book-fill',
-                        },
-                    },
-                    {
-                        path: 'answer',
-                        name: 'AnswerCourseAudit',
-                        meta: {
-                            title: '答疑课程审核',
-                            icon: 'book-2-fill',
-                        },
-                    },
-                    {
-                        path: 'admission',
-                        name: 'AdmissionAudit',
-                        meta: {
-                            title: '入学审核',
-                            icon: 'book-3-fill',
-                        },
-                    },
-                ],
-            },
         ],
     },
+    ...dynamicRoutes,
+    {
+        path: '/:pathMatch(.*)*',
+        redirect: '/404',
+        name: 'NotFound',
+        meta: {
+            global: true,
+        },
+    },
 ];
 
-// 动态模块
-const modules = import.meta.globEager('./modules/*.js');
-Object.values(modules).forEach((mod) => {
-    routes.push(...mod.default);
-});
-
 const router = createRouter({
     history: createWebHistory(),
     routes,
@@ -718,17 +73,40 @@ router.beforeEach(async (to, from, next) => {
     if (!from.matched.length) {
         store.loadCache();
     }
-    if (to.meta.global) {
-        next();
-    } else {
-        if (!store.state.auth.userInfo) {
-            await store.dispatch('auth/getUserInfo');
-        }
-        if (!store.state.auth.permission.length) {
-            await store.dispatch('auth/getPermission');
+    // if (!store.state.auth.userInfo) {
+    //     await store.dispatch('auth/getUserInfo');
+    // }
+    // if (!store.state.auth.permission.length) {
+    //     await store.dispatch('auth/getPermission');
+    // }
+    if (to.matched.length) {
+        store.commit('layout/setActiveAside', to.matched[0].name);
+        store.commit('layout/setActiveMenu', to.name);
+        console.info(`[router] from ${from.name} to ${to.name}`);
+        if (to.meta.global) {
+            next();
+        } else {
+            const deep = (route) => {
+                let child = (route.children || []).find((item) => !item.meta?.hidden);
+                return child?.children?.length ? deep(child?.children) : child?.name;
+            };
+            let childName = deep([...to.matched].pop());
+            if (childName) {
+                next({ name: childName });
+            } else {
+                next();
+            }
         }
-        next();
     }
 });
 
 export default router;
+
+export const reset = (routers) => {
+    const flat = (arr) => arr.flatMap((item) => [item, item.children || []]);
+    router.getRoutes().forEach((item) => {
+        router.removeRoute(item.name);
+    });
+    flat(routers).forEach(router.addRoute);
+    console.info('[router] reset', router.getRoutes());
+};
diff --git a/src/router/modules/demo.js b/src/router/modules/demo.js
deleted file mode 100644
index d6d1738..0000000
--- a/src/router/modules/demo.js
+++ /dev/null
@@ -1 +0,0 @@
-export default [];
diff --git a/src/router/modules/education.js b/src/router/modules/education.js
new file mode 100644
index 0000000..4584216
--- /dev/null
+++ b/src/router/modules/education.js
@@ -0,0 +1,286 @@
+export default [
+    {
+        path: '/education',
+        name: 'Education',
+        component: () => import('@/layouts/default.vue'),
+        meta: {
+            title: '教务教学',
+            icon: 'book-open-fill',
+        },
+        children: [
+            {
+                path: 'teacher',
+                name: 'TeacherManagement',
+                component: () => import('@/views/home/index.vue'),
+                meta: {
+                    title: '老师管理',
+                    icon: 'user-shared-fill',
+                },
+            },
+            {
+                path: 'student',
+                name: 'StudentManagement',
+                component: () => import('@/views/home/index.vue'),
+                meta: {
+                    title: '学生管理',
+                    icon: 'user-received-fill',
+                },
+                children: [
+                    {
+                        path: 'list',
+                        name: 'StudentManagementList',
+                        component: () => import('@/views/home/index.vue'),
+                        meta: {
+                            title: '学生列表',
+                            icon: 'user-received-line',
+                        },
+                    },
+                    {
+                        path: 'grade',
+                        name: 'GradeManagement',
+                        component: () => import('@/views/home/index.vue'),
+                        meta: {
+                            title: '年级管理',
+                            icon: 'account-pin-box-fill',
+                        },
+                    },
+                    {
+                        path: 'class',
+                        name: 'ClassManagement',
+                        component: () => import('@/views/home/index.vue'),
+                        meta: {
+                            title: '班级管理',
+                            icon: 'account-pin-circle-fill',
+                        },
+                    },
+                ],
+            },
+            {
+                path: 'admission',
+                name: 'AdmissionManagement',
+                component: () => import('@/views/global/home.vue'),
+                component: () => import('@/views/home/index.vue'),
+                meta: {
+                    title: '入学',
+                    icon: 'award-fill',
+                },
+                children: [
+                    {
+                        path: 'evaluation',
+                        name: 'AdmissionEvaluation',
+                        component: () => import('@/views/home/index.vue'),
+                        meta: {
+                            title: '入学评测',
+                            icon: 'file-paper-2-fill',
+                        },
+                    },
+                    {
+                        path: 'way',
+                        name: 'StudyWay',
+                        component: () => import('@/views/home/index.vue'),
+                        meta: {
+                            title: '学习路线',
+                            icon: 'send-plane-fill',
+                        },
+                    },
+                ],
+            },
+            {
+                path: 'answer',
+                name: 'Answer',
+                component: () => import('@/views/global/home.vue'),
+                component: () => import('@/views/home/index.vue'),
+                meta: {
+                    title: '答疑',
+                    icon: 'question-answer-fill',
+                },
+                children: [
+                    {
+                        path: 'management',
+                        name: 'AnswerManagement',
+                        component: () => import('@/views/global/home.vue'),
+                        component: () => import('@/views/home/index.vue'),
+                        meta: {
+                            title: '答疑管理',
+                            icon: 'question-answer-fill',
+                        },
+                        children: [
+                            {
+                                path: 'list',
+                                name: 'AnswerManagementList',
+                                component: () => import('@/views/home/index.vue'),
+                                meta: {
+                                    title: '答疑管理列表',
+                                    icon: 'question-answer-line',
+                                },
+                            },
+                            {
+                                path: 'invalid',
+                                name: 'InvalidQuestionManagement',
+                                component: () => import('@/views/home/index.vue'),
+                                meta: {
+                                    title: '无效追问管理',
+                                    icon: 'questionnaire-fill',
+                                },
+                            },
+                            {
+                                path: 'lock',
+                                name: 'UserLockManagement',
+                                component: () => import('@/views/home/index.vue'),
+                                meta: {
+                                    title: '用户锁定管理',
+                                    icon: 'lock-fill',
+                                },
+                            },
+                        ],
+                    },
+                    {
+                        path: 'assign/:questionId',
+                        name: 'AssignAnswerTeacher',
+                        component: () => import('@/views/home/index.vue'),
+                        meta: {
+                            title: '指派老师',
+                            icon: 'account-box-fill',
+                            hidden: true,
+                            activeMenu: '/education/answer/management',
+                        },
+                    },
+                    {
+                        path: 'teacher',
+                        name: 'AnswerTeacher',
+                        component: () => import('@/views/global/home.vue'),
+                        component: () => import('@/views/home/index.vue'),
+                        meta: {
+                            title: '答疑老师管理',
+                            icon: 'book-line',
+                        },
+                        children: [
+                            {
+                                path: 'summary',
+                                name: 'AnswerTeacherSummary',
+                                component: () => import('@/views/home/index.vue'),
+                                meta: {
+                                    title: '答疑老师统计',
+                                    icon: 'book-2-line',
+                                },
+                            },
+                            {
+                                path: 'management',
+                                name: 'AnswerTeacherManagement',
+                                component: () => import('@/views/home/index.vue'),
+                                meta: {
+                                    title: '答疑老师管理',
+                                    icon: 'book-3-line',
+                                },
+                            },
+                            {
+                                path: 'bind/:teacher?',
+                                name: 'AnswerTeacherUpdateBind',
+                                component: () => import('@/views/home/index.vue'),
+                                meta: {
+                                    title: '编辑课程绑定',
+                                    icon: 'book-fill',
+                                    hidden: true,
+                                    activeMenu: '/education/answer/teacher/management',
+                                },
+                            },
+                            {
+                                path: 'course',
+                                name: 'AnswerTeacherBindCourse',
+                                component: () => import('@/views/home/index.vue'),
+                                meta: {
+                                    title: '绑定课程管理',
+                                    icon: 'book-fill',
+                                },
+                            },
+                        ],
+                    },
+                ],
+            },
+            {
+                path: 'question',
+                name: 'QuestionManagement',
+                component: () => import('@/views/home/index.vue'),
+                meta: {
+                    title: '题库管理',
+                    icon: 'brush-fill',
+                },
+            },
+            {
+                path: 'note',
+                name: 'NoteManagement',
+                component: () => import('@/views/home/index.vue'),
+                meta: {
+                    title: '笔记管理',
+                    icon: 'sticky-note-2-fill',
+                },
+            },
+            {
+                path: 'research',
+                name: 'CourseResearch',
+                component: () => import('@/views/global/home.vue'),
+                component: () => import('@/views/home/index.vue'),
+                meta: {
+                    title: '课研更新',
+                    icon: 'contacts-book-upload-fill',
+                },
+                children: [
+                    {
+                        path: 'plan',
+                        name: 'CourseResearchPlan',
+                        component: () => import('@/views/home/index.vue'),
+                        meta: {
+                            title: '课研计划',
+                            icon: 'contacts-book-upload-line',
+                        },
+                    },
+                    {
+                        path: 'log',
+                        name: 'CourseResearchLog',
+                        component: () => import('@/views/home/index.vue'),
+                        meta: {
+                            title: '课研更新日志',
+                            icon: 'file-copy-2-line',
+                        },
+                    },
+                ],
+            },
+            {
+                path: 'live',
+                name: 'LiveManagement',
+                component: () => import('@/views/home/index.vue'),
+                meta: {
+                    title: '直播管理',
+                    icon: 'live-fill',
+                },
+            },
+            {
+                path: 'material',
+                name: 'MaterialManagement',
+                component: () => import('@/views/home/index.vue'),
+                meta: {
+                    title: '老师资料管理',
+                    icon: 'database-2-fill',
+                },
+            },
+            {
+                path: 'shift',
+                name: 'ShiftTable',
+                component: () => import('@/views/home/index.vue'),
+                meta: {
+                    title: '排班表',
+                    icon: 'calendar-check-line',
+                },
+            },
+            {
+                path: 'course',
+                name: 'CourseTable',
+                component: () => import('@/views/home/index.vue'),
+                meta: {
+                    title: '课程表管理',
+                    icon: 'calendar-todo-fill',
+                },
+            },
+        ],
+    },
+];
diff --git a/src/router/modules/system.js b/src/router/modules/system.js
new file mode 100644
index 0000000..732fd68
--- /dev/null
+++ b/src/router/modules/system.js
@@ -0,0 +1,49 @@
+export default [
+    {
+        path: '/system',
+        name: 'SystemManagement',
+        component: () => import('@/layouts/default.vue'),
+        meta: {
+            title: '系统管理',
+            icon: 'settings-3-fill',
+        },
+        children: [
+            {
+                path: 'log',
+                name: 'LogManagement',
+                component: () => import('@/views/home/index.vue'),
+                meta: {
+                    title: '日志管理',
+                    icon: 'file-chart-fill',
+                },
+            },
+            {
+                path: 'app',
+                name: 'AppManagement',
+                component: () => import('@/views/home/index.vue'),
+                meta: {
+                    title: 'APP包管理',
+                    icon: 'app-store-fill',
+                },
+            },
+            {
+                path: 'notify',
+                name: 'NotifyManagement',
+                component: () => import('@/views/home/index.vue'),
+                meta: {
+                    title: '通知管理',
+                    icon: 'alarm-warning-fill',
+                },
+            },
+            {
+                path: 'file',
+                name: 'FileManagement',
+                component: () => import('@/views/home/index.vue'),
+                meta: {
+                    title: '文件中台',
+                    icon: 'file-copy-fill',
+                },
+            },
+        ],
+    },
+];
diff --git a/src/router/modules/user.js b/src/router/modules/user.js
new file mode 100644
index 0000000..8817d51
--- /dev/null
+++ b/src/router/modules/user.js
@@ -0,0 +1,49 @@
+export default [
+    {
+        path: '/user',
+        name: 'UserManagement',
+        component: () => import('@/layouts/default.vue'),
+        meta: {
+            title: '用户管理',
+            icon: 'folder-user-fill',
+        },
+        children: [
+            {
+                path: 'consult',
+                name: 'ConsultManagement',
+                component: () => import('@/views/home/index.vue'),
+                meta: {
+                    title: '咨询管理',
+                    icon: 'kakao-talk-fill',
+                },
+            },
+            {
+                path: 'course',
+                name: 'CourseConsultManagement',
+                component: () => import('@/views/home/index.vue'),
+                meta: {
+                    title: '咨询课程',
+                    icon: 'chat-smile-2-fill',
+                },
+            },
+            {
+                path: 'account',
+                name: 'AccountManagement',
+                component: () => import('@/views/home/index.vue'),
+                meta: {
+                    title: '账号课程',
+                    icon: 'account-box-fill',
+                },
+            },
+            {
+                path: 'feedback',
+                name: 'FeedbackManagement',
+                component: () => import('@/views/home/index.vue'),
+                meta: {
+                    title: '意见反馈',
+                    icon: 'feedback-fill',
+                },
+            },
+        ],
+    },
+];
diff --git a/src/store/modules/auth.js b/src/store/modules/auth.js
index 21db2af..c0849e4 100644
--- a/src/store/modules/auth.js
+++ b/src/store/modules/auth.js
@@ -16,7 +16,8 @@ const login = () => {
         }, 1000);
     });
 };
-import router from '@/router';
+import router, { reset as resetRoutes } from '@/router';
+const modules = import.meta.glob('../views/*/*.vue');
 const state = () => ({
     userInfo: null,
     permission: [],
@@ -24,7 +25,49 @@ const state = () => ({
 const getters = {};
 const mutations = {
     setUserInfo: (state, data) => (state.userInfo = data),
-    setPermission: (state, data) => (state.permission = data),
+    setPermission: (state, data) => {
+        const convert = (arr, parent = { path: '/', meta: {} }) => {
+            return arr.map((item) => {
+                let route = {
+                    path: item.routeUrl,
+                    name: item.roleCode,
+                    component: item.pageUrl,
+                    meta: {
+                        title: item.title,
+                        icon: item.icon,
+                        hidden: item.type === 2,
+                        activeMenu: item.activeMenu,
+                    },
+                };
+                if (!route.path.startsWith('/')) {
+                    route.path = parent.path + route.path;
+                }
+                route.meta.menu = route.path.replaceAll(/\/:[^?]+\?/g, '');
+                let activeMenu = route.meta.activeMenu;
+                if (!activeMenu && route.meta.hidden) {
+                    activeMenu = parent.meta.menu;
+                }
+                route.meta.activeMenu = activeMenu || route.meta.menu;
+                if (route.component) {
+                    if (route.component === 'Layout') {
+                        route.component = () => import('@/layouts/default.vue');
+                    } else {
+                        let path = `../views/${route.component}`;
+                        if (!path.endsWith('.vue')) {
+                            path += '.vue';
+                        }
+                        let alias = path.replace(/\.vue$/, '/index.vue');
+                        route.component = modules[path] || modules[alias];
+                    }
+                }
+                route.children = convert(item.children || [], route);
+                route.redirect = route.children.find((item) => !item.meta.hidden)?.menu;
+                return route;
+            });
+        };
+        state.permission = convert(data);
+        // resetRoutes(state.permission);
+    },
 };
 const actions = {
     sms: async ({ commit }, data) => {
diff --git a/src/store/modules/layout.js b/src/store/modules/layout.js
new file mode 100644
index 0000000..d092d7a
--- /dev/null
+++ b/src/store/modules/layout.js
@@ -0,0 +1,24 @@
+import { routes } from '@/router';
+const state = () => ({
+    activeAside: null,
+    activeMenu: null,
+});
+const getters = {
+    asideList: () => {
+        const deep = (arr) =>
+            arr.flatMap((item) => (item.meta?.layout ? deep(item.children || []) : item.meta?.global ? [] : item));
+        return deep(routes);
+    },
+    menuList: (state, getters) => getters.asideList.find((item) => item.name === state.activeAside)?.children || [],
+};
+const mutations = {
+    setActiveAside: (state, data) => (state.activeAside = data),
+    setActiveMenu: (state, data) => (state.activeMenu = data),
+};
+const actions = {};
+export default {
+    state,
+    getters,
+    mutations,
+    actions,
+};
diff --git a/src/views/global/404.vue b/src/views/global/404.vue
new file mode 100644
index 0000000..b6da163
--- /dev/null
+++ b/src/views/global/404.vue
@@ -0,0 +1,75 @@
+<template>
+    <div class="container">
+        <div class="box">
+            <h1 class="title">404</h1>
+        </div>
+    </div>
+</template>
+
+<script setup>
+    const { proxy } = getCurrentInstance();
+    const store = useStore();
+
+    const refsForm = ref(null);
+    const loading = ref(false);
+    const form = reactive({
+        phone: '',
+        password: '',
+        verifyCode: '',
+    });
+    const lastTime = computed(() => store.state.local.lastSendMessageTime);
+    const waitTime = ref(60);
+    const sendStep = ref(60);
+    const rules = reactive({
+        phone: [{ required: true, message: '请输入手机号码' }],
+        password: [{ required: true, message: '请输入登录密码' }],
+        verifyCode: [{ required: true, message: '请输入验证码' }],
+    });
+
+    waitTime.value = Math.max(0, unref(sendStep) - Math.ceil((new Date().getTime() - unref(lastTime)) / 1000));
+    setInterval(() => {
+        waitTime.value = Math.max(0, unref(sendStep) - Math.ceil((new Date().getTime() - unref(lastTime)) / 1000));
+    }, 1000);
+
+    const handleSms = async () => {
+        if (form.phone) {
+            loading.value = true;
+            await store.dispatch('auth/sms', { phone: form.phone, type: 1 });
+            loading.value = false;
+        } else {
+            proxy.$message.warning('请输入手机号码');
+        }
+    };
+    const handleLogin = async () => {
+        loading.value = true;
+        try {
+            await unref(refsForm).validate();
+            await store.dispatch('auth/login', form);
+        } catch (e) {
+            console.info('取消登录', e);
+        }
+        loading.value = false;
+    };
+</script>
+
+<style lang="less" scoped>
+    .container {
+        width: 100vw;
+        height: 100vh;
+        background: #000 url('~/global/login-bgp.png') center center / 100% 100% no-repeat;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        color: @color-white;
+        .box {
+            width: 420px;
+            padding: 30px;
+            background: #1a2229;
+            border-radius: 10px;
+            .title {
+                font-size: 48px;
+                text-align: center;
+            }
+        }
+    }
+</style>
diff --git a/src/views/global/home.vue b/src/views/home/index.vue
similarity index 90%
rename from src/views/global/home.vue
rename to src/views/home/index.vue
index 2415a5b..e25ed4a 100644
--- a/src/views/global/home.vue
+++ b/src/views/home/index.vue
@@ -1,7 +1,9 @@
 <template>
     <div class="container">
+        <h1>{{ $route.name }}</h1>
         <h1>TOKEN:{{ token }}</h1>
         <h2>{{ userInfo }}</h2>
+        <h4>{{ permission }}</h4>
         <h1>
             <XIcon name="app-store" size="30" />
             <span>马士兵严选</span>
@@ -22,6 +24,7 @@
     const store = useStore();
     const token = computed(() => store.state.local.token);
     const userInfo = computed(() => store.state.auth.userInfo);
+    const permission = computed(() => store.state.auth.permission);
     const count = computed(() => store.state.demo.count);
     const doubleCount = computed(() => store.getters['demo/doubleCount']);
     const handleAdd = () => {