fan-standard-comp 4.0.2 → 4.0.4

package/es/ButtonGroup/index.js

@@ -20,7 +20,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-import React, { useState, useEffect, useContext } from "react";
+import React, { useState, useEffect, useContext, useMemo } from "react";
 import { IconNode } from "../components";
 import SpecIcon from "../SpecIcon";
 import PopConfirmTitle from "./PopConfirmTitle";
@@ -29,8 +29,6 @@ import { DownOutlined, QuestionCircleOutlined } from "@ant-design/icons";
 import { removeNoPermission, btnIsDisabled } from "../utils/filterPermission";
 import useStyle from "./styles";
 import classNames from "classnames";
-import _ from "lodash";
-import { funcCode } from "../data/index";
 import { FanContext } from "../ConfigContext";
 
 // 参数API
@@ -67,19 +65,11 @@ var ButtonGroup = function ButtonGroup(props) {
     _useState4 = _slicedToArray(_useState3, 2),
     popRow = _useState4[0],
     setPopRow = _useState4[1];
-  var _useState5 = useState([]),
-    _useState6 = _slicedToArray(_useState5, 2),
-    resetList = _useState6[0],
-    setResetList = _useState6[1];
-  useEffect(function () {
-    // codes在方法内，再合并默认的权限配置
-    // 合并本地的codes
-    var codesConcat = _.unionBy(codes || [], funcCode.btnFuncCodes, 'code');
-    // 重组选项options集合数据，排除：无权限（有配置code,并且不包含permissionCodes内）的数据及，isHide 为true的数据
-    setResetList(_toConsumableArray(removeNoPermission(options, permissionCodes, codesConcat, rowParams)) || []);
-    return function () {
-      setResetList([]);
-    };
+  // const [resetList, setResetList] = useState<any[]>([])
+  var resetList = useMemo(function () {
+    //   // codes在方法内，再合并默认的权限配置
+    //   // 重组选项options集合数据，排除：无权限（有配置code,并且不包含permissionCodes内）的数据及，isHide 为true的数据
+    return _toConsumableArray(removeNoPermission(options, permissionCodes, codes, rowParams)) || [];
   }, [options, codes, permissionCodes]);
   useEffect(function () {
     setPopVisibleIndex(-1);

package/es/ButtonGroup/styles/index.js

@@ -23,18 +23,18 @@ var SpecButtonGroupTextStyle = function SpecButtonGroupTextStyle(prefixCls, toke
     }
   }, "& + ".concat(prefixCls, "-text"), {
     position: 'relative',
-    marginLeft: token.paddingSM,
-    '&:before': {
-      position: 'absolute',
-      content: '""',
-      top: '50%',
-      left: " calc(-".concat(token.paddingSM, "px / 2)"),
-      transform: 'translate(0, -50%)',
-      display: 'inline-block',
-      height: '.9em',
-      verticalAlign: 'middle',
-      borderLeft: "1px solid ".concat(token.colorBorder)
-    }
+    marginLeft: token.paddingSM
+    // '&:before': {
+    //   position: 'absolute',
+    //   content: '""',
+    //   top: '50%',
+    //   left:` calc(-${token.paddingSM}px / 2)`,
+    //   transform: 'translate(0, -50%)',
+    //   display: 'inline-block',
+    //   height: '.9em',
+    //   verticalAlign: 'middle',
+    //   borderLeft: `1px solid ${token.colorBorder}`
+    // }
   }));
 };
 var SpecButtonGroupStyleFunc = function SpecButtonGroupStyleFunc(prefix) {

package/es/FormComp/RenderItemGroup/index.js

@@ -12,7 +12,7 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 /* eslint-disable */
-import React, { useCallback } from "react";
+import React, { useEffect, useCallback } from "react";
 import { Row, Col, Tooltip, Form, Space } from "antd";
 import { general } from "../../data";
 import Field from "../FieldComponent";
@@ -48,7 +48,53 @@ var RenderItemGroup = function RenderItemGroup(props) {
   //   // @ts-ignore
   //   return general.modalSize[size].columnNumber || 1
   // }, [size, columnCount])
-
+  /*
+    // 当前需要显示的前几条表单项
+    // const [showItemNumber, setShowItemNumber] = useState(0)
+    // 计算当前栅格数量，及对应的size
+    const columnNumberAndSize = useMemo(() => {
+      // 当前栅栅数量
+      let itemGroupSize = size || (layout === 'horizontal' ? 'xxlg' : 'md')
+      if (columnCount) {
+        // 有配置栅格数 1,2,3,4
+        switch (columnCount) {
+          case 1:
+            itemGroupSize = 'sm'
+            break;
+          case 2:
+            itemGroupSize = 'md'
+            break;
+          case 3:
+            itemGroupSize = 'lg'
+            break;
+          case 4:
+            itemGroupSize = 'xxlg'
+            break;
+        }
+      }
+      return {
+        // @ts-ignore
+        columnNumber: general.modalSize[itemGroupSize].columnNumber,
+        itemGroupSize, columnCount
+      }
+    }, [size, columnCount, layout])
+    useEffect(() => {
+      setShowItemNumber(columnNumberAndSize.columnNumber - 1)
+    }, [columnNumberAndSize, size])
+  
+    // 判断是否隐藏结构, display:'none'
+    const setItemHiddenNode = (item: any, index: number, collapsed: boolean, showItemNumber: number) => {
+      // updateFormFields()  // TODO 放这执行会报错,但是不加的话，切换栅格变化会导致收缩状态下隐藏的表单项未更新
+      if (item.filedName === 'filterAction') {
+        return {
+          isHidden: false
+        }
+      }
+      return {
+        // 栅格列为1时，显示1个表单项
+        isHidden: collapsed ? false : (showItemNumber === 0 ? index !== 0 : !(index < showItemNumber))
+      }
+    }*/
   var setColSpan = function setColSpan(display, modalSize, columnCount) {
     if (_typeof(display) === 'object' || display === 'block') {
       // 栅格数量为：1
@@ -72,13 +118,13 @@ var RenderItemGroup = function RenderItemGroup(props) {
     return 12;
   };
   var updateFormFields = function updateFormFields() {
+    // console.log('用于触发更新表单实例赋值')
     // if (newVal) form && form.setFieldsValue({ ...newVal })
     if (doUpdateFormFields) doUpdateFormFields(); // 用于触发更新表单实例赋值
   };
-
-  // useEffect(() => {
-  //   // updateFormFields()
-  // }, [form])
+  useEffect(function () {
+    updateFormFields();
+  }, [form]);
 
   // 渲染隐藏指定控件
   var itemIsHide = function itemIsHide(isHide, getFieldsValue, FormInstance) {
@@ -205,9 +251,18 @@ var RenderItemGroup = function RenderItemGroup(props) {
       customRender = item.customRender,
       filedName = item.filedName; // 当前可传参的配置值
     if (layout === "horizontal" || layout === "vertical") {
+      // if (collapseable && layout === "horizontal") {
+      //   const { isHidden } = setItemHiddenNode(item, index, collapsed, showItemNumber)
+      //   item.isHidden = isHidden
+      //   item.style = { ...(item.style || {}), display: item.isHidden ? 'none' : 'block' }
+      //   // if (index < showItemNumber) {
+      //   //   console.log('===>>>>当前显示【常规表单项】=>>', item.filedName, '序号', index, '可显示数量', showItemNumber, collapsed)
+      //   // }
+      // }
       return /*#__PURE__*/React.createElement(Col, {
         key: index,
-        span: item.colSpan || setColSpan(item.display, size, columnCount)
+        span: item.colSpan || setColSpan(item.display, size, columnCount),
+        style: item.style
       }, /*#__PURE__*/React.createElement(FormItem, _extends({
         name: type !== 'custom' && filedName,
         className: classNames(fieldStatus === 'viewOnly' ? 'form-item-view-only' : '', 'spec-item-group-form-item'),
@@ -244,34 +299,7 @@ var RenderItemGroup = function RenderItemGroup(props) {
         type = item.type,
         _item$display = item.display,
         display = _item$display === void 0 ? 'side' : _item$display; // 当前可传参的配置值
-
       var formLayout = calculateFormLayout(item);
-      // if (displayLayout) {
-      //   // 如果未配置，则使用以下配置值
-      //   formLayout = { ...displayLayout }
-      // }
-      // 优先级 displayLayout.side > displayLayout > general
-      // 优先级：若有displayLayout.block 则直接使用 general > displayLayout
-      // 还需要判断 layout为vertical还是horizontal
-      // @ts-ignore
-      // formLayout = displayLayout?.side || (displayLayout?.block ? general.modalSize[size].formLayout : ((!displayLayout || JSON.stringify(displayLayout) === '{}') ? general.modalSize[size].formLayout : displayLayout))
-      // if (item.hasOwnProperty('display')) {
-      //   if (typeof display === 'string') {
-      //     if (display === 'block') {
-      //       // @ts-ignore
-      //       formLayout = displayLayout?.block || general.modalSize[size].formBlockLayout
-      //     } else {
-      //       // 使用默认
-      //       // formLayout = displayLayout?.side || (displayLayout?.block ? general.modalSize[size].formLayout : displayLayout) || general.modalSize[size].formLayout
-      //     }
-      //   } else {
-      //     formLayout = item.display // 对象类型传值如： {labelCol: {span: 3},wrapperCol: {span: 8}} 优先级最高
-      //   }
-      // }
-      // // 当布局为 'inline' 时，不配置栅格结构
-      // if (layout === 'inline') {
-      //   formLayout = {}
-      // }
       // title标题或html渲染
       if (type === 'title' || type === 'html') {
         return /*#__PURE__*/React.createElement(FormItem, {
@@ -282,7 +310,8 @@ var RenderItemGroup = function RenderItemGroup(props) {
           var _item$protoConfig;
           // isHide 返回为true则隐藏当前控件
           return !itemIsHide(isHide, FormInstance.getFieldValue(), FormInstance) ? /*#__PURE__*/React.createElement(Col, {
-            span: item.colSpan || 24
+            span: item.colSpan || 24,
+            style: item.style
           }, type === 'title' ? /*#__PURE__*/React.createElement("h3", _extends({}, item.protoConfig, {
             className: "modalPanelTitle ".concat((item === null || item === void 0 || (_item$protoConfig = item.protoConfig) === null || _item$protoConfig === void 0 ? void 0 : _item$protoConfig.className) || '')
           }), label) : label) : /*#__PURE__*/React.createElement(React.Fragment, null, null);
@@ -299,6 +328,7 @@ var RenderItemGroup = function RenderItemGroup(props) {
           return !itemIsHide(isHide, FormInstance.getFieldValue(), FormInstance) ? renderColFormItem(item, index, formLayout) : null;
         });
       }
+      // 常规表单项结构
       return renderColFormItem(item, index, formLayout);
     });
   };

package/es/StandardFilter/index.d.ts

@@ -22,6 +22,7 @@ export interface StandardFilterProps {
     colon?: boolean;
     dateFormatter?: 'dayjs' | 'string';
     itemGroupConfig?: object;
+    collapseable?: boolean;
     [k: string]: any;
 }
 declare const StandardFilter: React.ForwardRefExoticComponent<Omit<StandardFilterProps, "ref"> & React.RefAttributes<unknown>>;

package/es/StandardFilter/index.js

@@ -21,8 +21,10 @@ import { general } from "../data/";
 import "./style/index.less";
 import { FanContext } from "../ConfigContext";
 import useStyle from "./style/FilterStyle";
+import SpecIcon from "../SpecIcon";
 var FormItem = Form.Item;
 var StandardFilter = /*#__PURE__*/React.forwardRef(function (props, ref) {
+  var _filterFormRef$curren4;
   var InitFanContext = useContext(FanContext);
   var providerConfig = InitFanContext['StandardFilter'] || {}; // 使用上下文（全局配置）设置扩展的配置项
   var _providerConfig$props = _objectSpread(_objectSpread({}, providerConfig), props),
@@ -56,7 +58,9 @@ var StandardFilter = /*#__PURE__*/React.forwardRef(function (props, ref) {
     filterBtnsStyle = _providerConfig$props.filterBtnsStyle,
     _providerConfig$props7 = _providerConfig$props.colon,
     colon = _providerConfig$props7 === void 0 ? true : _providerConfig$props7,
-    dateFormatter = _providerConfig$props.dateFormatter;
+    dateFormatter = _providerConfig$props.dateFormatter,
+    _providerConfig$props8 = _providerConfig$props.collapseable,
+    collapseable = _providerConfig$props8 === void 0 ? false : _providerConfig$props8;
   var filterFormRef = useRef();
   // ref 的转发
   useImperativeHandle(ref, function () {
@@ -70,7 +74,10 @@ var StandardFilter = /*#__PURE__*/React.forwardRef(function (props, ref) {
     _useState4 = _slicedToArray(_useState3, 2),
     isHideCount = _useState4[0],
     setIsHideCount = _useState4[1]; // 表单隐藏项数量值
-
+  var _useState5 = useState(false),
+    _useState6 = _slicedToArray(_useState5, 2),
+    collapsed = _useState6[0],
+    setCollapsed = _useState6[1];
   var componentName = 'spec-standard-filter';
   var _useStyle = useStyle(componentName),
     _useStyle2 = _slicedToArray(_useStyle, 2),
@@ -79,8 +86,9 @@ var StandardFilter = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var filterFormLayout = useMemo(function () {
     return formLayout || 'inline';
   }, [formLayout]);
-  //  配置筛选按钮（确认与取消）
-  var filterActionButtons = useMemo(function () {
+
+  // 计算当前栅格数量，及对应的size
+  var columnNumberAndSize = useMemo(function () {
     // 当前栅栅数量
     var itemGroupSize = (itemGroupConfig === null || itemGroupConfig === void 0 ? void 0 : itemGroupConfig.size) || (filterFormLayout === 'horizontal' ? 'xxlg' : 'md');
     if (itemGroupConfig !== null && itemGroupConfig !== void 0 && itemGroupConfig.columnCount) {
@@ -100,8 +108,31 @@ var StandardFilter = /*#__PURE__*/React.forwardRef(function (props, ref) {
           break;
       }
     }
+    return {
+      columnNumber: general.modalSize[itemGroupSize].columnNumber,
+      itemGroupSize: itemGroupSize
+    };
+  }, [itemGroupConfig, filterFormLayout]);
+
+  // 计算表单隐藏项(开启展开与收缩）
+  var calculateHideCount = function calculateHideCount(filterFormRef, groups) {
+    var _filterFormRef$curren;
+    var formValues = filterFormRef === null || filterFormRef === void 0 || (_filterFormRef$curren = filterFormRef.current) === null || _filterFormRef$curren === void 0 ? void 0 : _filterFormRef$curren.getFieldValue();
+    setIsHideCount((groups || []).filter(function (item) {
+      return (item === null || item === void 0 ? void 0 : item.isHidden) || (item.hasOwnProperty('isHide') ? item.isHide(_objectSpread({}, formValues), filterFormRef) : false);
+    }).length);
+  };
+
+  //  配置筛选按钮（确认与取消）
+  var filterActionButtons = useMemo(function () {
+    var itemGroupSize = columnNumberAndSize.itemGroupSize,
+      columnNumber = columnNumberAndSize.columnNumber;
     // 计算扣除栅格列数是否还有多余的项，用来判断筛选按钮的版式（初始化的时候，可能会受默认值内配置的isHide影响导致计算错误;或自定义表单控件组栅格影响）
-    var calculateTimes = (formItemGroup.length - isHideCount) % general.modalSize[itemGroupSize].columnNumber;
+    // if (collapseable) {
+    //   columnNumber = collapsed ? columnNumber : (columnNumber === 1 ? columnNumber = 2 : columnNumber)
+    // }
+    var calculateTimes = (reFormItemGroup.length - isHideCount) % columnNumber;
+    // console.log('当前多余的数量', calculateTimes, '当前隐藏的控件数量isHideCount==>', isHideCount, itemGroupSize, 'columnNumber', columnNumber)
     // xs:1列  sm:1列   【span:24】
     // md:2列           【span:12】
     // lg:3列  xlg:3列  【span:8】
@@ -111,10 +142,11 @@ var StandardFilter = /*#__PURE__*/React.forwardRef(function (props, ref) {
       label: '',
       type: 'custom',
       // display: 'block',
+      filedName: 'filterAction',
       display: {
         wrapperCol: {
-          // 占用的格子数按对应size配置的formItem(md下额外再新增1）
-          span: general.modalSize[itemGroupSize].formLayout.labelCol.span + general.modalSize[itemGroupSize].formLayout.wrapperCol.span + (itemGroupSize === 'md' ? 1 : 0)
+          // 占用的格子数按对应size配置的formItem(md下额外再新增1, 忘了为什么额外加了，先去除.20240619）
+          span: general.modalSize[itemGroupSize].formLayout.labelCol.span + general.modalSize[itemGroupSize].formLayout.wrapperCol.span // + (itemGroupSize === 'md' ? 1 : 0)
         }
       },
       protoFormItem: {
@@ -137,10 +169,23 @@ var StandardFilter = /*#__PURE__*/React.forwardRef(function (props, ref) {
           },
           onClick: handleReset,
           ghost: true
-        }, cancelButtonProps), cancelText || '重置'));
+        }, cancelButtonProps), cancelText || '重置'), filterFormLayout === 'horizontal' && collapseable && reFormItemGroup.length > columnNumberAndSize.columnNumber - 1 ? /*#__PURE__*/React.createElement(Button, {
+          type: 'link',
+          onClick: function onClick() {
+            return setCollapsed(!collapsed);
+          },
+          style: {
+            marginLeft: 8,
+            paddingInlineStart: 0,
+            paddingInlineEnd: 0
+          }
+        }, collapsed ? '收起' : '展开', /*#__PURE__*/React.createElement(SpecIcon, {
+          noPrefix: true,
+          name: collapsed ? 'speci-up' : 'speci-down'
+        })) : null);
       }
     })];
-  }, [confirmText, cancelText, filterFormLayout, reFormItemGroup, onFilterSearch, onFilterReset, itemGroupConfig, filterFormRef, isHideCount]);
+  }, [confirmText, cancelText, filterFormLayout, reFormItemGroup, onFilterSearch, onFilterReset, columnNumberAndSize, filterFormRef, isHideCount, collapseable, collapsed]);
 
   // 更新表单控件值，用于外部获取当前表单实例(force是否强制清空表单)
   var updateFormFields = function updateFormFields(newVal, force) {
@@ -175,37 +220,29 @@ var StandardFilter = /*#__PURE__*/React.forwardRef(function (props, ref) {
         })
       } */
     filterFormRef.current.setFieldsValue(_objectSpread(_objectSpread({}, resetValues), newVal || {})); // 直接清空表单的赋值
-    updateCalculate(filterFormRef.current.getFieldsValue());
-    if (getFormFields) getFormFields(filterFormRef.current.getFieldsValue(), filterFormRef);
+    forceUpdateForm();
   };
   // 强制更新表单值，用于赋初始化实例值
   var forceUpdateForm = useCallback(function () {
     var formValues = filterFormRef.current.getFieldsValue();
-    // if (Object.prototype.hasOwnProperty.call(formValues, false)) {
-    //   delete formValues.false // TODO 自定义结构会莫名的出来一个false字段
-    // }
-    updateCalculate(formValues); // 更新当前表单数量，排除被隐藏的值
-    if (getFormFields) getFormFields(filterFormRef.current.getFieldsValue(), filterFormRef);
-  }, [dateFormatter, formItemGroup]);
-  // 计算表单隐藏项
-  var updateCalculate = useCallback(function (formValues) {
-    setIsHideCount(reFormItemGroup.filter(function (item) {
-      return item.hasOwnProperty('isHide') ? item.isHide(_objectSpread({}, formValues), filterFormRef) : false;
-    }).length);
+    if (Object.prototype.hasOwnProperty.call(formValues, false)) {
+      delete formValues.false; // 自定义结构会莫名的出来一个false字段
+    }
+    calculateHideCount(filterFormRef, reFormItemGroup); // 更新当前表单数量，排除被隐藏的值
+    if (getFormFields) getFormFields(formValues, filterFormRef);
   }, [reFormItemGroup, filterFormRef]);
   var handleSearch = function handleSearch(values) {
     if (Object.prototype.hasOwnProperty.call(values, false)) {
-      delete values.false; // TODO 自定义结构会莫名的出来一个false字段
+      delete values.false; // 自定义结构会莫名的出来一个false字段
     }
-    var resultValues = dateFormatter === 'string' ? UtilValueFormat(values, formItemGroup) : values;
-    console.log('格式化前数据', values);
-    console.log('格式化后数据', resultValues);
+    var resultValues = dateFormatter === 'string' ? UtilValueFormat(values, reFormItemGroup) : values;
+    // console.log('格式化前数据', values)
+    // console.log('格式化后数据', resultValues)
     if (onFilterSearch) {
       onFilterSearch(_objectSpread({}, resultValues));
     }
   };
   var handleReset = function handleReset() {
-    var _filterFormRef$curren;
     // 使用此方法，表单校验无法清空掉
     // const resetValues = this.filterFormRef.current.getFieldsValue()
     // Object.keys(resetValues).forEach((item) => {
@@ -214,20 +251,78 @@ var StandardFilter = /*#__PURE__*/React.forwardRef(function (props, ref) {
     // this.filterFormRef.current.setFieldsValue({ ...resetValues }) // 直接清空表单的赋值
     filterFormRef.current.resetFields();
     setReFormItemGroup(formItemGroup); // 重新渲染列表
-    updateCalculate(filterFormRef === null || filterFormRef === void 0 || (_filterFormRef$curren = filterFormRef.current) === null || _filterFormRef$curren === void 0 ? void 0 : _filterFormRef$curren.getFieldsValue());
+    calculateHideCount(filterFormRef, reFormItemGroup);
     if (onFilterReset) {
       var _filterFormRef$curren2;
       onFilterReset(filterFormRef === null || filterFormRef === void 0 || (_filterFormRef$curren2 = filterFormRef.current) === null || _filterFormRef$curren2 === void 0 ? void 0 : _filterFormRef$curren2.getFieldsValue());
     }
   };
+
+  // 判断是否隐藏结构, display:'none'
+  var setItemHiddenNode = function setItemHiddenNode(item, index, collapsed, showItemNumber) {
+    // console.log('判断是否隐藏结构==>当前执行序号', index, showItemNumber)
+    if (item.filedName === 'filterAction') {
+      return {
+        isHidden: false
+      };
+    }
+    return {
+      // 栅格列为1时，显示1个表单项
+      isHidden: collapsed ? false : showItemNumber === 0 ? index !== 0 : !(index < showItemNumber)
+    };
+  };
+  // 渲染隐藏指定控件
+  var itemIsHide = function itemIsHide(isHide, getFieldsValue, FormInstance) {
+    if (typeof isHide === 'function') {
+      return isHide(getFieldsValue, FormInstance, 'default');
+    }
+    return isHide || false;
+  };
+  var updateGroupByCollapsed = function updateGroupByCollapsed(groups, formValues) {
+    // console.log('判断当前是否需要按展开与收缩显示对应的表单项')
+    var showItemNumber = columnNumberAndSize.columnNumber - 1;
+    return new Promise(function (resolve, reject) {
+      if (Array.isArray(groups)) {
+        resolve(groups.map(function (item, index) {
+          if (collapseable && filterFormLayout === "horizontal") {
+            var _setItemHiddenNode = setItemHiddenNode(item, index, collapsed, showItemNumber),
+              isHidden = _setItemHiddenNode.isHidden;
+            item.isHidden = isHidden;
+            item.style = _objectSpread(_objectSpread({}, item.style || {}), {}, {
+              display: item.isHidden ? 'none' : 'block'
+            });
+            if (item.hasOwnProperty('isHide') && itemIsHide(item.isHide, formValues, filterFormRef)) {
+              showItemNumber++;
+              item.isHidden = true;
+              // console.log('当前是结构是隐藏未渲染,跳到下个序号', showItemNumber)
+            }
+          }
+          return _objectSpread({}, item);
+        }));
+      } else {
+        resolve(groups);
+      }
+    });
+  };
+  useEffect(function () {
+    // 初始化表单数据数据
+    if (collapseable && filterFormLayout === "horizontal") {
+      var _filterFormRef$curren3;
+      var formValues = filterFormRef === null || filterFormRef === void 0 || (_filterFormRef$curren3 = filterFormRef.current) === null || _filterFormRef$curren3 === void 0 ? void 0 : _filterFormRef$curren3.getFieldValue();
+      updateGroupByCollapsed(formItemGroup, formValues).then(function (groups) {
+        setReFormItemGroup(groups);
+        calculateHideCount(filterFormRef, groups);
+      });
+    } else {
+      setReFormItemGroup(formItemGroup);
+    }
+  }, [formItemGroup, collapseable, filterFormLayout, collapsed, columnNumberAndSize === null || columnNumberAndSize === void 0 ? void 0 : columnNumberAndSize.columnNumber, itemGroupConfig, filterFormRef, filterFormRef === null || filterFormRef === void 0 || (_filterFormRef$curren4 = filterFormRef.current) === null || _filterFormRef$curren4 === void 0 ? void 0 : _filterFormRef$curren4.getFieldValue()]);
   useEffect(function () {
     if (initialValues && JSON.stringify(initialValues) !== '{}') {
       updateFormFields(initialValues, true);
     }
   }, [initialValues]);
-  useEffect(function () {
-    setReFormItemGroup(formItemGroup);
-  }, [formItemGroup]);
+
   // / 表单列表组 formItemGroup 类型为数组或者React.Node
   var renderFormItemGroup = function renderFormItemGroup() {
     if (Array.isArray(reFormItemGroup)) {
@@ -237,7 +332,9 @@ var StandardFilter = /*#__PURE__*/React.forwardRef(function (props, ref) {
         size: filterFormLayout === 'horizontal' ? 'xxlg' : 'md' // size决定栅格排列数量(4列排版）
         ,
         layout: filterFormLayout,
-        form: filterFormRef
+        form: filterFormRef,
+        collapseable: collapseable,
+        collapsed: collapsed
         // displayLayout={{labelCol: { span: 8 }, wrapperCol: { span: 16 },}}
         ,
         doUpdateFormFields: function doUpdateFormFields() {

package/es/StandardModal/index.js

@@ -74,20 +74,17 @@ var StandardModal = function StandardModal(props) {
   var _Form$useForm = Form.useForm(),
     _Form$useForm2 = _slicedToArray(_Form$useForm, 1),
     modalForm = _Form$useForm2[0];
-  var _useState = useState(),
+  // const [modalFormRef, setModalFormRef] = useState<any>();  // <---- set the ref when Form Rendered(使用此方法会出现溢出事件）
+  var _useState = useState(0),
     _useState2 = _slicedToArray(_useState, 2),
-    modalFormRef = _useState2[0],
-    setModalFormRef = _useState2[1]; // <---- set the ref when Form Rendered
-  var _useState3 = useState(0),
-    _useState4 = _slicedToArray(_useState3, 2),
-    bodyMaxHeight = _useState4[0],
-    setBodyMaxHeight = _useState4[1];
+    bodyMaxHeight = _useState2[0],
+    setBodyMaxHeight = _useState2[1];
 
   // setTabFormChild
-  var _useState5 = useState(),
-    _useState6 = _slicedToArray(_useState5, 2),
-    formChild = _useState6[0],
-    setFormChild = _useState6[1]; // <---- set the ref when Form Rendered
+  var _useState3 = useState(),
+    _useState4 = _slicedToArray(_useState3, 2),
+    formChild = _useState4[0],
+    setFormChild = _useState4[1]; // <---- set the ref when Form Rendered
 
   // 按钮栏是否有显示（默认显示）
   var hasFooterBar = useMemo(function () {
@@ -163,7 +160,7 @@ var StandardModal = function StandardModal(props) {
   };
   // fill Form when modal open 此处可解决获取  Form.useForm  warning
   useEffect(function () {
-    if (visible && modalFormRef) {
+    if (visible && modalForm) {
       // <---- check ref before use the form instance
       if (initialValues && _typeof(initialValues) === 'object') {
         initialValues && modalForm.setFieldsValue(_objectSpread({}, initialValues));
@@ -173,7 +170,7 @@ var StandardModal = function StandardModal(props) {
     // if (!visible && modalFormRef) {
     //   clearAllFieldsValue() // 清空表单传参数
     // }
-  }, [modalFormRef, visible]);
+  }, [modalForm, visible]);
   useEffect(function () {
     if (visible) {
       initBodyMaxHeight();
@@ -419,8 +416,12 @@ var StandardModal = function StandardModal(props) {
   // 内容渲染
   var renderChildrenNodes = function renderChildrenNodes() {
     return /*#__PURE__*/React.createElement(React.Fragment, null, children, (type === 'form' || type === 'gridForm') && /*#__PURE__*/React.createElement(Form, {
-      layout: formLayout,
-      ref: setModalFormRef,
+      layout: formLayout
+      // ref={(formInstance)=> {
+      //   // console.log('formInstance', formInstance)
+      //   // setModalFormRef(formInstance)
+      // }}
+      ,
       form: modalForm,
       onFinish: handleSubmit,
       hideRequiredMark: fieldStatus === 'viewOnly' || hideRequiredMark

package/es/StandardTable/index.js

@@ -55,7 +55,7 @@ var StandardTable = function StandardTable(props) {
     rest = _objectWithoutProperties(_providerConfig$props, _excluded);
   // 加上类型修复 TS:2322 报警
   var resetColumns = [_objectSpread(_objectSpread({
-    width: 62,
+    width: 76,
     align: 'center',
     title: '序号',
     key: 'orderNum',
@@ -83,7 +83,7 @@ var StandardTable = function StandardTable(props) {
         otherColumn = columnsConfig.otherColumn;
       if (colItem.type === 'action') {
         var _colItem, _colItem2, _colItem3;
-        colItem.width = ((_colItem = colItem) === null || _colItem === void 0 ? void 0 : _colItem.width) || (action === null || action === void 0 ? void 0 : action.width) || (colItem.buttonGroup.length > 1 ? 120 : 80);
+        colItem.width = ((_colItem = colItem) === null || _colItem === void 0 ? void 0 : _colItem.width) || (action === null || action === void 0 ? void 0 : action.width) || (colItem.buttonGroup.length > 1 ? 130 : 80);
         colItem.align = ((_colItem2 = colItem) === null || _colItem2 === void 0 ? void 0 : _colItem2.align) || (action === null || action === void 0 ? void 0 : action.align) || 'center';
         colItem.title = ((_colItem3 = colItem) === null || _colItem3 === void 0 ? void 0 : _colItem3.title) || (action === null || action === void 0 ? void 0 : action.title) || '操作';
         colItem.key = 'control';
@@ -167,7 +167,7 @@ var StandardTable = function StandardTable(props) {
   }, /*#__PURE__*/React.createElement(Table, _extends({
     rowKey: rowKey || 'id',
     rowSelection: rowSelection ? _objectSpread({
-      columnWidth: 46
+      columnWidth: 56
     }, rowSelection) : rowSelection,
     dataSource: list,
     pagination: !pagination ? false : paginationProps,

package/es/StandardTable/style/index.js

@@ -6,7 +6,6 @@ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol"
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 import { createStyleHook } from "../../theme/utils/genStyleHook";
 import { scrollBar } from "../../theme/index";
-import { TinyColor } from "@ctrl/tinycolor";
 var StandardTableStyleFunc = function StandardTableStyleFunc(prefix) {
   var prepareComponentToken = function prepareComponentToken(token) {
     return {
@@ -17,11 +16,10 @@ var StandardTableStyleFunc = function StandardTableStyleFunc(prefix) {
     var prefixCls = ".".concat(prefix);
     var rowTd = {
       '> td': {
-        borderColor: new TinyColor(token.colorPrimary).setAlpha(0.5).toRgbString(),
-        // fade(@primary-color, 50%),
-        '&::before': {
-          borderTop: "1px solid ".concat(new TinyColor(token.colorPrimary).setAlpha(0.5).toRgbString())
-        }
+        // borderColor: new TinyColor(token.colorPrimary).setAlpha(0.5).toRgbString(), // fade(@primary-color, 50%),
+        // '&::before': {
+        //   borderTop: `1px solid ${new TinyColor(token.colorPrimary).setAlpha(0.5).toRgbString()}`,
+        // }
       }
     };
     return [_defineProperty(_defineProperty(_defineProperty({}, prefixCls, {
@@ -40,22 +38,22 @@ var StandardTableStyleFunc = function StandardTableStyleFunc(prefix) {
       // 固定右侧列的样式
       '.ant-table-fixed-left table.ant-table-fixed': {
         '.ant-table-thead > tr > th, .ant-table-tbody > tr > td': {
-          paddingRight: token.paddingMD / 2,
+          paddingRight: token.paddingMD,
           '&:first-child': {
             paddingLeft: token.paddingMD,
-            paddingRight: token.paddingMD / 2
+            paddingRight: token.paddingMD
           }
         }
       },
       // 固定右侧列的样式
       '.ant-table-fixed-right': {
         '.ant-table-thead > tr > th, .ant-table-tbody > tr > td': {
-          paddingRight: token.paddingMD / 2,
+          paddingRight: token.paddingMD,
           '&:first-child': {
-            paddingLeft: token.paddingMD / 2
+            paddingLeft: token.paddingMD
           },
           '&:nth-last-child(1)': {
-            paddingLeft: token.paddingMD / 2,
+            paddingLeft: token.paddingMD,
             paddingRight: token.paddingMD
           }
         }
@@ -83,7 +81,7 @@ var StandardTableStyleFunc = function StandardTableStyleFunc(prefix) {
           fontSize: token.fontSizeLG
         },
         '.ant-table-thead > tr > th': {
-          padding: "12px ".concat(token.paddingMD / 2, "px"),
+          padding: "12px ".concat(token.paddingMD, "px"),
           '&:first-child': {
             paddingLeft: token.paddingMD
           },
@@ -92,7 +90,7 @@ var StandardTableStyleFunc = function StandardTableStyleFunc(prefix) {
           }
         },
         '.ant-table-tbody > tr > td ': {
-          padding: "12px ".concat(token.paddingMD / 2, "px"),
+          padding: "12px ".concat(token.paddingMD, "px"),
           '&:first-child': {
             paddingLeft: token.paddingMD
           },