wargerm 0.2.7 → 0.2.11

package/dist/components/WForm/index.d.ts

@@ -47,6 +47,7 @@ export interface WFormProps extends FormProps {
     className?: string;
     style?: React.CSSProperties;
     columns: ColumnProps[];
+    extraColumns?: ColumnProps[];
     disabled?: boolean;
     disabledHideInSearch?: boolean;
     onSubmit?: (params: Record<string, any>) => void;

package/dist/index.esm.js

@@ -38,7 +38,7 @@ import _TreeSelect from 'antd/es/tree-select';
 import uniqBy from 'lodash/uniqBy';
 import CountUp from 'react-countup';
 import { Swiper, SwiperSlide } from 'swiper/react';
-import SwiperCore, { Pagination, Navigation } from 'swiper';
+import SwiperCore, { Pagination, Navigation, Autoplay } from 'swiper';
 import 'antd/es/breadcrumb/style';
 import _Breadcrumb from 'antd/es/breadcrumb';
 import ReactDOM from 'react-dom';
@@ -7532,11 +7532,12 @@ Table.defaultProps = {
   rowKey: 'key'
 };
 
-var _excluded$5 = ["columns", "className", "style", "search", "disabled", "disabledHideInSearch", "onSubmit", "onReset"];
+var _excluded$5 = ["columns", "extraColumns", "className", "style", "search", "disabled", "disabledHideInSearch", "onSubmit", "onReset"];
 var RangePicker$2 = Index$2.RangePicker;
 
 var WForm = function WForm(props, ref) {
   var columns = props.columns,
+      extraColumns = props.extraColumns,
       className = props.className,
       style = props.style,
       search = props.search,
@@ -7560,11 +7561,18 @@ var WForm = function WForm(props, ref) {
       columnsFields = _useState4[0],
       setColumnsFields = _useState4[1];
 
-  var filterFormColumns = columns.filter(function (c) {
+  var filterFormColumns = _toConsumableArray(columns).filter(function (c) {
     return !c.hideInSearch || disabledHideInSearch;
   }).sort(function (a, b) {
     return (b.order || 0) - (a.order || 0);
   });
+
+  var filterExtraFormColumns = _toConsumableArray(extraColumns || []).filter(function (c) {
+    return !c.hideInSearch || disabledHideInSearch;
+  }).sort(function (a, b) {
+    return (b.order || 0) - (a.order || 0);
+  });
+
   var filterForm = useMemo(function () {
     return filterFormColumns.map(function (c) {
       var colProps = {};
@@ -7916,7 +7924,8 @@ var WForm = function WForm(props, ref) {
 
         var baseitem = c.renderFormItem(c, _objectSpread2(_objectSpread2({}, c), {}, {
           formItemProps: c.formItemProps,
-          fieldProps: c.fieldProps
+          fieldProps: c.fieldProps,
+          columnsFields: columnsFields
         }), form);
         return baseitem ? /*#__PURE__*/React.createElement(_Col, _objectSpread2(_objectSpread2({
           style: {
@@ -8013,7 +8022,457 @@ var WForm = function WForm(props, ref) {
         }, c.fieldProps))));
       }
     });
-  }, [changedValues, disabled, JSON.stringify(form.getFieldsValue())]);
+  }, [changedValues, columns, disabled, JSON.stringify(form.getFieldsValue())]);
+  var filterExtraColumnsForm = useMemo(function () {
+    return filterExtraFormColumns.map(function (c) {
+      var colProps = {};
+
+      if (search && search.span) {
+        colProps.span = typeof search.span == 'number' ? (c.colSize || 1) * search.span : {
+          xs: 24,
+          sm: 24,
+          md: 12,
+          lg: 12,
+          xl: 8,
+          xxl: 6
+        };
+      }
+
+      if (c.valueType == 'select') {
+        var _extraProps3 = {};
+
+        if (c.request) {
+          _extraProps3.request = c.request;
+        } else if (c.valueEnum) {
+          _extraProps3.valueEnum = c.valueEnum;
+        }
+
+        var labelCol = {};
+
+        if (search && search.labelWidth) {
+          labelCol.style = {
+            width: search.labelWidth
+          };
+        }
+
+        return /*#__PURE__*/React.createElement(_Col, _objectSpread2(_objectSpread2({
+          style: {
+            paddingLeft: '12px',
+            paddingRight: '12px'
+          }
+        }, colProps), {}, {
+          key: c.dataIndex
+        }), /*#__PURE__*/React.createElement(_Form.Item, _objectSpread2(_objectSpread2({
+          initialValue: c.initialValue
+        }, c.formItemProps), {}, {
+          name: c.dataIndex,
+          label: c.title,
+          labelCol: labelCol
+        }), /*#__PURE__*/React.createElement(Index$1, _objectSpread2(_objectSpread2({
+          placeholder: "\u8BF7\u9009\u62E9",
+          disabled: disabled,
+          onLoad: function onLoad(opt) {
+            setColumnsFields(function (preColumnsFields) {
+              return _objectSpread2(_objectSpread2({}, preColumnsFields), {}, _defineProperty({}, c.dataIndex, opt));
+            });
+          }
+        }, c.fieldProps), _extraProps3))));
+      } else if (c.valueType == 'treeSelect') {
+        var _extraProps4 = {};
+
+        if (c.request) {
+          _extraProps4.request = c.request;
+        }
+
+        var _labelCol12 = {};
+
+        if (search && search.labelWidth) {
+          _labelCol12.style = {
+            width: search.labelWidth
+          };
+        }
+
+        return /*#__PURE__*/React.createElement(_Col, _objectSpread2(_objectSpread2({
+          style: {
+            paddingLeft: '12px',
+            paddingRight: '12px'
+          }
+        }, colProps), {}, {
+          key: c.dataIndex
+        }), /*#__PURE__*/React.createElement(_Form.Item, _objectSpread2(_objectSpread2({
+          initialValue: c.initialValue
+        }, c.formItemProps), {}, {
+          name: c.dataIndex,
+          label: c.title,
+          labelCol: _labelCol12
+        }), /*#__PURE__*/React.createElement(Index$5, _objectSpread2(_objectSpread2({
+          disabled: disabled,
+          placeholder: "\u8BF7\u9009\u62E9",
+          onLoad: function onLoad(opt) {}
+        }, c.fieldProps), _extraProps4))));
+      } else if (c.valueType && ['date', 'dateTime', 'dateMonth', 'dateYear'].includes(c.valueType)) {
+        var _labelCol13 = {};
+
+        if (search && search.labelWidth) {
+          _labelCol13.style = {
+            width: search.labelWidth
+          };
+        }
+
+        var showTime = {};
+        var picker = {};
+
+        if (c.valueType == 'dateTime') {
+          showTime = {
+            showTime: {
+              format: 'HH:mm'
+            }
+          };
+        }
+
+        if (c.valueType == 'dateMonth') {
+          picker = {
+            picker: 'month'
+          };
+        }
+
+        if (c.valueType == 'dateYear') {
+          picker = {
+            picker: 'year'
+          };
+        }
+
+        return /*#__PURE__*/React.createElement(_Col, _objectSpread2(_objectSpread2({
+          style: {
+            paddingLeft: '12px',
+            paddingRight: '12px'
+          }
+        }, colProps), {}, {
+          key: c.dataIndex
+        }), /*#__PURE__*/React.createElement(_Form.Item, _objectSpread2(_objectSpread2({
+          initialValue: c.initialValue
+        }, c.formItemProps), {}, {
+          name: c.dataIndex,
+          label: c.title,
+          labelCol: _labelCol13
+        }), /*#__PURE__*/React.createElement(Index$2, _objectSpread2(_objectSpread2(_objectSpread2({
+          disabled: disabled,
+          placeholder: "\u8BF7\u8F93\u5165"
+        }, picker), showTime), c.fieldProps))));
+      } else if (c.valueType === 'dateRange' || c.valueType === 'dateTimeRange') {
+        var _labelCol14 = {};
+
+        if (search && search.labelWidth) {
+          _labelCol14.style = {
+            width: search.labelWidth
+          };
+        }
+
+        var _showTime2 = {};
+
+        if (c.valueType == 'dateTimeRange') {
+          _showTime2 = {
+            showTime: {
+              format: 'HH:mm'
+            }
+          };
+        }
+
+        return /*#__PURE__*/React.createElement(_Col, _objectSpread2(_objectSpread2({
+          style: {
+            paddingLeft: '12px',
+            paddingRight: '12px'
+          }
+        }, colProps), {}, {
+          key: c.dataIndex
+        }), /*#__PURE__*/React.createElement(_Form.Item, _objectSpread2(_objectSpread2({
+          initialValue: c.initialValue
+        }, c.formItemProps), {}, {
+          name: c.dataIndex,
+          label: c.title,
+          labelCol: _labelCol14
+        }), /*#__PURE__*/React.createElement(RangePicker$2, _objectSpread2(_objectSpread2({
+          disabled: disabled
+        }, _showTime2), c.fieldProps))));
+      } else if (c.valueType === 'checkbox') {
+        var options = [];
+
+        if (c.valueEnum) {
+          for (var key in c.valueEnum) {
+            var text = c.valueEnum[key].text;
+            options.push({
+              label: text,
+              value: key
+            });
+          }
+        }
+
+        if (c.options) {
+          options = c.options;
+        }
+
+        setColumnsFields(function (preColumnsFields) {
+          return _objectSpread2(_objectSpread2({}, preColumnsFields), {}, _defineProperty({}, c.dataIndex, options));
+        });
+        var _labelCol15 = {};
+
+        if (search && search.labelWidth) {
+          _labelCol15.style = {
+            width: search.labelWidth
+          };
+        }
+
+        return /*#__PURE__*/React.createElement(_Col, _objectSpread2(_objectSpread2({
+          style: {
+            paddingLeft: '12px',
+            paddingRight: '12px'
+          }
+        }, colProps), {}, {
+          key: c.dataIndex
+        }), /*#__PURE__*/React.createElement(_Form.Item, _objectSpread2(_objectSpread2({
+          initialValue: c.initialValue
+        }, c.formItemProps), {}, {
+          name: c.dataIndex,
+          label: c.title,
+          labelCol: _labelCol15
+        }), /*#__PURE__*/React.createElement(Index$4.Group, _objectSpread2({
+          disabled: disabled,
+          options: options
+        }, c.fieldProps))));
+      } else if (c.valueType === 'radio' || c.valueType === 'radioButton') {
+        var _options3 = [];
+
+        if (c.options) {
+          _options3 = c.options;
+        }
+
+        if (c.valueEnum) {
+          for (var _key3 in c.valueEnum) {
+            var _text3 = c.valueEnum[_key3].text;
+
+            _options3.push({
+              label: _text3,
+              value: _key3
+            });
+          }
+        }
+
+        setColumnsFields(function (preColumnsFields) {
+          return _objectSpread2(_objectSpread2({}, preColumnsFields), {}, _defineProperty({}, c.dataIndex, _options3));
+        });
+        var _labelCol16 = {};
+
+        if (search && search.labelWidth) {
+          _labelCol16.style = {
+            width: search.labelWidth
+          };
+        }
+
+        var radioButtonProps = {};
+
+        if (c.valueType === 'radioButton') {
+          radioButtonProps = {
+            optionType: 'button',
+            buttonStyle: 'solid'
+          };
+        }
+
+        return /*#__PURE__*/React.createElement(_Col, _objectSpread2(_objectSpread2({
+          style: {
+            paddingLeft: '12px',
+            paddingRight: '12px'
+          }
+        }, colProps), {}, {
+          key: c.dataIndex
+        }), /*#__PURE__*/React.createElement(_Form.Item, _objectSpread2(_objectSpread2({
+          initialValue: c.initialValue
+        }, c.formItemProps), {}, {
+          name: c.dataIndex,
+          label: c.title,
+          labelCol: _labelCol16
+        }), /*#__PURE__*/React.createElement(Index$3.Group, _objectSpread2(_objectSpread2({
+          disabled: disabled
+        }, radioButtonProps), {}, {
+          options: _options3
+        }, c.fieldProps))));
+      } else if (c.valueType === 'switch') {
+        var _options4 = [];
+
+        if (c.valueEnum) {
+          for (var _key4 in c.valueEnum) {
+            var _text4 = c.valueEnum[_key4].text;
+
+            _options4.push({
+              label: _text4,
+              value: _key4
+            });
+          }
+        }
+
+        var _labelCol17 = {};
+
+        if (search && search.labelWidth) {
+          _labelCol17.style = {
+            width: search.labelWidth
+          };
+        }
+
+        setColumnsFields(function (preColumnsFields) {
+          return _objectSpread2(_objectSpread2({}, preColumnsFields), {}, _defineProperty({}, c.dataIndex, _options4));
+        });
+        return /*#__PURE__*/React.createElement(_Col, _objectSpread2(_objectSpread2({
+          style: {
+            paddingLeft: '12px',
+            paddingRight: '12px'
+          }
+        }, colProps), {}, {
+          key: c.dataIndex
+        }), /*#__PURE__*/React.createElement(_Form.Item, _objectSpread2(_objectSpread2({
+          initialValue: c.initialValue,
+          valuePropName: "checked"
+        }, c.formItemProps), {}, {
+          name: c.dataIndex,
+          label: c.title,
+          labelCol: _labelCol17
+        }), /*#__PURE__*/React.createElement(WSwitch, _objectSpread2({
+          disabled: disabled
+        }, c.fieldProps))));
+      } else if (c.valueType === 'digit') {
+        var _labelCol18 = {};
+
+        if (search && search.labelWidth) {
+          _labelCol18.style = {
+            width: search.labelWidth
+          };
+        }
+
+        return /*#__PURE__*/React.createElement(_Col, _objectSpread2(_objectSpread2({
+          style: {
+            paddingLeft: '12px',
+            paddingRight: '12px'
+          }
+        }, colProps), {}, {
+          key: c.dataIndex
+        }), /*#__PURE__*/React.createElement(_Form.Item, _objectSpread2(_objectSpread2({
+          initialValue: c.initialValue
+        }, c.formItemProps), {}, {
+          name: c.dataIndex,
+          label: c.title,
+          labelCol: _labelCol18
+        }), /*#__PURE__*/React.createElement(NumericInput, _objectSpread2({
+          disabled: disabled,
+          placeholder: "\u8BF7\u8F93\u5165\u53C2\u6570(double/int)"
+        }, c.fieldProps))));
+      } else if (c.renderFormItem) {
+        var _labelCol19 = {};
+
+        if (search && search.labelWidth) {
+          _labelCol19.style = {
+            width: search.labelWidth
+          };
+        }
+
+        var baseitem = c.renderFormItem(c, _objectSpread2(_objectSpread2({}, c), {}, {
+          formItemProps: c.formItemProps,
+          fieldProps: c.fieldProps,
+          columnsFields: columnsFields
+        }), form);
+        return baseitem ? /*#__PURE__*/React.createElement(_Col, _objectSpread2(_objectSpread2({
+          style: {
+            paddingLeft: '12px',
+            paddingRight: '12px'
+          }
+        }, colProps), {}, {
+          key: c.dataIndex
+        }), /*#__PURE__*/React.createElement(_Form.Item, _objectSpread2(_objectSpread2({
+          initialValue: c.initialValue
+        }, c.formItemProps), {}, {
+          name: c.dataIndex,
+          label: c.title,
+          labelCol: _labelCol19
+        }), baseitem)) : null;
+      } else if (c.valueType === 'textarea') {
+        var _labelCol20 = {};
+
+        if (search && search.labelWidth) {
+          _labelCol20.style = {
+            width: search.labelWidth
+          };
+        }
+
+        return /*#__PURE__*/React.createElement(_Col, _objectSpread2(_objectSpread2({
+          style: {
+            paddingLeft: '12px',
+            paddingRight: '12px'
+          }
+        }, colProps), {}, {
+          key: c.dataIndex
+        }), /*#__PURE__*/React.createElement(_Form.Item, _objectSpread2(_objectSpread2({
+          initialValue: c.initialValue
+        }, c.formItemProps), {}, {
+          name: c.dataIndex,
+          label: c.title,
+          labelCol: _labelCol20
+        }), /*#__PURE__*/React.createElement(Index.TextArea, _objectSpread2({
+          rows: 4,
+          disabled: disabled,
+          placeholder: "\u8BF7\u8F93\u5165"
+        }, c.fieldProps))));
+      } else if (c.valueType === 'inputNumber') {
+        var _labelCol21 = {};
+
+        if (search && search.labelWidth) {
+          _labelCol21.style = {
+            width: search.labelWidth
+          };
+        }
+
+        return /*#__PURE__*/React.createElement(_Col, _objectSpread2(_objectSpread2({
+          style: {
+            paddingLeft: '12px',
+            paddingRight: '12px'
+          }
+        }, colProps), {}, {
+          key: c.dataIndex
+        }), /*#__PURE__*/React.createElement(_Form.Item, _objectSpread2(_objectSpread2({
+          initialValue: c.initialValue
+        }, c.formItemProps), {}, {
+          name: c.dataIndex,
+          label: c.title,
+          labelCol: _labelCol21
+        }), /*#__PURE__*/React.createElement(WInputNumber, _objectSpread2({
+          disabled: disabled,
+          placeholder: "\u8BF7\u8F93\u5165"
+        }, c.fieldProps))));
+      } else {
+        var _labelCol22 = {};
+
+        if (search && search.labelWidth) {
+          _labelCol22.style = {
+            width: search.labelWidth
+          };
+        }
+
+        return /*#__PURE__*/React.createElement(_Col, _objectSpread2(_objectSpread2({
+          style: {
+            paddingLeft: '12px',
+            paddingRight: '12px'
+          }
+        }, colProps), {}, {
+          key: c.dataIndex
+        }), /*#__PURE__*/React.createElement(_Form.Item, _objectSpread2(_objectSpread2({
+          initialValue: c.initialValue
+        }, c.formItemProps), {}, {
+          name: c.dataIndex,
+          label: c.title,
+          labelCol: _labelCol22
+        }), /*#__PURE__*/React.createElement(Index, _objectSpread2({
+          disabled: disabled,
+          placeholder: "\u8BF7\u8F93\u5165"
+        }, c.fieldProps))));
+      }
+    });
+  }, [changedValues, extraColumns, disabled, JSON.stringify(form.getFieldsValue())]);
 
   var handleSearch = function handleSearch(v) {
     var searchForm = form.getFieldsValue();
@@ -8085,7 +8544,7 @@ var WForm = function WForm(props, ref) {
       setchangedValues(changedValues);
     },
     form: form
-  }, extraProps), /*#__PURE__*/React.createElement(_Row, null, filterForm), search && search.hideSubmit ? null : /*#__PURE__*/React.createElement(_Row, {
+  }, extraProps), /*#__PURE__*/React.createElement(_Row, null, filterForm), /*#__PURE__*/React.createElement(_Row, null, filterExtraColumnsForm), search && search.hideSubmit ? null : /*#__PURE__*/React.createElement(_Row, {
     justify: "end"
   }, /*#__PURE__*/React.createElement(_Col, {
     style: {
@@ -8483,7 +8942,7 @@ var Index$8 = function Index(_ref) {
 
 var _excluded$9 = ["data", "onClick", "renderItem"];
 
-SwiperCore.use([Pagination, Navigation]);
+SwiperCore.use([Pagination, Navigation, Autoplay]);
 
 var Index$9 = function Index(props) {
   var data = props.data,
@@ -9413,10 +9872,11 @@ Modal.hidden = function () {
   ModalContainer[modelSysbol] && ModalContainer[modelSysbol].hidden();
 };
 
-var _excluded$d = ["columns", "search", "visible", "setVisible", "disabled", "submitMethod", "onSubmitSuccess", "title", "record"];
+var _excluded$d = ["columns", "extraColumns", "search", "visible", "setVisible", "disabled", "submitMethod", "onSubmitSuccess", "title", "record"];
 
 var ModalForm = function ModalForm(props, ref) {
   var columns = props.columns,
+      extraColumns = props.extraColumns,
       search = props.search,
       visible = props.visible,
       setVisible = props.setVisible,
@@ -9548,7 +10008,8 @@ var ModalForm = function ModalForm(props, ref) {
     onSubmit: onSubmit,
     disabledHideInSearch: true,
     search: search,
-    columns: columns
+    columns: columns,
+    extraColumns: extraColumns
   }));
 };
 
@@ -9582,7 +10043,10 @@ var TabelCard = function TabelCard(props, ref) {
       setModalFormConfig = _useState4[1];
 
   useImperativeHandle(ref, function () {
-    return {};
+    return {
+      actionRef: actionRef.current,
+      formRef: formRef.current
+    };
   });
 
   var openFormModel = function openFormModel(options) {

package/dist/index.js

@@ -7565,11 +7565,12 @@ Table.defaultProps = {
   rowKey: 'key'
 };
 
-var _excluded$5 = ["columns", "className", "style", "search", "disabled", "disabledHideInSearch", "onSubmit", "onReset"];
+var _excluded$5 = ["columns", "extraColumns", "className", "style", "search", "disabled", "disabledHideInSearch", "onSubmit", "onReset"];
 var RangePicker$2 = Index$2.RangePicker;
 
 var WForm = function WForm(props, ref) {
   var columns = props.columns,
+      extraColumns = props.extraColumns,
       className = props.className,
       style = props.style,
       search = props.search,
@@ -7593,11 +7594,18 @@ var WForm = function WForm(props, ref) {
       columnsFields = _useState4[0],
       setColumnsFields = _useState4[1];
 
-  var filterFormColumns = columns.filter(function (c) {
+  var filterFormColumns = _toConsumableArray(columns).filter(function (c) {
     return !c.hideInSearch || disabledHideInSearch;
   }).sort(function (a, b) {
     return (b.order || 0) - (a.order || 0);
   });
+
+  var filterExtraFormColumns = _toConsumableArray(extraColumns || []).filter(function (c) {
+    return !c.hideInSearch || disabledHideInSearch;
+  }).sort(function (a, b) {
+    return (b.order || 0) - (a.order || 0);
+  });
+
   var filterForm = React.useMemo(function () {
     return filterFormColumns.map(function (c) {
       var colProps = {};
@@ -7949,7 +7957,8 @@ var WForm = function WForm(props, ref) {
 
         var baseitem = c.renderFormItem(c, _objectSpread2(_objectSpread2({}, c), {}, {
           formItemProps: c.formItemProps,
-          fieldProps: c.fieldProps
+          fieldProps: c.fieldProps,
+          columnsFields: columnsFields
         }), form);
         return baseitem ? /*#__PURE__*/React__default['default'].createElement(_Col__default['default'], _objectSpread2(_objectSpread2({
           style: {
@@ -8046,7 +8055,457 @@ var WForm = function WForm(props, ref) {
         }, c.fieldProps))));
       }
     });
-  }, [changedValues, disabled, JSON.stringify(form.getFieldsValue())]);
+  }, [changedValues, columns, disabled, JSON.stringify(form.getFieldsValue())]);
+  var filterExtraColumnsForm = React.useMemo(function () {
+    return filterExtraFormColumns.map(function (c) {
+      var colProps = {};
+
+      if (search && search.span) {
+        colProps.span = typeof search.span == 'number' ? (c.colSize || 1) * search.span : {
+          xs: 24,
+          sm: 24,
+          md: 12,
+          lg: 12,
+          xl: 8,
+          xxl: 6
+        };
+      }
+
+      if (c.valueType == 'select') {
+        var _extraProps3 = {};
+
+        if (c.request) {
+          _extraProps3.request = c.request;
+        } else if (c.valueEnum) {
+          _extraProps3.valueEnum = c.valueEnum;
+        }
+
+        var labelCol = {};
+
+        if (search && search.labelWidth) {
+          labelCol.style = {
+            width: search.labelWidth
+          };
+        }
+
+        return /*#__PURE__*/React__default['default'].createElement(_Col__default['default'], _objectSpread2(_objectSpread2({
+          style: {
+            paddingLeft: '12px',
+            paddingRight: '12px'
+          }
+        }, colProps), {}, {
+          key: c.dataIndex
+        }), /*#__PURE__*/React__default['default'].createElement(_Form__default['default'].Item, _objectSpread2(_objectSpread2({
+          initialValue: c.initialValue
+        }, c.formItemProps), {}, {
+          name: c.dataIndex,
+          label: c.title,
+          labelCol: labelCol
+        }), /*#__PURE__*/React__default['default'].createElement(Index$1, _objectSpread2(_objectSpread2({
+          placeholder: "\u8BF7\u9009\u62E9",
+          disabled: disabled,
+          onLoad: function onLoad(opt) {
+            setColumnsFields(function (preColumnsFields) {
+              return _objectSpread2(_objectSpread2({}, preColumnsFields), {}, _defineProperty({}, c.dataIndex, opt));
+            });
+          }
+        }, c.fieldProps), _extraProps3))));
+      } else if (c.valueType == 'treeSelect') {
+        var _extraProps4 = {};
+
+        if (c.request) {
+          _extraProps4.request = c.request;
+        }
+
+        var _labelCol12 = {};
+
+        if (search && search.labelWidth) {
+          _labelCol12.style = {
+            width: search.labelWidth
+          };
+        }
+
+        return /*#__PURE__*/React__default['default'].createElement(_Col__default['default'], _objectSpread2(_objectSpread2({
+          style: {
+            paddingLeft: '12px',
+            paddingRight: '12px'
+          }
+        }, colProps), {}, {
+          key: c.dataIndex
+        }), /*#__PURE__*/React__default['default'].createElement(_Form__default['default'].Item, _objectSpread2(_objectSpread2({
+          initialValue: c.initialValue
+        }, c.formItemProps), {}, {
+          name: c.dataIndex,
+          label: c.title,
+          labelCol: _labelCol12
+        }), /*#__PURE__*/React__default['default'].createElement(Index$5, _objectSpread2(_objectSpread2({
+          disabled: disabled,
+          placeholder: "\u8BF7\u9009\u62E9",
+          onLoad: function onLoad(opt) {}
+        }, c.fieldProps), _extraProps4))));
+      } else if (c.valueType && ['date', 'dateTime', 'dateMonth', 'dateYear'].includes(c.valueType)) {
+        var _labelCol13 = {};
+
+        if (search && search.labelWidth) {
+          _labelCol13.style = {
+            width: search.labelWidth
+          };
+        }
+
+        var showTime = {};
+        var picker = {};
+
+        if (c.valueType == 'dateTime') {
+          showTime = {
+            showTime: {
+              format: 'HH:mm'
+            }
+          };
+        }
+
+        if (c.valueType == 'dateMonth') {
+          picker = {
+            picker: 'month'
+          };
+        }
+
+        if (c.valueType == 'dateYear') {
+          picker = {
+            picker: 'year'
+          };
+        }
+
+        return /*#__PURE__*/React__default['default'].createElement(_Col__default['default'], _objectSpread2(_objectSpread2({
+          style: {
+            paddingLeft: '12px',
+            paddingRight: '12px'
+          }
+        }, colProps), {}, {
+          key: c.dataIndex
+        }), /*#__PURE__*/React__default['default'].createElement(_Form__default['default'].Item, _objectSpread2(_objectSpread2({
+          initialValue: c.initialValue
+        }, c.formItemProps), {}, {
+          name: c.dataIndex,
+          label: c.title,
+          labelCol: _labelCol13
+        }), /*#__PURE__*/React__default['default'].createElement(Index$2, _objectSpread2(_objectSpread2(_objectSpread2({
+          disabled: disabled,
+          placeholder: "\u8BF7\u8F93\u5165"
+        }, picker), showTime), c.fieldProps))));
+      } else if (c.valueType === 'dateRange' || c.valueType === 'dateTimeRange') {
+        var _labelCol14 = {};
+
+        if (search && search.labelWidth) {
+          _labelCol14.style = {
+            width: search.labelWidth
+          };
+        }
+
+        var _showTime2 = {};
+
+        if (c.valueType == 'dateTimeRange') {
+          _showTime2 = {
+            showTime: {
+              format: 'HH:mm'
+            }
+          };
+        }
+
+        return /*#__PURE__*/React__default['default'].createElement(_Col__default['default'], _objectSpread2(_objectSpread2({
+          style: {
+            paddingLeft: '12px',
+            paddingRight: '12px'
+          }
+        }, colProps), {}, {
+          key: c.dataIndex
+        }), /*#__PURE__*/React__default['default'].createElement(_Form__default['default'].Item, _objectSpread2(_objectSpread2({
+          initialValue: c.initialValue
+        }, c.formItemProps), {}, {
+          name: c.dataIndex,
+          label: c.title,
+          labelCol: _labelCol14
+        }), /*#__PURE__*/React__default['default'].createElement(RangePicker$2, _objectSpread2(_objectSpread2({
+          disabled: disabled
+        }, _showTime2), c.fieldProps))));
+      } else if (c.valueType === 'checkbox') {
+        var options = [];
+
+        if (c.valueEnum) {
+          for (var key in c.valueEnum) {
+            var text = c.valueEnum[key].text;
+            options.push({
+              label: text,
+              value: key
+            });
+          }
+        }
+
+        if (c.options) {
+          options = c.options;
+        }
+
+        setColumnsFields(function (preColumnsFields) {
+          return _objectSpread2(_objectSpread2({}, preColumnsFields), {}, _defineProperty({}, c.dataIndex, options));
+        });
+        var _labelCol15 = {};
+
+        if (search && search.labelWidth) {
+          _labelCol15.style = {
+            width: search.labelWidth
+          };
+        }
+
+        return /*#__PURE__*/React__default['default'].createElement(_Col__default['default'], _objectSpread2(_objectSpread2({
+          style: {
+            paddingLeft: '12px',
+            paddingRight: '12px'
+          }
+        }, colProps), {}, {
+          key: c.dataIndex
+        }), /*#__PURE__*/React__default['default'].createElement(_Form__default['default'].Item, _objectSpread2(_objectSpread2({
+          initialValue: c.initialValue
+        }, c.formItemProps), {}, {
+          name: c.dataIndex,
+          label: c.title,
+          labelCol: _labelCol15
+        }), /*#__PURE__*/React__default['default'].createElement(Index$4.Group, _objectSpread2({
+          disabled: disabled,
+          options: options
+        }, c.fieldProps))));
+      } else if (c.valueType === 'radio' || c.valueType === 'radioButton') {
+        var _options3 = [];
+
+        if (c.options) {
+          _options3 = c.options;
+        }
+
+        if (c.valueEnum) {
+          for (var _key3 in c.valueEnum) {
+            var _text3 = c.valueEnum[_key3].text;
+
+            _options3.push({
+              label: _text3,
+              value: _key3
+            });
+          }
+        }
+
+        setColumnsFields(function (preColumnsFields) {
+          return _objectSpread2(_objectSpread2({}, preColumnsFields), {}, _defineProperty({}, c.dataIndex, _options3));
+        });
+        var _labelCol16 = {};
+
+        if (search && search.labelWidth) {
+          _labelCol16.style = {
+            width: search.labelWidth
+          };
+        }
+
+        var radioButtonProps = {};
+
+        if (c.valueType === 'radioButton') {
+          radioButtonProps = {
+            optionType: 'button',
+            buttonStyle: 'solid'
+          };
+        }
+
+        return /*#__PURE__*/React__default['default'].createElement(_Col__default['default'], _objectSpread2(_objectSpread2({
+          style: {
+            paddingLeft: '12px',
+            paddingRight: '12px'
+          }
+        }, colProps), {}, {
+          key: c.dataIndex
+        }), /*#__PURE__*/React__default['default'].createElement(_Form__default['default'].Item, _objectSpread2(_objectSpread2({
+          initialValue: c.initialValue
+        }, c.formItemProps), {}, {
+          name: c.dataIndex,
+          label: c.title,
+          labelCol: _labelCol16
+        }), /*#__PURE__*/React__default['default'].createElement(Index$3.Group, _objectSpread2(_objectSpread2({
+          disabled: disabled
+        }, radioButtonProps), {}, {
+          options: _options3
+        }, c.fieldProps))));
+      } else if (c.valueType === 'switch') {
+        var _options4 = [];
+
+        if (c.valueEnum) {
+          for (var _key4 in c.valueEnum) {
+            var _text4 = c.valueEnum[_key4].text;
+
+            _options4.push({
+              label: _text4,
+              value: _key4
+            });
+          }
+        }
+
+        var _labelCol17 = {};
+
+        if (search && search.labelWidth) {
+          _labelCol17.style = {
+            width: search.labelWidth
+          };
+        }
+
+        setColumnsFields(function (preColumnsFields) {
+          return _objectSpread2(_objectSpread2({}, preColumnsFields), {}, _defineProperty({}, c.dataIndex, _options4));
+        });
+        return /*#__PURE__*/React__default['default'].createElement(_Col__default['default'], _objectSpread2(_objectSpread2({
+          style: {
+            paddingLeft: '12px',
+            paddingRight: '12px'
+          }
+        }, colProps), {}, {
+          key: c.dataIndex
+        }), /*#__PURE__*/React__default['default'].createElement(_Form__default['default'].Item, _objectSpread2(_objectSpread2({
+          initialValue: c.initialValue,
+          valuePropName: "checked"
+        }, c.formItemProps), {}, {
+          name: c.dataIndex,
+          label: c.title,
+          labelCol: _labelCol17
+        }), /*#__PURE__*/React__default['default'].createElement(WSwitch, _objectSpread2({
+          disabled: disabled
+        }, c.fieldProps))));
+      } else if (c.valueType === 'digit') {
+        var _labelCol18 = {};
+
+        if (search && search.labelWidth) {
+          _labelCol18.style = {
+            width: search.labelWidth
+          };
+        }
+
+        return /*#__PURE__*/React__default['default'].createElement(_Col__default['default'], _objectSpread2(_objectSpread2({
+          style: {
+            paddingLeft: '12px',
+            paddingRight: '12px'
+          }
+        }, colProps), {}, {
+          key: c.dataIndex
+        }), /*#__PURE__*/React__default['default'].createElement(_Form__default['default'].Item, _objectSpread2(_objectSpread2({
+          initialValue: c.initialValue
+        }, c.formItemProps), {}, {
+          name: c.dataIndex,
+          label: c.title,
+          labelCol: _labelCol18
+        }), /*#__PURE__*/React__default['default'].createElement(NumericInput, _objectSpread2({
+          disabled: disabled,
+          placeholder: "\u8BF7\u8F93\u5165\u53C2\u6570(double/int)"
+        }, c.fieldProps))));
+      } else if (c.renderFormItem) {
+        var _labelCol19 = {};
+
+        if (search && search.labelWidth) {
+          _labelCol19.style = {
+            width: search.labelWidth
+          };
+        }
+
+        var baseitem = c.renderFormItem(c, _objectSpread2(_objectSpread2({}, c), {}, {
+          formItemProps: c.formItemProps,
+          fieldProps: c.fieldProps,
+          columnsFields: columnsFields
+        }), form);
+        return baseitem ? /*#__PURE__*/React__default['default'].createElement(_Col__default['default'], _objectSpread2(_objectSpread2({
+          style: {
+            paddingLeft: '12px',
+            paddingRight: '12px'
+          }
+        }, colProps), {}, {
+          key: c.dataIndex
+        }), /*#__PURE__*/React__default['default'].createElement(_Form__default['default'].Item, _objectSpread2(_objectSpread2({
+          initialValue: c.initialValue
+        }, c.formItemProps), {}, {
+          name: c.dataIndex,
+          label: c.title,
+          labelCol: _labelCol19
+        }), baseitem)) : null;
+      } else if (c.valueType === 'textarea') {
+        var _labelCol20 = {};
+
+        if (search && search.labelWidth) {
+          _labelCol20.style = {
+            width: search.labelWidth
+          };
+        }
+
+        return /*#__PURE__*/React__default['default'].createElement(_Col__default['default'], _objectSpread2(_objectSpread2({
+          style: {
+            paddingLeft: '12px',
+            paddingRight: '12px'
+          }
+        }, colProps), {}, {
+          key: c.dataIndex
+        }), /*#__PURE__*/React__default['default'].createElement(_Form__default['default'].Item, _objectSpread2(_objectSpread2({
+          initialValue: c.initialValue
+        }, c.formItemProps), {}, {
+          name: c.dataIndex,
+          label: c.title,
+          labelCol: _labelCol20
+        }), /*#__PURE__*/React__default['default'].createElement(Index.TextArea, _objectSpread2({
+          rows: 4,
+          disabled: disabled,
+          placeholder: "\u8BF7\u8F93\u5165"
+        }, c.fieldProps))));
+      } else if (c.valueType === 'inputNumber') {
+        var _labelCol21 = {};
+
+        if (search && search.labelWidth) {
+          _labelCol21.style = {
+            width: search.labelWidth
+          };
+        }
+
+        return /*#__PURE__*/React__default['default'].createElement(_Col__default['default'], _objectSpread2(_objectSpread2({
+          style: {
+            paddingLeft: '12px',
+            paddingRight: '12px'
+          }
+        }, colProps), {}, {
+          key: c.dataIndex
+        }), /*#__PURE__*/React__default['default'].createElement(_Form__default['default'].Item, _objectSpread2(_objectSpread2({
+          initialValue: c.initialValue
+        }, c.formItemProps), {}, {
+          name: c.dataIndex,
+          label: c.title,
+          labelCol: _labelCol21
+        }), /*#__PURE__*/React__default['default'].createElement(WInputNumber, _objectSpread2({
+          disabled: disabled,
+          placeholder: "\u8BF7\u8F93\u5165"
+        }, c.fieldProps))));
+      } else {
+        var _labelCol22 = {};
+
+        if (search && search.labelWidth) {
+          _labelCol22.style = {
+            width: search.labelWidth
+          };
+        }
+
+        return /*#__PURE__*/React__default['default'].createElement(_Col__default['default'], _objectSpread2(_objectSpread2({
+          style: {
+            paddingLeft: '12px',
+            paddingRight: '12px'
+          }
+        }, colProps), {}, {
+          key: c.dataIndex
+        }), /*#__PURE__*/React__default['default'].createElement(_Form__default['default'].Item, _objectSpread2(_objectSpread2({
+          initialValue: c.initialValue
+        }, c.formItemProps), {}, {
+          name: c.dataIndex,
+          label: c.title,
+          labelCol: _labelCol22
+        }), /*#__PURE__*/React__default['default'].createElement(Index, _objectSpread2({
+          disabled: disabled,
+          placeholder: "\u8BF7\u8F93\u5165"
+        }, c.fieldProps))));
+      }
+    });
+  }, [changedValues, extraColumns, disabled, JSON.stringify(form.getFieldsValue())]);
 
   var handleSearch = function handleSearch(v) {
     var searchForm = form.getFieldsValue();
@@ -8118,7 +8577,7 @@ var WForm = function WForm(props, ref) {
       setchangedValues(changedValues);
     },
     form: form
-  }, extraProps), /*#__PURE__*/React__default['default'].createElement(_Row__default['default'], null, filterForm), search && search.hideSubmit ? null : /*#__PURE__*/React__default['default'].createElement(_Row__default['default'], {
+  }, extraProps), /*#__PURE__*/React__default['default'].createElement(_Row__default['default'], null, filterForm), /*#__PURE__*/React__default['default'].createElement(_Row__default['default'], null, filterExtraColumnsForm), search && search.hideSubmit ? null : /*#__PURE__*/React__default['default'].createElement(_Row__default['default'], {
     justify: "end"
   }, /*#__PURE__*/React__default['default'].createElement(_Col__default['default'], {
     style: {
@@ -8516,7 +8975,7 @@ var Index$8 = function Index(_ref) {
 
 var _excluded$9 = ["data", "onClick", "renderItem"];
 
-SwiperCore__default['default'].use([SwiperCore.Pagination, SwiperCore.Navigation]);
+SwiperCore__default['default'].use([SwiperCore.Pagination, SwiperCore.Navigation, SwiperCore.Autoplay]);
 
 var Index$9 = function Index(props) {
   var data = props.data,
@@ -9446,10 +9905,11 @@ Modal.hidden = function () {
   ModalContainer[modelSysbol] && ModalContainer[modelSysbol].hidden();
 };
 
-var _excluded$d = ["columns", "search", "visible", "setVisible", "disabled", "submitMethod", "onSubmitSuccess", "title", "record"];
+var _excluded$d = ["columns", "extraColumns", "search", "visible", "setVisible", "disabled", "submitMethod", "onSubmitSuccess", "title", "record"];
 
 var ModalForm = function ModalForm(props, ref) {
   var columns = props.columns,
+      extraColumns = props.extraColumns,
       search = props.search,
       visible = props.visible,
       setVisible = props.setVisible,
@@ -9581,7 +10041,8 @@ var ModalForm = function ModalForm(props, ref) {
     onSubmit: onSubmit,
     disabledHideInSearch: true,
     search: search,
-    columns: columns
+    columns: columns,
+    extraColumns: extraColumns
   }));
 };
 
@@ -9615,7 +10076,10 @@ var TabelCard = function TabelCard(props, ref) {
       setModalFormConfig = _useState4[1];
 
   React.useImperativeHandle(ref, function () {
-    return {};
+    return {
+      actionRef: actionRef.current,
+      formRef: formRef.current
+    };
   });
 
   var openFormModel = function openFormModel(options) {

package/package.json

@@ -1,7 +1,7 @@
 {
   "private": false,
   "name": "wargerm",
-  "version": "0.2.7",
+  "version": "0.2.11",
   "scripts": {
     "dev": "dumi dev",
     "docs:build": "dumi build",