-
Notifications
You must be signed in to change notification settings - Fork 656
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
wip(router): async import route developing
- Loading branch information
1 parent
c5ab359
commit 95a2bd8
Showing
11 changed files
with
311 additions
and
4 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,27 @@ | ||
import ParentLayout from '@/components/ParentView/index.vue' | ||
import type { RouteLocationNormalized, RouteRecordNormalized } from 'vue-router' | ||
|
||
export const getParentLayout = (name: string) => { | ||
return () => | ||
new Promise((resolve) => { | ||
resolve({ | ||
...ParentLayout, | ||
name | ||
}) | ||
}) | ||
} | ||
|
||
export function getRoute(route: RouteLocationNormalized): RouteLocationNormalized { | ||
if (!route) return route | ||
const { matched, ...opt } = route | ||
return { | ||
...opt, | ||
matched: (matched | ||
? matched.map((item) => ({ | ||
meta: item.meta, | ||
name: item.name, | ||
path: item.path | ||
})) | ||
: undefined) as RouteRecordNormalized[] | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,180 @@ | ||
// import { defineStore } from 'pinia' | ||
// import { asyncRouterMap, constantRouterMap } from '@/router' | ||
// import { useCache } from '@/hooks/web/useCache' | ||
// import { getParentLayout } from '@/router/helper' | ||
// import { store } from '../index' | ||
// import { useAppStoreWithOut } from '@/store/modules/app' | ||
// import { isUrl } from '@/utils/is' | ||
// import { deepClone } from '@/utils' | ||
|
||
// const { wsCache } = useCache() | ||
|
||
// const appStore = useAppStoreWithOut() | ||
|
||
// const modules = import.meta.glob('../../views/**/*.{vue,tsx}') | ||
|
||
// /* Layout */ | ||
// const Layout = () => import('@/layout/index.vue') | ||
|
||
// export interface PermissionState { | ||
// routers: AppRouteRecordRaw[] | ||
// addRouters: AppRouteRecordRaw[] | ||
// isAddRouters: boolean | ||
// activeTab: string | ||
// menuTabRouters: AppRouteRecordRaw[] | ||
// } | ||
|
||
// export const usePermissionStore = defineStore({ | ||
// id: 'permission', | ||
// state: (): PermissionState => ({ | ||
// routers: [], | ||
// addRouters: [], | ||
// isAddRouters: false, | ||
// menuTabRouters: [], | ||
// activeTab: '' | ||
// }), | ||
// getters: { | ||
// getRouters(): AppRouteRecordRaw[] { | ||
// return this.routers | ||
// }, | ||
// getAddRouters(): AppRouteRecordRaw[] { | ||
// return this.addRouters | ||
// }, | ||
// getIsAddRouters(): boolean { | ||
// return this.isAddRouters | ||
// }, | ||
// getActiveTab(): string { | ||
// return this.activeTab | ||
// }, | ||
// getMenuTabRouters(): AppRouteRecordRaw[] { | ||
// return this.menuTabRouters | ||
// } | ||
// }, | ||
// actions: { | ||
// generateRoutes(): Promise<unknown> { | ||
// return new Promise<void>((resolve) => { | ||
// // 路由权限控制 | ||
// let routerMap: AppRouteRecordRaw[] = [] | ||
// if (wsCache.get(appStore.getUserInfo).roleName === 'admin') { | ||
// // 模拟前端控制权限 | ||
// routerMap = generateRoutesFn(deepClone(asyncRouterMap, ['component'])) | ||
// } else { | ||
// // 模拟后端控制权限 | ||
// routerMap = getFilterRoutes(wsCache.get(appStore.getUserInfo).checkedNodes) | ||
// } | ||
// // const routerMap: AppRouteRecordRaw[] = generateRoutesFn(deepClone(asyncRouterMap, ['component'])) | ||
// // 动态路由,404一定要放到最后面 | ||
// this.addRouters = routerMap.concat([ | ||
// { | ||
// path: '/:path(.*)*', | ||
// redirect: '/404', | ||
// name: '404', | ||
// meta: { | ||
// hidden: true, | ||
// breadcrumb: false | ||
// } | ||
// } | ||
// ]) | ||
// // 渲染菜单的所有路由 | ||
// this.routers = deepClone(constantRouterMap, ['component']).concat(routerMap) | ||
// resolve() | ||
// }) | ||
// }, | ||
// setIsAddRouters(state: boolean): void { | ||
// this.isAddRouters = state | ||
// }, | ||
// setMenuTabRouters(routers: AppRouteRecordRaw[]): void { | ||
// this.menuTabRouters = routers | ||
// }, | ||
// setAcitveTab(activeTab: string): void { | ||
// this.activeTab = activeTab | ||
// } | ||
// } | ||
// }) | ||
|
||
// // 路由过滤,主要用于权限控制 | ||
// function generateRoutesFn(routes: AppRouteRecordRaw[], basePath = '/'): AppRouteRecordRaw[] { | ||
// const res: AppRouteRecordRaw[] = [] | ||
|
||
// for (const route of routes) { | ||
// // skip some route | ||
// if (route.meta && route.meta.hidden && !route.meta.showMainRoute) { | ||
// continue | ||
// } | ||
|
||
// let onlyOneChild: Nullable<string> = null | ||
|
||
// if (route.children && route.children.length === 1 && !route.meta.alwaysShow) { | ||
// onlyOneChild = ( | ||
// isUrl(route.children[0].path) | ||
// ? route.children[0].path | ||
// : path.resolve(path.resolve(basePath, route.path), route.children[0].path) | ||
// ) as string | ||
// } | ||
|
||
// let data: Nullable<AppRouteRecordRaw> = null | ||
|
||
// // 如不需要路由权限,可注释以下逻辑 | ||
// // 权限过滤,通过获取登录信息里面的角色权限,动态的渲染菜单。 | ||
// const list = wsCache.get(appStore.getUserInfo).checkedNodes | ||
// // 开发者可以根据实际情况进行扩展 | ||
// for (const item of list) { | ||
// // 通过路径去匹配 | ||
// if (isUrl(item.path) && (onlyOneChild === item.path || route.path === item.path)) { | ||
// data = Object.assign({}, route) | ||
// } else { | ||
// const routePath = path.resolve(basePath, onlyOneChild || route.path) | ||
// if (routePath === item.path || (route.meta && route.meta.followRoute === item.path)) { | ||
// data = Object.assign({}, route) | ||
// } | ||
// } | ||
// } | ||
// // 如不需要路由权限,解注释下面一行 | ||
// // data = Object.assign({}, route) | ||
|
||
// // recursive child routes | ||
// if (route.children && data) { | ||
// data.children = generateRoutesFn(route.children, path.resolve(basePath, data.path)) | ||
// } | ||
// if (data) { | ||
// res.push(data as AppRouteRecordRaw) | ||
// } | ||
// } | ||
// return res | ||
// } | ||
|
||
// // 模拟后端过滤路由 | ||
// function getFilterRoutes(routes: AppRouteRecordRaw[]): AppRouteRecordRaw[] { | ||
// const res: AppRouteRecordRaw[] = [] | ||
|
||
// for (const route of routes) { | ||
// const data: AppRouteRecordRaw = { | ||
// path: route.path, | ||
// name: route.name, | ||
// redirect: route.redirect, | ||
// meta: {} | ||
// } | ||
// data.meta = Object.assign({}, route.meta || {}, { title: route.meta.title }) | ||
// if (route.component) { | ||
// // 动态加载路由文件,可根据实际情况进行自定义逻辑 | ||
// const component = route.component as string | ||
// data.component = ( | ||
// component === '#' | ||
// ? Layout | ||
// : component.includes('##') | ||
// ? getParentLayout(component.split('##')[1]) | ||
// : modules[`../../${route.component}.vue`] || modules[`../../${route.component}.tsx`] | ||
// ) | ||
// } | ||
// // recursive child routes | ||
// if (route.children) { | ||
// data.children = getFilterRoutes(route.children) | ||
// } | ||
// res.push(data as AppRouteRecordRaw) | ||
// } | ||
// return res | ||
// } | ||
|
||
// export function usePermissionStoreWithOut() { | ||
// return usePermissionStore(store) | ||
// } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,5 @@ | ||
<script setup lang="ts"></script> | ||
|
||
<template> | ||
<div>Menu11</div> | ||
</template> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,5 @@ | ||
<script setup lang="ts"></script> | ||
|
||
<template> | ||
<div>Menu12</div> | ||
</template> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,5 @@ | ||
<script setup lang="ts"></script> | ||
|
||
<template> | ||
<div>Menu2</div> | ||
</template> |