feat: app 启动优化

react-ui/src/app.tsx

@@ -21,7 +21,7 @@ import {
 } from './services/session';
 import './styles/menu.less';
 import { needAuth } from './utils';
-// import { closeAllModals } from './utils/modal';
+import { closeAllModals } from './utils/modal';
 import { gotoLoginPage } from './utils/ui';
 export { requestConfig as request } from './requestConfig';
 
@@ -30,8 +30,8 @@ export { requestConfig as request } from './requestConfig';
  */
 export async function getInitialState(): Promise<GlobalInitialState> {
   const fetchUserInfo = async () => {
+    globalGetSeverTime();
     try {
-      globalGetSeverTime();
       const response = await getUserInfo();
       return {
         ...response.user,
@@ -47,11 +47,8 @@ export async function getInitialState(): Promise<GlobalInitialState> {
     return undefined;
   };
 
-  // 如果不是登录页面，执行
-  const { location } = history;
-
-  // console.log('getInitialState', needAuth(location.pathname));
-  if (needAuth(location.pathname)) {
+  const token = getAccessToken();
+  if (token) {
     const currentUser = await fetchUserInfo();
     return {
       fetchUserInfo,
@@ -72,9 +69,6 @@ export const layout: RuntimeConfig['layout'] = ({ initialState }) => {
   return {
     ErrorBoundary: ErrorBoundary,
     rightContentRender: false,
-    waterMarkProps: {
-      // content: initialState?.currentUser?.nickName,
-    },
     menu: {
       locale: false,
       // 每当 initialState?.currentUser?.userid 发生修改时重新执行 request
@@ -85,46 +79,9 @@ export const layout: RuntimeConfig['layout'] = ({ initialState }) => {
         if (!initialState?.currentUser?.userId) {
           return [];
         }
-        // console.log('get menus')
-        // initialState.currentUser 中包含了所有用户信息
-        // console.log('get routers')
-        // setInitialState((preInitialState) => ({
-        //   ...preInitialState,
-        //   menus,
-        // }));
         return getRemoteMenu();
       },
     },
-    onPageChange: () => {
-      const { location } = history;
-      // closeAllModals();
-      // 如果没有登录，重定向到 login
-      if (!initialState?.currentUser && needAuth(location.pathname)) {
-        gotoLoginPage();
-      }
-    },
-    layoutBgImgList: [
-      {
-        src: 'https://mdn.alipayobjects.com/yuyan_qk0oxh/afts/img/D2LWSqNny4sAAAAAAAAAAAAAFl94AQBr',
-        left: 85,
-        bottom: 100,
-        height: '303px',
-      },
-      {
-        src: 'https://mdn.alipayobjects.com/yuyan_qk0oxh/afts/img/C2TWRpJpiC0AAAAAAAAAAAAAFl94AQBr',
-        bottom: -68,
-        right: -45,
-        height: '303px',
-      },
-      {
-        src: 'https://mdn.alipayobjects.com/yuyan_qk0oxh/afts/img/F6vSTbj8KpYAAAAAAAAAAAAAFl94AQBr',
-        bottom: 0,
-        left: 0,
-        width: '331px',
-      },
-    ],
-    // 自定义 403 页面
-    // unAccessible: <div>unAccessible</div>,
     childrenRender: (children) => {
       // 增加一个 loading 的状态
       // if (initialState?.loading) return <PageLoading />;
@@ -161,9 +118,26 @@ export const layout: RuntimeConfig['layout'] = ({ initialState }) => {
 };
 
 export const onRouteChange: RuntimeConfig['onRouteChange'] = async (e) => {
+  // console.log('onRouteChange');
+
+  // 路由切换时，尤其是回退时，关闭打开的弹框
+  closeAllModals();
+
   const { location } = e;
+  const token = getAccessToken();
+  // 没有 token，跳转到登录页面
+  if (!token && needAuth(location.pathname)) {
+    gotoLoginPage();
+    return;
+  }
+
+  // 有 token， 登录页面直接跳转到首页
+  if (token && !needAuth(location.pathname)) {
+    history.push('/');
+  }
+
   const menus = getRemoteMenu();
-  // console.log('onRouteChange', menus);
+  // 没有菜单，刷新页面
   if (menus === null && needAuth(location.pathname)) {
     history.go(0);
   }
@@ -181,10 +155,12 @@ export const patchClientRoutes: RuntimeConfig['patchClientRoutes'] = (e) => {
 export function render(oldRender: () => void) {
   // console.log('render');
   const token = getAccessToken();
-  if (!token || token?.length === 0) {
+  if (!token) {
     oldRender();
     return;
   }
+
+  // 有 token，获取路由
   getRoutersInfo()
     .then((res) => {
       setRemoteMenu(res);

react-ui/src/components/RightContent/AvatarDropdown.tsx

@@ -5,7 +5,7 @@ import { logout } from '@/services/system/auth';
 import { ClientInfo } from '@/types';
 import { sleep, to } from '@/utils/promise';
 import SessionStorage from '@/utils/sessionStorage';
-import { oauthLogout } from '@/utils/ui';
+import { gotoLoginPage, oauthLogout } from '@/utils/ui';
 import { LogoutOutlined, UserOutlined } from '@ant-design/icons';
 import { setAlpha } from '@ant-design/pro-components';
 import { useEmotionCss } from '@ant-design/use-emotion-css';
@@ -78,10 +78,9 @@ const AvatarDropdown: React.FC<GlobalHeaderRightProps> = ({ menu }) => {
     if (clientInfo) {
       const { logoutUri } = clientInfo;
       location.replace(logoutUri);
+    } else {
+      gotoLoginPage();
     }
-    // setTimeout(() => {
-    //   gotoLoginPage();
-    // }, 100);
   };
   const actionClassName = useEmotionCss(({ token }) => {
     return {