'admin-21.02.24:编写后端控制路由'
This commit is contained in:
lyt-Top
parent
38b9f430ce
commit
3fbf507129
@ -1,40 +1,24 @@
|
|||||||
import request from '/@/utils/request.ts'
|
import request from '/@/utils/request.ts'
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* webpack 的代理只是本地开发生效，打包后需要在部署环境 搭建 nginx 代理
|
* 后端控制菜单模拟json，路径在 https://gitee.com/lyt-top/vue-admin-wonderful-images/tree/master/next/menu
|
||||||
* 所以：
|
* 后端控制路由，isRequestRoutes 为 true，则开启后端控制路由
|
||||||
* 开发环境，请求跨越的接口。为了配置跨越示例
|
|
||||||
* 线上环境，请求目录下的 `json` 数据
|
|
||||||
* 一般后端接口都会处理跨越问题，可根据具体情况进行修改
|
|
||||||
*/
|
*/
|
||||||
// 获取后端动态路由菜单(超级管理)
|
// 获取后端动态路由菜单(admin)
|
||||||
export function getMenuAdmin(params?: object) {
|
export function getMenuAdmin(params?: object) {
|
||||||
if (process.env.NODE_ENV === 'development') {
|
return request({
|
||||||
return request({
|
url: '/gitee/lyt-top/vue-admin-wonderful-images/raw/master/next/menu/adminMenu.json',
|
||||||
url: '/gitee/lyt-top/vue-admin-wonderful-images/raw/master/menu/menuAdmin.json',
|
method: 'get',
|
||||||
method: 'get',
|
params,
|
||||||
params,
|
});
|
||||||
});
|
|
||||||
} else {
|
|
||||||
return request({
|
|
||||||
url: './menuAdmin.json',
|
|
||||||
method: 'get'
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// 获取后端动态路由菜单(普通用户)
|
// 获取后端动态路由菜单(test)
|
||||||
export function getMenuOrdinary(params?: object) {
|
export function getMenuTest(params?: object) {
|
||||||
if (process.env.NODE_ENV === 'development') {
|
return request({
|
||||||
return request({
|
// url: '/gitee/lyt-top/vue-admin-wonderful-images/raw/master/next/menu/testMenu.json',
|
||||||
url: '/gitee/lyt-top/vue-admin-wonderful-images/raw/master/menu/menuOrdinary.json',
|
url: '/src/api/menu/testMenu.json',
|
||||||
method: 'get',
|
method: 'get',
|
||||||
params,
|
params,
|
||||||
});
|
});
|
||||||
} else {
|
|
||||||
return request({
|
|
||||||
url: './menuOrdinary.json',
|
|
||||||
method: 'get'
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
363
src/api/menu/testMenu.json
Normal file
363
src/api/menu/testMenu.json
Normal file
@ -0,0 +1,363 @@
|
|||||||
|
{
|
||||||
|
"code": 0,
|
||||||
|
"type": "testMenu",
|
||||||
|
"data": [
|
||||||
|
{
|
||||||
|
"path": "/home",
|
||||||
|
"name": "home",
|
||||||
|
"component": "'/@/views/home/index.vue'",
|
||||||
|
"meta": {
|
||||||
|
"title": "首页",
|
||||||
|
"isLink": "",
|
||||||
|
"isHide": false,
|
||||||
|
"isKeepAlive": true,
|
||||||
|
"isAffix": true,
|
||||||
|
"isIframe": false,
|
||||||
|
"auth": [
|
||||||
|
"admin",
|
||||||
|
"test"
|
||||||
|
],
|
||||||
|
"icon": "iconfonticon-shouye"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "/limits",
|
||||||
|
"name": "limits",
|
||||||
|
"component": "layout/routerView/parent",
|
||||||
|
"redirect": "/limits/frontEnd",
|
||||||
|
"meta": {
|
||||||
|
"title": "权限管理",
|
||||||
|
"isLink": "",
|
||||||
|
"isHide": false,
|
||||||
|
"isKeepAlive": true,
|
||||||
|
"isAffix": false,
|
||||||
|
"isIframe": false,
|
||||||
|
"auth": [
|
||||||
|
"admin",
|
||||||
|
"test"
|
||||||
|
],
|
||||||
|
"icon": "iconfonticon-quanxian"
|
||||||
|
},
|
||||||
|
"children": [
|
||||||
|
{
|
||||||
|
"path": "/limits/frontEnd",
|
||||||
|
"name": "limitsFrontEnd",
|
||||||
|
"component": "layout/routerView/parent",
|
||||||
|
"redirect": "/limits/frontEnd/page",
|
||||||
|
"meta": {
|
||||||
|
"title": "前端控制",
|
||||||
|
"isLink": "",
|
||||||
|
"isHide": false,
|
||||||
|
"isKeepAlive": true,
|
||||||
|
"isAffix": false,
|
||||||
|
"isIframe": false,
|
||||||
|
"auth": [
|
||||||
|
"admin",
|
||||||
|
"test"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"children": [
|
||||||
|
{
|
||||||
|
"path": "/limits/frontEnd/page",
|
||||||
|
"name": "limitsFrontEndPage",
|
||||||
|
"component": "limits/frontEnd/page/index",
|
||||||
|
"meta": {
|
||||||
|
"title": "页面权限",
|
||||||
|
"isLink": "",
|
||||||
|
"isHide": false,
|
||||||
|
"isKeepAlive": true,
|
||||||
|
"isAffix": false,
|
||||||
|
"isIframe": false,
|
||||||
|
"auth": [
|
||||||
|
"admin",
|
||||||
|
"test"
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "/limits/frontEnd/btn",
|
||||||
|
"name": "limitsFrontEndBtn",
|
||||||
|
"component": "limits/frontEnd/btn/index",
|
||||||
|
"meta": {
|
||||||
|
"title": "按钮权限",
|
||||||
|
"isLink": "",
|
||||||
|
"isHide": false,
|
||||||
|
"isKeepAlive": true,
|
||||||
|
"isAffix": false,
|
||||||
|
"isIframe": false,
|
||||||
|
"auth": [
|
||||||
|
"admin",
|
||||||
|
"test"
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "/limits/backEnd",
|
||||||
|
"name": "limitsBackEnd",
|
||||||
|
"component": "layout/routerView/parent",
|
||||||
|
"meta": {
|
||||||
|
"title": "后端控制",
|
||||||
|
"isLink": "",
|
||||||
|
"isHide": false,
|
||||||
|
"isKeepAlive": true,
|
||||||
|
"isAffix": false,
|
||||||
|
"isIframe": false,
|
||||||
|
"auth": [
|
||||||
|
"admin",
|
||||||
|
"test"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"children": [
|
||||||
|
{
|
||||||
|
"path": "/limits/backEnd/page",
|
||||||
|
"name": "limitsBackEndEndPage",
|
||||||
|
"component": "limits/backEnd/page/index",
|
||||||
|
"meta": {
|
||||||
|
"title": "页面权限",
|
||||||
|
"isLink": "",
|
||||||
|
"isHide": false,
|
||||||
|
"isKeepAlive": true,
|
||||||
|
"isAffix": false,
|
||||||
|
"isIframe": false,
|
||||||
|
"auth": [
|
||||||
|
"admin",
|
||||||
|
"test"
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "/menu",
|
||||||
|
"name": "menu",
|
||||||
|
"component": "layout/routerView/parent",
|
||||||
|
"redirect": "/menu/menu1",
|
||||||
|
"meta": {
|
||||||
|
"title": "菜单嵌套",
|
||||||
|
"isLink": "",
|
||||||
|
"isHide": false,
|
||||||
|
"isKeepAlive": true,
|
||||||
|
"isAffix": false,
|
||||||
|
"isIframe": false,
|
||||||
|
"auth": [
|
||||||
|
"admin",
|
||||||
|
"test"
|
||||||
|
],
|
||||||
|
"icon": "iconfonticon-caidan"
|
||||||
|
},
|
||||||
|
"children": [
|
||||||
|
{
|
||||||
|
"path": "/menu/menu1",
|
||||||
|
"name": "menu1",
|
||||||
|
"component": "layout/routerView/parent",
|
||||||
|
"redirect": "/menu/menu1/menu11",
|
||||||
|
"meta": {
|
||||||
|
"title": "菜单1",
|
||||||
|
"isLink": "",
|
||||||
|
"isHide": false,
|
||||||
|
"isKeepAlive": true,
|
||||||
|
"isAffix": false,
|
||||||
|
"isIframe": false,
|
||||||
|
"auth": [
|
||||||
|
"admin",
|
||||||
|
"test"
|
||||||
|
],
|
||||||
|
"icon": "iconfonticon-caidan"
|
||||||
|
},
|
||||||
|
"children": [
|
||||||
|
{
|
||||||
|
"path": "/menu/menu1/menu11",
|
||||||
|
"name": "menu11",
|
||||||
|
"component": "menu/menu1/menu11/index",
|
||||||
|
"meta": {
|
||||||
|
"title": "菜单11",
|
||||||
|
"isLink": "",
|
||||||
|
"isHide": false,
|
||||||
|
"isKeepAlive": true,
|
||||||
|
"isAffix": false,
|
||||||
|
"isIframe": false,
|
||||||
|
"auth": [
|
||||||
|
"admin",
|
||||||
|
"test"
|
||||||
|
],
|
||||||
|
"icon": "iconfonticon-caidan"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "/menu/menu1/menu12",
|
||||||
|
"name": "menu12",
|
||||||
|
"component": "layout/routerView/parent",
|
||||||
|
"redirect": "/menu/menu1/menu12/menu121",
|
||||||
|
"meta": {
|
||||||
|
"title": "菜单12",
|
||||||
|
"isLink": "",
|
||||||
|
"isHide": false,
|
||||||
|
"isKeepAlive": true,
|
||||||
|
"isAffix": false,
|
||||||
|
"isIframe": false,
|
||||||
|
"auth": [
|
||||||
|
"admin",
|
||||||
|
"test"
|
||||||
|
],
|
||||||
|
"icon": "iconfonticon-caidan"
|
||||||
|
},
|
||||||
|
"children": [
|
||||||
|
{
|
||||||
|
"path": "/menu/menu1/menu12/menu121",
|
||||||
|
"name": "menu121",
|
||||||
|
"component": "menu/menu1/menu12/menu121/index",
|
||||||
|
"meta": {
|
||||||
|
"title": "菜单121",
|
||||||
|
"isLink": "",
|
||||||
|
"isHide": false,
|
||||||
|
"isKeepAlive": true,
|
||||||
|
"isAffix": false,
|
||||||
|
"isIframe": false,
|
||||||
|
"auth": [
|
||||||
|
"admin",
|
||||||
|
"test"
|
||||||
|
],
|
||||||
|
"icon": "iconfonticon-caidan"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "/menu/menu1/menu12/menu122",
|
||||||
|
"name": "menu122",
|
||||||
|
"component": "menu/menu1/menu12/menu122/index",
|
||||||
|
"meta": {
|
||||||
|
"title": "菜单122",
|
||||||
|
"isLink": "",
|
||||||
|
"isHide": false,
|
||||||
|
"isKeepAlive": true,
|
||||||
|
"isAffix": false,
|
||||||
|
"isIframe": false,
|
||||||
|
"auth": [
|
||||||
|
"admin",
|
||||||
|
"test"
|
||||||
|
],
|
||||||
|
"icon": "iconfonticon-caidan"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "/menu/menu1/menu13",
|
||||||
|
"name": "menu13",
|
||||||
|
"component": "menu/menu1/menu13/index",
|
||||||
|
"meta": {
|
||||||
|
"title": "菜单13",
|
||||||
|
"isLink": "",
|
||||||
|
"isHide": false,
|
||||||
|
"isKeepAlive": true,
|
||||||
|
"isAffix": false,
|
||||||
|
"isIframe": false,
|
||||||
|
"auth": [
|
||||||
|
"admin",
|
||||||
|
"test"
|
||||||
|
],
|
||||||
|
"icon": "iconfonticon-caidan"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "/menu/menu2",
|
||||||
|
"name": "menu2",
|
||||||
|
"component": "menu/menu2/index",
|
||||||
|
"meta": {
|
||||||
|
"title": "菜单2",
|
||||||
|
"isLink": "",
|
||||||
|
"isHide": false,
|
||||||
|
"isKeepAlive": true,
|
||||||
|
"isAffix": false,
|
||||||
|
"isIframe": false,
|
||||||
|
"auth": [
|
||||||
|
"admin",
|
||||||
|
"test"
|
||||||
|
],
|
||||||
|
"icon": "iconfonticon-caidan"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "/fun",
|
||||||
|
"name": "funIndex",
|
||||||
|
"component": "layout/routerView/parent",
|
||||||
|
"redirect": "/fun/tagsView",
|
||||||
|
"meta": {
|
||||||
|
"title": "功能",
|
||||||
|
"isLink": "",
|
||||||
|
"isHide": false,
|
||||||
|
"isKeepAlive": true,
|
||||||
|
"isAffix": false,
|
||||||
|
"isIframe": false,
|
||||||
|
"auth": [
|
||||||
|
"admin",
|
||||||
|
"test"
|
||||||
|
],
|
||||||
|
"icon": "iconfonticon-crew_feature"
|
||||||
|
},
|
||||||
|
"children": [
|
||||||
|
{
|
||||||
|
"path": "/fun/tagsView",
|
||||||
|
"name": "funTagsView",
|
||||||
|
"component": "fun/tagsView/index",
|
||||||
|
"meta": {
|
||||||
|
"title": "tagsView操作",
|
||||||
|
"isLink": "",
|
||||||
|
"isHide": false,
|
||||||
|
"isKeepAlive": true,
|
||||||
|
"isAffix": false,
|
||||||
|
"isIframe": false,
|
||||||
|
"auth": [
|
||||||
|
"admin",
|
||||||
|
"test"
|
||||||
|
],
|
||||||
|
"icon": "el-icon-thumb"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "/pages",
|
||||||
|
"name": "pagesIndex",
|
||||||
|
"component": "pages/index",
|
||||||
|
"meta": {
|
||||||
|
"title": "页面",
|
||||||
|
"isLink": "",
|
||||||
|
"isHide": false,
|
||||||
|
"isKeepAlive": true,
|
||||||
|
"isAffix": false,
|
||||||
|
"isIframe": false,
|
||||||
|
"auth": [
|
||||||
|
"admin",
|
||||||
|
"test"
|
||||||
|
],
|
||||||
|
"icon": "iconfonticon-fuzhiyemian"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "/chart",
|
||||||
|
"name": "chartIndex",
|
||||||
|
"component": "chart/index",
|
||||||
|
"meta": {
|
||||||
|
"title": "大数据图表",
|
||||||
|
"isLink": "",
|
||||||
|
"isHide": false,
|
||||||
|
"isKeepAlive": true,
|
||||||
|
"isAffix": false,
|
||||||
|
"isIframe": false,
|
||||||
|
"auth": [
|
||||||
|
"admin",
|
||||||
|
"test"
|
||||||
|
],
|
||||||
|
"icon": "iconfonticon-ico_shuju"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
@ -1,9 +1,10 @@
|
|||||||
|
import { defineAsyncComponent } from 'vue'
|
||||||
import { createRouter, createWebHashHistory, RouteRecordRaw } from "vue-router"
|
import { createRouter, createWebHashHistory, RouteRecordRaw } from "vue-router"
|
||||||
import NProgress from 'nprogress';
|
import NProgress from 'nprogress';
|
||||||
import 'nprogress/nprogress.css';
|
import 'nprogress/nprogress.css';
|
||||||
import { store } from "/@/store/index.ts"
|
import { store } from "/@/store/index.ts"
|
||||||
import { getSession, clearSession } from "/@/utils/storage.ts"
|
import { getSession, clearSession } from "/@/utils/storage.ts"
|
||||||
import { getMenuAdmin } from '/@/api/menu/index.ts'
|
import { getMenuAdmin, getMenuTest } from '/@/api/menu/index.ts'
|
||||||
|
|
||||||
// 定义动态路由
|
// 定义动态路由
|
||||||
export const dynamicRoutes = [
|
export const dynamicRoutes = [
|
||||||
@ -473,11 +474,31 @@ const router = createRouter({
|
|||||||
// console.log(dynamicRoutes)
|
// console.log(dynamicRoutes)
|
||||||
// store.dispatch('setBackEndControlRoutes', 'admin')
|
// store.dispatch('setBackEndControlRoutes', 'admin')
|
||||||
export function getBackEndControlRoutes() {
|
export function getBackEndControlRoutes() {
|
||||||
getMenuAdmin().then((res: any) => {
|
getMenuTest().then((res: any) => {
|
||||||
console.log(res);
|
console.log(JSON.parse(JSON.stringify(res)));
|
||||||
|
console.log(backEndRouter(res.data))
|
||||||
|
dynamicRoutes[0].children = backEndRouter(res.data)
|
||||||
|
console.log(dynamicRoutes)
|
||||||
|
// initAllFun()
|
||||||
|
store.dispatch('setUserInfos')
|
||||||
|
setAddRoute() // 添加动态路由
|
||||||
|
setFilterMenu() // 过滤权限菜单
|
||||||
|
setCacheTagsViewRoutes() // 添加 keepAlive 缓存
|
||||||
|
console.log(router.getRoutes())
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 后端控制路由，递归处理每一项 `component` 中的路径
|
||||||
|
export function backEndRouter(routes: any) {
|
||||||
|
if (!routes) return false
|
||||||
|
return routes.map((v: any) => {
|
||||||
|
// if (v.component) v.component = () => import(`/@/views/${v.component}.vue`)
|
||||||
|
if (v.component) v.component = () => import(v.component)
|
||||||
|
if (v.children) v.children = backEndRouter(v.children)
|
||||||
|
return v
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
// 多级嵌套数组处理成一维数组
|
// 多级嵌套数组处理成一维数组
|
||||||
export function formatFlatteningRoutes(arr: any) {
|
export function formatFlatteningRoutes(arr: any) {
|
||||||
if (arr.length < 0) return false
|
if (arr.length < 0) return false
|
||||||
|
|||||||
@ -50,7 +50,7 @@ service.interceptors.response.use(
|
|||||||
} else if (error.message == "Network Error") {
|
} else if (error.message == "Network Error") {
|
||||||
ElMessage.error("网络连接错误");
|
ElMessage.error("网络连接错误");
|
||||||
} else {
|
} else {
|
||||||
if (error.response.data) ElMessage.error(error.response.data.message)
|
if (error.response.data) ElMessage.error(error.response.statusText)
|
||||||
else ElMessage.error('接口路径找不到')
|
else ElMessage.error('接口路径找不到')
|
||||||
}
|
}
|
||||||
return Promise.reject(error);
|
return Promise.reject(error);
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user