@hw-component/form 1.2.5 → 1.2.7

package/src/pages/Form/index.tsx

@@ -1,202 +1,187 @@
 import { HForm, HFormConfigProvider, useHForm } from "../../components";
-import { Button, Form, Input } from "antd";
-import React from "react";
-import {useRequest} from "ahooks";
-import {MediaTypeEnum} from "../../components/Upload/enums";
+import { useState } from "react";
+import { Button, DatePicker, Form, Input } from "antd";
 
-const formData = () => {
-  return [
-    {
-      label: "测试",
-      className: "hdjd",
-      name:"nameTest"
-    },
-    {
-      label: "测试1",
-      type: "select",
-    },
-    {
-      label: "测试1",
-      type: "inputNumber",
-    },
-    {
-      noStyle: true,
-      render: () => {
-        return <div>你好a</div>;
-      },
-    },
-    {
-      label: "时间",
-      type: "rangePicker",
-      name: "rangePicker",
-      itemProps: {
-        subProvider: () => {
-          console.log("fff");
+const formData = (options) => {
+    const op = [
+        {
+            key: 1,
+            value: "是",
         },
-      },
-    },
-    {
-      label:(form)=>{
-        const nameTest=form.getFieldValue("nameTest")
-        return nameTest;
-      },
-      name: "checkboxGroup",
-      type: "checkboxGroup",
-      rules: [{ required: true }],
-      shouldUpdate:()=>{
-        return true;
-      },
-      helper: "帮助我",
-      options: [
-        { value: "选择1", key: "check1" },
-        { value: "选择2", key: "check2" },
-      ],
-      direction: "vertical",
-      labelAlign: "topLeft",
-    },
-    {
-      label: "开关",
-      name: "switch",
-      type: "switch",
-      rules: [{ required: true }],
-      itemProps: {
-        valueMap: {
-          open: 1,
-          close: 0,
+        {
+            key: 0,
+            value: "否",
         },
-      },
-    },
-    {
-      type: "submit",
-      itemProps: {
-        extraList: [
-          <Button
-            key="wh"
-            onClick={() => {
-              console.log("起飞");
-            }}
-          >
-            芜湖
-          </Button>,
-          "666",
-          "reset",
-        ],
-      },
-    },
-    {
-      type: "verificationCodeInput",
-      name:"verificationCodeInput",
-      label:"验证码",
-      itemProps: {
-        request:()=>{
-         return new Promise((resolve)=>{
-            setTimeout(()=>{
-              resolve({})
-            },4000);
-         })
+    ];
+    return [
+        {
+            label: "测试",
+            className: "hdjd",
+        },
+        {
+            label: "测试1",
+            type: "select",
+        },
+        {
+            label: "测试1",
+            type: "inputNumber",
+        },
+        {
+            noStyle: true,
+            render: () => {
+                return <div>你好a</div>;
+            },
+        },
+        {
+            label: "时间",
+            type: "rangePicker",
+            name: "rangePicker",
+            itemProps: {
+                subProvider: () => {
+                    console.log("fff");
+                },
+            },
         },
-        buttonProps:{
-          disabled:({nameTest})=>{
-            if (nameTest){
-              return false;
-            }
-            return true;
-          }
-        }
-      },
-      dispatch: {
-        fnKey: "disabled",
-        dependencies: ["nameTest"],
-        manual:false
-      },
-    },
-    {
-      type: "urlUpload",
-      name:"urlUpload",
-      label:"测试",
-      helper:"123123",
-      itemProps: {
-        inputHelper:"fff",
-        style:{
-          width:368
+        {
+            label: "选择",
+            name: "checkboxGroup",
+            type: "checkboxGroup",
+            rules: [{ required: true }],
+            helper: "帮助我",
+            options: [
+                { value: "选择1", key: "check1" },
+                { value: "选择2", key: "check2" },
+            ],
+            direction: "vertical",
+            labelAlign: "topLeft",
         },
-        mediaType:MediaTypeEnum.video,
-        maxSize:1024*1024*10,
-        thumbUrl:"https://inews.gtimg.com/om_bt/OHyQqgC_5oi4Vm0tlH49XvJzqNBHo2Zryxx5F_be5N2cIAA/1000"
-      }
-    },
-  ];
+        {
+            label: "开关",
+            name: "switch",
+            type: "switch",
+            rules: [{ required: true }],
+            itemProps: {
+                valueMap: {
+                    open: 1,
+                    close: 0,
+                },
+            },
+        },
+        {
+            type: "submit",
+            itemProps: {
+                extraList: [
+                    <Button
+                        key="wh"
+                        onClick={() => {
+                            console.log("起飞");
+                        }}
+                    >
+                        芜湖
+                    </Button>,
+                    "666",
+                    "reset",
+                ],
+            },
+        },
+        {
+            type: "submit",
+            itemProps: {
+                extraList: [
+                    <Button
+                        key="wh"
+                        onClick={() => {
+                            console.log("起飞");
+                        }}
+                    >
+                        芜湖
+                    </Button>,
+                    <Ttta key="aa" />,
+                    "666",
+                    "submit",
+                    "reset",
+                ],
+            },
+        },
+    ];
 };
 function Ttta({ form }) {
-  return (
-    <div
-      onClick={() => {
-        console.log("form", form);
-        form.setFieldsValue({ switch: 1 });
-      }}
-    >
-      ttta
-    </div>
-  );
+    return (
+        <div
+            onClick={() => {
+                console.log("form", form);
+                form.setFieldsValue({ switch: 1 });
+            }}
+        >
+            ttta
+        </div>
+    );
 }
 
 const Test = (props) => {
-  return <div>ffff</div>;
+    return <div>ffff</div>;
 };
 export default () => {
-  const form = useHForm();
-  const [aForm] = Form.useForm();
-  const {run,loading}=useRequest(async ()=>{
-     await new Promise((resolve)=>{
-        setTimeout(()=>{
-           resolve({})
-        },2000)
-     })
-  },{manual:true});
-  return (
-    <div style={{ overflow: "auto", height: "90vh" ,padding:30}}>
-      <Form form={aForm} initialValues={{ ttim: "132123" }}>
-        <Form.Item name="ttim" rules={[{ required: true }]}>
-          <Input />
-        </Form.Item>
-      </Form>
-      <HFormConfigProvider
-        valueSwitchMap={{ open: 1, close: 2 }}
-        valueCheckMap={{ noChecked: 0, checked: 1 }}
-        defaultComponent={{
-          test: Test,
-        }}
-        itemProps={{
-          style: {
-            borderRadius: 10,
-          },
-        }}
-        fieldNames={{
-          label: "value",
-          value: "key",
-        }}
-      >
-        <HForm
-          configData={formData()}
-          labelWidth={200}
-          form={form}
-          onFinish={run}
-        />
-      </HFormConfigProvider>
-      <div
-        onClick={() => {
-          form.submit();
-        }}
-      >
-        点我
-      </div>
-      <div
-        onClick={() => {
-          form.resetFieldsInitValue();
-        }}
-      >
-        重置
-      </div>
-    </div>
-  );
-};
+    const form = useHForm();
+    const [options, setOptions] = useState([{ label: "1", value: 1 }]);
+    const [aForm] = Form.useForm();
+    return (
+        <div style={{ overflow: "auto", height: "90vh" }}>
+            <Form form={aForm} initialValues={{ ttim: "132123" }}>
+                <Form.Item name="ttim" rules={[{ required: true }]}>
+                    <Input />
+                </Form.Item>
+            </Form>
+            <HFormConfigProvider
+                valueSwitchMap={{ open: 1, close: 2 }}
+                valueCheckMap={{ noChecked: 0, checked: 1 }}
+                defaultComponent={{
+                    test: Test,
+                }}
+                itemProps={{
+                    style: {
+                        borderRadius: 10,
+                    },
+                }}
+                fieldNames={{
+                    label: "value",
+                    value: "key",
+                }}
+            >
+                <HForm
+                    configData={formData(options)}
+                    labelWidth={200}
+                    form={form}
+                    labelAlign={"right"}
+                    onFinish={(value) => {
+                        console.log(value);
+                    }}
+                    onValuesChange={(val) => {
+                        console.log(val, "onValuesChange");
+                    }}
+                    request={(params) => {
+                        return new Promise<any>((resolve) => {
+                            setTimeout(() => {
+                                resolve(params);
+                            }, 3000);
+                        });
+                    }}
+                />
+            </HFormConfigProvider>
+            <div
+                onClick={() => {
+                    aForm.resetFields();
+                }}
+            >
+                点我
+            </div>
+            <div
+                onClick={() => {
+                    form.resetFieldsInitValue();
+                }}
+            >
+                重置
+            </div>
+        </div>
+    );
+};

package/src/pages/Select/index.tsx

@@ -20,6 +20,7 @@ export default () => {
         placeholder="多选"
         value={selectVal}
         onChange={(val, option) => {
+            console.log(option)
           setSelectVal(val);
         }}
         allSelect={true}