新增
This commit is contained in:
Your Name
@@ -0,0 +1,12 @@
|
||||
import type { Router } from 'vue-router'
|
||||
|
||||
const modules = import.meta.glob('./*.ts', { eager: true })
|
||||
|
||||
export function registerRouteGuard(router: Router) {
|
||||
Object.keys(modules).forEach((key) => {
|
||||
const fn = (modules[key] as any).default
|
||||
if (typeof fn === 'function') {
|
||||
fn(router)
|
||||
}
|
||||
})
|
||||
}
|
||||
@@ -0,0 +1,23 @@
|
||||
import type { Router } from 'vue-router'
|
||||
|
||||
import useAppStore from '@/stores/modules/app'
|
||||
|
||||
export default function createInitGuard(router: Router) {
|
||||
router.beforeEach(async () => {
|
||||
const appStore = useAppStore()
|
||||
if (Object.keys(appStore.config).length == 0) {
|
||||
// 获取配置
|
||||
const data: any = await appStore.getConfig()
|
||||
|
||||
// 设置网站logo
|
||||
let favicon: HTMLLinkElement = document.querySelector('link[rel="icon"]')!
|
||||
if (favicon) {
|
||||
favicon.href = data.web_favicon
|
||||
}
|
||||
favicon = document.createElement('link')
|
||||
favicon.rel = 'icon'
|
||||
favicon.href = data.web_favicon
|
||||
document.head.appendChild(favicon)
|
||||
}
|
||||
})
|
||||
}
|
||||
@@ -0,0 +1,112 @@
|
||||
import { createRouter, createWebHistory, type RouteRecordRaw, RouterView } from 'vue-router'
|
||||
|
||||
import { MenuEnum } from '@/enums/appEnums'
|
||||
import useUserStore from '@/stores/modules/user'
|
||||
import { isExternal } from '@/utils/validate'
|
||||
|
||||
import { constantRoutes, INDEX_ROUTE_NAME, LAYOUT } from './routes'
|
||||
|
||||
// 匹配views里面所有的.vue文件，动态引入
|
||||
const modules = import.meta.glob('/src/views/**/*.vue')
|
||||
|
||||
//
|
||||
export function getModulesKey() {
|
||||
return Object.keys(modules).map((item) => item.replace('/src/views/', '').replace('.vue', ''))
|
||||
}
|
||||
|
||||
// 过滤路由所需要的数据
|
||||
export function filterAsyncRoutes(routes: any[], firstRoute = true) {
|
||||
return routes.map((route) => {
|
||||
const routeRecord = createRouteRecord(route, firstRoute)
|
||||
if (route.children != null && route.children && route.children.length) {
|
||||
routeRecord.children = filterAsyncRoutes(route.children, false)
|
||||
}
|
||||
return routeRecord
|
||||
})
|
||||
}
|
||||
|
||||
// 创建一条路由记录
|
||||
export function createRouteRecord(route: any, firstRoute: boolean): RouteRecordRaw {
|
||||
//@ts-ignore
|
||||
const routeRecord: RouteRecordRaw = {
|
||||
path: isExternal(route.paths) ? route.paths : firstRoute ? `/${route.paths}` : route.paths,
|
||||
name: Symbol(route.paths),
|
||||
meta: {
|
||||
hidden: !route.is_show,
|
||||
keepAlive: !!route.is_cache,
|
||||
title: route.name,
|
||||
perms: route.perms,
|
||||
query: route.params,
|
||||
icon: route.icon,
|
||||
type: route.type,
|
||||
activeMenu: route.selected
|
||||
}
|
||||
}
|
||||
switch (route.type) {
|
||||
case MenuEnum.CATALOGUE:
|
||||
routeRecord.component = firstRoute ? LAYOUT : RouterView
|
||||
if (!route.children) {
|
||||
routeRecord.component = RouterView
|
||||
}
|
||||
break
|
||||
case MenuEnum.MENU:
|
||||
routeRecord.component = loadRouteView(route.component)
|
||||
break
|
||||
}
|
||||
return routeRecord
|
||||
}
|
||||
|
||||
// 动态加载组件
|
||||
export function loadRouteView(component: string) {
|
||||
try {
|
||||
const key = Object.keys(modules).find((key) => {
|
||||
return key.includes(`/${component}.vue`)
|
||||
})
|
||||
if (key) {
|
||||
return modules[key]
|
||||
}
|
||||
throw Error(`找不到组件${component}，请确保组件路径正确`)
|
||||
} catch (error) {
|
||||
console.error(error)
|
||||
return RouterView
|
||||
}
|
||||
}
|
||||
|
||||
// 找到第一个有效的路由
|
||||
export function findFirstValidRoute(routes: RouteRecordRaw[]): string | undefined {
|
||||
for (const route of routes) {
|
||||
if (route.meta?.type == MenuEnum.MENU && !route.meta?.hidden && !isExternal(route.path)) {
|
||||
return route.name as string
|
||||
}
|
||||
if (route.children) {
|
||||
const name = findFirstValidRoute(route.children)
|
||||
if (name) {
|
||||
return name
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
//通过权限字符查询路由路径
|
||||
export function getRoutePath(perms: string) {
|
||||
const routerObj = useRouter() || router
|
||||
return routerObj.getRoutes().find((item) => item.meta?.perms == perms)?.path || ''
|
||||
}
|
||||
|
||||
// 重置路由
|
||||
export function resetRouter() {
|
||||
router.removeRoute(INDEX_ROUTE_NAME)
|
||||
const { routes } = useUserStore()
|
||||
routes.forEach((route) => {
|
||||
const name = route.name
|
||||
if (name && router.hasRoute(name)) {
|
||||
router.removeRoute(name)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const router = createRouter({
|
||||
history: createWebHistory(import.meta.env.BASE_URL),
|
||||
routes: constantRoutes
|
||||
})
|
||||
|
||||
export default router
|
||||
@@ -0,0 +1,90 @@
|
||||
/**
|
||||
* Note: 路由配置项
|
||||
*
|
||||
* path: '/path' // 路由路径
|
||||
* name:'router-name' // 设定路由的名字，一定要填写不然使用<keep-alive>时会出现各种问题
|
||||
* meta : {
|
||||
title: 'title' // 设置该路由在侧边栏的名字
|
||||
icon: 'icon-name' // 设置该路由的图标
|
||||
activeMenu: '/system/user' // 当路由设置了该属性，则会高亮相对应的侧边栏。
|
||||
query: '{"id": 1}' // 访问路由的默认传递参数
|
||||
hidden: true // 当设置 true 的时候该路由不会在侧边栏出现
|
||||
hideTab: true //当设置 true 的时候该路由不会在多标签tab栏出现
|
||||
}
|
||||
*/
|
||||
|
||||
import type { RouteRecordRaw } from 'vue-router'
|
||||
|
||||
import { PageEnum } from '@/enums/pageEnum'
|
||||
import Layout from '@/layout/default/index.vue'
|
||||
|
||||
export const LAYOUT = () => Promise.resolve(Layout)
|
||||
|
||||
export const INDEX_ROUTE_NAME = Symbol()
|
||||
|
||||
export const constantRoutes: Array<RouteRecordRaw> = [
|
||||
{
|
||||
path: '/:pathMatch(.*)*',
|
||||
component: () => import('@/views/error/404.vue')
|
||||
},
|
||||
{
|
||||
path: PageEnum.ERROR_403,
|
||||
component: () => import('@/views/error/403.vue')
|
||||
},
|
||||
{
|
||||
path: PageEnum.LOGIN,
|
||||
component: () => import('@/views/account/login.vue')
|
||||
},
|
||||
{
|
||||
path: '/user',
|
||||
component: LAYOUT,
|
||||
children: [
|
||||
{
|
||||
path: 'setting',
|
||||
component: () => import('@/views/user/setting.vue'),
|
||||
name: Symbol(),
|
||||
meta: {
|
||||
title: '个人设置'
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '/decoration/pc_details',
|
||||
component: () => import('@/views/decoration/pc_details.vue')
|
||||
}
|
||||
// {
|
||||
// path: '/dev_tools',
|
||||
// component: LAYOUT,
|
||||
// children: [
|
||||
// {
|
||||
// path: 'code/edit',
|
||||
// component: () => import('@/views/dev_tools/code/edit.vue'),
|
||||
// meta: {
|
||||
// title: '编辑数据表',
|
||||
// activeMenu: '/dev_tools/code'
|
||||
// }
|
||||
// }
|
||||
// ]
|
||||
// },
|
||||
// {
|
||||
// path: '/setting',
|
||||
// component: LAYOUT,
|
||||
// children: [
|
||||
// {
|
||||
// path: 'dict/data',
|
||||
// component: () => import('@/views/setting/dict/data/index.vue'),
|
||||
// meta: {
|
||||
// title: '数据管理',
|
||||
// activeMenu: '/setting/dict'
|
||||
// }
|
||||
// }
|
||||
// ]
|
||||
// }
|
||||
]
|
||||
|
||||
export const INDEX_ROUTE: RouteRecordRaw = {
|
||||
path: PageEnum.INDEX,
|
||||
component: LAYOUT,
|
||||
name: INDEX_ROUTE_NAME
|
||||
}
|
||||
Reference in New Issue
Block a user