有没有办法在vue中只显示管理用户的管理页面，并只显示给普通用户的常规页面？

// 路由配置
import Vue from 'vue'
import Router from 'vue-router'
import AdminLayout from '@/layouts/AdminLayout'
import UserLayout from '@/layouts/UserLayout'
import AdminDashboard from '@/views/AdminDashboard'
import UserDashboard from '@/views/UserDashboard'

Vue.use(Router)

const router = new Router({
  routes: [
    {
      path: '/',
      redirect: '/dashboard'
    },
    {
      path: '/admin',
      component: AdminLayout,
      children: [
        {
          path: 'dashboard',
          component: AdminDashboard,
          meta: {
            requiresAuth: true,
            roles: ['admin'] // 只允许管理员角色访问
          }
        }
      ]
    },
    {
      path: '/user',
      component: UserLayout,
      children: [
        {
          path: 'dashboard',
          component: UserDashboard,
          meta: {
            requiresAuth: true
          }
        }
      ]
    }
  ]
})

// 导航守卫进行权限控制
router.beforeEach((to, from, next) => {
  const isAuthenticated = // 根据登录认证状态判断用户是否已登录
  const userRole = // 获取用户角色信息

  if (to.meta.requiresAuth && !isAuthenticated) {
    // 需要登录但未认证的用户被导航到登录页面
    next('/login')
  } else if (to.meta.roles && !to.meta.roles.includes(userRole)) {
    // 没有权限访问的用户被导航到无权限提示页面
    next('/unauthorized')
  } else {
    // 其他情况正常导航
    next()
  }
})

export default router