移除use-permission多余方法,移动MenuIcon文件
This commit is contained in:
parent
30941f2433
commit
e072be8dcb
|
@ -1,154 +1,15 @@
|
||||||
import NProgress from 'nprogress'
|
import NProgress from 'nprogress'
|
||||||
import type { RouteRawConfig, RouterTypes, rawConfig } from '~/basic'
|
|
||||||
import type { RouteRecordName } from 'vue-router'
|
import type { RouteRecordName } from 'vue-router'
|
||||||
/**
|
|
||||||
* 根据请求,过滤异步路由
|
|
||||||
* @param:menuList 异步路由数组
|
|
||||||
* return 过滤后的异步路由
|
|
||||||
*/
|
|
||||||
// @ts-ignore
|
|
||||||
import Layout from '@/layout/index.vue'
|
import Layout from '@/layout/index.vue'
|
||||||
/*
|
|
||||||
* 路由操作
|
|
||||||
* */
|
|
||||||
import router, { asyncRoutes, constantRoutes } from '@/router'
|
import router, { asyncRoutes, constantRoutes } from '@/router'
|
||||||
//进度条
|
|
||||||
import 'nprogress/nprogress.css'
|
import 'nprogress/nprogress.css'
|
||||||
import { useBasicStore } from '@/store/basic'
|
import { useBasicStore } from '@/store/basic'
|
||||||
import { isArray } from 'xe-utils'
|
import { isArray } from 'xe-utils'
|
||||||
|
|
||||||
const buttonCodes: Array<Number> = [] //按钮权限
|
//从数据库设置文本路由
|
||||||
interface menuRow {
|
export function setRouterFromDatabase(menuList) {
|
||||||
category: number
|
|
||||||
code: number
|
|
||||||
children: RouterTypes
|
|
||||||
}
|
|
||||||
export const filterAsyncRoutesByMenuList = (menuList) => {
|
|
||||||
const filterRouter: RouterTypes = []
|
|
||||||
menuList.forEach((route: menuRow) => {
|
|
||||||
//button permission
|
|
||||||
if (route.category === 3) {
|
|
||||||
buttonCodes.push(route.code)
|
|
||||||
} else {
|
|
||||||
//generator every router item by menuList
|
|
||||||
const itemFromReqRouter = getRouteItemFromReqRouter(route)
|
|
||||||
if (route.children?.length) {
|
|
||||||
//judge the type is router or button
|
|
||||||
itemFromReqRouter.children = filterAsyncRoutesByMenuList(route.children)
|
|
||||||
}
|
|
||||||
filterRouter.push(itemFromReqRouter)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
return filterRouter
|
|
||||||
}
|
|
||||||
const getRouteItemFromReqRouter = (route): RouteRawConfig => {
|
|
||||||
const tmp: rawConfig = { meta: { title: '' } }
|
|
||||||
const routeKeyArr = ['path', 'component', 'redirect', 'alwaysShow', 'name', 'hidden']
|
|
||||||
const metaKeyArr = ['title', 'activeMenu', 'elSvgIcon', 'icon']
|
|
||||||
// @ts-ignore
|
|
||||||
const modules = import.meta.glob('../views/**/**.vue')
|
|
||||||
//generator routeKey
|
|
||||||
routeKeyArr.forEach((fItem) => {
|
|
||||||
if (fItem === 'component') {
|
|
||||||
if (route[fItem] === 'Layout') {
|
|
||||||
tmp[fItem] = Layout
|
|
||||||
} else {
|
|
||||||
//has error , i will fix it through plugins
|
|
||||||
//tmp[fItem] = () => import(`@/views/permission-center/test/TestTableQuery.vue`)
|
|
||||||
tmp[fItem] = modules[`../views/${route[fItem]}`]
|
|
||||||
}
|
|
||||||
} else if (fItem === 'path' && route.parentId === 0) {
|
|
||||||
tmp[fItem] = `/${route[fItem]}`
|
|
||||||
} else if (['hidden', 'alwaysShow'].includes(fItem)) {
|
|
||||||
tmp[fItem] = !!route[fItem]
|
|
||||||
} else if (['name'].includes(fItem)) {
|
|
||||||
tmp[fItem] = route['code']
|
|
||||||
} else if (route[fItem]) {
|
|
||||||
tmp[fItem] = route[fItem]
|
|
||||||
}
|
|
||||||
})
|
|
||||||
//generator metaKey
|
|
||||||
metaKeyArr.forEach((fItem) => {
|
|
||||||
if (route[fItem] && tmp.meta) tmp.meta[fItem] = route[fItem]
|
|
||||||
})
|
|
||||||
//route extra insert
|
|
||||||
if (route.extra) {
|
|
||||||
Object.entries(route.extra.parse(route.extra)).forEach(([key, value]) => {
|
|
||||||
if (key === 'meta' && tmp.meta) {
|
|
||||||
tmp.meta[key] = value
|
|
||||||
} else {
|
|
||||||
tmp[key] = value
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
return tmp as RouteRawConfig
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 根据角色数组过滤异步路由
|
|
||||||
* @param routes asyncRoutes 未过滤的异步路由
|
|
||||||
* @param roles 角色数组
|
|
||||||
* return 过滤后的异步路由
|
|
||||||
*/
|
|
||||||
export function filterAsyncRoutesByRoles(routes, roles) {
|
|
||||||
const res: RouterTypes = []
|
|
||||||
routes.forEach((route) => {
|
|
||||||
const tmp: RouteRawConfig = { ...route }
|
|
||||||
if (hasPermission(roles, tmp)) {
|
|
||||||
if (tmp.children) {
|
|
||||||
tmp.children = filterAsyncRoutesByRoles(tmp.children, roles)
|
|
||||||
}
|
|
||||||
res.push(tmp)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
return res
|
|
||||||
}
|
|
||||||
function hasPermission(roles, route) {
|
|
||||||
if (route?.meta?.roles) {
|
|
||||||
return roles?.some((role) => route.meta.roles.includes(role))
|
|
||||||
} else {
|
|
||||||
return true
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 根据code数组,过滤异步路由
|
|
||||||
* @param codes code数组
|
|
||||||
* @param codesRoutes 未过滤的异步路由
|
|
||||||
* return 过滤后的异步路由
|
|
||||||
*/
|
|
||||||
export function filterAsyncRouterByCodes(codesRoutes, codes) {
|
|
||||||
const filterRouter: RouterTypes = []
|
|
||||||
codesRoutes.forEach((routeItem: RouteRawConfig) => {
|
|
||||||
if (hasCodePermission(codes, routeItem)) {
|
|
||||||
if (routeItem.children) routeItem.children = filterAsyncRouterByCodes(routeItem.children, codes)
|
|
||||||
filterRouter.push(routeItem)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
return filterRouter
|
|
||||||
}
|
|
||||||
function hasCodePermission(codes, routeItem) {
|
|
||||||
if (routeItem.meta?.code) {
|
|
||||||
return codes.includes(routeItem.meta.code) || routeItem.hidden
|
|
||||||
} else {
|
|
||||||
return true
|
|
||||||
}
|
|
||||||
}
|
|
||||||
//过滤异步路由
|
|
||||||
export function filterAsyncRouter({ menuList, roles, codes }: { menuList; roles?; codes? }) {
|
|
||||||
const basicStore = useBasicStore()
|
const basicStore = useBasicStore()
|
||||||
const accessRoutes = menuList
|
const accessRoutes = menuList
|
||||||
// 与项目兼容,移除权限筛选部分,这一部分在公司项目中为后端处理。
|
|
||||||
|
|
||||||
// let accessRoutes: RouterTypes = []
|
|
||||||
// const permissionMode = basicStore.settings?.permissionMode
|
|
||||||
// if (permissionMode === 'rbac') {
|
|
||||||
// accessRoutes = filterAsyncRoutesByMenuList(menuList) //by menuList
|
|
||||||
// } else if (permissionMode === 'roles') {
|
|
||||||
// accessRoutes = filterAsyncRoutesByRoles(roleCodeRoutes, roles) //by roles
|
|
||||||
// } else {
|
|
||||||
// accessRoutes = filterAsyncRouterByCodes(roleCodeRoutes, codes) //by codes
|
|
||||||
// }
|
|
||||||
|
|
||||||
// @ts-ignore
|
// @ts-ignore
|
||||||
const views = import.meta.glob('../views/**/*.vue') as Record<string, () => Promise<Component>>
|
const views = import.meta.glob('../views/**/*.vue') as Record<string, () => Promise<Component>>
|
||||||
|
@ -164,7 +25,8 @@ export function filterAsyncRouter({ menuList, roles, codes }: { menuList; roles?
|
||||||
item.component = async () => {
|
item.component = async () => {
|
||||||
let component
|
let component
|
||||||
try {
|
try {
|
||||||
component = await views[url]()
|
component = await views[url]?.()
|
||||||
|
if (!component) throw new Error(`找不到文件${url}`)
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
console.error(e)
|
console.error(e)
|
||||||
component = await import('../views/error-page/404.vue')
|
component = await import('../views/error-page/404.vue')
|
||||||
|
@ -175,11 +37,13 @@ export function filterAsyncRouter({ menuList, roles, codes }: { menuList; roles?
|
||||||
if (isArray(item.children)) scanRouter(item.children)
|
if (isArray(item.children)) scanRouter(item.children)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
scanRouter(accessRoutes)
|
scanRouter(accessRoutes)
|
||||||
accessRoutes.forEach((route) => router.addRoute(route))
|
accessRoutes.forEach((route) => router.addRoute(route))
|
||||||
asyncRoutes.forEach((item) => router.addRoute(item))
|
asyncRoutes.forEach((item) => router.addRoute(item))
|
||||||
basicStore.setFilterAsyncRoutes(accessRoutes)
|
basicStore.setFilterAsyncRoutes(accessRoutes)
|
||||||
}
|
}
|
||||||
|
|
||||||
//重置路由
|
//重置路由
|
||||||
export function resetRouter() {
|
export function resetRouter() {
|
||||||
//移除之前存在的路由
|
//移除之前存在的路由
|
||||||
|
@ -191,6 +55,7 @@ export function resetRouter() {
|
||||||
//新增constantRoutes
|
//新增constantRoutes
|
||||||
constantRoutes.forEach((feItem) => router.addRoute(feItem))
|
constantRoutes.forEach((feItem) => router.addRoute(feItem))
|
||||||
}
|
}
|
||||||
|
|
||||||
//重置登录状态
|
//重置登录状态
|
||||||
export function resetState() {
|
export function resetState() {
|
||||||
resetRouter()
|
resetRouter()
|
||||||
|
@ -200,8 +65,7 @@ export function resetState() {
|
||||||
//刷新路由
|
//刷新路由
|
||||||
export function freshRouter(data) {
|
export function freshRouter(data) {
|
||||||
resetRouter()
|
resetRouter()
|
||||||
filterAsyncRouter(data)
|
setRouterFromDatabase(data)
|
||||||
// location.reload()
|
|
||||||
}
|
}
|
||||||
|
|
||||||
NProgress.configure({ showSpinner: false })
|
NProgress.configure({ showSpinner: false })
|
||||||
|
|
|
@ -14,7 +14,7 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import MenuIcon from "@/layout/sidebar/MenuIcon.vue";
|
import MenuIcon from "@/components/MenuIcon.vue";
|
||||||
import { useDebuggerStore } from "@/store/debuger";
|
import { useDebuggerStore } from "@/store/debuger";
|
||||||
|
|
||||||
const store = useDebuggerStore()
|
const store = useDebuggerStore()
|
||||||
|
|
|
@ -28,7 +28,7 @@
|
||||||
import { ref } from 'vue'
|
import { ref } from 'vue'
|
||||||
import { resolve } from 'path-browserify'
|
import { resolve } from 'path-browserify'
|
||||||
import Link from './Link.vue'
|
import Link from './Link.vue'
|
||||||
import MenuIcon from './MenuIcon.vue'
|
import MenuIcon from '../../components/MenuIcon.vue'
|
||||||
import type { RouteRawConfig } from '~/basic'
|
import type { RouteRawConfig } from '~/basic'
|
||||||
import { isExternal } from '@/hooks/use-layout'
|
import { isExternal } from '@/hooks/use-layout'
|
||||||
import { langTitle } from '@/hooks/use-common'
|
import { langTitle } from '@/hooks/use-common'
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
import router from '@/router'
|
import router from '@/router'
|
||||||
import { filterAsyncRouter, progressClose, progressStart } from '@/hooks/use-permission'
|
import { progressClose, progressStart, setRouterFromDatabase } from '@/hooks/use-permission'
|
||||||
import { useBasicStore } from '@/store/basic'
|
import { useBasicStore } from '@/store/basic'
|
||||||
import { getMyInfo, getMyRole } from '@/api/user'
|
import { getMyInfo, getMyRole } from '@/api/user'
|
||||||
import { langTitle } from '@/hooks/use-common'
|
import { langTitle } from '@/hooks/use-common'
|
||||||
|
@ -26,7 +26,7 @@ router.beforeEach(async (to) => {
|
||||||
const [userData, userRole] = await Promise.all([getMyInfo(), getMyRole()])
|
const [userData, userRole] = await Promise.all([getMyInfo(), getMyRole()])
|
||||||
const routes = await getRouterList({ roleId: userRole.roleId })
|
const routes = await getRouterList({ roleId: userRole.roleId })
|
||||||
//3.动态路由权限筛选
|
//3.动态路由权限筛选
|
||||||
filterAsyncRouter({ menuList: routes })
|
setRouterFromDatabase(routes)
|
||||||
//4.保存用户信息到store
|
//4.保存用户信息到store
|
||||||
basicStore.setUserInfo({
|
basicStore.setUserInfo({
|
||||||
userInfo: userData,
|
userInfo: userData,
|
||||||
|
@ -37,7 +37,6 @@ router.beforeEach(async (to) => {
|
||||||
return { ...to, replace: true }
|
return { ...to, replace: true }
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
console.error(`route permission error${e}`)
|
console.error(`route permission error${e}`)
|
||||||
basicStore.resetState()
|
|
||||||
progressClose()
|
progressClose()
|
||||||
return `/500?redirect=${to.path}`
|
return `/500?redirect=${to.path}`
|
||||||
}
|
}
|
||||||
|
|
|
@ -79,7 +79,7 @@
|
||||||
import { doDelete, getList } from "@/api/userManagement";
|
import { doDelete, getList } from "@/api/userManagement";
|
||||||
import Edit from "./components/UserManagementEdit.vue";
|
import Edit from "./components/UserManagementEdit.vue";
|
||||||
import { sha1 } from "hash.js";
|
import { sha1 } from "hash.js";
|
||||||
import MenuIcon from "@/layout/sidebar/MenuIcon.vue";
|
import MenuIcon from "@/components/MenuIcon.vue";
|
||||||
import { ElMessage, ElMessageBox } from "element-plus";
|
import { ElMessage, ElMessageBox } from "element-plus";
|
||||||
import RightNavSearchInput from "@/views/system/userManagement/components/RightNavSearchInput.vue";
|
import RightNavSearchInput from "@/views/system/userManagement/components/RightNavSearchInput.vue";
|
||||||
import { useSystemStore } from "@/store/system";
|
import { useSystemStore } from "@/store/system";
|
||||||
|
|
|
@ -38,7 +38,6 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import AvatarEdit from "@/views/user/profile/components/AvatarEditor.vue";
|
import AvatarEdit from "@/views/user/profile/components/AvatarEditor.vue";
|
||||||
import UserImage from "@/assets/layout/user.png";
|
import UserImage from "@/assets/layout/user.png";
|
||||||
import MenuIcon from "@/components/MenuIcon.vue";
|
|
||||||
|
|
||||||
const showAvatarEditor = ref(false);
|
const showAvatarEditor = ref(false);
|
||||||
const userInfo = toRef(useBasicStore(), "userInfo");
|
const userInfo = toRef(useBasicStore(), "userInfo");
|
||||||
|
|
Loading…
Reference in New Issue
Block a user