模拟动态路由

This commit is contained in:
TimSpan 2025-04-30 15:30:44 +08:00
parent 430162ee4e
commit 7abf4bfa81
5 changed files with 602 additions and 49 deletions

View File

@ -7,7 +7,7 @@ import { type Component } from "vue";
import router from "@/router"; import router from "@/router";
import { LOGIN_ROUTER } from "@/config/constant"; import { LOGIN_ROUTER } from "@/config/constant";
import { type RouteRecordRaw } from "vue-router"; import { type RouteRecordRaw } from "vue-router";
import { getPages } from "./getPages";
const modules: Record<string, () => Promise<Component>> = const modules: Record<string, () => Promise<Component>> =
import.meta.glob<Component>("@/views/**/*.vue"); import.meta.glob<Component>("@/views/**/*.vue");
@ -15,14 +15,15 @@ export const initDynamicRouter = async () => {
const userStore = useUserStore(); const userStore = useUserStore();
const permissionStore = usePermissionStore(); const permissionStore = usePermissionStore();
//获取我授权的menu // 获取我授权的menu
const resp = await getPages();
// const resp = await api.get<AuthMenuTree[]>("/management/auth/myAuthMenu"); // const resp = await api.get<AuthMenuTree[]>("/management/auth/myAuthMenu");
// if (isEmpty(resp.data)) { if (isEmpty(resp.data)) {
// message.warning("您没有任何权限"); message.warning("您没有任何权限");
// userStore.resetUserInfo(); userStore.resetUserInfo();
// await router.replace(LOGIN_ROUTER.path); await router.replace(LOGIN_ROUTER.path);
// return Promise.reject("当前用户暂无授权权限,请联系管理员进行添加"); return Promise.reject("当前用户暂无授权权限,请联系管理员进行添加");
// } }
const removeEmptyChildren = (data: AuthMenuTree[]) => { const removeEmptyChildren = (data: AuthMenuTree[]) => {
return data.map((item) => { return data.map((item) => {
if (item.type.value === "dir") { if (item.type.value === "dir") {
@ -35,37 +36,37 @@ export const initDynamicRouter = async () => {
return item; return item;
}); });
}; };
// permissionStore.initAuthMenuList( permissionStore.initAuthMenuList(
// removeEmptyChildren(resp.data as AuthMenuTree[]) removeEmptyChildren(resp.data as AuthMenuTree[])
// ); );
//扁平化路由 提取children // 扁平化路由 提取children
// const flatAuthMenu = flatMenuList(resp.data as AuthMenuTree[]); const flatAuthMenu = flatMenuList(resp.data as AuthMenuTree[]);
// 动态添加路由 // 动态添加路由
// flatAuthMenu.forEach((item) => { flatAuthMenu.forEach((item) => {
// const route: RouteRecordRaw = { const route: RouteRecordRaw = {
// name: item.snowFlakeId, name: item.snowFlakeId,
// path: item.path, path: item.path,
// redirect: item.redirect, redirect: item.redirect,
// meta: { meta: {
// btnList: item.btnList, btnList: item.btnList,
// title: item.name, title: item.name,
// icon: item.icon, icon: item.icon,
// isFixed: false, isFixed: false,
// isKeepAlive: item.isKeepAlive.extData?.boolVal ?? false, isKeepAlive: item.isKeepAlive.extData?.boolVal ?? false,
// isFull: item.isFull.extData?.boolVal ?? false, isFull: item.isFull.extData?.boolVal ?? false,
// remark: item.remark, remark: item.remark,
// }, },
// component: modules[`/src/views${item.path}/index.vue`], component: modules[`/src/views${item.path}/index.vue`],
// children: [], children: [],
// }; };
// if (item.isFull.extData?.boolVal) { if (item.isFull.extData?.boolVal) {
// //全屏路由添加到根路由下 //全屏路由添加到根路由下
// router.addRoute(route); router.addRoute(route);
// } else { } else {
// //非全屏路由添加到layout下 //非全屏路由添加到layout下
// router.addRoute("layout", route); router.addRoute("layout", route);
// } }
// }); });
}; };
const flatMenuList = ( const flatMenuList = (

555
src/router/getPages.ts Normal file
View File

@ -0,0 +1,555 @@
export const getPages = (): Promise<any> => {
return new Promise((resolve) => {
resolve({
code: 200,
data: [
{
btnList: [],
children: [
{
btnList: [],
children: [],
createBy: null,
createTime: null,
deleteFlag: null,
icon: "CodiconOrganization",
isFull: {
extData: {
boolVal: false,
},
label: "否",
value: 1,
},
isKeepAlive: {
extData: {
boolVal: true,
},
label: "是",
value: 0,
},
link: "",
name: "部门架构",
orderIndex: null,
parentId: "1907342465921191936",
path: "/personnelManagement/departmentStructure",
redirect: "",
remark: "",
snowFlakeId: "1907343323534725120",
status: null,
type: {
extData: null,
label: "菜单",
value: "menu",
},
updateBy: null,
updateTime: null,
},
{
btnList: [],
children: [],
createBy: null,
createTime: null,
deleteFlag: null,
icon: "LineMdAccount",
isFull: {
extData: {
boolVal: false,
},
label: "否",
value: 1,
},
isKeepAlive: {
extData: {
boolVal: true,
},
label: "是",
value: 0,
},
link: "",
name: "企业员工",
orderIndex: null,
parentId: "1907342465921191936",
path: "/personnelManagement/enterpriseStaff",
redirect: "",
remark: "",
snowFlakeId: "1907342952527564800",
status: null,
type: {
extData: null,
label: "菜单",
value: "menu",
},
updateBy: null,
updateTime: null,
},
{
btnList: [],
children: [],
createBy: null,
createTime: null,
deleteFlag: null,
icon: "LineMdAccount",
isFull: {
extData: {
boolVal: false,
},
label: "否",
value: 1,
},
isKeepAlive: {
extData: {
boolVal: true,
},
label: "是",
value: 0,
},
link: "",
name: "安保员工",
orderIndex: null,
parentId: "1907342465921191936",
path: "/personnelManagement/securityStaff",
redirect: "",
remark: "",
snowFlakeId: "1907344307979816960",
status: null,
type: {
extData: null,
label: "菜单",
value: "menu",
},
updateBy: null,
updateTime: null,
},
],
createBy: null,
createTime: null,
deleteFlag: null,
icon: "LineMdAccount",
isFull: {
extData: {
boolVal: false,
},
label: "否",
value: 1,
},
isKeepAlive: {
extData: {
boolVal: true,
},
label: "是",
value: 0,
},
link: "",
name: "人事管理",
orderIndex: null,
parentId: "0",
path: "/personnelManagement",
redirect: "",
remark: "",
snowFlakeId: "1907342465921191936",
status: null,
type: {
extData: null,
label: "目录",
value: "dir",
},
updateBy: null,
updateTime: null,
},
{
btnList: [],
children: [
{
btnList: [
{
extData: {
remark: "测试按钮2",
},
label: "测试按钮2",
value: "test2",
},
],
children: [],
createBy: null,
createTime: null,
deleteFlag: null,
icon: "EosIconsRoleBinding",
isFull: {
extData: {
boolVal: false,
},
label: "否",
value: 1,
},
isKeepAlive: {
extData: {
boolVal: false,
},
label: "否",
value: 1,
},
link: "",
name: "角色",
orderIndex: null,
parentId: "1904795567075102720",
path: "/system/role",
redirect: "",
remark: "",
snowFlakeId: "1904812573660811264",
status: null,
type: {
extData: null,
label: "菜单",
value: "menu",
},
updateBy: null,
updateTime: null,
},
],
createBy: null,
createTime: null,
deleteFlag: null,
icon: "LineMdCogFilledLoop",
isFull: {
extData: {
boolVal: false,
},
label: "否",
value: 1,
},
isKeepAlive: {
extData: {
boolVal: false,
},
label: "否",
value: 1,
},
link: "",
name: "系统管理",
orderIndex: null,
parentId: "0",
path: "/system",
redirect: "/system/user",
remark: "",
snowFlakeId: "1904795567075102720",
status: null,
type: {
extData: null,
label: "目录",
value: "dir",
},
updateBy: null,
updateTime: null,
},
{
btnList: [],
children: [
{
btnList: [],
children: [],
createBy: null,
createTime: null,
deleteFlag: null,
icon: "LineMdList",
isFull: {
extData: {
boolVal: false,
},
label: "否",
value: 1,
},
isKeepAlive: {
extData: {
boolVal: false,
},
label: "否",
value: 1,
},
link: "",
name: "菜单管理",
orderIndex: null,
parentId: "1905455414980382720",
path: "/development/menu",
redirect: "",
remark: "",
snowFlakeId: "1905455579321602048",
status: null,
type: {
extData: null,
label: "菜单",
value: "menu",
},
updateBy: null,
updateTime: null,
},
],
createBy: null,
createTime: null,
deleteFlag: null,
icon: "LineMdDocumentCode",
isFull: {
extData: {
boolVal: false,
},
label: "否",
value: 1,
},
isKeepAlive: {
extData: {
boolVal: false,
},
label: "否",
value: 1,
},
link: "",
name: "开发管理",
orderIndex: null,
parentId: "0",
path: "/development",
redirect: "",
remark: "",
snowFlakeId: "1905455414980382720",
status: null,
type: {
extData: null,
label: "目录",
value: "dir",
},
updateBy: null,
updateTime: null,
},
{
btnList: [],
children: [
{
btnList: [],
children: [],
createBy: null,
createTime: null,
deleteFlag: null,
icon: "LineMdList",
isFull: {
extData: {
boolVal: false,
},
label: "否",
value: 1,
},
isKeepAlive: {
extData: {
boolVal: false,
},
label: "否",
value: 1,
},
link: "",
name: "测试1菜单2",
orderIndex: null,
parentId: "1910252674549288960",
path: "/test1/test1menu2",
redirect: "",
remark: "",
snowFlakeId: "1910253280865292288",
status: null,
type: {
extData: null,
label: "菜单",
value: "menu",
},
updateBy: null,
updateTime: null,
},
{
btnList: [],
children: [],
createBy: null,
createTime: null,
deleteFlag: null,
icon: "LineMdList",
isFull: {
extData: {
boolVal: false,
},
label: "否",
value: 1,
},
isKeepAlive: {
extData: {
boolVal: false,
},
label: "否",
value: 1,
},
link: "",
name: "测试1菜单1",
orderIndex: null,
parentId: "1910252674549288960",
path: "/test1/test1menu1",
redirect: "",
remark: "",
snowFlakeId: "1910253160014811136",
status: null,
type: {
extData: null,
label: "菜单",
value: "menu",
},
updateBy: null,
updateTime: null,
},
{
btnList: [],
children: [
{
btnList: [],
children: [],
createBy: null,
createTime: null,
deleteFlag: null,
icon: "LineMdList",
isFull: {
extData: {
boolVal: false,
},
label: "否",
value: 1,
},
isKeepAlive: {
extData: {
boolVal: false,
},
label: "否",
value: 1,
},
link: "",
name: "测试2菜单2",
orderIndex: null,
parentId: "1910252952203825152",
path: "/test1/test2/test2menu2",
redirect: "",
remark: "",
snowFlakeId: "1910253703755993088",
status: null,
type: {
extData: null,
label: "菜单",
value: "menu",
},
updateBy: null,
updateTime: null,
},
{
btnList: [],
children: [],
createBy: null,
createTime: null,
deleteFlag: null,
icon: "LineMdList",
isFull: {
extData: {
boolVal: false,
},
label: "否",
value: 1,
},
isKeepAlive: {
extData: {
boolVal: false,
},
label: "否",
value: 1,
},
link: "",
name: "测试2菜单1",
orderIndex: null,
parentId: "1910252952203825152",
path: "/test1/test2/test2menu1",
redirect: "",
remark: "",
snowFlakeId: "1910253563792068608",
status: null,
type: {
extData: null,
label: "菜单",
value: "menu",
},
updateBy: null,
updateTime: null,
},
],
createBy: null,
createTime: null,
deleteFlag: null,
icon: "CarbonSubtractAlt",
isFull: {
extData: {
boolVal: false,
},
label: "否",
value: 1,
},
isKeepAlive: {
extData: {
boolVal: true,
},
label: "是",
value: 0,
},
link: "",
name: "测试2",
orderIndex: null,
parentId: "1910252674549288960",
path: "/test2",
redirect: "",
remark: "",
snowFlakeId: "1910252952203825152",
status: null,
type: {
extData: null,
label: "目录",
value: "dir",
},
updateBy: null,
updateTime: null,
},
],
createBy: null,
createTime: null,
deleteFlag: null,
icon: "CarbonSubtractAlt",
isFull: {
extData: {
boolVal: false,
},
label: "否",
value: 1,
},
isKeepAlive: {
extData: {
boolVal: true,
},
label: "是",
value: 0,
},
link: "",
name: "测试1",
orderIndex: null,
parentId: "0",
path: "/test1",
redirect: "",
remark: "",
snowFlakeId: "1910252674549288960",
status: null,
type: {
extData: null,
label: "目录",
value: "dir",
},
updateBy: null,
updateTime: null,
},
],
message: "操作成功!",
});
});
};

View File

@ -37,10 +37,10 @@ router.beforeEach(async (to, from, next) => {
// } // }
// //
// // 6.如果没有菜单列表,就重新请求菜单列表并添加动态路由 // // 6.如果没有菜单列表,就重新请求菜单列表并添加动态路由
// if (isEmpty(permissionStore.authMenuList)) { if (isEmpty(permissionStore.authMenuList)) {
// await initDynamicRouter(); await initDynamicRouter();
// return next({ ...to, replace: true }); return next({ ...to, replace: true });
// } }
//放行 //放行
return next(); return next();
}); });

View File

@ -1,11 +1,7 @@
<template> <template>
<div> 菜单</div> <div>菜单</div>
</template> </template>
<script setup lang="ts"> <script setup lang="ts"></script>
</script> <style scoped lang="scss"></style>
<style scoped lang="scss">
</style>

View File

@ -1,3 +1,4 @@
<template> <template>
<div>待开发</div> <div>待开发</div>
</template> </template>