gin-admin · heromicro · Apr 23, 2021 · Jun 12, 2021 · Jun 12, 2021 · Jun 12, 2021
diff --git a/package.json b/package.json
@@ -18,7 +18,7 @@
    "@ant-design/compatible": "^1.0.2",
    "@ant-design/icons": "^4.0.6",
    "antd": "^4.1.2",
-    "axios": "^0.18.0",
+    "axios": "^0.21.1",
    "classnames": "^2.2.5",
    "history": "^4.7.2",
    "lodash": "^4.17.10",

diff --git a/src/components/UpdatePasswordDialog/index.js b/src/components/UpdatePasswordDialog/index.js
@@ -1,41 +1,42 @@
 import React, { PureComponent } from 'react';
-import { Form } from '@ant-design/compatible';
 import '@ant-design/compatible/assets/index.css';
-import { Input, Modal, message } from 'antd';
+import { Form, Input, Modal, message } from 'antd';
 import { updatePwd } from '@/services/login';
 import { md5Hash } from '../../utils/utils';

-@Form.create()
 class UpdatePasswordDialog extends PureComponent {
+  formRef = React.createRef();
+
  state = {
    submitting: false,
  };

  onOKClick = () => {
-    const { form } = this.props;
-
-    form.validateFieldsAndScroll((err, values) => {
-      if (err) {
-        return;
-      }
-      if (values.new_password !== values.confirm_new_password) {
-        message.warning('新密码与确认新密码不一致！');
-        return;
-      }
-
-      this.setState({ submitting: true });
-      const formData = {
-        old_password: md5Hash(values.old_password),
-        new_password: md5Hash(values.new_password),
-      };
-      updatePwd(formData).then(res => {
-        if (res.status === 'OK') {
-          message.success('密码更新成功！');
-          this.handleCancel();
+    this.formRef.current
+      .validateFields()
+      .then(values => {
+        if (values.new_password !== values.confirm_new_password) {
+          message.warning('新密码与确认新密码不一致！');
+          return;
        }
+
+        this.setState({ submitting: true });
+        const formData = {
+          old_password: md5Hash(values.old_password),
+          new_password: md5Hash(values.new_password),
+        };
+        updatePwd(formData).then(res => {
+          if (res.status === 'OK') {
+            message.success('密码更新成功！');
+            this.handleCancel();
+          }
+          this.setState({ submitting: false });
+        });
+      })
+      .catch(err => {
+        console.log(' ----- === err :', err);
        this.setState({ submitting: false });
      });
-    });
  };

  handleCancel = () => {
@@ -51,10 +52,7 @@ class UpdatePasswordDialog extends PureComponent {
  };

  render() {
-    const {
-      visible,
-      form: { getFieldDecorator },
-    } = this.props;
+    const { visible } = this.props;

    const { submitting } = this.state;

@@ -80,36 +78,30 @@ class UpdatePasswordDialog extends PureComponent {
        style={{ top: 20 }}
        bodyStyle={{ maxHeight: 'calc( 100vh - 158px )', overflowY: 'auto' }}
      >
-        <Form>
-          <Form.Item {...formItemLayout} label="旧密码">
-            {getFieldDecorator('old_password', {
-              rules: [
-                {
-                  required: true,
-                  message: '请输入旧密码',
-                },
-              ],
-            })(<Input type="password" placeholder="请输入旧密码" />)}
+        <Form ref={this.formRef} initialValues={{}}>
+          <Form.Item
+            {...formItemLayout}
+            label="旧密码"
+            name="old_password"
+            rules={[{ required: true, message: '请输入旧密码' }]}
+          >
+            <Input type="password" placeholder="请输入旧密码" />
          </Form.Item>
-          <Form.Item {...formItemLayout} label="新密码">
-            {getFieldDecorator('new_password', {
-              rules: [
-                {
-                  required: true,
-                  message: '请输入新密码',
-                },
-              ],
-            })(<Input type="password" placeholder="请输入新密码" />)}
+          <Form.Item
+            {...formItemLayout}
+            label="新密码"
+            name="new_password"
+            rules={[{ required: true, message: '请输入新密码' }]}
+          >
+            <Input type="password" placeholder="请输入新密码" />
          </Form.Item>
-          <Form.Item {...formItemLayout} label="确认新密码">
-            {getFieldDecorator('confirm_new_password', {
-              rules: [
-                {
-                  required: true,
-                  message: '请输入确认新密码',
-                },
-              ],
-            })(<Input type="password" placeholder="请输入确认新密码" />)}
+          <Form.Item
+            {...formItemLayout}
+            label="确认新密码"
+            name="confirm_new_password"
+            rules={[{ required: true, message: '请输入确认新密码' }]}
+          >
+            <Input type="password" placeholder="请输入确认新密码" />
          </Form.Item>
        </Form>
      </Modal>

diff --git a/src/models/demo.js b/src/models/demo.js
@@ -13,6 +13,7 @@ export default {
    submitting: false,
    formTitle: '',
    formID: '',
+    formModalVisible: false,
    formVisible: false,
    formData: {},
  },
@@ -54,7 +55,7 @@ export default {
    },
    *loadForm({ payload }, { put }) {
      yield put({
-        type: 'changeFormVisible',
+        type: 'changeModalFormVisible',
        payload: true,
      });

@@ -92,6 +93,13 @@ export default {
            payload: { id: payload.id },
          }),
        ];
+      } else {
+        yield [
+          put({
+            type: 'changeFormVisible',
+            payload: true,
+          }),
+        ];
      }
    },
    *fetchForm({ payload }, { call, put }) {
@@ -101,6 +109,10 @@ export default {
          type: 'saveFormData',
          payload: response,
        }),
+        put({
+          type: 'changeFormVisible',
+          payload: true,
+        }),
      ];
    },
    *submit({ payload }, { call, put, select }) {
@@ -133,7 +145,7 @@ export default {
      if (success) {
        message.success('保存成功');
        yield put({
-          type: 'changeFormVisible',
+          type: 'changeModalFormVisible',
          payload: false,
        });
        yield put({
@@ -191,8 +203,17 @@ export default {
      return { ...state, pagination: payload };
    },
    changeFormVisible(state, { payload }) {
+      if (payload) {
+        return { ...state, formModalVisible: payload, formVisible: payload };
+      }
      return { ...state, formVisible: payload };
    },
+    changeModalFormVisible(state, { payload }) {
+      if (!payload) {
+        return { ...state, formModalVisible: payload, formVisible: payload };
+      }
+      return { ...state, formModalVisible: payload };
+    },
    saveFormTitle(state, { payload }) {
      return { ...state, formTitle: payload };
    },

diff --git a/src/models/menu.js b/src/models/menu.js
@@ -14,6 +14,7 @@ export default {
    formType: '',
    formTitle: '',
    formID: '',
+    formModalVisible: false,
    formVisible: false,
    formData: {},
    treeData: [],
@@ -59,7 +60,7 @@ export default {
    },
    *loadForm({ payload }, { put, select }) {
      yield put({
-        type: 'changeFormVisible',
+        type: 'changeModalFormVisible',
        payload: true,
      });

@@ -104,14 +105,26 @@ export default {
          type: 'saveFormData',
          payload: { parent_id: search.parentID ? search.parentID : '' },
        });
+        yield [
+          put({
+            type: 'changeFormVisible',
+            payload: true,
+          }),
+        ];
      }
    },
    *fetchForm({ payload }, { call, put }) {
      const response = yield call(menuService.get, payload.id);
-      yield put({
-        type: 'saveFormData',
-        payload: response,
-      });
+      yield [
+        put({
+          type: 'saveFormData',
+          payload: response,
+        }),
+        put({
+          type: 'changeFormVisible',
+          payload: true,
+        }),
+      ];
    },
    *submit({ payload }, { call, put, select }) {
      yield put({
@@ -143,7 +156,7 @@ export default {
      if (success) {
        message.success('保存成功');
        yield put({
-          type: 'changeFormVisible',
+          type: 'changeModalFormVisible',
          payload: false,
        });

@@ -213,8 +226,17 @@ export default {
      return { ...state, pagination: payload };
    },
    changeFormVisible(state, { payload }) {
+      if (payload) {
+        return { ...state, formModalVisible: payload, formVisible: payload };
+      }
      return { ...state, formVisible: payload };
    },
+    changeModalFormVisible(state, { payload }) {
+      if (!payload) {
+        return { ...state, formModalVisible: payload, formVisible: payload };
+      }
+      return { ...state, formModalVisible: payload };
+    },
    saveFormType(state, { payload }) {
      return { ...state, formType: payload };
    },

diff --git a/src/models/role.js b/src/models/role.js
@@ -13,6 +13,7 @@ export default {
    submitting: false,
    formTitle: '',
    formID: '',
+    formModalVisible: false,
    formVisible: false,
    formData: {},
    selectData: [],
@@ -55,7 +56,7 @@ export default {
    },
    *loadForm({ payload }, { put }) {
      yield put({
-        type: 'changeFormVisible',
+        type: 'changeModalFormVisible',
        payload: true,
      });

@@ -93,6 +94,13 @@ export default {
            payload: { id: payload.id },
          }),
        ];
+      } else {
+        yield [
+          put({
+            type: 'changeFormVisible',
+            payload: true,
+          }),
+        ];
      }
    },
    *fetchForm({ payload }, { call, put }) {
@@ -120,6 +128,10 @@ export default {
          type: 'saveFormData',
          payload: response,
        }),
+        put({
+          type: 'changeFormVisible',
+          payload: true,
+        }),
      ];
    },
    *submit({ payload }, { call, put, select }) {
@@ -153,7 +165,7 @@ export default {
      if (success) {
        message.success('保存成功');
        yield put({
-          type: 'changeFormVisible',
+          type: 'changeModalFormVisible',
          payload: false,
        });
        yield put({
@@ -218,8 +230,17 @@ export default {
      return { ...state, pagination: payload };
    },
    changeFormVisible(state, { payload }) {
+      if (payload) {
+        return { ...state, formModalVisible: payload, formVisible: payload };
+      }
      return { ...state, formVisible: payload };
    },
+    changeModalFormVisible(state, { payload }) {
+      if (!payload) {
+        return { ...state, formModalVisible: payload, formVisible: payload };
+      }
+      return { ...state, formModalVisible: payload };
+    },
    saveFormTitle(state, { payload }) {
      return { ...state, formTitle: payload };
    },