# feat: 路由与布局支持coach后台入口

src/layout/AdminLayout.vue

@@ -14,7 +14,12 @@ const logoutHandler = () => {
 
 }
 const menus:ComputedRef<RouteRecordRaw[] | undefined> = computed(()=>{
-  return adminRoutes[0].children;
+  const role = loginUserStore.loginUser.user?.role
+  return adminRoutes[0].children?.filter((child) => {
+    if (child.meta?.requiresAdmin) return role === 'admin'
+    if (child.meta?.requiresCoach) return role === 'admin' || role === 'coach'
+    return false
+  });
 })
 const isCollapse = ref(false)
 const handleOpen = (key: string, keyPath: string[]) => {

src/layout/UserLayout.vue

@@ -17,7 +17,7 @@
             <el-icon><component :is="menu.meta?.icon"/></el-icon>
             <template #title>{{ menu.meta?.title }}</template>
           </el-menu-item>
-          <el-menu-item v-if="isAdmin" index="/admin">
+          <el-menu-item v-if="isStaff" index="/admin">
             <el-icon><Tools/></el-icon>
             <template #title>后台管理</template>
           </el-menu-item>
@@ -64,7 +64,10 @@ import {
 const metaStore = useMetaStore()
 const loginUserStore = useLoginUserStore()
 const login = computed(() => loginUserStore.loginUser.isLogin)
-const isAdmin = computed(() => loginUserStore.loginUser.user?.role === 'admin')
+const isStaff = computed(() => {
+  const role = loginUserStore.loginUser.user?.role
+  return role === 'admin' || role === 'coach'
+})
 const loginHandler = () => {
   router.push('/login')
 }

src/router/index.ts

@@ -46,6 +46,7 @@ export const adminRoutes:RouteRecordRaw[] = [
         path: '/admin',
         name: 'adminLayout',
         component: AdminLayout,
+        redirect: '/admin/problems',
         children:[
             {
                 path: '/admin/users',
@@ -56,20 +57,10 @@ export const adminRoutes:RouteRecordRaw[] = [
                     icon: User,
                     requiresAdmin: true
                 }
-            },
-            {
-                path:'/admin/other',
-                name:'other',
-                component: AdminLayout,
-                meta:{
-                    title: '其他',
-                    icon: Menu,
-                    requiresAdmin: true
-                }
             }
         ],
         meta: {
-            requiresAdmin: true
+            requiresCoach: true
         }
     }
 ]
@@ -87,12 +78,23 @@ const router : Router = createRouter({
     ],
 });
 router.beforeEach((to, _from, next) => {
+    const loginUserStore = useLoginUserStore()
+    const role = loginUserStore.loginUser.user?.role
     if (to.matched.some(record => record.meta.requiresAdmin)) {
-        const loginUserStore = useLoginUserStore()
         if (!loginUserStore.loginUser.isLogin) {
             ElMessage.warning('请先登录')
             next({path: '/login', query: {redirect: to.fullPath}})
-        } else if (loginUserStore.loginUser.user?.role !== 'admin') {
+        } else if (role !== 'admin') {
+            ElMessage.error('无权访问')
+            next('/')
+        } else {
+            next()
+        }
+    } else if (to.matched.some(record => record.meta.requiresCoach)) {
+        if (!loginUserStore.loginUser.isLogin) {
+            ElMessage.warning('请先登录')
+            next({path: '/login', query: {redirect: to.fullPath}})
+        } else if (role !== 'admin' && role !== 'coach') {
             ElMessage.error('无权访问')
             next('/')
         } else {

src/type/index.ts

@@ -2,7 +2,7 @@ export interface User{
     id:string,
     name:string,
     avatar?: string
-    role: 'admin' | 'user' | 'guest'
+    role: 'admin' | 'coach' | 'user' | 'guest'
 }
 export interface LoginUser{
     isLogin:boolean,