@zat-design/sisyphus-react 3.13.2 → 3.13.3

package/lib/ProForm/utils/useWatch.js

@@ -5,83 +5,163 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-exports.getNamePath = getNamePath;
-exports.stringify = stringify;
 exports.toArray = toArray;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _lodash = require("lodash");
-var _FieldContext = require("rc-field-form/es/FieldContext");
 var _warning = _interopRequireDefault(require("rc-util/lib/warning"));
 var _react = require("react");
+var _isEqual = _interopRequireDefault(require("lodash/isEqual"));
 function toArray(value) {
   if (value === undefined || value === null) {
     return [];
   }
   return Array.isArray(value) ? value : [value];
 }
-function getNamePath(path) {
-  return toArray(path);
+// 从一个对象或Form值中获取特定路径的值
+function get(source, path) {
+  if (!source || path.length === 0) {
+    return source;
+  }
+  var current = source;
+  for (var i = 0; i < path.length; i++) {
+    if (current === undefined || current === null) {
+      return undefined;
+    }
+    current = current[path[i]];
+  }
+  return current;
 }
-function stringify(value) {
-  try {
-    return JSON.stringify(value);
-  } catch (err) {
-    return Math.random();
+/**
+ * 将值设置到指定路径的嵌套对象中
+ * @param obj 目标对象
+ * @param path 路径数组
+ * @param value 要设置的值
+ */
+function setValueByPath(obj, path, value) {
+  if (path.length === 0) return;
+  // 处理单层路径
+  if (path.length === 1) {
+    obj[path[0]] = value;
+    return;
+  }
+  // 处理多层嵌套路径
+  var current = obj;
+  for (var i = 0; i < path.length - 1; i++) {
+    var key = path[i];
+    if (!current[key]) {
+      current[key] = {};
+    }
+    current = current[key];
   }
+  current[path[path.length - 1]] = value;
 }
-// 创建之后namepath就不可变
-var useWatchWarning = process.env.NODE_ENV !== 'production' ? function (namePath) {
-  var fullyStr = JSON.stringify(namePath);
-  var nameStrRef = (0, _react.useRef)(fullyStr);
-  (0, _warning.default)(nameStrRef.current === fullyStr, '`useWatch` is not support dynamic `namePath`. Please provide static instead.');
+// 创建之后namepath就不可变的警告
+var useWatchWarning = process.env.NODE_ENV !== 'production' ? function (dependencies) {
+  var depsStr = JSON.stringify(dependencies);
+  var depsStrRef = (0, _react.useRef)(depsStr);
+  (0, _warning.default)(depsStrRef.current === depsStr, '`useWatch` is not support dynamic `namePath`. Please provide static instead.');
 } : function () {};
+/**
+ * ProForm的useWatch hook，用于监听表单字段变化
+ * @param dependencies 监听的字段路径
+ * @param form 表单实例
+ * @param wait 防抖等待时间
+ * @returns 表单值
+ */
 function useWatch(dependencies, form, wait) {
-  var isSingle = typeof dependencies === 'string';
+  // 处理开发环境警告
+  useWatchWarning(dependencies);
+  // 获取表单实例
+  var formInstance = form;
+  // 用于存储最终结果
   var _useState = (0, _react.useState)({}),
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    value = _useState2[0],
-    setValue = _useState2[1];
-  var valueStr = (0, _react.useMemo)(function () {
-    return stringify(value);
-  }, [value]);
-  var valueStrRef = (0, _react.useRef)(valueStr);
-  valueStrRef.current = valueStr;
-  var formInstance = form;
-  var isValidForm = formInstance && formInstance._init;
-  var _dependencies = isSingle ? [dependencies] : dependencies;
-  var namePaths = _dependencies === null || _dependencies === void 0 ? void 0 : _dependencies.map(function (item) {
-    return getNamePath(item);
-  });
-  var namePathsRef = (0, _react.useRef)(namePaths);
-  namePathsRef.current = namePaths;
-  useWatchWarning(namePaths);
+    state = _useState2[0],
+    setState = _useState2[1];
+  // 使用ref存储中间状态，避免不必要的渲染
+  var valueRef = (0, _react.useRef)({});
+  var prevStateRef = (0, _react.useRef)({});
+  // 标准化依赖为路径数组的数组
+  var namePaths = (0, _react.useMemo)(function () {
+    // 将依赖标准化为数组的数组形式
+    var paths = [];
+    // 字符串形式: 'fieldName'
+    if (typeof dependencies === 'string') {
+      paths.push(dependencies);
+      // 数组形式
+    } else if (Array.isArray(dependencies)) {
+      // 检查是否是路径数组的集合，例如：[['a', 'number'], 'fieldName']
+      var isPathsCollection = dependencies.length > 0 && (typeof dependencies[0] === 'string' || Array.isArray(dependencies[0]));
+      if (isPathsCollection) {
+        // 每个元素都是一个路径
+        dependencies.forEach(function (path) {
+          paths.push(path);
+        });
+      } else {
+        // 整个数组是一个单一路径
+        paths.push(dependencies);
+      }
+    }
+    return paths;
+  }, [/* dependencies 故意忽略，与原实现一致 */]);
+  // 保存防抖函数引用，避免重复创建
+  var debouncedFn = (0, _react.useMemo)(function () {
+    if (wait) {
+      return (0, _lodash.debounce)(function (value) {
+        // 只在值真正变化时才更新状态
+        if (!(0, _isEqual.default)(prevStateRef.current, value)) {
+          prevStateRef.current = (0, _objectSpread2.default)({}, value);
+          setState(value);
+        }
+      }, wait);
+    }
+    // 非防抖版本
+    return function (value) {
+      if (!(0, _isEqual.default)(prevStateRef.current, value)) {
+        prevStateRef.current = (0, _objectSpread2.default)({}, value);
+        setState(value);
+      }
+    };
+  }, [wait]);
   (0, _react.useEffect)(function () {
-    if (!isValidForm) return;
-    var getFieldsValue = formInstance.getFieldsValue,
-      getInternalHooks = formInstance.getInternalHooks;
-    var _getInternalHooks = getInternalHooks(_FieldContext.HOOK_MARK),
+    if (!formInstance) return undefined;
+    // 创建更新状态的函数
+    var updateState = function updateState() {
+      var values = formInstance.getFieldsValue(true);
+      var newState = {};
+      // 处理每个监听路径
+      namePaths.forEach(function (path) {
+        // 将路径转换为数组形式
+        var namePath = toArray(path);
+        // 获取路径对应的值
+        var value = get(values, namePath);
+        // 将值设置到正确的嵌套结构中
+        setValueByPath(newState, namePath, value);
+      });
+      // 存储并更新状态
+      valueRef.current = newState;
+      debouncedFn(newState);
+    };
+    // 初始调用一次
+    updateState();
+    // 注册表单变化监听
+    var getInternalHooks = formInstance.getInternalHooks;
+    var _getInternalHooks = getInternalHooks('RC_FORM_INTERNAL_HOOKS'),
       registerWatch = _getInternalHooks.registerWatch;
-    var callback = function callback() {
-      var newValue = getFieldsValue(_dependencies);
-      var nextValueStr = stringify(newValue);
-      // Compare stringify in case it's nest object
-      if (valueStrRef.current !== nextValueStr) {
-        valueStrRef.current = nextValueStr;
-        setValue(getFieldsValue(_dependencies));
+    var cancelWatch = registerWatch(function (values) {
+      if (values) {
+        updateState();
+      }
+    });
+    // 清理订阅
+    return function () {
+      if (wait) {
+        debouncedFn.cancel();
       }
+      cancelWatch();
     };
-    // 增加防抖
-    if (wait) {
-      callback = (0, _lodash.debounce)(callback, wait);
-    }
-    var cancelRegister = registerWatch(callback);
-    var initialValue = getFieldsValue(_dependencies);
-    setValue(initialValue);
-    return cancelRegister;
-  },
-  // We do not need re-register since namePath content is the same
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  [isValidForm]);
-  return value;
+  }, [formInstance, namePaths, debouncedFn, wait]);
+  return state;
 }
 var _default = exports.default = useWatch;

package/lib/ProTable/components/RenderTabs/index.js

@@ -20,7 +20,8 @@ var RenderTabs = function RenderTabs(props) {
     transformResponse = props.transformResponse,
     tabsProps = props.tabsProps,
     name = props.name,
-    formTableProps = props.formTableProps;
+    formTableProps = props.formTableProps,
+    transformParams = props.transformParams;
   var _ref = formTableProps || {},
     form = _ref.form,
     onSearch = _ref.onSearch;
@@ -71,7 +72,11 @@ var RenderTabs = function RenderTabs(props) {
       var fieldsValues = (form === null || form === void 0 ? void 0 : form.getFieldsValue()) || {};
       setActiveKey(key);
       form.setFieldValue(name, key);
-      onSearch === null || onSearch === void 0 ? void 0 : onSearch((0, _objectSpread3.default)((0, _objectSpread3.default)({}, fieldsValues), {}, (0, _defineProperty2.default)({}, name, key)));
+      var params = (0, _objectSpread3.default)((0, _objectSpread3.default)({}, fieldsValues), {}, (0, _defineProperty2.default)({}, name, key));
+      if (transformParams && typeof transformParams === 'function') {
+        params = transformParams(params);
+      }
+      onSearch === null || onSearch === void 0 ? void 0 : onSearch(params);
     },
     type: "card"
   }, tabsProps), {}, {

package/lib/ProTable/hooks/useAntdTable.js

@@ -33,7 +33,7 @@ var useDefaultOptions = function useDefaultOptions(options) {
 };
 var previousSearchValues = null;
 function useAntdTable(service, options, useRequestOptions) {
-  var _locale$ProTable2, _locale$ProTable3, _locale$ProTable4, _locale$ProTable5;
+  var _locale$ProTable2, _locale$ProTable3, _locale$ProTable4, _locale$ProTable5, _result$params;
   var _useSetState = (0, _ahooks.useSetState)({
       data: [],
       total: 0,
@@ -110,12 +110,6 @@ function useAntdTable(service, options, useRequestOptions) {
       allSelected: false
     }, values));
   };
-  var params = (0, _react.useMemo)(function () {
-    var newQueryBean = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, searchValues), extraFilter);
-    return getTransformParams((0, _objectSpread2.default)({
-      page: page
-    }, newQueryBean));
-  }, [page, searchValues, extraFilter]);
   var curService = (0, _react.useMemo)(function () {
     return service.toString();
   }, [service]);
@@ -254,7 +248,7 @@ function useAntdTable(service, options, useRequestOptions) {
       onPageChange(newPage);
     }
     // 减少查询按钮的渲染，只有需要重置值时才需要调用
-    if ((selectedRecords === null || selectedRecords === void 0 ? void 0 : selectedRecords.length) || (0, _utils.isNonEmptyObject)(_values) && !(0, _lodash.isEqual)(previousSearchValues, _values)) {
+    if ((selectedRecords === null || selectedRecords === void 0 ? void 0 : selectedRecords.length) || (0, _utils.isNonEmptyObject)(_values) || !(0, _lodash.isEqual)(previousSearchValues, _values)) {
       previousSearchValues = _values;
       setState({
         searchValues: _values,
@@ -484,7 +478,7 @@ function useAntdTable(service, options, useRequestOptions) {
   };
   var useAntdTableProps = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, result), {}, {
     data: data,
-    params: params,
+    params: (result === null || result === void 0 ? void 0 : (_result$params = result.params) === null || _result$params === void 0 ? void 0 : _result$params[0]) || {},
     rowSelection: rowSelection,
     searchValues: searchValues,
     allSelected: allSelected,

package/lib/ProTable/propsType.d.ts

@@ -337,6 +337,12 @@ export interface ProTableTabsType {
         label: string;
         value: string;
     }[];
+    /**
+     * 转换查询参数
+     * @description 转换查询参数
+     * @default undefined
+     */
+    transformParams?: (params: any) => any;
     /**
      * 枚举数据源转换
      * @description 枚举数据源转换

package/lib/ProTooltip/index.js

@@ -16,8 +16,15 @@ var _react = require("react");
 var _classnames2 = _interopRequireDefault(require("classnames"));
 var _utils = require("../utils");
 var _excluded = ["text", "mode", "width", "line", "className", "style", "lineHeight", "scrollFollowParent"];
+var _findTableParent = function findTableParent(element) {
+  var _element$tagName;
+  var depth = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+  if (!element || depth >= 3) return false;
+  if (((_element$tagName = element.tagName) === null || _element$tagName === void 0 ? void 0 : _element$tagName.toLowerCase()) === 'td') return true;
+  return _findTableParent(element.parentElement, depth + 1);
+};
 var ProTooltip = function ProTooltip(props) {
-  var _useSize, _parentElement$tagNam;
+  var _useSize;
   var ref = (0, _react.useRef)();
   var childRef = (0, _react.useRef)();
   var contentWrapRef = (0, _react.useRef)();
@@ -64,7 +71,7 @@ var ProTooltip = function ProTooltip(props) {
   });
   var _ref = (_useSize = (0, _ahooks.useSize)(localElement)) !== null && _useSize !== void 0 ? _useSize : {},
     _localSizeWidth = _ref.width;
-  var isTable = (parentElement === null || parentElement === void 0 ? void 0 : (_parentElement$tagNam = parentElement.tagName) === null || _parentElement$tagNam === void 0 ? void 0 : _parentElement$tagNam.toLowerCase()) === 'td';
+  var isTable = _findTableParent(ref.current);
   var overlayStyle = mode === 'auto' ? {
     maxWidth: _localSizeWidth
   } : {};

package/lib/ProTooltip/propsType.d.ts

@@ -9,9 +9,8 @@ export interface ProTooltipType {
     /**
      * 提示框宽度
      * @description 设置提示框的宽度，支持各种CSS宽度单位
-     * @default 'auto'
      */
-    width?: string;
+    width?: string | number;
     /**
      * 显示的行数
      * @description 当内容超过设定行数时将截断显示

package/lib/style/theme/antd.less

@@ -107,6 +107,11 @@
   .@{ant-prefix}-empty-normal {
     margin: calc(var(--zaui-space-size-lg; 32px) * var(--zaui-size; 1)) 0;
   }
+  .@{ant-prefix}-table-tbody{
+    .@{ant-prefix}-table-cell-fix-left-last:after{
+      width: 8px;
+    }
+  }
   &.pro-table-no-stripe {
     .@{ant-prefix}-table-tbody {
       .@{ant-prefix}-table-row {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zat-design/sisyphus-react",
-  "version": "3.13.2",
+  "version": "3.13.3",
   "license": "MIT",
   "main": "lib/index.js",
   "module": "es/index.js",