feat: form 逻辑整理

src/pages/businessCustomer/components/CustomerInfo.jsx

@@ -36,6 +36,53 @@ const CustomerInfo = props => {
   const [selectedMealTypes, setSelectedMealTypes] = useState([]);
   const [pickSelfList, setPickSelfList] = useState([]);
 
+  // 1. 表单展示
+  // const formItem = [
+  // {
+  //   label: '企业名称',
+  //   name: 'enterpriseName',
+  //   rules: [{ required: true, message: '请输入企业名称' }],
+  //   component: <Input placeholder="请输入企业名称" />,
+  // },
+
+  // 2. 预加载数据, 数据模型转换,用于表单回显
+
+  // 3. 表单交互逻辑
+
+  // 4. 表单校验
+  const validateForm = async () => {
+    const res = await form.validateFields();
+    console.log(11, res);
+    // TODO 其他校验
+  };
+
+  // 5. 数据模型转换, 表单到接口的转换, 可以用 lodash
+  const tranformFormData = data => {};
+
+  // 6. 表单关闭
+  const closeModal = index => {
+    if (props.onClose && typeof props.onClose === 'function') {
+      props.onClose(!!index);
+    }
+  };
+
+  // 7. 表单提交
+
+  const sumbitForm = async () => {
+    const valid = await validateForm();
+    if (!valid) {
+      return false;
+    }
+    return false;
+    // const params = tranformFormData(res);
+    // const resp = await apiNewEnterprise(params);
+    // if (resp && resp.data) {
+    //   // 保存成功后刷新列表
+    //   closeModal(1);
+    //   notification.success({ message: '保存成功！' });
+    // }
+  };
+
   // 校验时间
   const checkTime = (arr, curren, curName) => {
     let valid = false;
@@ -127,7 +174,7 @@ const CustomerInfo = props => {
     const resp = await api(params);
     if (resp && resp.data) {
       // 保存成功后刷新列表
-      props.onClose && props.onClose(true);
+      closeModal(1);
       notification.success({ message: '保存成功！' });
     }
   };
@@ -299,8 +346,8 @@ const CustomerInfo = props => {
       destroyOnClose
       maskClosable={false}
       width="900px"
-      onOk={handleConfirm}
-      onCancel={() => props.onClose(false)}
+      onOk={sumbitForm}
+      onCancel={() => closeModal(0)}
     >
       <Form
         name="basicInfo"