vben
2 years ago
31 changed files with 792 additions and 202 deletions
@ -1,39 +0,0 @@ |
|||
import type { RouteRecordRaw } from 'vue-router'; |
|||
|
|||
import { BasicLayout, IFrameView } from '@/layouts'; |
|||
|
|||
const routes: RouteRecordRaw[] = [ |
|||
{ |
|||
component: BasicLayout, |
|||
meta: { |
|||
title: '外部页面', |
|||
}, |
|||
name: 'Outside', |
|||
path: '/outside', |
|||
redirect: '/outside/document', |
|||
children: [ |
|||
{ |
|||
name: 'Document', |
|||
path: 'document', |
|||
component: IFrameView, |
|||
meta: { |
|||
iframeSrc: 'https://doc.vvbin.cn/', |
|||
// keepAlive: true,
|
|||
title: '项目文档', |
|||
}, |
|||
}, |
|||
{ |
|||
name: 'IFrameView', |
|||
path: 'vue-document', |
|||
component: IFrameView, |
|||
meta: { |
|||
iframeSrc: 'https://cn.vuejs.org/', |
|||
keepAlive: true, |
|||
title: 'Vue 文档(缓存)', |
|||
}, |
|||
}, |
|||
], |
|||
}, |
|||
]; |
|||
|
|||
export default routes; |
|||
@ -1,29 +1,35 @@ |
|||
import type { RouteRecordRaw } from 'vue-router'; |
|||
|
|||
import { traverseTreeValues } from '@vben/utils'; |
|||
import { mergeRouteModules } from '@vben-core/helpers'; |
|||
|
|||
import { essentialsRoutes } from './_essentials'; |
|||
import { essentialsRoutes, fallbackNotFoundRoute } from './_essentials'; |
|||
|
|||
const dynamicRouteFiles = import.meta.glob('./dynamic/**/*.ts', { |
|||
const dynamicRouteFiles = import.meta.glob('./modules/**/*.ts', { |
|||
eager: true, |
|||
}); |
|||
|
|||
const staticRouteFiles = import.meta.glob('./static/**/*.ts', { eager: true }); |
|||
|
|||
const externalRouteFiles = import.meta.glob('./external/**/*.ts', { |
|||
eager: true, |
|||
}); |
|||
// 有需要可以自行打开注释，并创建文件夹
|
|||
// const staticRouteFiles = import.meta.glob('./static/**/*.ts', { eager: true });
|
|||
|
|||
/** 动态路由 */ |
|||
const dynamicRoutes: RouteRecordRaw[] = mergeRouteModules(dynamicRouteFiles); |
|||
|
|||
/** 静态路由列表，访问这些页面可以不需要权限 */ |
|||
const staticRoutes: RouteRecordRaw[] = mergeRouteModules(staticRouteFiles); |
|||
|
|||
/** 排除在主框架外的路由，这些路由没有菜单和顶部及其他框架内容 */ |
|||
const externalRoutes: RouteRecordRaw[] = mergeRouteModules(externalRouteFiles); |
|||
// const staticRoutes: RouteRecordRaw[] = mergeRouteModules(staticRouteFiles);
|
|||
const staticRoutes: RouteRecordRaw[] = []; |
|||
|
|||
/** 路由列表，由基本路由+静态路由组成 */ |
|||
const routes: RouteRecordRaw[] = [...essentialsRoutes, ...staticRoutes]; |
|||
|
|||
export { dynamicRoutes, externalRoutes, routes }; |
|||
const routes: RouteRecordRaw[] = [ |
|||
...essentialsRoutes, |
|||
...staticRoutes, |
|||
fallbackNotFoundRoute, |
|||
]; |
|||
|
|||
/** 基本路由列表，这些路由不需要进入权限拦截 */ |
|||
const essentialsRouteNames = traverseTreeValues( |
|||
essentialsRoutes, |
|||
(route) => route.name, |
|||
); |
|||
|
|||
export { dynamicRoutes, essentialsRouteNames, routes }; |
|||
|
|||
@ -0,0 +1,49 @@ |
|||
import type { RouteRecordRaw } from 'vue-router'; |
|||
|
|||
import { BasicLayout } from '@/layouts'; |
|||
import { $t } from '@vben/locales/helper'; |
|||
|
|||
const routes: RouteRecordRaw[] = [ |
|||
{ |
|||
component: BasicLayout, |
|||
meta: { |
|||
icon: 'mdi:lightbulb-error-outline', |
|||
title: $t('page.fallback.page'), |
|||
}, |
|||
name: 'FallbackLayout', |
|||
path: '/fallback', |
|||
redirect: '/fallback/403', |
|||
children: [ |
|||
{ |
|||
name: 'Fallback403', |
|||
path: '403', |
|||
component: () => import('@/views/_essential/fallback/forbidden.vue'), |
|||
meta: { |
|||
icon: 'mdi:do-not-disturb-alt', |
|||
title: '403', |
|||
}, |
|||
}, |
|||
{ |
|||
name: 'Fallback404', |
|||
path: '404', |
|||
component: () => import('@/views/_essential/fallback/not-found.vue'), |
|||
meta: { |
|||
icon: 'mdi:table-off', |
|||
title: '404', |
|||
}, |
|||
}, |
|||
{ |
|||
name: 'Fallback500', |
|||
path: '500', |
|||
component: () => |
|||
import('@/views/_essential/fallback/internal-error.vue'), |
|||
meta: { |
|||
icon: 'mdi:server-network-off', |
|||
title: '500', |
|||
}, |
|||
}, |
|||
], |
|||
}, |
|||
]; |
|||
|
|||
export default routes; |
|||
@ -0,0 +1,85 @@ |
|||
import type { RouteRecordRaw } from 'vue-router'; |
|||
|
|||
import { BasicLayout, IFrameView } from '@/layouts'; |
|||
import { $t } from '@vben/locales/helper'; |
|||
|
|||
const routes: RouteRecordRaw[] = [ |
|||
{ |
|||
component: BasicLayout, |
|||
meta: { |
|||
icon: 'ic:round-settings-input-composite', |
|||
title: $t('page.outside.page'), |
|||
}, |
|||
name: 'Outside', |
|||
path: '/outside', |
|||
redirect: '/outside/iframe', |
|||
children: [ |
|||
{ |
|||
name: 'iframe', |
|||
path: 'iframe', |
|||
meta: { |
|||
icon: 'mdi:newspaper-variant-outline', |
|||
title: $t('page.outside.embedded'), |
|||
}, |
|||
redirect: '/outside/iframe/vue-document', |
|||
children: [ |
|||
{ |
|||
name: 'VueDocument', |
|||
path: 'vue-document', |
|||
component: IFrameView, |
|||
meta: { |
|||
icon: 'logos:vue', |
|||
iframeSrc: 'https://cn.vuejs.org/', |
|||
keepAlive: true, |
|||
title: 'Vue', |
|||
}, |
|||
}, |
|||
{ |
|||
name: 'Tailwindcss', |
|||
path: 'tailwindcss', |
|||
component: IFrameView, |
|||
meta: { |
|||
icon: 'devicon:tailwindcss', |
|||
iframeSrc: 'https://tailwindcss.com/', |
|||
// keepAlive: true,
|
|||
title: 'Tailwindcss', |
|||
}, |
|||
}, |
|||
], |
|||
}, |
|||
{ |
|||
name: 'ExternalLink', |
|||
path: 'external-link', |
|||
meta: { |
|||
icon: 'mdi:newspaper-variant-multiple-outline', |
|||
title: $t('page.outside.external-link'), |
|||
}, |
|||
redirect: '/outside/external-link/vite', |
|||
children: [ |
|||
{ |
|||
name: 'Vite', |
|||
path: 'vite', |
|||
component: IFrameView, |
|||
meta: { |
|||
icon: 'logos:vitejs', |
|||
link: 'https://vitejs.dev/', |
|||
title: 'Vite', |
|||
}, |
|||
}, |
|||
{ |
|||
name: 'VueUse', |
|||
path: 'vue-use', |
|||
component: IFrameView, |
|||
meta: { |
|||
icon: 'logos:vueuse', |
|||
link: 'https://vueuse.org', |
|||
title: 'VueUse', |
|||
}, |
|||
}, |
|||
], |
|||
}, |
|||
], |
|||
}, |
|||
]; |
|||
|
|||
export default routes; |
|||
@ -0,0 +1,7 @@ |
|||
<script lang="ts" setup> |
|||
import { Fallback } from '@vben/common-ui'; |
|||
</script> |
|||
|
|||
<template> |
|||
<Fallback status="403" /> |
|||
</template> |
|||
@ -0,0 +1,7 @@ |
|||
<script lang="ts" setup> |
|||
import { Fallback } from '@vben/common-ui'; |
|||
</script> |
|||
|
|||
<template> |
|||
<Fallback status="500" :show-back="false" /> |
|||
</template> |
|||
@ -0,0 +1,31 @@ |
|||
interface FallbackProps { |
|||
/** |
|||
* 描述 |
|||
*/ |
|||
description?: string; |
|||
/** |
|||
* @zh_CN 首页路由地址 |
|||
* @default / |
|||
*/ |
|||
homePath?: string; |
|||
/** |
|||
* @zh_CN 默认显示的图片 |
|||
* @default pageNotFoundSvg |
|||
*/ |
|||
image?: string; |
|||
|
|||
/** |
|||
* @zh_CN 是否显示返回首页按钮 |
|||
* @default true |
|||
*/ |
|||
showBack?: boolean; |
|||
/** |
|||
* @zh_CN 内置类型 |
|||
*/ |
|||
status?: '403' | '404' | '500'; |
|||
/** |
|||
* @zh_CN 页面提示语 |
|||
*/ |
|||
title?: string; |
|||
} |
|||
export type { FallbackProps }; |
|||
|
Before Width: | Height: | Size: 8.8 KiB After Width: | Height: | Size: 9.6 KiB |
|
Before Width: | Height: | Size: 6.4 KiB After Width: | Height: | Size: 7.6 KiB |
@ -1 +1,2 @@ |
|||
export type * from './fallback'; |
|||
export { default as Fallback } from './fallback.vue'; |
|||
|
|||
Loading…
Reference in new issue