mirror of
https://github.com/fantastic-admin/basic.git
synced 2026-10-07 16:18:19 +08:00
对未设置 redirect 的父路由,访问时将自动重定向到允许访问的子路由
This commit is contained in:
@@ -10,7 +10,7 @@ import { useFocus } from '@vueuse/core'
|
||||
import hotkeys from 'hotkeys-js'
|
||||
|
||||
defineOptions({
|
||||
name: 'Search',
|
||||
name: 'NavSearchModal',
|
||||
})
|
||||
|
||||
const isShow = defineModel<boolean>({
|
||||
|
||||
@@ -18,7 +18,6 @@ export default defineFakeRoute([
|
||||
{
|
||||
path: '/multilevel_menu_example',
|
||||
component: 'Layout',
|
||||
redirect: '/multilevel_menu_example/page',
|
||||
name: 'multilevelMenuExample',
|
||||
meta: {
|
||||
title: '多级导航',
|
||||
@@ -36,7 +35,6 @@ export default defineFakeRoute([
|
||||
{
|
||||
path: 'level2',
|
||||
name: 'multilevelMenuExample2',
|
||||
redirect: '/multilevel_menu_example/level2/page',
|
||||
meta: {
|
||||
title: '导航2',
|
||||
},
|
||||
@@ -52,7 +50,6 @@ export default defineFakeRoute([
|
||||
{
|
||||
path: 'level3',
|
||||
name: 'multilevelMenuExample2-2',
|
||||
redirect: '/multilevel_menu_example/level2/level3/page1',
|
||||
meta: {
|
||||
title: '导航2-2',
|
||||
},
|
||||
@@ -82,7 +79,6 @@ export default defineFakeRoute([
|
||||
{
|
||||
path: '/permission_example',
|
||||
component: 'Layout',
|
||||
redirect: '/permission_example/index',
|
||||
name: 'permissionExample',
|
||||
meta: {
|
||||
title: '权限验证',
|
||||
|
||||
@@ -112,6 +112,26 @@ function setupRoutes(router: Router) {
|
||||
})
|
||||
}
|
||||
|
||||
// 当父级路由未配置重定向时,自动重定向到有访问权限的子路由
|
||||
function setupRedirectAuthChildendRoute(router: Router) {
|
||||
router.beforeEach((to, _from, next) => {
|
||||
const { auth } = useAuth()
|
||||
const currentRoute = router.getRoutes().find(route => route.path === (to.matched.at(-1)?.path ?? ''))
|
||||
if (!currentRoute?.redirect) {
|
||||
const findAuthRoute = currentRoute?.children?.find(route => route.meta?.menu !== false && auth(route.meta?.auth ?? ''))
|
||||
if (findAuthRoute) {
|
||||
next(findAuthRoute)
|
||||
}
|
||||
else {
|
||||
next()
|
||||
}
|
||||
}
|
||||
else {
|
||||
next()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 进度条
|
||||
function setupProgress(router: Router) {
|
||||
const { isLoading } = useNProgress()
|
||||
@@ -208,6 +228,7 @@ function setupOther(router: Router) {
|
||||
|
||||
export default function setupGuards(router: Router) {
|
||||
setupRoutes(router)
|
||||
setupRedirectAuthChildendRoute(router)
|
||||
setupProgress(router)
|
||||
setupTitle(router)
|
||||
setupKeepAlive(router)
|
||||
|
||||
@@ -7,7 +7,6 @@ function Layout() {
|
||||
const routes: RouteRecordRaw = {
|
||||
path: '/breadcrumb_example',
|
||||
component: Layout,
|
||||
redirect: '/breadcrumb_example/list1',
|
||||
name: 'breadcrumbExample',
|
||||
meta: {
|
||||
title: '面包屑导航',
|
||||
@@ -34,7 +33,6 @@ const routes: RouteRecordRaw = {
|
||||
},
|
||||
{
|
||||
path: 'list2',
|
||||
redirect: '/breadcrumb_example/list2',
|
||||
meta: {
|
||||
title: '列表2(层级模式)',
|
||||
},
|
||||
|
||||
@@ -242,7 +242,6 @@ const routes: RouteRecordRaw = {
|
||||
},
|
||||
{
|
||||
path: 'extend',
|
||||
redirect: 'pageheader',
|
||||
name: 'componentExampleExtend',
|
||||
meta: {
|
||||
title: '扩展组件',
|
||||
|
||||
@@ -7,7 +7,6 @@ function Layout() {
|
||||
const routes: RouteRecordRaw[] = [
|
||||
{
|
||||
path: '/official',
|
||||
redirect: '/official/fantastic-startkit',
|
||||
component: Layout,
|
||||
meta: {
|
||||
title: '官方周边',
|
||||
@@ -48,7 +47,6 @@ const routes: RouteRecordRaw[] = [
|
||||
},
|
||||
{
|
||||
path: '/recommand',
|
||||
redirect: '/recommand/vform',
|
||||
component: Layout,
|
||||
meta: {
|
||||
title: '友情推荐',
|
||||
|
||||
@@ -7,7 +7,6 @@ function Layout() {
|
||||
const routes: RouteRecordRaw = {
|
||||
path: '/link',
|
||||
component: Layout,
|
||||
redirect: '/link/gitee',
|
||||
name: 'externalLinkExample',
|
||||
meta: {
|
||||
title: '外链',
|
||||
|
||||
@@ -7,7 +7,6 @@ function Layout() {
|
||||
const routes: RouteRecordRaw = {
|
||||
path: '/feature_example',
|
||||
component: Layout,
|
||||
redirect: '/feature_example/clipboard',
|
||||
name: 'featureExample',
|
||||
meta: {
|
||||
title: '功能',
|
||||
|
||||
@@ -7,7 +7,6 @@ function Layout() {
|
||||
const routes: RouteRecordRaw = {
|
||||
path: '/icon_example',
|
||||
component: Layout,
|
||||
redirect: '/icon_example/svg',
|
||||
name: 'iconExample',
|
||||
meta: {
|
||||
title: '扩展图标',
|
||||
|
||||
@@ -7,7 +7,6 @@ function Layout() {
|
||||
const routes: RouteRecordRaw = {
|
||||
path: '/jsx_example',
|
||||
component: Layout,
|
||||
redirect: '/jsx_example/index',
|
||||
name: 'jsxExample',
|
||||
meta: {
|
||||
title: 'JSX',
|
||||
|
||||
@@ -7,7 +7,6 @@ function Layout() {
|
||||
const routes: RouteRecordRaw = {
|
||||
path: '/keep_alive_example',
|
||||
component: Layout,
|
||||
redirect: '/keep_alive_example/page',
|
||||
name: 'keepAliveExample',
|
||||
meta: {
|
||||
title: '页面缓存',
|
||||
@@ -35,7 +34,6 @@ const routes: RouteRecordRaw = {
|
||||
},
|
||||
{
|
||||
path: 'nested',
|
||||
redirect: '/keep_alive_example/nested/detail',
|
||||
meta: {
|
||||
title: '嵌套路由',
|
||||
menu: false,
|
||||
|
||||
@@ -7,7 +7,6 @@ function Layout() {
|
||||
const routes: RouteRecordRaw = {
|
||||
path: '/mock_example',
|
||||
component: Layout,
|
||||
redirect: '/mock_example/index',
|
||||
name: 'mockExample',
|
||||
meta: {
|
||||
title: 'Mock',
|
||||
|
||||
@@ -7,7 +7,6 @@ function Layout() {
|
||||
const routes: RouteRecordRaw = {
|
||||
path: '/multilevel_menu_example',
|
||||
component: Layout,
|
||||
redirect: '/multilevel_menu_example/page',
|
||||
name: 'multilevelMenuExample',
|
||||
meta: {
|
||||
title: '多级导航',
|
||||
@@ -25,7 +24,6 @@ const routes: RouteRecordRaw = {
|
||||
{
|
||||
path: 'level2',
|
||||
name: 'multilevelMenuExample2',
|
||||
redirect: '/multilevel_menu_example/level2/page',
|
||||
meta: {
|
||||
title: '导航2',
|
||||
},
|
||||
@@ -41,7 +39,6 @@ const routes: RouteRecordRaw = {
|
||||
{
|
||||
path: 'level3',
|
||||
name: 'multilevelMenuExample2-2',
|
||||
redirect: '/multilevel_menu_example/level2/level3/page1',
|
||||
meta: {
|
||||
title: '导航2-2',
|
||||
},
|
||||
|
||||
@@ -7,7 +7,6 @@ function Layout() {
|
||||
const routes: RouteRecordRaw = {
|
||||
path: '/permission_example',
|
||||
component: Layout,
|
||||
redirect: '/permission_example/index',
|
||||
name: 'permissionExample',
|
||||
meta: {
|
||||
title: '权限验证',
|
||||
|
||||
@@ -7,7 +7,6 @@ function Layout() {
|
||||
const routes: RouteRecordRaw = {
|
||||
path: '/plugin_example',
|
||||
component: Layout,
|
||||
redirect: '/plugin_example/qrcode',
|
||||
name: 'pluginExample',
|
||||
meta: {
|
||||
title: '插件',
|
||||
@@ -70,7 +69,6 @@ const routes: RouteRecordRaw = {
|
||||
},
|
||||
{
|
||||
path: 'chart',
|
||||
redirect: '/chart/echarts',
|
||||
name: 'pluginExampleChart',
|
||||
meta: {
|
||||
title: '图表',
|
||||
|
||||
@@ -7,7 +7,6 @@ function Layout() {
|
||||
const routes: RouteRecordRaw = {
|
||||
path: '/tab_example',
|
||||
component: Layout,
|
||||
redirect: '/tab_example/index',
|
||||
name: 'tabExample',
|
||||
meta: {
|
||||
title: '标签栏',
|
||||
|
||||
@@ -47,12 +47,10 @@ function open(url: string) {
|
||||
</FaButton>
|
||||
</div>
|
||||
</template>
|
||||
<ElButton @click="open('https://element-plus.org/#/zh-CN')">
|
||||
<template #icon>
|
||||
<FaIcon name="i-ep:link" />
|
||||
</template>
|
||||
<FaButton variant="outline" @click="open('https://element-plus.org/#/zh-CN')">
|
||||
<FaIcon name="i-ep:link" />
|
||||
Element Plus 官网
|
||||
</ElButton>
|
||||
</FaButton>
|
||||
</FaPageHeader>
|
||||
<FaPageMain>
|
||||
<ElTabs type="border-card">
|
||||
|
||||
@@ -498,12 +498,10 @@ function open(url: string) {
|
||||
<template>
|
||||
<div>
|
||||
<FaPageHeader title="常用正则" description="正则来源于 Github 上 any-rule 项目">
|
||||
<ElButton @click="open('https://github.com/any86/any-rule')">
|
||||
<template #icon>
|
||||
<FaIcon name="i-ep:link" />
|
||||
</template>
|
||||
<FaButton variant="outline" @click="open('https://github.com/any86/any-rule')">
|
||||
<FaIcon name="i-ep:link" />
|
||||
访问 any-rule
|
||||
</ElButton>
|
||||
</FaButton>
|
||||
</FaPageHeader>
|
||||
<FaPageMain v-for="(item, index) in rules" :key="index" :title="item.title">
|
||||
<div class="rule">
|
||||
|
||||
@@ -33,12 +33,10 @@ function open(url: string) {
|
||||
<template>
|
||||
<div>
|
||||
<FaPageHeader title="VueUse" description="VueUse 是一个 Vue Composition API 实用程序的集合,更多 API 和例子请查看 VueUse 官网。">
|
||||
<ElButton @click="open('https://vueuse.org/')">
|
||||
<template #icon>
|
||||
<FaIcon name="i-ep:link" />
|
||||
</template>
|
||||
<FaButton variant="outline" @click="open('https://vueuse.org/')">
|
||||
<FaIcon name="i-ep:link" />
|
||||
VueUse 官网
|
||||
</ElButton>
|
||||
</FaButton>
|
||||
</FaPageHeader>
|
||||
<FaPageMain title="防抖:debounce">
|
||||
<p class="mt-0">
|
||||
|
||||
Reference in New Issue
Block a user