@teamix/pro 1.2.34 → 1.2.35

package/es/page-header/index.js

@@ -17,7 +17,7 @@ import { useHistory } from 'react-router-dom';
 import classnames from 'classnames';
 import TeamixIcon from '@teamix/icon';
 import { Breadcrumb } from '@alicloudfe/components';
-import { baseClass, goToLink, renderTags, isPresetColor, getColorClassName, getBackgroundColorClassName } from '@teamix/utils';
+import { baseClass, goToLink, renderTags, isPresetColor, getColor, getColorClassName, getBackgroundColorClassName } from '@teamix/utils';
 import { ProActionGroup } from '../actions';
 import { ProSkeletonRaw } from '../skeleton';
 import ProInfo from '../info';
@@ -69,8 +69,8 @@ var getColorAndStyle = function getColorAndStyle(color, backgroundColor, backgro
   var isColorPresetColor = isPresetColor(color);
   var isBgColorPresetColor = isPresetColor(backgroundColor);
   var className = classnames((_classnames = {}, _defineProperty(_classnames, "".concat(getColorClassName(color)), isColorPresetColor), _defineProperty(_classnames, "".concat(getBackgroundColorClassName(backgroundColor)), isBgColorPresetColor), _defineProperty(_classnames, "".concat(cls("bg-type-".concat(backgroundType))), !!backgroundType), _classnames));
-  var styleColor = isColorPresetColor ? undefined : color;
-  var styleBgColor = isBgColorPresetColor ? undefined : backgroundColor;
+  var styleColor = isColorPresetColor ? getColor(color) : color;
+  var styleBgColor = isBgColorPresetColor ? getColor(color) : backgroundColor;
   var style = {
     color: styleColor,
     backgroundColor: styleBgColor

package/es/table/index.js

@@ -300,8 +300,8 @@ var ProTable = function ProTable(props) {
   var normalDataFilterForm = normalDataFilterFormRef.current;
   var fullscreenDataFilterForm = fullscreenDataFilterFormRef.current; // 传给 QueryFilter 的 formRef
 
-  var dataFilterFormRef = !fullscreenState ? normalDataFilterFormRef : fullscreenDataFilterFormRef;
-  var dataFilterForm = dataFilterFormRef.current; // 整个内容区是否超过一屏。用于表格在非全屏模式下的吸底
+  var dataFilterFormRef = !fullscreenState ? normalDataFilterFormRef : fullscreenDataFilterFormRef; // let dataFilterForm = dataFilterFormRef.current;
+  // 整个内容区是否超过一屏。用于表格在非全屏模式下的吸底
 
   var _useState29 = useState(false),
       _useState30 = _slicedToArray(_useState29, 2),
@@ -510,12 +510,12 @@ var ProTable = function ProTable(props) {
       _request(params);
     },
     reset: function reset() {
-      var _actionRef$current4, _actionRef$current4$s;
+      var _actionRef$current4, _actionRef$current4$s, _dataFilterFormRef$cu;
 
       (propsDataFilter === null || propsDataFilter === void 0 ? void 0 : propsDataFilter.onReset) && (propsDataFilter === null || propsDataFilter === void 0 ? void 0 : propsDataFilter.onReset()); // 清空列过滤参数
 
       (_actionRef$current4 = actionRef.current) === null || _actionRef$current4 === void 0 ? void 0 : (_actionRef$current4$s = _actionRef$current4.setFilterRules) === null || _actionRef$current4$s === void 0 ? void 0 : _actionRef$current4$s.call(_actionRef$current4, {});
-      dataFilterForm === null || dataFilterForm === void 0 ? void 0 : dataFilterForm.reset();
+      (_dataFilterFormRef$cu = dataFilterFormRef.current) === null || _dataFilterFormRef$cu === void 0 ? void 0 : _dataFilterFormRef$cu.reset();
       setCurrentPage(1);
 
       _request(_defineProperty({}, targetPageKey, 1));
@@ -537,7 +537,8 @@ var ProTable = function ProTable(props) {
       pageSize: pageSize
     },
     data: data,
-    dataFilterForm: dataFilterForm,
+    dataFilterForm: dataFilterFormRef.current,
+    dataFilterFormRef: dataFilterFormRef,
     normalDataFilterForm: normalDataFilterForm,
     fullscreenDataFilterForm: fullscreenDataFilterForm,
     filterEnableRef: filterEnableRef,
@@ -630,7 +631,7 @@ var ProTable = function ProTable(props) {
   }); // 请求函数
 
   function _request(params, noLoading, filterParams) {
-    var _actionRef$current$ge, _actionRef$current5, _actionRef$current5$g, _objectSpread2;
+    var _dataFilterFormRef$cu2, _actionRef$current$ge, _actionRef$current5, _actionRef$current5$g, _objectSpread2;
 
     // 如果没有传 url 且没有 customRequest，直接返回
     if (!url && !customRequest) {
@@ -643,7 +644,7 @@ var ProTable = function ProTable(props) {
 
     var sortParams = targetFormatSort(sort); // 筛选区请求参数
 
-    var dataFilterParams = filterParams !== null && filterParams !== void 0 ? filterParams : dataFilterForm === null || dataFilterForm === void 0 ? void 0 : dataFilterForm.values; // 列过滤请求参数
+    var dataFilterParams = filterParams !== null && filterParams !== void 0 ? filterParams : (_dataFilterFormRef$cu2 = dataFilterFormRef.current) === null || _dataFilterFormRef$cu2 === void 0 ? void 0 : _dataFilterFormRef$cu2.values; // 列过滤请求参数
 
     var columnsFilterParams = (_actionRef$current$ge = (_actionRef$current5 = actionRef.current) === null || _actionRef$current5 === void 0 ? void 0 : (_actionRef$current5$g = _actionRef$current5.getFilterRules) === null || _actionRef$current5$g === void 0 ? void 0 : _actionRef$current5$g.call(_actionRef$current5)) !== null && _actionRef$current$ge !== void 0 ? _actionRef$current$ge : {}; // 格式化后的请求参数
 
@@ -741,6 +742,7 @@ var ProTable = function ProTable(props) {
   }, propsDataFilter), {}, {
     onInit: function onInit(values) {
       // 表单初始化请求处理
+      console.log('onInit');
       (propsDataFilter === null || propsDataFilter === void 0 ? void 0 : propsDataFilter.onInit) && (propsDataFilter === null || propsDataFilter === void 0 ? void 0 : propsDataFilter.onInit(values));
       !fullscreenState && _request({}, false, values);
       return true;
@@ -748,7 +750,8 @@ var ProTable = function ProTable(props) {
     onFilter: function onFilter(values) {
       var _actionRef$current6, _actionRef$current6$c;
 
-      // 全屏状态，判断全屏表单onFilter是否禁用
+      console.log('onFilter'); // 全屏状态，判断全屏表单onFilter是否禁用
+
       if (fullscreenState && !filterEnableRef.current.fullscreen) {
         filterEnableRef.current.fullscreen = true;
         return;
@@ -768,8 +771,10 @@ var ProTable = function ProTable(props) {
       _request(_defineProperty({}, targetPageKey, 1), false, values);
     },
     onReset: function onReset(values) {
+      var _dataFilterFormRef$cu3;
+
       (propsDataFilter === null || propsDataFilter === void 0 ? void 0 : propsDataFilter.onReset) && (propsDataFilter === null || propsDataFilter === void 0 ? void 0 : propsDataFilter.onReset());
-      dataFilterForm === null || dataFilterForm === void 0 ? void 0 : dataFilterForm.reset();
+      (_dataFilterFormRef$cu3 = dataFilterFormRef.current) === null || _dataFilterFormRef$cu3 === void 0 ? void 0 : _dataFilterFormRef$cu3.reset();
       setCurrentPage(1);
 
       _request(_defineProperty({}, targetPageKey, 1), false, values);

package/es/table/typing.d.ts

@@ -190,6 +190,8 @@ export declare type ProTableActionType = {
     resetPage?: () => void;
     /** 获取数据过滤区表单实例 */
     dataFilterForm?: FormType;
+    /** 用于在 mount 的时候获取到表单 ref */
+    dataFilterFormRef?: React.MutableRefObject<FormType>;
     normalDataFilterForm?: FormType;
     fullscreenDataFilterForm?: FormType;
     filterEnableRef?: any;

package/lib/form/Filter/index.js

@@ -103,16 +103,43 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
       onInit = props.onInit,
       onReset = props.onReset,
       onExpand = props.onExpand,
-      otherProps = _objectWithoutProperties(props, _excluded); // 表单默认值初始化回调
+      otherProps = _objectWithoutProperties(props, _excluded);
 
+  var _useSpecialProps = (0, _useSpecialProps2.default)(props),
+      hasDefault = _useSpecialProps.hasDefault,
+      hasChangeDefault = _useSpecialProps.hasChangeDefault,
+      hasRequired = _useSpecialProps.hasRequired;
+
+  var hasDefaultOrRequired = hasDefault || hasRequired;
+
+  var _useState = (0, _react.useState)(!!expand),
+      _useState2 = _slicedToArray(_useState, 2),
+      panelVisible = _useState2[0],
+      setPanelVisible = _useState2[1];
+
+  var _useState3 = (0, _react.useState)([]),
+      _useState4 = _slicedToArray(_useState3, 2),
+      tagDataSource = _useState4[0],
+      setTagDataSource = _useState4[1];
+
+  var filterItem = (0, _react.useRef)([]);
+  var defaultForm = mode === 'panel' ? hasDefaultOrRequired || panelVisible ? 'advanced' : 'light' : 'simple';
+  var currentForm = (0, _react.useRef)(defaultForm);
+  var prefixCls = (0, _utils.usePrefixCls)('', {
+    prefix: 'teamix-pro-form-query-filter'
+  });
+  /**
+   * 处理onInit与onFilter事件的触发问题
+   */
 
-  var _onFormInit = function onFormInit(form, _ref, configFilterItem) {
+  var filterEnable = (0, _react.useRef)('waiting');
+
+  var _onFormInit = function onFormInit(form, _ref) {
     var initialRequest = _ref.initialRequest,
-        initialValues = _ref.initialValues,
-        onInit = _ref.onInit;
+        initialValues = _ref.initialValues;
 
     if (!form.mounted) {
-      // form的loading为自定义属性
+      // 在form上自定义loading属性使用
       form.setState({
         loading: !!initialRequest || !!initialValues
       });
@@ -120,32 +147,27 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
 
     var loadingField = Object.values(form.fields).filter(function (field) {
       return !!field.loading;
-    });
+    }); // 等待表单mounted + 字段loading结束 + form的loading结束 => 表单初始化完成
 
-    if (form.mounted) {
+    if (form.mounted && loadingField.length === 0 && !form.loading) {
       if (loadingField.length === 0 && !form.loading) {
-        // 仅执行一次onInit
-        _onFormInit = function onFormInit() {};
+        _onFormInit = function onFormInit() {}; // init后销毁 isFormInit 方法
 
-        var onInitResult = onInit === null || onInit === void 0 ? void 0 : onInit((0, _reactive.toJS)(form.values));
 
-        if (onInitResult) {
-          // 根据onInit返回值，判断是否使用该事件执行筛选，使用过则添加筛选标签
-          configFilterItem === null || configFilterItem === void 0 ? void 0 : configFilterItem(form);
-          configTag();
-        } // 防止onInit前后的无效onFilter
+        var values = (0, _utils.getValidValues)(form.values);
 
-
-        if (!Object.keys(form.initialValues).length) {
-          // 如果没有默认值，直接开启onFilter
-          filterEnable.current = true;
+        if (!(0, _utils.isUsable)(values) || !hasChangeDefault) {
+          // 表单无默认值 或 无触发onChange的默认值配置，不会触发onFilter内的onInit，所以主动触发onInit
+          setTimeout(function () {
+            onInit === null || onInit === void 0 ? void 0 : onInit((0, _reactive.toJS)(form.values));
+          }, 0);
+          filterEnable.current = 'filter';
         } else {
-          // 否则，拿onFilter的值与默认值进行比较
-          filterEnable.current = form.initialValues;
+          filterEnable.current = 'initialized';
         }
       }
     }
-  }; // 设置当前form
+  }; // 配置当前激活的form实例
 
 
   var setCurrentForm = function setCurrentForm(formName) {
@@ -167,7 +189,9 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
       validateFirst: true,
       effects: function effects() {
         (0, _core.onFormReact)(function (form) {
-          _onFormInit(form, props);
+          if (defaultForm === 'simple') {
+            _onFormInit(form, props);
+          }
         });
       }
     });
@@ -177,8 +201,13 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
     return (0, _core.createForm)({
       validateFirst: true,
       effects: function effects() {
+        (0, _core.onFormReact)(function (form) {
+          if (defaultForm === 'light') {
+            _onFormInit(form, props);
+          }
+        });
         (0, _core.onFormInputChange)(function () {
-          setCurrentForm('light');
+          setCurrentForm('light'); // 主动修改轻量筛选值
         });
       }
     });
@@ -189,11 +218,12 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
       validateFirst: true,
       effects: function effects() {
         (0, _core.onFormReact)(function (form) {
-          _onFormInit(form, props, configFilterItem);
+          if (defaultForm === 'advanced') {
+            _onFormInit(form, props);
+          }
         });
         (0, _core.onFormInputChange)(function (form) {
-          // 主动修改高级筛选值
-          setCurrentForm('advanced');
+          setCurrentForm('advanced'); // 主动修改高级筛选值
         });
       }
     });
@@ -202,35 +232,7 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
     simple: simpleForm,
     light: lightForm,
     advanced: advancedForm
-  };
-
-  var _useSpecialProps = (0, _useSpecialProps2.default)(props),
-      hasDefault = _useSpecialProps.hasDefault,
-      hasAsyncDefault = _useSpecialProps.hasAsyncDefault,
-      hasRequired = _useSpecialProps.hasRequired;
-
-  var hasDefaultOrRequired = hasDefault || hasAsyncDefault || hasRequired;
-
-  var _useState = (0, _react.useState)(!!expand),
-      _useState2 = _slicedToArray(_useState, 2),
-      advancedFilterVisible = _useState2[0],
-      setAdvancedFilterVisible = _useState2[1];
-
-  var _useState3 = (0, _react.useState)([]),
-      _useState4 = _slicedToArray(_useState3, 2),
-      tagDataSource = _useState4[0],
-      setTagDataSource = _useState4[1];
-
-  var filterItem = (0, _react.useRef)([]);
-  var currentForm = (0, _react.useRef)(mode === 'panel' ? advancedFilterVisible ? 'advanced' : 'light' : 'simple');
-  var filterEnable = (0, _react.useRef)(false);
-  var prefixCls = (0, _utils.usePrefixCls)('', {
-    prefix: 'teamix-pro-form-query-filter'
-  }); // 设置筛选数据
-
-  var configFilterItem = (0, _react.useCallback)(function (form) {
-    filterItem.current = getFilterDisplayValues(form);
-  }, []); // 获取筛选数据Label
+  }; // 获取筛选数据Label
 
   var getFilterDisplayValues = (0, _react.useCallback)(function (form) {
     var displayValues = (0, _useFormDisplayValues.getFormDisplayValues)(form);
@@ -258,7 +260,7 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
             index: index
           });
         });
-      } else if ((0, _utils.isSignificative)(value)) {
+      } else if ((0, _utils.isUsable)(value)) {
         filterData.push({
           key: key,
           type: _fieldTypeMap.default[component] || 'text',
@@ -268,63 +270,58 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
       }
     });
     return filterData;
+  }, []); // 设置筛选数据
+
+  var configFilterItem = (0, _react.useCallback)(function (form) {
+    filterItem.current = getFilterDisplayValues(form);
   }, []); // 设置标签数据
 
   var configTag = (0, _react.useCallback)(function () {
     setTagDataSource(filterItem.current);
-  }, [filterItem.current]); // 展开收起高级筛选
+  }, []); // 展开收起高级筛选
 
   var toggleAdvancedFilter = (0, _react.useCallback)(function () {
-    var result = !advancedFilterVisible;
+    var result = !panelVisible;
 
     if (result) {
       // 展开高级筛选，Light回填Advanced
       if (currentForm.current === 'light') {
-        advancedForm.setValues(lightForm.values);
+        Object.entries(lightForm.values || {}).map(function (_ref4) {
+          var _ref5 = _slicedToArray(_ref4, 2),
+              key = _ref5[0],
+              value = _ref5[1];
+
+          // 有效值值回填，防止全部值回填改变，触发不必要的 reactions
+          advancedForm.setValuesIn(key, value);
+        });
       }
     } else {
       // 收起高级筛选，配置标签数据
       configTag();
     }
 
-    setAdvancedFilterVisible(result);
+    setPanelVisible(result);
     onExpand === null || onExpand === void 0 ? void 0 : onExpand(result);
-  }, [advancedFilterVisible, configTag, currentForm.current]); // 是否开启onFilter
-
-  var enableFilter = function enableFilter(values) {
-    var initialValues = JSON.stringify((0, _utils.getValidValues)(filterEnable.current));
-    var changeValues = JSON.stringify((0, _utils.getValidValues)(values));
-
-    if (filterEnable.current === true) {
-      return true;
-    } else if (initialValues === changeValues) {
-      filterEnable.current = true;
-      return false;
-    }
-
-    return false;
-  }; // 简单搜索Filter
-
+  }, [panelVisible, configTag]); // 简单搜索Filter
 
   var onSimpleFilter = (0, _react.useCallback)( /*#__PURE__*/function () {
-    var _ref4 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(values) {
+    var _ref6 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(values) {
       return regeneratorRuntime.wrap(function _callee$(_context) {
         while (1) {
           switch (_context.prev = _context.next) {
             case 0:
-              if (enableFilter(values)) {
-                _context.next = 2;
+              if (!(currentForm.current === 'simple')) {
+                _context.next = 14;
                 break;
               }
 
-              return _context.abrupt("return");
-
-            case 2:
-              if (!(currentForm.current === 'simple')) {
-                _context.next = 7;
+              if (!(filterEnable.current === 'initialized')) {
+                _context.next = 9;
                 break;
               }
 
+              filterEnable.current = 'filter';
+
               if (!hasRequired) {
                 _context.next = 6;
                 break;
@@ -334,9 +331,28 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
               return simpleForm.validate();
 
             case 6:
+              onInit === null || onInit === void 0 ? void 0 : onInit(values);
+              _context.next = 14;
+              break;
+
+            case 9:
+              if (!(filterEnable.current === 'filter')) {
+                _context.next = 14;
+                break;
+              }
+
+              if (!hasRequired) {
+                _context.next = 13;
+                break;
+              }
+
+              _context.next = 13;
+              return simpleForm.validate();
+
+            case 13:
               onFilter === null || onFilter === void 0 ? void 0 : onFilter(values);
 
-            case 7:
+            case 14:
             case "end":
               return _context.stop();
           }
@@ -345,39 +361,49 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
     }));
 
     return function (_x) {
-      return _ref4.apply(this, arguments);
+      return _ref6.apply(this, arguments);
     };
-  }(), [onFilter, currentForm.current, hasRequired, enableFilter]); // 轻量搜索Filter
+  }(), [onFilter, hasRequired, onInit]); // 轻量搜索Filter
 
   var onLightFilter = (0, _react.useCallback)( /*#__PURE__*/function () {
-    var _ref5 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2(values) {
+    var _ref7 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2(values) {
       return regeneratorRuntime.wrap(function _callee2$(_context2) {
         while (1) {
           switch (_context2.prev = _context2.next) {
             case 0:
-              if (enableFilter(values)) {
-                _context2.next = 2;
+              if (!(currentForm.current === 'light')) {
+                _context2.next = 14;
                 break;
               }
 
-              return _context2.abrupt("return");
-
-            case 2:
-              if (!(currentForm.current === 'light')) {
+              if (!(filterEnable.current === 'initialized')) {
                 _context2.next = 8;
                 break;
               }
 
+              filterEnable.current = 'filter';
+              onInit === null || onInit === void 0 ? void 0 : onInit(values);
+              configFilterItem(advancedForm);
+              configTag();
+              _context2.next = 14;
+              break;
+
+            case 8:
+              if (!(filterEnable.current === 'filter')) {
+                _context2.next = 14;
+                break;
+              }
+
               onFilter === null || onFilter === void 0 ? void 0 : onFilter(values);
-              _context2.next = 6;
+              _context2.next = 12;
               return advancedForm.reset();
 
-            case 6:
+            case 12:
               // 不会触发高级筛选的onReset回调函数
               configFilterItem(advancedForm);
               configTag();
 
-            case 8:
+            case 14:
             case "end":
               return _context2.stop();
           }
@@ -386,33 +412,70 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
     }));
 
     return function (_x2) {
-      return _ref5.apply(this, arguments);
+      return _ref7.apply(this, arguments);
     };
-  }(), [onFilter, currentForm.current, enableFilter]); // 高级搜索Filter
+  }(), [onFilter, onInit]); // 高级搜索Filter by Submit
 
   var onAdvancedFilter = (0, _react.useCallback)(function (values) {
-    if (!enableFilter(values)) {
-      return;
-    }
-
     setCurrentForm('advanced');
     onFilter === null || onFilter === void 0 ? void 0 : onFilter(values);
     configFilterItem(advancedForm);
     lightForm.reset();
-  }, [onFilter, currentForm.current, enableFilter]); // 高级搜索Change
-
-  var onAdvancedChange = (0, _react.useCallback)(function (values) {
-    if (!enableFilter(values)) {
-      return;
-    }
-  }, [enableFilter]); // 高级搜索Reset
+  }, [onFilter]); // 高级搜索Reset
 
   var onAdvancedReset = (0, _react.useCallback)(function () {
     setCurrentForm('advanced');
     onReset === null || onReset === void 0 ? void 0 : onReset((0, _reactive.toJS)(advancedForm.values));
     configFilterItem(advancedForm);
     lightForm.reset();
-  }, [onReset]); // 关闭标签清空表单字段值
+  }, [onReset]); // 高级搜索Filter by Change
+
+  var onAdvancedChange = (0, _react.useCallback)( /*#__PURE__*/function () {
+    var _ref8 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee3(values) {
+      return regeneratorRuntime.wrap(function _callee3$(_context3) {
+        while (1) {
+          switch (_context3.prev = _context3.next) {
+            case 0:
+              if (!(currentForm.current === 'advanced')) {
+                _context3.next = 9;
+                break;
+              }
+
+              if (!(filterEnable.current === 'initialized')) {
+                _context3.next = 9;
+                break;
+              }
+
+              filterEnable.current = 'filter';
+
+              if (!hasRequired) {
+                _context3.next = 6;
+                break;
+              }
+
+              _context3.next = 6;
+              return advancedForm.validate();
+
+            case 6:
+              onInit === null || onInit === void 0 ? void 0 : onInit(values);
+              configFilterItem(advancedForm);
+
+              if (!panelVisible) {
+                configTag();
+              }
+
+            case 9:
+            case "end":
+              return _context3.stop();
+          }
+        }
+      }, _callee3);
+    }));
+
+    return function (_x3) {
+      return _ref8.apply(this, arguments);
+    };
+  }(), [hasRequired, onInit]); // 关闭标签清空表单字段值
 
   var onTagClose = (0, _react.useCallback)(function (key, index) {
     var newValue = undefined;
@@ -432,7 +495,8 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
     form.setState({
       loading: false
     });
-  }, []);
+  }, []); // 组件挂载
+
   (0, _react.useEffect)(function () {
     setCurrentForm(currentForm.current);
   }, []);
@@ -440,7 +504,7 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
     className: (0, _classnames.default)(prefixCls, props.className),
     addonBefore: addonBefore,
     addonAfter: addonAfter,
-    expand: advancedFilterVisible,
+    expand: panelVisible,
     onExpand: toggleAdvancedFilter,
     count: tagDataSource.length,
     inlineContent: mode === 'panel' ? /*#__PURE__*/_react.default.createElement("div", {
@@ -464,12 +528,12 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
       onReset: onAdvancedReset,
       onInitialComplete: onInitialComplete
     })) : null
-  }, mode === 'panel' && !advancedFilterVisible ? /*#__PURE__*/_react.default.createElement(_components.Tag.Group, null, tagDataSource.map(function (_ref6) {
-    var key = _ref6.key,
-        label = _ref6.label,
-        value = _ref6.value,
-        type = _ref6.type,
-        index = _ref6.index;
+  }, mode === 'panel' && !panelVisible ? /*#__PURE__*/_react.default.createElement(_components.Tag.Group, null, tagDataSource.map(function (_ref9) {
+    var key = _ref9.key,
+        label = _ref9.label,
+        value = _ref9.value,
+        type = _ref9.type,
+        index = _ref9.index;
     return /*#__PURE__*/_react.default.createElement(_components.Tag.Closeable, {
       key: (0, _utils.isNum)(index) ? key + label : key,
       afterClose: function afterClose() {

package/lib/form/Filter/useSpecialProps.d.ts

@@ -1,6 +1,6 @@
 declare const useSpecialProps: (props: any) => {
     hasDefault: boolean;
-    hasAsyncDefault: boolean;
+    hasChangeDefault: boolean;
     hasRequired: boolean;
 };
 export default useSpecialProps;

package/lib/form/Filter/useSpecialProps.js

@@ -11,8 +11,9 @@ var _utils = require("@teamix/utils");
 var useSpecialProps = function useSpecialProps(props) {
   var initialValues = props.initialValues,
       initialRequest = props.initialRequest;
-  var hasDefault = !!initialValues;
-  var hasAsyncDefault = !!initialRequest;
+  var hasChangeDefault = !!initialValues || !!initialRequest; // 会触发onChange的默认值
+
+  var hasDefault = hasChangeDefault;
   var hasRequired = false;
 
   var hasDefaultOrRule = function hasDefaultOrRule(schema) {
@@ -20,13 +21,12 @@ var useSpecialProps = function useSpecialProps(props) {
       var value = item.default,
           required = item.required,
           rules = item.rules,
-          request = item.request,
           dataSource = item.dataSource,
-          children = item.children;
-      hasDefault = hasDefault || (0, _utils.isSignificative)(value);
+          children = item.children; // 字符串变量配置default值会触发onChange
+
+      hasChangeDefault = hasChangeDefault || !!((0, _utils.isPureObj)(dataSource) && (0, _utils.isStr)(value) && value.indexOf('.dataSource'));
+      hasDefault = hasDefault || (0, _utils.isUsable)(value);
       hasRequired = hasRequired || required || !!rules;
-      hasAsyncDefault = hasAsyncDefault || !!request || // 如果dataSource是异步且default取自dataSource
-      !!((0, _utils.isPlainObj)(dataSource) && (0, _utils.isStr)(value) && value.indexOf('.dataSource'));
 
       if (children === null || children === void 0 ? void 0 : children.length) {
         hasDefaultOrRule(children);
@@ -37,7 +37,7 @@ var useSpecialProps = function useSpecialProps(props) {
   hasDefaultOrRule(props.schema);
   return {
     hasDefault: hasDefault,
-    hasAsyncDefault: hasAsyncDefault,
+    hasChangeDefault: hasChangeDefault,
     hasRequired: hasRequired
   };
 };

package/lib/form/SchemaForm/index.js

@@ -244,10 +244,10 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref) {
 
       var _initializeRequest = (0, _initializeRequest2.default)(request, "".concat(suffix, "r")),
           requestReactions = _initializeRequest.reactions,
-          requestScope = _initializeRequest.scope; // 初始化dataSource
+          requestScope = _initializeRequest.scope; // 初始化dataSource，如果readPretty为字符串表达式将失去loading等状态，仍可配置dataSource
 
 
-      var _initializeDataSource = (0, _initializeDataSource2.default)(dataSource, "".concat(suffix, "d")),
+      var _initializeDataSource = (0, _initializeDataSource2.default)(dataSource, "".concat(suffix, "d"), newItem.readPretty),
           defaultDataSource = _initializeDataSource.dataSource,
           dataSourceReactions = _initializeDataSource.reactions,
           dataSourceScope = _initializeDataSource.scope; // 初始化rules validator

package/lib/form/SchemaForm/initializeDataSource.d.ts

@@ -1,6 +1,6 @@
 import type { ProFormRequestConfig } from '../typing';
 interface IInitializeDataSource {
-    (requestConfig?: ProFormRequestConfig | any, suffix?: string): {
+    (requestConfig?: ProFormRequestConfig | any, suffix?: string, readPretty?: string | boolean): {
         dataSource?: any[];
         reactions: any[];
         scope: {