fix: modal-form 初始值问题

1. openModal 与 initialValues 合并.
2. 去除告警

Author: jaykou25

docs/case/antdForm.md

@@ -6,7 +6,7 @@ group:
   title: 核心组件
   order: 0
 toc: content
-order: 1
+order: 5
 title: Antd Form
 debug: true
 ---

docs/case/modal-form-demo/modal-form-initial-value/index.tsx

@@ -0,0 +1,32 @@
+import { useRef } from 'react';
+import { Button, ModalForm, ModalFormInnerRefType } from 'react-admin-kit';
+
+export default function () {
+  const innerRef = useRef<ModalFormInnerRefType>();
+  return (
+    <div>
+      <Button
+        onClick={() => innerRef.current?.openModal('edit', { name: 'Jack2' })}
+      >
+        打开
+      </Button>
+      <ModalForm
+        formProps={{
+          initialValues: { name: 'Jack', phone: 123 },
+        }}
+        innerRef={innerRef}
+        columns={[
+          {
+            title: 'name',
+            dataIndex: 'name',
+            initialValue: 'Hello',
+          },
+          {
+            title: 'phone',
+            dataIndex: 'phone',
+          },
+        ]}
+      />
+    </div>
+  );
+}

docs/case/modal-form-demo/pro-component-initial-value/index.tsx

@@ -0,0 +1,24 @@
+import { SchemaForm } from 'react-admin-kit';
+import { BetaSchemaForm } from '@ant-design/pro-form';
+
+export default function () {
+  return (
+    <SchemaForm
+      initialValues={{
+        user: 'Jack',
+      }}
+      columns={[
+        {
+          title: 'user',
+          dataIndex: 'user',
+          initialValue: 'Hello',
+        },
+        {
+          title: 'phone',
+          dataIndex: 'phone',
+          initialValue: 'World',
+        },
+      ]}
+    />
+  );
+}

docs/case/modal-form.md

@@ -0,0 +1,32 @@
+---
+nav:
+  title: 测试用例
+  order: 10
+group:
+  title: 核心组件
+  order: 0
+order: 20
+toc: content
+title: ModalForm
+debug: true
+---
+
+
+# SchemaForm
+
+## 初始值问题
+columns 上有 initialValue. Form 上也有 initialValues. 这两者会合并处理吗?
+
+首先我们来看看 pro-component 是如何处理的.
+
+<code src="./modal-form-demo/pro-component-initial-value" ></code>
+
+可以看出 Form 上的 initialValues 优先级更高. 并且他们是合并的关系. 同时控制台会有告警信息.
+
+同理, ModalForm 也要遵循这个规则.
+
+案例1. columns 有初始值 `{name: 'hello'}`, ModalForm 上有初始值 `{name: 'Jack', phone: 123}`, openModal 有初始值 `{name: 'Jack2'}`
+
+期望1: `{name: 'Jack2', phone: 123}`
+
+<code src="./modal-form-demo/modal-form-initial-value" ></code>

docs/case/proForm.md

@@ -5,7 +5,7 @@ nav:
 group:
   title: 核心组件
   order: 0
-order: 1
+order: 10
 toc: content
 title: ProForm
 debug: true

docs/case/proTable.md

@@ -6,7 +6,7 @@ group:
   title: 核心组件
   order: 0
 toc: content
-order: 1
+order: 30
 title: ProTable
 debug: true
 ---

src/ModalForm/demos/innerRef/index.tsx

@@ -14,7 +14,10 @@ const InnerRefDemo = () => {
   return (
     <div>
       <div style={{ textAlign: 'start' }}>
-        <Button type="primary" onClick={() => ref.current?.openModal()}>
+        <Button
+          type="primary"
+          onClick={() => ref.current?.openModal('edit', { username: 'Jack' })}
+        >
           打开弹窗
         </Button>
       </div>

src/ModalForm/index.tsx

@@ -95,15 +95,14 @@ class ModalForm extends Component<
     const innerRef = this.getInnerRef();
     innerRef.current.formType = formType;
 
-    if (initialData) {
-      this.setState({ visible: true, formType, formData: initialData });
-      return;
-    }
+    // 合并初始值. openModal 所携带的初始值优先级更大.
+    const propsInitialValues = this.props.formProps?.initialValues || {};
+    const initialValues = { ...propsInitialValues, ...initialData };
 
     this.setState({
       visible: true,
       formType,
-      formData: this.props.formProps?.initialValues || {},
+      formData: initialValues,
     });
   };
 
@@ -204,13 +203,26 @@ class ModalForm extends Component<
   };
 
   getColumns = (): any => {
+    const { formData } = this.state;
+    const { open } = this.props;
+
     const $cols = normalizeTree(
       this.props.columns,
       (item) => {
         /** 去掉 width 属性, 因为在表单中不需要 width */
-        const { width, ...rest } = item;
-
-        return rest;
+        const { width, initialValue, ...rest } = item;
+
+        // columns 上和 SchemaForm 组件的 initialValues 上不能有相同的字段, 否则会有告警.
+        // Form already set 'initialValues' with path 'name'. Field can not overwrite it
+        if (
+          !open &&
+          typeof item.dataIndex === 'string' &&
+          formData.hasOwnProperty(item.dataIndex)
+        ) {
+          return rest;
+        } else {
+          return { initialValue, ...rest };
+        }
       },
       { replace: true },
     );