tntd 2.7.2 → 2.7.4

package/es/tntd-form/TntdForm/index.js

@@ -10,41 +10,46 @@ import { validateFields, getFieldsValue, getFieldValue } from './utils';
 import { FormContext } from './store';
 import List from './components/List';
 import Item from './components/Item';
-const TntdForm = ({ form, initialValues, children }) => {
-    const updateRefs = useRef({
-        shouldUpdateList: [],
-        dependencies: {},
-    });
-    const compsRefs = useRef({});
-    return (React.createElement(FormContext.Provider, { value: {
-            form,
-            initialValues,
-            updateRefs,
-            compsRefs,
-        } }, children));
+const TntdForm = ({
+  form,
+  initialValues,
+  children
+}) => {
+  const updateRefs = useRef({
+    shouldUpdateList: [],
+    dependencies: {}
+  });
+  const compsRefs = useRef({});
+  return React.createElement(FormContext.Provider, {
+    value: {
+      form,
+      initialValues,
+      updateRefs,
+      compsRefs
+    }
+  }, children);
 };
 TntdForm.useForm = () => {
-    const form = useRef({
-        dataLevel: {},
-        formData: {},
-        validateFields: () => validateFields(form.current),
-        getFieldsValue: () => getFieldsValue(form.current),
-        getFieldValue: (field) => getFieldValue(form.current, field),
-        setFieldsValue: (obj) => {
-            for (const i in obj) {
-                if (Object.prototype.hasOwnProperty.call(obj, i)) {
-                    const prefix = (i === null || i === void 0 ? void 0 : i.split('.')) || [];
-                    const attr = prefix.pop();
-                    if (attr && form.current.formData[prefix.join('.')][attr]) {
-                        form.current.formData[prefix.join('.')][attr].setItemValue(obj[i]);
-                    }
-                }
-            }
-        },
-    });
-    return [form.current];
+  const form = useRef({
+    dataLevel: {},
+    formData: {},
+    validateFields: () => validateFields(form.current),
+    getFieldsValue: () => getFieldsValue(form.current),
+    getFieldValue: field => getFieldValue(form.current, field),
+    setFieldsValue: obj => {
+      for (const i in obj) {
+        if (Object.prototype.hasOwnProperty.call(obj, i)) {
+          const prefix = (i === null || i === void 0 ? void 0 : i.split('.')) || [];
+          const attr = prefix.pop();
+          if (attr && form.current.formData[prefix.join('.')][attr]) {
+            form.current.formData[prefix.join('.')][attr].setItemValue(obj[i]);
+          }
+        }
+      }
+    }
+  });
+  return [form.current];
 };
 TntdForm.List = List;
 TntdForm.Item = Item;
-export default TntdForm;
-//# sourceMappingURL=index.js.map
+export default TntdForm;

package/es/tntd-form/TntdForm/interface.js

@@ -1,2 +1 @@
-export {};
-//# sourceMappingURL=interface.js.map
+export {};

package/es/tntd-form/TntdForm/store.js

@@ -1,3 +1,2 @@
 import React from 'react';
-export const FormContext = React.createContext({});
-//# sourceMappingURL=store.js.map
+export const FormContext = React.createContext({});

package/es/tntd-form/TntdForm/utils.js

@@ -1,21 +1,20 @@
 export const isValidKey = (key, object) => {
-    return key in object;
+  return key in object;
 };
 /**
  * 将xx.xx.xx 转换为数组
  * @param {*} name
  * @returns
  */
-export const getNames = (name) => {
-    let attrs = [];
-    if (Array.isArray(name)) {
-        const [str, ...rest] = name;
-        attrs = str.split('.').concat(rest);
-    }
-    else {
-        attrs = typeof name === 'string' ? name.split('.') : [];
-    }
-    return attrs;
+export const getNames = name => {
+  let attrs = [];
+  if (Array.isArray(name)) {
+    const [str, ...rest] = name;
+    attrs = str.split('.').concat(rest);
+  } else {
+    attrs = typeof name === 'string' ? name.split('.') : [];
+  }
+  return attrs;
 };
 /**
  * 对数据进行校验
@@ -25,34 +24,32 @@ export const getNames = (name) => {
  * @returns
  */
 export const recursionCheck = (list, dataLevel, formData, errorList = []) => {
-    try {
-        if (Array.isArray(list)) {
-            list.forEach((item) => {
-                const key = item.name;
-                const attrs = Object.keys(formData[key]);
-                attrs.forEach((attr) => {
-                    var _a;
-                    const error = (_a = formData[item.name][attr]) === null || _a === void 0 ? void 0 : _a.checkItem();
-                    if (error) {
-                        errorList.push(`${[item.name + '.' + attr]}:`, error);
-                    }
-                });
-                if (dataLevel[key]) {
-                    recursionCheck(dataLevel[key], dataLevel, formData, errorList);
-                }
-            });
+  try {
+    if (Array.isArray(list)) {
+      list.forEach(item => {
+        const key = item.name;
+        const attrs = Object.keys(formData[key]);
+        attrs.forEach(attr => {
+          var _a;
+          const error = (_a = formData[item.name][attr]) === null || _a === void 0 ? void 0 : _a.checkItem();
+          if (error) {
+            errorList.push(`${[item.name + '.' + attr]}:`, error);
+          }
+        });
+        if (dataLevel[key]) {
+          recursionCheck(dataLevel[key], dataLevel, formData, errorList);
         }
-        return errorList;
+      });
     }
-    catch (e) {
-        if (typeof e === 'string') {
-            throw e.toUpperCase();
-        }
-        else if (e instanceof Error) {
-            throw e.message;
-        }
-        throw e;
+    return errorList;
+  } catch (e) {
+    if (typeof e === 'string') {
+      throw e.toUpperCase();
+    } else if (e instanceof Error) {
+      throw e.message;
     }
+    throw e;
+  }
 };
 /**
  * 将数据进行排序
@@ -63,78 +60,74 @@ export const recursionCheck = (list, dataLevel, formData, errorList = []) => {
  * @returns
  */
 export const recursionSort = (list, dataLevel, formData) => {
-    try {
-        if (Array.isArray(list)) {
-            const values = list.reduce((total, item, index) => {
-                const attrObj = {};
-                const key = item.name;
-                const prefixs = key.split('.');
-                const attrs = formData[key] ? Object.keys(formData[key]) : [];
-                attrs.forEach((attr) => {
-                    var _a;
-                    attrObj[attr] = (_a = formData[key][attr]) === null || _a === void 0 ? void 0 : _a.value;
-                });
-                let children = [];
-                if (dataLevel[key]) {
-                    children = recursionSort(dataLevel[key], dataLevel, formData);
-                }
-                const len = prefixs.length - 2;
-                if (total[prefixs[len]]) {
-                    total[prefixs[len]][index] = Object.assign(Object.assign({}, attrObj), (children || []));
-                }
-                else {
-                    total[prefixs[len]] = [
-                        Object.assign(Object.assign({}, attrObj), (children || [])),
-                    ];
-                }
-                return total;
-            }, {});
-            return values;
-        }
+  try {
+    if (Array.isArray(list)) {
+      const values = list.reduce((total, item, index) => {
+        const attrObj = {};
+        const key = item.name;
+        const prefixs = key.split('.');
+        const attrs = formData[key] ? Object.keys(formData[key]) : [];
+        attrs.forEach(attr => {
+          var _a;
+          attrObj[attr] = (_a = formData[key][attr]) === null || _a === void 0 ? void 0 : _a.value;
+        });
+        let children = [];
+        if (dataLevel[key]) {
+          children = recursionSort(dataLevel[key], dataLevel, formData);
+        }
+        const len = prefixs.length - 2;
+        if (total[prefixs[len]]) {
+          total[prefixs[len]][index] = Object.assign(Object.assign({}, attrObj), children || []);
+        } else {
+          total[prefixs[len]] = [Object.assign(Object.assign({}, attrObj), children || [])];
+        }
+        return total;
+      }, {});
+      return values;
     }
-    catch (e) {
-        if (typeof e === 'string') {
-            console.error(e.toUpperCase());
-            throw e.toUpperCase();
-        }
-        else if (e instanceof Error) {
-            console.error(e.message);
-            throw e.message;
-        }
-        throw e;
+  } catch (e) {
+    if (typeof e === 'string') {
+      console.error(e.toUpperCase());
+      throw e.toUpperCase();
+    } else if (e instanceof Error) {
+      console.error(e.message);
+      throw e.message;
     }
+    throw e;
+  }
 };
 /**
  * 获取form表单的value
  * @param {*} formCurrent
  * @returns
  */
-export const getFieldsValue = (formCurrent) => {
-    try {
-        const { formData, dataLevel } = formCurrent;
-        let firstKey = '';
-        // 这里不直接用Object.keys的原因是Object.keys并不能保证一定是按照属性顺序
-        for (const i in dataLevel) {
-            if (Object.prototype.hasOwnProperty.call(dataLevel, i)) {
-                firstKey = i;
-                break;
-            }
-        }
-        const recursionStart = dataLevel[firstKey];
-        const values = recursionSort(recursionStart, dataLevel, formData);
-        return values;
+export const getFieldsValue = formCurrent => {
+  try {
+    const {
+      formData,
+      dataLevel
+    } = formCurrent;
+    let firstKey = '';
+    // 这里不直接用Object.keys的原因是Object.keys并不能保证一定是按照属性顺序
+    for (const i in dataLevel) {
+      if (Object.prototype.hasOwnProperty.call(dataLevel, i)) {
+        firstKey = i;
+        break;
+      }
     }
-    catch (e) {
-        if (typeof e === 'string') {
-            console.error(e.toUpperCase());
-            return e.toUpperCase();
-        }
-        else if (e instanceof Error) {
-            console.error(e.message);
-            return e.message;
-        }
-        return e;
+    const recursionStart = dataLevel[firstKey];
+    const values = recursionSort(recursionStart, dataLevel, formData);
+    return values;
+  } catch (e) {
+    if (typeof e === 'string') {
+      console.error(e.toUpperCase());
+      return e.toUpperCase();
+    } else if (e instanceof Error) {
+      console.error(e.message);
+      return e.message;
     }
+    return e;
+  }
 };
 /**
  * 获取form表单的value
@@ -142,88 +135,85 @@ export const getFieldsValue = (formCurrent) => {
  * @returns
  */
 export const getFieldValue = (formCurrent, field) => {
-    var _a, _b;
-    try {
-        const { formData } = formCurrent;
-        return formData && ((_b = (_a = formData === null || formData === void 0 ? void 0 : formData[field[0]]) === null || _a === void 0 ? void 0 : _a[field[1]]) === null || _b === void 0 ? void 0 : _b.value);
-    }
-    catch (e) {
-        if (typeof e === 'string') {
-            return e.toUpperCase();
-        }
-        else if (e instanceof Error) {
-            return e.message;
-        }
-        return e;
+  var _a, _b;
+  try {
+    const {
+      formData
+    } = formCurrent;
+    return formData && ((_b = (_a = formData === null || formData === void 0 ? void 0 : formData[field[0]]) === null || _a === void 0 ? void 0 : _a[field[1]]) === null || _b === void 0 ? void 0 : _b.value);
+  } catch (e) {
+    if (typeof e === 'string') {
+      return e.toUpperCase();
+    } else if (e instanceof Error) {
+      return e.message;
     }
+    return e;
+  }
 };
 /**
  * 提交时候校验的方法
  * @param {*} formCurrent
  * @returns
  */
-export const validateFields = (formCurrent) => {
-    return new Promise((resolve) => {
-        const { formData, dataLevel } = formCurrent;
-        let firstKey = '';
-        // 这里不直接用Object.keys的原因是Object.keys并不能保证一定是按照属性顺序
-        for (const i in dataLevel) {
-            if (Object.prototype.hasOwnProperty.call(dataLevel, i)) {
-                firstKey = i;
-                break;
-            }
-        }
-        const recursionStart = dataLevel[firstKey];
-        const errorList = recursionCheck(recursionStart, dataLevel, formData);
-        if (Array.isArray(errorList) && errorList.length) {
-            console.error(JSON.stringify(errorList));
-        }
-        else {
-            resolve(recursionSort(recursionStart, dataLevel, formData));
-        }
-    });
+export const validateFields = formCurrent => {
+  return new Promise(resolve => {
+    const {
+      formData,
+      dataLevel
+    } = formCurrent;
+    let firstKey = '';
+    // 这里不直接用Object.keys的原因是Object.keys并不能保证一定是按照属性顺序
+    for (const i in dataLevel) {
+      if (Object.prototype.hasOwnProperty.call(dataLevel, i)) {
+        firstKey = i;
+        break;
+      }
+    }
+    const recursionStart = dataLevel[firstKey];
+    const errorList = recursionCheck(recursionStart, dataLevel, formData);
+    if (Array.isArray(errorList) && errorList.length) {
+      console.error(JSON.stringify(errorList));
+    } else {
+      resolve(recursionSort(recursionStart, dataLevel, formData));
+    }
+  });
 };
 /** 获取初始化的值 */
 export const getInitValue = (initialValues, names) => {
-    let keys = [];
-    if (Array.isArray(names)) {
-        const [str, ...rest] = names;
-        keys = str.split('.').concat(rest);
-    }
-    if (Array.isArray(keys) && !!keys.length) {
-        keys.forEach((i) => {
-            initialValues = ['', null, undefined].includes(initialValues === null || initialValues === void 0 ? void 0 : initialValues[i])
-                ? undefined
-                : initialValues === null || initialValues === void 0 ? void 0 : initialValues[i];
-        });
-    }
-    return initialValues;
+  let keys = [];
+  if (Array.isArray(names)) {
+    const [str, ...rest] = names;
+    keys = str.split('.').concat(rest);
+  }
+  if (Array.isArray(keys) && !!keys.length) {
+    keys.forEach(i => {
+      initialValues = ['', null, undefined].includes(initialValues === null || initialValues === void 0 ? void 0 : initialValues[i]) ? undefined : initialValues === null || initialValues === void 0 ? void 0 : initialValues[i];
+    });
+  }
+  return initialValues;
 };
 /** 校验表单是否正确的方法 */
 export const handleCheckItem = (value, rules) => {
-    try {
-        if (Array.isArray(rules)) {
-            rules.forEach((i) => {
-                // @ts-ignore
-                if (i.required && ['', null, undefined].includes(value)) {
-                    throw new Error((i === null || i === void 0 ? void 0 : i.message) || 'error');
-                }
-                if (i === null || i === void 0 ? void 0 : i.validator) {
-                    i.validator(rules, value, function (_errorMsg) {
-                        throw new Error(_errorMsg);
-                    });
-                }
-            });
-        }
-        return;
+  try {
+    if (Array.isArray(rules)) {
+      rules.forEach(i => {
+        // @ts-ignore
+        if (i.required && ['', null, undefined].includes(value)) {
+          throw new Error((i === null || i === void 0 ? void 0 : i.message) || 'error');
+        }
+        if (i === null || i === void 0 ? void 0 : i.validator) {
+          i.validator(rules, value, function (_errorMsg) {
+            throw new Error(_errorMsg);
+          });
+        }
+      });
     }
-    catch (e) {
-        if (typeof e === 'string') {
-            return e.toUpperCase();
-        }
-        else if (e instanceof Error) {
-            return e.message;
-        }
+    return;
+  } catch (e) {
+    if (typeof e === 'string') {
+      return e.toUpperCase();
+    } else if (e instanceof Error) {
+      return e.message;
     }
-};
-//# sourceMappingURL=utils.js.map
+  }
+};

package/es/tntd-form/tntd-form.stories.js

@@ -13,8 +13,8 @@ import React, { useEffect, useRef, useState } from 'react';
 import Form from './index';
 import { Input, InputNumber, Checkbox, Button, Select, Radio, Row, message, Icon, Modal, Drawer, Cascader, DatePicker, TimePicker, TreeSelect, Switch, Upload, } from '../index';
 import moment from 'moment';
-const { TreeNode } = TreeSelect;
 const { Option } = Select;
+const { TreeNode } = TreeSelect;
 const options = [
     { label: 'Apple', value: 'apple' },
     { label: 'Pear', value: 'pear' },
@@ -50,8 +50,8 @@ Basic.args = {
             React.createElement(Input, null)),
         React.createElement(Form.Item, { label: "Password", name: "password", rules: [{ required: true, message: 'Please input your password!' }] },
             React.createElement(Input.Password, null)),
-        React.createElement(Form.Item, { label: "TreeSelect", name: "treeSelect" },
-            React.createElement(TreeSelect, { treeDefaultExpandAll: true, showSearch: true },
+        React.createElement(Form.Item, { label: "TreeSelect", name: "treeSelect", rules: [{ required: true, message: 'Please select one node' }] },
+            React.createElement(TreeSelect, { showSearch: true, treeDefaultExpandAll: true, allowClear: true },
                 React.createElement(TreeNode, { value: "parent 1", title: "parent 1", key: "0-1" },
                     React.createElement(TreeNode, { value: "parent 1-0", title: "parent 1-0", key: "0-1-1" },
                         React.createElement(TreeNode, { value: "leaf1", title: "my leaf", key: "random" }),
@@ -268,13 +268,14 @@ export const DynamicItemsComplex = DynamicItemsComplexTpl.bind({});
 // 弹窗中表单
 const FormInModalTpl = () => {
     const [data, setData] = useState({});
+    const [destroyOnClose, setDestroyOnClose] = useState(true);
     const [popupType, setPopupType] = useState('modal');
     const PopupCom = {
         modal: Modal,
         drawer: Drawer,
     }[popupType];
-    const [form] = Form.useForm();
     const close = () => setData(null);
+    const [form] = Form.useForm();
     return (React.createElement(React.Fragment, null,
         React.createElement(Button, { type: "primary", onClick: () => setData({}), style: { marginRight: 12 } }, "\u65B0\u5EFA"),
         React.createElement(Button, { type: "primary", style: { marginRight: 12, marginBottom: 12 }, onClick: () => setData({
@@ -286,7 +287,8 @@ const FormInModalTpl = () => {
         React.createElement(Radio.Group, { value: popupType, onChange: (evt) => setPopupType(evt.target.value) },
             React.createElement(Radio.Button, { value: "modal" }, "\u5F39\u7A97"),
             React.createElement(Radio.Button, { value: "drawer" }, "\u62BD\u5C49")),
-        React.createElement(PopupCom, { title: `${(data === null || data === void 0 ? void 0 : data.id) ? '编辑' : '新建'}`, visible: !!data, width: "40%", destroyOnClose: true, onClose: close, onCancel: close, onOk: close },
+        React.createElement(Switch, { onClick: () => setDestroyOnClose(!destroyOnClose), checked: destroyOnClose, checkedChildren: "\u5173\u95ED\u65F6\u9500\u6BC1\u5B50\u5143\u7D20", unCheckedChildren: "\u5173\u95ED\u65F6\u4E0D\u9500\u6BC1\u5B50\u5143\u7D20" }),
+        React.createElement(PopupCom, { title: `${(data === null || data === void 0 ? void 0 : data.id) ? '编辑' : '新建'}`, visible: !!data, width: "40%", destroyOnClose: destroyOnClose, onClose: close, onCancel: close, onOk: close },
             React.createElement(Form, { initialValues: data, form: form },
                 React.createElement(Form.Item, { name: "name", label: "\u540D\u79F0" },
                     React.createElement(Input, null)),