From fdd80c6cd1e48437f8487107bd66473bd50ab3a3 Mon Sep 17 00:00:00 2001 From: francis-fh Date: Fri, 5 Jun 2026 13:58:56 +0800 Subject: [PATCH] 11 --- config/config.ts | 4 ++-- public/scripts/loading.js | 4 ++++ src/app.tsx | 42 +++++++++++++++------------------------ src/loading.less | 24 ++++++++++++++++++++++ src/loading.tsx | 21 ++++++++++++++++++++ src/utils/routeContext.ts | 19 ++++++++++++++++++ 6 files changed, 86 insertions(+), 28 deletions(-) create mode 100644 src/loading.less create mode 100644 src/loading.tsx create mode 100644 src/utils/routeContext.ts diff --git a/config/config.ts b/config/config.ts index 8b79e5c..4fd455f 100644 --- a/config/config.ts +++ b/config/config.ts @@ -124,8 +124,8 @@ export default defineConfig({ * @description 配置 中额外的 script */ headScripts: [ - // 解决首次加载时白屏的问题 - { src: '/shihezi/scripts/loading.js', async: true }, + // 同步执行，在 umi 主包解析前注入 #root 占位，避免首屏纯白 + { src: '/shihezi/scripts/loading.js' }, ], //================ pro 插件配置 ================= presets: ['umi-presets-pro'], diff --git a/public/scripts/loading.js b/public/scripts/loading.js index c1ced54..56f8612 100644 --- a/public/scripts/loading.js +++ b/public/scripts/loading.js @@ -14,6 +14,10 @@ margin: 0; padding: 0; } + body, + #root { + background-color: #f0f4f8; + } #root { background-repeat: no-repeat; background-size: 100% auto; diff --git a/src/app.tsx b/src/app.tsx index aecbe1d..477646a 100644 --- a/src/app.tsx +++ b/src/app.tsx @@ -10,6 +10,7 @@ import { exchangeThirdPartyCredential, isThirdPartyTransitionPage, } from './utils/thirdPartyLogin'; +import { shouldSkipManagementBootstrap } from './utils/routeContext'; import { saveGetInfoCache } from './utils/jobPortalAuth'; import { getRemoteMenu, @@ -73,19 +74,8 @@ export async function getInitialState(): Promise<{ } return undefined; }; - // 如果不是登录页面，执行 const { location } = history; - // 排除登录页面、过渡页面和求职者页面（考虑基础路径 /shihezi/） - const isTransitionPage = location.pathname === '/' || - location.pathname === '/login-tow' || - location.pathname === '/shihezi/' || - location.pathname === '/shihezi/login-tow'; - - // 排除求职者相关页面 - const isJobPortalPage = location.pathname.startsWith('/job-portal') || - location.pathname.startsWith('/shihezi/job-portal'); - - if (location.pathname !== PageEnum.LOGIN && !isTransitionPage && !isJobPortalPage) { + if (!shouldSkipManagementBootstrap(location.pathname)) { const currentUser = await fetchUserInfo(); return { fetchUserInfo, @@ -135,16 +125,10 @@ export const layout: RunTimeLayoutConfig = ({ initialState, setInitialState }) = onPageChange: () => { const { location } = history; // 如果没有登录，重定向到 login，但排除过渡页面和求职者页面（考虑基础路径 /shihezi/） - const isTransitionPage = location.pathname === '/' || - location.pathname === '/login-tow' || - location.pathname === '/shihezi/' || - location.pathname === '/shihezi/login-tow'; - - // 排除求职者相关页面 - const isJobPortalPage = location.pathname.startsWith('/job-portal') || - location.pathname.startsWith('/shihezi/job-portal'); - - if (!initialState?.currentUser && location.pathname !== PageEnum.LOGIN && !isTransitionPage && !isJobPortalPage) { + if ( + !initialState?.currentUser && + !shouldSkipManagementBootstrap(location.pathname) + ) { history.push(PageEnum.LOGIN); } }, @@ -205,11 +189,12 @@ export const layout: RunTimeLayoutConfig = ({ initialState, setInitialState }) = export async function onRouteChange({ clientRoutes, location }: { clientRoutes: any; location: any }) { const menus = getRemoteMenu(); - // console.log('onRouteChange', clientRoutes, location, menus); - - // 如果路由信息未加载，尝试重新获取路由信息 const token = getAccessToken(); - if (menus === null && location.pathname !== PageEnum.LOGIN && token) { + if ( + menus === null && + token && + !shouldSkipManagementBootstrap(location.pathname) + ) { console.log('检测到路由信息未加载，正在重新获取路由信息...'); // 重新获取路由信息，而不是刷新页面 @@ -248,6 +233,11 @@ export async function render(oldRender: () => void) { } } + if (shouldSkipManagementBootstrap(pathname)) { + oldRender(); + return; + } + const token = getAccessToken(); if (!token || token.length === 0) { oldRender(); diff --git a/src/loading.less b/src/loading.less new file mode 100644 index 0000000..ed61aa6 --- /dev/null +++ b/src/loading.less @@ -0,0 +1,24 @@ +.job-portal-route-loading { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + min-height: 100vh; + background: #f0f4f8; + + .ant-spin .ant-spin-dot-item { + background-color: #1890ff; + } + + &__title { + margin: 20px 0 0; + font-size: 16px; + color: #1a1a1a; + } + + &__hint { + margin: 8px 0 0; + font-size: 14px; + color: #8c8c8c; + } +} diff --git a/src/loading.tsx b/src/loading.tsx new file mode 100644 index 0000000..dd86d4f --- /dev/null +++ b/src/loading.tsx @@ -0,0 +1,21 @@ +import { PageLoading } from '@ant-design/pro-components'; +import { Spin } from 'antd'; +import { isJobPortalPage } from '@/utils/routeContext'; +import './loading.less'; + +/** 路由 chunk 加载时的占位（Umi 约定入口） */ +export default function RouteLoading() { + const pathname = typeof window !== 'undefined' ? window.location.pathname : ''; + + if (isJobPortalPage(pathname)) { + return ( +
+ +

正在加载页面

+

请稍候

+
+ ); + } + + return ; +} diff --git a/src/utils/routeContext.ts b/src/utils/routeContext.ts new file mode 100644 index 0000000..ad318a0 --- /dev/null +++ b/src/utils/routeContext.ts @@ -0,0 +1,19 @@ +import { PageEnum } from '@/enums/pagesEnums'; +import { isThirdPartyTransitionPage } from '@/utils/thirdPartyLogin'; + +/** 求职者门户路由（含 base /shihezi/） */ +export function isJobPortalPage(pathname: string): boolean { + return ( + pathname.startsWith('/job-portal') || pathname.startsWith('/shihezi/job-portal') + ); +} + +/** 无需在应用启动前拉取管理端菜单/用户信息的路径 */ +export function shouldSkipManagementBootstrap(pathname: string): boolean { + return ( + pathname === PageEnum.LOGIN || + pathname === '/shihezi/user/login' || + isThirdPartyTransitionPage(pathname) || + isJobPortalPage(pathname) + ); +}