From 296fff25a53310189ef2d4290febe9b8f227a3e0 Mon Sep 17 00:00:00 2001 From: zheng Date: Sat, 6 May 2023 16:37:56 +0800 Subject: [PATCH 1/2] =?UTF-8?q?style:=20=E9=A6=96=E9=A1=B5=E9=AB=98?= =?UTF-8?q?=E5=88=86=E8=BE=A8=E7=8E=87=E4=B8=8B=E5=87=BA=E7=8E=B0=E7=A9=BA?= =?UTF-8?q?=E7=99=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- examples/website/src/components/Layouts/index/index.tsx | 2 +- examples/website/src/components/Layouts/index/style.ts | 6 +++++- 2 files changed, 6 insertions(+), 2 deletions(-) diff --git a/examples/website/src/components/Layouts/index/index.tsx b/examples/website/src/components/Layouts/index/index.tsx index c02f581ba..74d4a036e 100644 --- a/examples/website/src/components/Layouts/index/index.tsx +++ b/examples/website/src/components/Layouts/index/index.tsx @@ -22,7 +22,7 @@ export default function Layout(props: KktproPageProps) { algorithm: data_theme === 'dark' ? theme.darkAlgorithm : theme.defaultAlgorithm, }} > -
+
{pathname === '/home' ? (
diff --git a/examples/website/src/components/Layouts/index/style.ts b/examples/website/src/components/Layouts/index/style.ts index 4d854303d..f13785e7e 100644 --- a/examples/website/src/components/Layouts/index/style.ts +++ b/examples/website/src/components/Layouts/index/style.ts @@ -5,12 +5,16 @@ export const Wrapper = styled.div` height: 100%; `; -export const Main = styled.main` +export const Main = styled.main<{ isHome?: boolean }>` box-sizing: border-box; display: block; height: 100%; overflow: auto; scroll-behavior: smooth; + + ${(props) => props.isHome && ` + background-color: var(--home-background-color); + `} `; export const Body = styled.div` From ef8b52b1dcd8d63ff5d012baad29602765651b20 Mon Sep 17 00:00:00 2001 From: zheng Date: Thu, 8 Jun 2023 16:06:40 +0800 Subject: [PATCH 2/2] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E8=B7=AF=E7=94=B1?= =?UTF-8?q?=E6=B2=A1=E6=9D=83=E9=99=90=E8=B7=B3=E8=BD=AC=E6=8A=A5=E9=94=99?= =?UTF-8?q?=E9=97=AE=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/basic-layouts/src/interface.ts | 10 ++- packages/basic-layouts/src/utils.tsx | 100 +++++++++++++++--------- 2 files changed, 68 insertions(+), 42 deletions(-) diff --git a/packages/basic-layouts/src/interface.ts b/packages/basic-layouts/src/interface.ts index 725ffb11b..29144dfa4 100644 --- a/packages/basic-layouts/src/interface.ts +++ b/packages/basic-layouts/src/interface.ts @@ -1,6 +1,6 @@ import React from 'react'; import { IntlShape } from 'react-intl/lib/src/types'; -import { ConfigProviderProps } from 'antd/es/config-provider' +import { ConfigProviderProps } from 'antd/es/config-provider' export interface HandleMenuProps { /**语言转换*/ @@ -31,6 +31,8 @@ export interface RouterMenu { /**原来的path*/ oPath?: string; element?: any; + id?: string; + parentId?: string; } export interface BasicLayoutsProps { @@ -74,9 +76,9 @@ export interface BasicLayoutsProps { */ name?: string; }; - theme?:'dark' | 'light'; - configProviderProps?:ConfigProviderProps; - className?:string; + theme?: 'dark' | 'light'; + configProviderProps?: ConfigProviderProps; + className?: string; } export interface UseLayoutsProps extends Omit { diff --git a/packages/basic-layouts/src/utils.tsx b/packages/basic-layouts/src/utils.tsx index 12eb9f4ef..8b4706500 100644 --- a/packages/basic-layouts/src/utils.tsx +++ b/packages/basic-layouts/src/utils.tsx @@ -7,7 +7,7 @@ import { IntlShape } from "react-intl/lib/src/types" /** - * + * * 1. 对路由权限进行判定 * 2. 保存每个子集对应的父级 * 3. 父级链 @@ -90,32 +90,26 @@ export class HandleMenu { * 1. 权限处理 * 1. 子集全部没权限，父级也没有权限 * 2. 子集存在权限，父级也存在权限 - * 3. 没有权限的自动把 path 转换成 403 + * 3. 没有权限的自动把 path 转换成 403 * */ initAuth(routers: RouterMenu[], isParent = false) { - let child: RouterMenu[] = [] - routers.sort(it => Number(it.order || 0)).forEach((item) => { - const { routes } = item - const newItem = { ...item } - if (Array.isArray(routes)) { - newItem.routes = this.initAuth(routes, true) - } - const check = this.checkAuth(item.path || "") - if (!check && item.path) { - const { element:Comp } = routers.find(item=>item.path === '/403') || {} - item.oPath = item.path - item.element = Comp || null - item.path = "/403" - } else { - child.push({ ...item }) - } - - if (!isParent) { - this.checkAuthMenus.push({ ...item }) - } - }) - return child + let child: RouterMenu[] = []; + routers + .sort((it) => Number(it.order || 0)) + .forEach((item) => { + const { routes } = item; + const newItem = { ...item }; + if (Array.isArray(routes)) { + newItem.routes = this.initAuth(routes, true); + } + if (!isParent) { + this.checkAuthMenus.push({ ...item }); + } + child.push(newItem); + }); + return child; } + /** * 2. 国际化翻译 * */ @@ -227,30 +221,60 @@ export class HandleMenu { /**8. 获取父级path*/ getParentPath(path: string) { - const parentPath = this.childParent.get(path) || "/" - return parentPath + const parentPath = this.childParent.get(path) || '/'; + return parentPath; + } + + // 查询所有父节点和自己是否有权限 + getCheckAuthAll(path: string) { + const node = this.flatAllMenu.find((item) => item.path === path); + if (!node) { + return false; + } + const pathList: string[] = []; + let currentNode: RouterMenu | undefined = node; + while (currentNode) { + pathList.push(currentNode.path || ''); + currentNode = this.flatAllMenu.find((item) => item.id === currentNode?.parentId); + } + let hasPermission = true; // 假设有权限 + // 从最上层父节点开始逐一判断权限 + for (let i = pathList.length - 1; i >= 0; i--) { + const p = pathList[i]; + if (!this.checkAuth(p)) { + hasPermission = false; + break; + } + } + return hasPermission; } /**9. 获取跳转地址*/ getToPath(path: string) { // 1. 先判断是不是 side === true - const currentItem = this.flatAllMenu.find(item => item.path === path) - if (currentItem?.path === "/") { - this.preParentPath = "" - this.prePath = currentItem.redirectTo - return currentItem.redirectTo + const currentItem = this.flatAllMenu.find((item) => item.path === path); + if (currentItem?.path === '/') { + this.preParentPath = ''; + this.prePath = currentItem.redirectTo; + return currentItem.redirectTo; } if (!currentItem) { - this.preParentPath = "" - if (this.prePath === "/404") { + this.preParentPath = '' + if (this.prePath === '/404') { return false } - this.prePath = "/404" - return "/404" + this.prePath = '/404' + return '/404' + } + // 查询所有父节点和自己是否有权限 + if (!this.getCheckAuthAll(currentItem?.path || '')) { + this.prePath = '/403'; + this.preParentPath = ''; + return '/403'; } if (!currentItem?.side) { - this.prePath = currentItem.path || "" - this.preParentPath = "" + this.prePath = currentItem.path || '' + this.preParentPath = '' return false } if (this.preParentPath === currentItem.path) { @@ -259,7 +283,7 @@ export class HandleMenu { } this.preParentPath = currentItem.path const siderMenus = this.childMenu.get(path) - const findx = siderMenus?.find(item => item.index || item.redirectTo) + const findx = siderMenus?.find((item) => item.index || item.redirectTo) const current = findx?.path || findx?.redirectTo if (this.prePath === current) { return false