欢迎页自适应

src/app.tsx

@@ -206,7 +206,9 @@ export async function getInitialState(): Promise<{
   // 如果是登录页面，不执行
   if (history.location.pathname !== loginPath) {
     const currentUser = await fetchUserInfo();
+    console.log('currentUser', currentUser)
     if (currentUser && currentUser.user.locale) {
+      console.log('locale', currentUser.user.locale)
       setLocale(currentUser.user.locale)
     }
     return {

src/pages/Welcome.less

@@ -8,14 +8,15 @@
 }
 
 .container {
-  width: 100%;
+  width: 1920px;
   display: flex;
   color: #fff;
+  overflow: hidden;
   position: relative;
   flex-direction: column;
   transform-origin: top left;
   align-items: center;
-  height: 100%;
+  height: 1080px;
   color: white;
   background: #00204c;
 }

src/pages/Welcome.tsx

 import React, { useState,useEffect, useCallback } from 'react';
 import { useIntl, useModel } from 'umi';
 import { useHistory } from 'react-router-dom';
+import { delay, floor } from 'lodash';
 import styles from './Welcome.less';
 import { logout as outLogin } from '@/services/mgr/api';
 const Welcome: React.FC = () => {
   const intl = useIntl();
   const { initialState, setInitialState } = useModel('@@initialState');
   const [kanbanList, setkanbanList] = useState([]);
-  
+  const [scaleWidth, setScaleWidth] = useState(1);
+  const [scaleHeight, setScaleHeight] = useState(1);
+  const resetScale = () => {
+    setScaleWidth(floor(document.body.clientWidth / 1920, 4));
+    setScaleHeight(floor(document.body.clientHeight / 1080, 4));
+    delay(
+      () => {
+        setScaleWidth(floor(document.body.clientWidth / 1920, 4));
+        setScaleHeight(floor(document.body.clientHeight / 1080, 4));
+      },
+      1,
+      20,
+    );
+  };
   useEffect(() => {
     if (initialState?.menuList) {
-      console.log('sada', initialState?.menuList)
       const menuList = initialState?.menuList
       const item = menuList.find(v => v.name === 'kanban')
       if (item?.children) {
         setkanbanList(item?.children)
-        
       }
-      
     }
+    document.body.onresize = () => resetScale();
+    resetScale()
 }, []);
   const history = useHistory();
   // 跳转函数
@@ -43,7 +56,9 @@ const Welcome: React.FC = () => {
     }
   }, [setInitialState]);
   return (
-    <div className={styles.container}>
+    <div className={styles.container} style={{
+        transform: `scale(${scaleWidth},${scaleHeight})`,
+      }}>
       <div className={styles.logout} onClick={() => loginOut()}>
         {intl.formatMessage({id:'退出登录'})}
       </div>