From 9e471eafa7a1ed62db9c6ccc7c2e2dbc218e5bf1 Mon Sep 17 00:00:00 2001 From: jialin Date: Sun, 23 Jun 2024 21:30:20 +0800 Subject: [PATCH] fix: redirect default path after login --- config/routes.ts | 16 ++++++++-------- src/access.ts | 6 ++++-- src/app.tsx | 23 ++++++++++++++++++++++- src/config/global.d.ts | 7 +++++++ src/layouts/index.tsx | 29 ++++++++++++----------------- src/layouts/runtime.tsx | 23 +++++++++++++---------- src/pages/users/index.tsx | 1 + 7 files changed, 67 insertions(+), 38 deletions(-) diff --git a/config/routes.ts b/config/routes.ts index 6417ac85..be958a4a 100644 --- a/config/routes.ts +++ b/config/routes.ts @@ -1,17 +1,16 @@ export default [ - { - path: '/', - key: 'dashboard', - layout: false, - icon: 'home', - redirect: '/dashboard', - access: 'canLogin' - }, + // { + // path: '/', + // key: 'root', + // icon: 'home', + // redirect: '' + // }, { name: 'Dashboard', path: '/dashboard', key: 'dashboard', icon: 'home', + access: 'canSeeAdmin', component: './dashboard' }, { @@ -48,6 +47,7 @@ export default [ path: '/users', key: 'users', icon: 'Team', + access: 'canSeeAdmin', component: './users' }, { diff --git a/src/access.ts b/src/access.ts index 340d990a..5c62fd95 100644 --- a/src/access.ts +++ b/src/access.ts @@ -1,8 +1,10 @@ -export default (initialState: API.UserInfo) => { +export default (initialState: { currentUser?: Global.UserInfo }) => { // 在这里按照初始化数据定义项目中的权限,统一管理 // 参考文档 https://umijs.org/docs/max/access const canSeeAdmin = !!( - initialState && initialState.name !== 'dontHaveAccess' + initialState && + initialState.currentUser && + initialState.currentUser.is_admin ); return { canSeeAdmin, diff --git a/src/app.tsx b/src/app.tsx index 7ebe2662..0864d80b 100644 --- a/src/app.tsx +++ b/src/app.tsx @@ -1,8 +1,10 @@ -import { RequestConfig, history } from '@umijs/max'; +import { Navigate, RequestConfig, history } from '@umijs/max'; import { requestConfig } from './request-config'; import { queryCurrentUserState } from './services/profile/apis'; const loginPath = '/login'; +let currentUserInfo: any = {}; + // 运行时配置 // 全局初始化数据配置,用于 Layout 用户信息和权限初始化 @@ -25,6 +27,9 @@ export async function getInitialState() { if (![loginPath].includes(location.pathname)) { const userInfo = await fetchUserInfo(); + currentUserInfo = { + ...userInfo + }; return { fetchUserInfo, currentUser: userInfo @@ -35,6 +40,22 @@ export async function getInitialState() { }; } +export const patchClientRoutes = async (params: { routes: any[] }) => { + const { routes } = params; + const data = await queryCurrentUserState({ + skipErrorHandler: true + }); + + routes.unshift({ + path: '/', + element: data?.is_admin ? ( + + ) : ( + + ) + }); +}; + export const request: RequestConfig = { baseURL: ' /v1', ...requestConfig diff --git a/src/config/global.d.ts b/src/config/global.d.ts index 1109008e..dbd0ee81 100644 --- a/src/config/global.d.ts +++ b/src/config/global.d.ts @@ -13,4 +13,11 @@ declare namespace Global { perPage: number; }; } + + interface UserInfo { + username: string; + is_admin: boolean; + full_name: string; + id: number; + } } diff --git a/src/layouts/index.tsx b/src/layouts/index.tsx index a9f0a524..bf9582e9 100644 --- a/src/layouts/index.tsx +++ b/src/layouts/index.tsx @@ -96,15 +96,6 @@ export default (props: any) => { const formatMessage = undefined; - // const runtimeConfig = pluginManager.applyPlugins({ - // key: 'layout', - // type: 'modify', - // logout: true, - // initialValue: { - // ...initialInfo, - // notFound:
not found
- // } - // }); const runtimeConfig = { ...initialInfo, logout: async (userInfo) => { @@ -114,12 +105,6 @@ export default (props: any) => { }, notFound: 404 not found }; - console.log('clientRoute==========2=', { - props, - clientRoutes, - runtimeConfig, - initialInfo - }); // 现在的 layout 及 wrapper 实现是通过父路由的形式实现的, 会导致路由数据多了冗余层级, proLayout 消费时, 无法正确展示菜单, 这里对冗余数据进行过滤操作 const newRoutes = filterRoutes( @@ -131,15 +116,20 @@ export default (props: any) => { ); } ); + console.log('clientRoutes===========', clientRoutes, newRoutes); const [route] = useAccessMarkedRoutes(mapRoutes(newRoutes)); - patchRoutes({ routes: route?.children || [] }); + + patchRoutes({ + routes: route.children, + initialState: initialInfo.initialState + }); const matchedRoute = useMemo( () => matchRoutes(route?.children || [], location.pathname)?.pop?.()?.route, [location.pathname] ); - console.log('route===========', route); + console.log('route===========', matchedRoute, route); return (
@@ -160,6 +150,11 @@ export default (props: any) => { // 如果没有登录,重定向到 login if (!initialState?.currentUser && location.pathname !== loginPath) { history.push(loginPath); + } else if (location.path === '/') { + const pathname = initialState?.currentUser?.is_admin + ? '/dashboard' + : '/playground'; + history.push(pathname); } }} formatMessage={userConfig.formatMessage || formatMessage} diff --git a/src/layouts/runtime.tsx b/src/layouts/runtime.tsx index 447b4db7..2897fcfc 100644 --- a/src/layouts/runtime.tsx +++ b/src/layouts/runtime.tsx @@ -7,30 +7,33 @@ import icons from './icons'; function formatIcon(name: string) { return name .replace(name[0], name[0].toUpperCase()) - .replace(/-(w)/g, function(all, letter) { + .replace(/-(w)/g, function (all, letter) { return letter.toUpperCase(); }); } -export function patchRoutes({ routes }) { - console.log('patchRoutes====',routes) - Object.keys(routes).forEach(key => { +export function patchRoutes({ routes, initialState }) { + console.log('patchRoutes99999', routes); + Object.keys(routes).forEach((key) => { const { icon } = routes[key]; if (icon && typeof icon === 'string') { const upperIcon = formatIcon(icon); if (icons[upperIcon] || icons[upperIcon + 'Outlined']) { - routes[key].icon = React.createElement(icons[upperIcon] || icons[upperIcon + 'Outlined']); + routes[key].icon = React.createElement( + icons[upperIcon] || icons[upperIcon + 'Outlined'] + ); } } }); } -export function renderMenuIcon (icon: string){ - +export function renderMenuIcon(icon: string) { const upperIcon = formatIcon(icon); - console.log('upperIcon',upperIcon) + console.log('upperIcon', upperIcon); if (icons[upperIcon] || icons[upperIcon + 'Outlined']) { - return React.createElement(icons[upperIcon] || icons[upperIcon + 'Outlined']); + return React.createElement( + icons[upperIcon] || icons[upperIcon + 'Outlined'] + ); } return null; -}; +} diff --git a/src/pages/users/index.tsx b/src/pages/users/index.tsx index 58c4caa2..1b8ddb52 100644 --- a/src/pages/users/index.tsx +++ b/src/pages/users/index.tsx @@ -117,6 +117,7 @@ const Models: React.FC = () => { } else { await createUser({ data: params }); } + fetchData(); setOpenAddModal(false); message.success('successfully!'); } catch (error) {