fix: 初始化登录页面

.env

@@ -1,3 +1,4 @@
 # 默认配置
 DID_YOU_KNOW=none
-PORT=30058
+PORT=30058
+APP_ENV=production

.env.production

@@ -0,0 +1 @@
+APP_ENV=production

.umirc.ts

@@ -4,6 +4,8 @@ export default defineConfig({
   favicons: ['/assets/logo.jpg'],
   access: {},
   model: {},
+  dva: {},
+  request: {},
   initialState: {},
   layout: false,
   qiankun: {
@@ -11,7 +13,13 @@ export default defineConfig({
       prefetch: false,
     },
   },
+  mfsu: false,
   routes: [
+    {
+      name: '登录',
+      path: '/login',
+      component: '@/pages/login',
+    },
     {
       name: 'intelligent-file-cabinet',
       path: '/intelligent-file-cabinet/*',
@@ -34,4 +42,7 @@ export default defineConfig({
     },
   ],
   npmClient: 'pnpm',
+  define: {
+    APP_ENV: process.env.APP_ENV || 'development',
+  },
 });

global.d.ts

@@ -0,0 +1 @@
+declare const APP_ENV: string;

src/actions/index.ts

@@ -0,0 +1,20 @@
+import { initGlobalState, MicroAppStateActions } from '@umijs/max';
+
+const state = {
+  num: 1,
+};
+
+// 初始化 state
+const actions: MicroAppStateActions = initGlobalState(state);
+
+actions.onGlobalStateChange((state, prev) => {
+  // state: 变更后的状态; prev 变更前的状态
+  console.log('主应用检测到state变更：', state, prev);
+});
+
+// 你还可以定义一个获取state的方法下发到子应用
+actions.getGlobalState = function () {
+  return state;
+};
+
+export default actions;

src/app.ts

@@ -1,13 +1,21 @@
 import { useState } from 'react';
 
 // 运行时配置
-export async function getInitialState(): Promise<{ name: string }> {
-  return { name: '@umijs/max' };
+export async function getInitialState(): Promise<{
+  name: string;
+  useLogin: boolean;
+}> {
+  return {
+    name: '主应用',
+    useLogin: false,
+  };
 }
 
+// 给子应用暴露的方法
 export function useQiankunStateForSlave() {
   const [globalState, setGlobalState] = useState<any>({
     slogan: 'qiankun father',
+    useLogin: false,
   });
 
   return {
@@ -22,31 +30,38 @@ export const qiankun = {
   apps: [
     {
       name: 'intelligent-file-cabinet', // 盒子管理
-      entry: `//${hostname}:30068/intelligent-file-cabinet/`,
-      props: {
-        accountInfo: {
-          username: 'admin',
-          password: 'test123',
-        },
-      },
+      entry:
+        APP_ENV === 'production'
+          ? `//${hostname}:30068/intelligent-file-cabinet/`
+          : '//localhost:30068/',
+      props: {},
     },
     {
       name: 'smart-video-analysis', // AI 智能分析仓
-      entry: `//${hostname}:30088/smart-video-analysis/`,
+      entry:
+        APP_ENV === 'production'
+          ? `//${hostname}:30088/smart-video-analysis/`
+          : '//localhost:30088/',
     },
     {
       name: 'algorithm-warehouse', // AI 算法分析
-      entry: `//${hostname}:30078/algorithm-warehouse/`,
+      entry:
+        APP_ENV === 'production'
+          ? `//${hostname}:30078/algorithm-warehouse/`
+          : '//localhost:30078/',
     },
     {
       name: 'communal-facilities-pages', // 物料库
-      entry: `//${hostname}:30098/communal-facilities-pages/`,
+      entry:
+        APP_ENV === 'production'
+          ? `//${hostname}:30098/communal-facilities-pages/`
+          : '//localhost:30098/',
     },
   ],
   lifeCycles: {
     // 所有子应用在挂载完成时，打印 props 信息
     async afterMount(props: any) {
-      console.log('主应用:', props);
+      console.log('子应用已全部加载:', props);
     },
   },
 };

src/layouts/index.tsx

@@ -1,13 +1,41 @@
-import { Outlet } from '@umijs/max'; 
+import { SettingOutlined, ShopOutlined } from '@ant-design/icons';
+import { Outlet, useAppData, useModel } from '@umijs/max';
+import { FloatButton } from 'antd';
+import React from 'react';
 import styles from './index.less';
 
-export default function Layout() {
+const Layout = () => {
+  const p = useAppData();
+  const model = useModel('@@qiankunStateForSlave');
+  const model2 = useModel('@@initialState');
+
+  console.log('useAppData', p);
+  console.log('qiankunStateForSlave', model);
+  console.log('initialState', model2);
+
   return (
     <div className={styles.layout}>
-      <div className={styles.layout_tag} style={{ position: 'fixed', zIndex: 9999999999999999 }} >
-        测试项目
-      </div>
+      <FloatButton.Group
+        trigger="click"
+        type="primary"
+        style={{ right: 32 }}
+        icon={<SettingOutlined />}
+      >
+        <FloatButton
+          tooltip="物料库"
+          onClick={() =>
+            (location.href = 'http://10.0.0.222:30098/communal-cabinets')
+          }
+        />
+        <FloatButton
+          tooltip="组件库"
+          onClick={() => (location.href = 'http://10.0.0.222')}
+        />
+        <FloatButton tooltip="demo 展示" icon={<ShopOutlined />} />
+      </FloatButton.Group>
       <Outlet />
     </div>
   );
-}
+};
+
+export default Layout;

src/pages/docs.tsx

@@ -1,9 +0,0 @@
-const DocsPage = () => {
-  return (
-    <div>
-      <p>This is umi docs.</p>
-    </div>
-  );
-};
-
-export default DocsPage;

src/pages/login/index.tsx

@@ -0,0 +1,16 @@
+/**
+ * Created by dev on 2024/03/18
+ */
+
+import React, { FC } from 'react';
+
+interface LoginProps {
+  demo: string;
+}
+
+const Login: FC<LoginProps> = (props) => {
+  console.log('props', props);
+  return <div>登录</div>;
+};
+
+export default Login;

src/pages/password/index.tsx

@@ -0,0 +1,16 @@
+/**
+ * Created by dev on 2024/03/18
+ */
+
+import React, { FC } from 'react';
+
+export interface PasswordProps {
+  demo: string;
+}
+
+const Password: FC<PasswordProps> = (props) => {
+  console.log('props', props);
+  return <div>修改密码</div>;
+};
+
+export default Password;