fix framework

Author: xlorne

antd-pro/config/config.ts

@@ -18,6 +18,9 @@ export default defineConfig({
   // 默认是 browser
   history: { type: 'hash' },
 
+  // dva 的配置
+  dva: {},
+
   /**
    * @name 兼容性设置
    * @description 设置 ie11 不一定完美兼容，需要检查自己使用的所有依赖

antd-pro/config/routes.ts

@@ -93,6 +93,45 @@ export default [
       },
     ],
   },
+  {
+    name: 'framework',
+    icon: 'appstore',
+    path: '/framework',
+    access: 'hasAuthentication',
+    routes: [
+      {
+        name: 'dva',
+        path: '/framework/dva',
+        access: 'hasAuthentication',
+        routes: [
+          {
+            name: 'test1',
+            path: '/framework/dva/test1',
+            component: './framework/dva/test1',
+            access: 'hasAuthentication',
+          },
+          {
+            name: 'test2',
+            path: '/framework/dva/test2',
+            component: './framework/dva/test2',
+            access: 'hasAuthentication',
+          },
+        ]
+      },
+      {
+        name: 'bean',
+        path: '/framework/bean',
+        access: 'hasAuthentication',
+        component: './framework/bean',
+      },
+      {
+        name: 'event',
+        path: '/framework/event',
+        access: 'hasAuthentication',
+        component: './framework/event',
+      }
+    ]
+  },
   {
     path: '/',
     redirect: '/welcome',

antd-pro/src/app.tsx

@@ -10,7 +10,18 @@ import React from 'react';
 import { AvatarDropdown, AvatarName } from './components/RightContent/AvatarDropdown';
 import { loadLayoutMenus, loadLoayoutMenuAuthentications } from './components/Menu';
 import { menus } from '@/services/api/account'
-const loginPath = '/user/login';
+
+const loginPath = '/login';
+import * as beans from '@/bean';
+
+// 初始化bean
+function initBean() {
+  console.log('register beans');
+  beans.registerBeans();
+}
+
+
+initBean();
 
 /**
  * @see  https://umijs.org/zh-CN/plugins/plugin-initial-state
@@ -119,3 +130,5 @@ export const layout: RunTimeLayoutConfig = ({ initialState, setInitialState }) =
 export const request = {
   ...errorConfig,
 };
+
+

antd-pro/src/bean/index.ts

@@ -0,0 +1,8 @@
+import { defaultTestModel } from '@/bean/test';
+import { beanFactory } from 'coding-components'
+
+
+export const registerBeans = () => {
+  beanFactory.registerBean(defaultTestModel);
+}
+

antd-pro/src/bean/test.ts

@@ -0,0 +1,12 @@
+import { TestModel } from "@/domain/test";
+
+
+//todo 这个地方最好可以实现全局任何地方都可以注册bean
+export const defaultTestModel = new class extends TestModel{
+    beanName: string = "TestModel";
+    loadData(): string {
+        return "default loadData";
+    }
+}
+
+

antd-pro/src/domain/test.ts

@@ -0,0 +1,35 @@
+import { Bean } from "coding-components";
+
+export class Test {
+  count = 0;
+
+  public add(index: number) {
+    this.count += index;
+  }
+
+  public clear() {
+    this.count = 0;
+  }
+
+  constructor(count: number) {
+    this.count = count;
+  }
+
+  public toStates() {
+    return {
+      count: this.count,
+    };
+  }
+
+  public hasCount() {
+    return this.count > 0;
+  }
+}
+
+export abstract class TestModel implements Bean {
+  beanName: string = "TestModel";
+
+  public abstract loadData(): string;
+}
+
+

antd-pro/src/locales/en-US/menu.ts

@@ -55,4 +55,10 @@ export default {
   'menu.components.parameter': 'Parameter',
   'menu.components.oss': 'Files',
   'menu.components.oss.test': 'File Test',
+  'menu.framework': 'Framework',
+  'menu.framework.dva': 'dva',
+  'menu.framework.dva.test1': 'Test1',
+  'menu.framework.dva.test2': 'Test2',
+  'menu.framework.bean': 'Bean',
+  'menu.framework.event': 'Event',
 };

antd-pro/src/locales/zh-CN/menu.ts

@@ -55,4 +55,10 @@ export default {
   'menu.components.parameter': '参数管理',
   'menu.components.oss': '文件管理',
   'menu.components.oss.test': '文件测试',
+  'menu.framework': '框架',
+  'menu.framework.dva': 'dva',
+  'menu.framework.dva.test1': '测试1',
+  'menu.framework.dva.test2': '测试2',
+  'menu.framework.bean': 'Bean',
+  'menu.framework.event': '事件',
 };

antd-pro/src/models/test.ts

@@ -0,0 +1,27 @@
+import {Test} from '@/domain/test';
+
+export default {
+  namespace: 'test',
+  state: {
+    count: 0,
+  },
+
+  effects: {
+    *test({ payload, state }: any, { call, put }: any) {
+      yield put({ type: 'testSuccess', data: 1 });
+    },
+  },
+  reducers: {
+    testSuccess(state: any, { data }) {
+      const test = new Test(state.count);
+      test.add(data);
+      return test.toStates();
+    },
+
+    clear(state: any, action: any) {
+      const test = new Test(state.count);
+      test.clear();
+      return test.toStates();
+    },
+  },
+};

antd-pro/src/pages/framework/bean/index.tsx

@@ -0,0 +1,48 @@
+import React from "react";
+import { Button, Space } from "antd";
+
+import { TestModel } from '@/domain/test';
+import { defaultTestModel } from "@/bean/test";
+import { beanFactory } from "coding-components";
+
+
+const TestPage: React.FC = () => {
+
+  const [data, setData] = React.useState<string>();
+
+
+  // 获取bean对象，调用loadData方法
+  const handleClick = () => {
+    const model = beanFactory.getBean(TestModel);
+    setData(model.loadData());
+  }
+
+  const handleDefault = () => {
+    // 重置bean对象
+    beanFactory.registerBean(defaultTestModel);
+  }
+
+  const handleRegister = () => {
+    // 注册bean对象
+    beanFactory.registerBean(new class extends TestModel {
+      loadData() {
+        return "new load data";
+      }
+    });
+  }
+
+
+  return (
+    <>
+      <h1>{data}</h1>
+      <Space>
+        <Button type="primary" onClick={handleClick}>getBean</Button>
+        <Button onClick={handleDefault}>resetBean</Button>
+        <Button onClick={handleRegister}>registerBean</Button>
+      </Space>
+    </>
+  )
+
+}
+
+export default TestPage;

antd-pro/src/pages/framework/dva/test1.tsx

@@ -0,0 +1,41 @@
+import { connect, useSelector } from "@umijs/max";
+import { Button, Space } from "antd";
+import React from "react";
+import { Test } from '@/domain/test';
+
+
+const TestPage: React.FC<any> = (props: any) => {
+
+  const handleAdd = () => {
+    props.dispatch({ type: 'test/test', payload: { "name": "test" } })
+  }
+
+  const handleClear = () => {
+    props.dispatch({ type: 'test/clear' })
+  }
+
+  const test = useSelector((state: any) => {
+    return new Test(state.test.count);
+  });
+
+  const handleCount = () => {
+    alert(test.hasCount());
+  }
+
+
+  return (
+    <div>
+      <h1>Test1</h1>
+      <h1>{test.count}</h1>
+      <Space>
+        <Button onClick={handleAdd}>Add</Button>
+        <Button onClick={handleClear}>Clear</Button>
+        <Button onClick={handleCount}>hasCount</Button>
+      </Space>
+    </div>
+  )
+}
+
+
+
+export default connect(({ dva }: any) => ({ dva }))(TestPage)

antd-pro/src/pages/framework/dva/test2.tsx

@@ -0,0 +1,28 @@
+import { connect, useSelector } from "@umijs/max";
+import { Button } from "antd";
+import React from "react";
+
+
+
+const TestPage: React.FC<any> = (props: any) => {
+
+  const handleAdd = () => {
+    props.dispatch({ type: 'test/test', payload: { "name": "test" } })
+  }
+
+  const { count } = useSelector((state: any) => {
+    return state.test;
+  });
+
+  return (
+    <div>
+      <h1>Test2</h1>
+      <h1>{count}</h1>
+      <Button onClick={handleAdd}>Add</Button>
+    </div>
+  )
+}
+
+
+
+export default connect(({ dva }: any) => ({ dva }))(TestPage)

antd-pro/src/pages/framework/event/index.tsx

@@ -0,0 +1,34 @@
+import { events } from "coding-components"
+import { Button } from "antd";
+import React, { useEffect } from "react"
+
+const TestPage: React.FC = () => {
+
+  const [data, setData] = React.useState<any>();
+
+  const eventAction = 'test';
+
+  const handleClick = () => {
+    events.emit(eventAction, 'event data');
+  }
+
+  useEffect(() => {
+    events.on(eventAction, (data: any) => {
+      setData(data)
+    });
+
+    return () => {
+      events.off(eventAction);
+    }
+  }, [])
+
+  return (
+    <>
+      <h1>监听:{data}</h1>
+      <Button onClick={handleClick}>发送事件</Button>
+    </>
+  )
+
+}
+
+export default TestPage;