@zat-design/sisyphus-react 3.7.3-beta.9 → 3.8.0

package/es/ProTreeModal/index.js

@@ -15,7 +15,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
  * @Author: za-xuwenli xuwenli@zhongan.io
  * @Date: 2024-06-04 10:01:18
  * @LastEditors: za-xuwenli xuwenli@zhongan.io
- * @LastEditTime: 2024-06-25 17:56:33
+ * @LastEditTime: 2024-09-27 11:49:28
  * @FilePath: /za-material-warehouse/src/ProTreeModal/index.tsx
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
@@ -26,7 +26,8 @@ import { ReactSVG } from 'react-svg';
 import classNames from 'classnames';
 import { ProDrawerForm, useProConfig } from '../index';
 import { Trigger, ListView, TreeView, Cascader } from './components';
-import { getFlatTreeData, filterCheckedNodes, getChildrenKeys, findTreeNodeByKey, getAllKeys, transformMessage } from './utils';
+import { getFlatTreeData, filterCheckedNodes, getChildrenKeys, findTreeNodeByKey, getAllKeys, transformMessage, addLevelAndParentId } from './utils';
+import { transformTreeToArray, treeNodeFind } from '../ProTable/components/RcTable/components/DraggableTable/components/DndWrapper/utils/index';
 import searchSVG from '../assets/input-search.svg';
 import locale, { formatMessage } from '../locale';
 import './style/index.less';
@@ -98,7 +99,8 @@ var ProTreeModal = function ProTreeModal(props) {
       flatTreeData: [],
       searchStr: '',
       checkAll: false,
-      allKeys: []
+      allKeys: [],
+      transformedTree: []
     }),
     _useSetState2 = _slicedToArray(_useSetState, 2),
     state = _useSetState2[0],
@@ -220,6 +222,12 @@ var ProTreeModal = function ProTreeModal(props) {
       });
     }
   }, [value, state.allKeys, state.open]);
+  useDeepCompareEffect(function () {
+    var transformedTree = addLevelAndParentId(state.treeData, fieldNames);
+    setState({
+      transformedTree: transformedTree
+    });
+  }, [state.treeData]);
   var handleClick = function handleClick() {
     setState({
       open: true
@@ -360,8 +368,55 @@ var ProTreeModal = function ProTreeModal(props) {
   var onCheck = function onCheck(checkedKeys, info) {
     var checkedValues = _toConsumableArray(state.checkedValues);
     var originalTreeData = state.originalTreeData;
+    // 如果有检索则自管理
+    if (state.searchStr) {
+      var _transformTreeToArray;
+      var node = info.node;
+      // 从完整树中找到当前节点
+      var activeNode = treeNodeFind(state.transformedTree, function (t) {
+        return t[fieldNameValue] === node[fieldNameValue];
+      }, {
+        childrenKey: fieldNames.children
+      });
+      var allChildren = (_transformTreeToArray = transformTreeToArray([activeNode], {
+        childrenKey: fieldNames.children
+      })) === null || _transformTreeToArray === void 0 ? void 0 : _transformTreeToArray.map(function (item) {
+        return item[fieldNameValue];
+      });
+      // 子项合并勾选
+      checkedValues = checkedValues.concat(allChildren);
+      // 从完整树中拿到父节点 只要存在父节点，那么就判断当前children是否全被勾选 若全被勾选就合并当前key到勾选队列
+      var _recourse2 = function _recourse(findNode) {
+        if (findNode.parentId) {
+          var _transformTreeToArray2;
+          var parentNode = treeNodeFind(state.transformedTree, function (t) {
+            return t[fieldNameValue] === findNode.parentId;
+          }, {
+            childrenKey: fieldNames.children
+          });
+          var parentChildrenKeys = (_transformTreeToArray2 = transformTreeToArray([parentNode], {
+            childrenKey: fieldNames.children
+          })) === null || _transformTreeToArray2 === void 0 ? void 0 : _transformTreeToArray2.map(function (item) {
+            return item[fieldNameValue];
+          });
+          var parentChildrenAllChecked = parentChildrenKeys.every(function (key) {
+            return checkedValues.includes(key);
+          });
+          if (parentChildrenAllChecked) {
+            // 把当前父节点追加进来
+            checkedValues = checkedValues.concat([parentNode[fieldNameValue]]);
+            // 继续向上查找
+            if (parentNode.parentId) {
+              _recourse2(parentNode);
+            }
+          }
+        }
+      };
+      _recourse2(activeNode);
+    }
+    var _checkStrictly = state.searchStr ? true : checkStrictly;
     // 此时应该取消掉自身并包含它所有的子集
-    if (!info.checked && !checkStrictly) {
+    if (!info.checked && !_checkStrictly) {
       // 1. 取消自身
       // 2. 把所有的子节点也要取消
       var childrenkeys = [];
@@ -378,8 +433,8 @@ var ProTreeModal = function ProTreeModal(props) {
         return !parentKeys.includes(key);
       });
     } else {
-      // checkStrictly 模式下取 checkedKeys.checked 或者自身的 key
-      if (checkStrictly) {
+      // _checkStrictly 模式下取 checkedKeys.checked 或者自身的 key
+      if (_checkStrictly) {
         if (!info.checked) {
           checkedValues = checkedValues.filter(function (key) {
             return key !== info.node.key;
@@ -618,7 +673,7 @@ var ProTreeModal = function ProTreeModal(props) {
         });
       case TREE:
         return _jsx(TreeView, {
-          treeData: state.treeData,
+          treeData: state.transformedTree,
           originalTreeData: state.originalTreeData,
           flatTreeData: state.flatTreeData,
           checkedValues: state.checkedValues,

package/es/ProTreeModal/utils.d.ts

@@ -36,3 +36,4 @@ export declare function filterCheckedNodes(data: any, checkedKeys: any, searchSt
  */
 export declare function getChildrenKeys(node: TreeDataProps, childrenKeys: string[], fieldNames: FieldNamesType, type: 'treeClose' | 'treeCheck'): void;
 export declare const transformMessage: (obj: any, message: string) => string;
+export declare const addLevelAndParentId: (tree: any[], fieldNames: any, currentLevel?: number, currentParentId?: any) => any[];

package/es/ProTreeModal/utils.js

@@ -197,4 +197,24 @@ export var transformMessage = function transformMessage(obj, message) {
     _message = message.replaceAll("{".concat(key, "}"), obj[key]);
   });
   return _message;
-};
+};
+var _addLevelAndParentId = function addLevelAndParentId() {
+  var tree = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+  var fieldNames = arguments.length > 1 ? arguments[1] : undefined;
+  var currentLevel = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
+  var currentParentId = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null;
+  var _fieldNames$children = fieldNames.children,
+    children = _fieldNames$children === void 0 ? 'children' : _fieldNames$children,
+    _fieldNames$value = fieldNames.value,
+    value = _fieldNames$value === void 0 ? 'value' : _fieldNames$value;
+  return tree.map(function (node) {
+    var newNode = _objectSpread({}, node);
+    newNode.level = currentLevel;
+    newNode.parentId = currentParentId;
+    if (node[children]) {
+      newNode[children] = _addLevelAndParentId(node[children], fieldNames, currentLevel + 1, newNode[value]);
+    }
+    return newNode;
+  });
+};
+export { _addLevelAndParentId as addLevelAndParentId };

package/es/style/theme/index.less

@@ -8,7 +8,7 @@
   --zaui-brand                      : #006aff;
   --zaui-brand-hover                : #3387ff;
   --zaui-brand-active               : #005ad9;
-  --zaui-brand-disabled             : #99c3ff;
+  --zaui-brand-disabled             : color-mix(in srgb, var(--zaui-brand) 70%, white);
   --zaui-text                       : #343434;
   --zaui-text-weak                  : #616161;
   --zaui-aide-text                  : #909090;

package/lib/ProEditTable/components/RenderField/index.js

@@ -517,7 +517,7 @@ var RenderField = function RenderField(_ref) {
       form: form,
       names: names,
       namePath: [].concat((0, _toConsumableArray2.default)(namePath), [index]),
-      name: cellName,
+      name: originalName,
       listName: cellName,
       viewEmpty: viewEmpty,
       valueType: _valueType,

package/lib/ProEnum/components/Group.js

@@ -50,7 +50,10 @@ var Group = function Group(props) {
   }
   return (0, _jsxRuntime.jsx)("div", {
     id: id,
-    className: (0, _classnames.default)('pro-enum-group-root', disabled ? 'pro-enum-group-root-disabled' : ''),
+    className: (0, _classnames.default)({
+      'pro-enum-group-root': true,
+      'pro-enum-group-root-disabled': disabled
+    }),
     children: dataSource.map(function (item, index) {
       return (0, _jsxRuntime.jsx)("div", {
         onClick: function onClick() {
@@ -58,7 +61,12 @@ var Group = function Group(props) {
             handleClick(item[fieldValue], index);
           }
         },
-        className: (0, _classnames.default)('pro-enum-group-item', value === item[fieldValue] ? 'pro-enum-group-item-selected' : '', index === idx.current || index + 1 === idx.current ? 'pro-enum-group-item-disabled-after' : '', item.disabled ? 'pro-enum-group-item-disabled' : ''),
+        className: (0, _classnames.default)({
+          'pro-enum-group-item': true,
+          'pro-enum-group-item-selected': value === item[fieldValue],
+          'pro-enum-group-item-disabled-after': index === idx.current || index + 1 === idx.current,
+          'pro-enum-group-item-disabled': item.disabled
+        }),
         children: item[fieldLabel]
       }, item[fieldValue]);
     })

package/lib/ProEnum/index.js

@@ -44,7 +44,7 @@ var ProEnum = function ProEnum(props) {
     enumProps = (0, _objectWithoutProperties2.default)(props, _excluded);
   var _ref = otherProps || {},
     viewEmpty = _ref.viewEmpty;
-  var _isView = isView || otherProps.isView;
+  var _isView = isView || (otherProps === null || otherProps === void 0 ? void 0 : otherProps.isView);
   var _ref2 = (0, _ProConfigProvider.useProConfig)('ProEnum') || {},
     fieldNames = _ref2.fieldNames,
     _ref2$clear = _ref2.clear,

package/lib/ProEnum/style/index.less

@@ -1,6 +1,8 @@
 @root-entry-name: 'default';
 @import (reference) '~antd/es/style/themes/index.less';
 
+@zaui-disabled-bg: var(--zaui-disabled-bg);
+
 .pro-enum {
   &-tag-root {
     display: flex;
@@ -96,10 +98,14 @@
   }
 
   &-group-root-disabled {
-    color: #bfbfbf;
+    color: var(--zaui-aide-text);
 
     .pro-enum-group-item {
       background: var(--zaui-disabled-bg);
+      &.pro-enum-group-item-selected {
+        background: var(--zaui-brand-disabled);
+        border-color: var(--zaui-brand-disabled);
+      }
     }
   }
 }

package/lib/ProForm/components/combination/ProModalSelect/index.js

@@ -132,10 +132,10 @@ var ProModalSelect = function ProModalSelect(props, ref) {
     }, (0, _objectSpread3.default)((0, _objectSpread3.default)({}, useRequest === null || useRequest === void 0 ? void 0 : useRequest.options), {}, {
       manual: true,
       onSuccess: function onSuccess(res) {
-        var _res$data;
+        var _res$data, _ref5;
         var list = withPagination ? res === null || res === void 0 ? void 0 : (_res$data = res.data) === null || _res$data === void 0 ? void 0 : _res$data.list : res === null || res === void 0 ? void 0 : res.data;
         setState({
-          options: transformResponse ? transformResponse(res === null || res === void 0 ? void 0 : res.data) : list
+          options: (_ref5 = transformResponse ? transformResponse(res === null || res === void 0 ? void 0 : res.data) : list) !== null && _ref5 !== void 0 ? _ref5 : []
         });
       }
     })),
@@ -161,9 +161,9 @@ var ProModalSelect = function ProModalSelect(props, ref) {
   };
   var handleFormat = onFormat || defaultOptionRender;
   if (showCodeName) {
-    handleFormat = function handleFormat(_ref5) {
-      var value = _ref5.value,
-        label = _ref5.label;
+    handleFormat = function handleFormat(_ref6) {
+      var value = _ref6.value,
+        label = _ref6.label;
       return "".concat(value, "-").concat(label);
     };
   }
@@ -232,7 +232,7 @@ var ProModalSelect = function ProModalSelect(props, ref) {
     onChange(val, option);
   };
   var handleClick = /*#__PURE__*/function () {
-    var _ref6 = (0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee() {
+    var _ref7 = (0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee() {
       var _yield$beforeOpen, res;
       return (0, _regeneratorRuntime2.default)().wrap(function _callee$(_context) {
         while (1) switch (_context.prev = _context.next) {
@@ -275,7 +275,7 @@ var ProModalSelect = function ProModalSelect(props, ref) {
       }, _callee);
     }));
     return function handleClick() {
-      return _ref6.apply(this, arguments);
+      return _ref7.apply(this, arguments);
     };
   }();
   var handleClose = function handleClose() {
@@ -294,7 +294,7 @@ var ProModalSelect = function ProModalSelect(props, ref) {
     }
   };
   var handleFinish = /*#__PURE__*/function () {
-    var _ref7 = (0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee2() {
+    var _ref8 = (0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee2() {
       var _nextSelectedRows, _nextSelectedRows2, nextSelectedRows, record, flag, res;
       return (0, _regeneratorRuntime2.default)().wrap(function _callee2$(_context2) {
         while (1) switch (_context2.prev = _context2.next) {
@@ -355,11 +355,11 @@ var ProModalSelect = function ProModalSelect(props, ref) {
       }, _callee2, null, [[0, 18]]);
     }));
     return function handleFinish() {
-      return _ref7.apply(this, arguments);
+      return _ref8.apply(this, arguments);
     };
   }();
   var handleSearch = /*#__PURE__*/function () {
-    var _ref8 = (0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee3() {
+    var _ref9 = (0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee3() {
       var values;
       return (0, _regeneratorRuntime2.default)().wrap(function _callee3$(_context3) {
         while (1) switch (_context3.prev = _context3.next) {
@@ -378,7 +378,7 @@ var ProModalSelect = function ProModalSelect(props, ref) {
       }, _callee3);
     }));
     return function handleSearch() {
-      return _ref8.apply(this, arguments);
+      return _ref9.apply(this, arguments);
     };
   }();
   var _rowSelection = (0, _objectSpread3.default)({
@@ -432,7 +432,7 @@ var ProModalSelect = function ProModalSelect(props, ref) {
   };
   // 初始化回显，当传入initParams时，前端用来回险
   var getInitValues = /*#__PURE__*/function () {
-    var _ref9 = (0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee4() {
+    var _ref10 = (0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee4() {
       var _contentForm$getField, _useRequest$options2, _useRequest$options3, queryBean, page, params, res, _res$data2, _list, list, _data, nextSelectRowKeys;
       return (0, _regeneratorRuntime2.default)().wrap(function _callee4$(_context4) {
         while (1) switch (_context4.prev = _context4.next) {
@@ -490,12 +490,12 @@ var ProModalSelect = function ProModalSelect(props, ref) {
       }, _callee4);
     }));
     return function getInitValues() {
-      return _ref9.apply(this, arguments);
+      return _ref10.apply(this, arguments);
     };
   }();
   // 初始化回显，当传入initParams时，前端用来回险
   var getDefaultOneValues = /*#__PURE__*/function () {
-    var _ref10 = (0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee5() {
+    var _ref11 = (0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee5() {
       var _useRequest$options4, _useRequest$options5;
       var queryBean, page, params, res, _res$data3, _list2, list, _data2, nextSelectRowKeys;
       return (0, _regeneratorRuntime2.default)().wrap(function _callee5$(_context5) {
@@ -543,7 +543,7 @@ var ProModalSelect = function ProModalSelect(props, ref) {
       }, _callee5);
     }));
     return function getDefaultOneValues() {
-      return _ref10.apply(this, arguments);
+      return _ref11.apply(this, arguments);
     };
   }();
   (0, _react.useImperativeHandle)(ref, function () {
@@ -574,7 +574,7 @@ var ProModalSelect = function ProModalSelect(props, ref) {
       });
     }
   });
-  (0, _react.useEffect)(function () {
+  (0, _ahooks.useDeepCompareEffect)(function () {
     if (onOff && !visible) {
       var _useRequest$options6;
       if ((useRequest === null || useRequest === void 0 ? void 0 : (_useRequest$options6 = useRequest.options) === null || _useRequest$options6 === void 0 ? void 0 : _useRequest$options6.manual) !== true) {
@@ -610,34 +610,39 @@ var ProModalSelect = function ProModalSelect(props, ref) {
       setState(nextState);
     }
   }, [onOff, visible, value]);
-  (0, _react.useEffect)(function () {
-    if (value && !visible && isInit) {
-      if (readOnly) {
-        // 加定时器 修复依赖数据同步更新未取到问题
-        setTimeout(function () {
-          var _useRequest$options7, _useRequest$options8;
-          var initParams = useRequest === null || useRequest === void 0 ? void 0 : useRequest.initParams;
-          if (typeof (useRequest === null || useRequest === void 0 ? void 0 : useRequest.initParams) === 'function') {
-            var _contentForm$getField2;
-            initParams = useRequest === null || useRequest === void 0 ? void 0 : useRequest.initParams(value, contentForm === null || contentForm === void 0 ? void 0 : (_contentForm$getField2 = contentForm.getFieldsValue) === null || _contentForm$getField2 === void 0 ? void 0 : _contentForm$getField2.call(contentForm));
-          }
-          var params = withPagination ? {
-            pageNum: 1,
-            pageSize: 50,
-            queryBean: (0, _objectSpread3.default)((0, _objectSpread3.default)({}, useRequest === null || useRequest === void 0 ? void 0 : (_useRequest$options7 = useRequest.options) === null || _useRequest$options7 === void 0 ? void 0 : _useRequest$options7.defaultParams), initParams)
-          } : (0, _objectSpread3.default)((0, _objectSpread3.default)({}, useRequest === null || useRequest === void 0 ? void 0 : (_useRequest$options8 = useRequest.options) === null || _useRequest$options8 === void 0 ? void 0 : _useRequest$options8.defaultParams), initParams);
-          var nextParams = transformParams ? transformParams(params) : params;
-          run(nextParams);
-          setState({
-            isInit: false
-          });
-        }, 300);
-      } else {
-        getInitValues();
+  (0, _ahooks.useDeepCompareEffect)(function () {
+    if (value && !visible && isInit && !readOnly) {
+      getInitValues();
+    }
+  }, [value, visible, isInit]);
+  (0, _ahooks.useDeepCompareEffect)(function () {
+    if (value && !visible && readOnly) {
+      var _options$some;
+      var isHasValue = options === null || options === void 0 ? void 0 : (_options$some = options.some) === null || _options$some === void 0 ? void 0 : _options$some.call(options, function (item) {
+        return item[valueKey] === value;
+      });
+      if (isHasValue) {
+        return;
       }
+      // 加定时器 修复依赖数据同步更新未取到问题
+      setTimeout(function () {
+        var _useRequest$options7, _useRequest$options8;
+        var initParams = useRequest === null || useRequest === void 0 ? void 0 : useRequest.initParams;
+        if (typeof (useRequest === null || useRequest === void 0 ? void 0 : useRequest.initParams) === 'function') {
+          var _contentForm$getField2;
+          initParams = useRequest === null || useRequest === void 0 ? void 0 : useRequest.initParams(value, contentForm === null || contentForm === void 0 ? void 0 : (_contentForm$getField2 = contentForm.getFieldsValue) === null || _contentForm$getField2 === void 0 ? void 0 : _contentForm$getField2.call(contentForm));
+        }
+        var params = withPagination ? {
+          pageNum: 1,
+          pageSize: 50,
+          queryBean: (0, _objectSpread3.default)((0, _objectSpread3.default)({}, useRequest === null || useRequest === void 0 ? void 0 : (_useRequest$options7 = useRequest.options) === null || _useRequest$options7 === void 0 ? void 0 : _useRequest$options7.defaultParams), initParams)
+        } : (0, _objectSpread3.default)((0, _objectSpread3.default)({}, useRequest === null || useRequest === void 0 ? void 0 : (_useRequest$options8 = useRequest.options) === null || _useRequest$options8 === void 0 ? void 0 : _useRequest$options8.defaultParams), initParams);
+        var nextParams = transformParams ? transformParams(params) : params;
+        run(nextParams);
+      }, 300);
     }
-  }, [value, visible, isInit, useRequest]);
-  (0, _react.useEffect)(function () {
+  }, [value, options, visible, useRequest]);
+  (0, _ahooks.useDeepCompareEffect)(function () {
     if (!value) {
       if (defaultOne) {
         getDefaultOneValues();
@@ -737,7 +742,7 @@ var ProModalSelect = function ProModalSelect(props, ref) {
       children: customRender
     });
   }
-  (0, _react.useEffect)(function () {
+  (0, _ahooks.useDeepCompareEffect)(function () {
     if (isTooltip && value) {
       var dom = document.getElementById(uuid);
       dom.addEventListener('mouseover', function (e) {
@@ -774,7 +779,7 @@ var ProModalSelect = function ProModalSelect(props, ref) {
   }, [value, isTooltip]);
   (0, _ahooks.useDeepCompareEffect)(function () {
     setState({
-      options: tableProps === null || tableProps === void 0 ? void 0 : tableProps.dataSource
+      options: (tableProps === null || tableProps === void 0 ? void 0 : tableProps.dataSource) || []
     });
   }, [tableProps === null || tableProps === void 0 ? void 0 : tableProps.dataSource]);
   // 当搜索条件只有一个时，且为输入框，默认设置suffix

package/lib/ProForm/components/combination/ProNumberRange/index.js

@@ -17,11 +17,9 @@ var _utils = require("@zat-design/utils");
 var _Container = _interopRequireDefault(require("../../Container"));
 var _locale = _interopRequireDefault(require("../../../../locale"));
 var _ProForm = _interopRequireDefault(require("../../../../ProForm"));
-var formatAmount = _utils.tools.formatAmount,
-  formatPercent = _utils.tools.formatPercent,
-  formatPerMill = _utils.tools.formatPerMill;
+var formatAmount = _utils.tools.formatAmount;
 var ProNumberRange = function ProNumberRange(props) {
-  var _valueProps, _ref2, _ref3, _value$, _valueProps2, _ref4, _ref5, _value$2, _valueProps3, _valueProps4;
+  var _document$querySelect, _valueProps, _ref2, _ref3, _value$, _valueProps2, _ref4, _ref5, _value$2, _valueProps3, _valueProps4;
   var _props$value = props.value,
     value = _props$value === void 0 ? [] : _props$value,
     _props$onChange = props.onChange,
@@ -46,6 +44,7 @@ var ProNumberRange = function ProNumberRange(props) {
     viewEmpty = _ref.viewEmpty,
     valueType = _ref.valueType;
   var isView = typeof props.isView === 'boolean' ? props.isView : isViewCon; // 组件可直接接收isView参数, 优先级高
+  var addonAfterDomWidth = (_document$querySelect = document.querySelector('.ant-input-number-group-addon')) === null || _document$querySelect === void 0 ? void 0 : _document$querySelect.clientWidth;
   var _useSetState = (0, _ahooks.useSetState)({
       range: value || []
     }),
@@ -91,6 +90,8 @@ var ProNumberRange = function ProNumberRange(props) {
   };
   var cls = (0, _classnames.default)({
     'pro-number-range': true,
+    'pro-number-range-after': addonAfter,
+    'pro-number-range-before': addonBefore,
     className: className
   });
   // 查看模式
@@ -194,6 +195,9 @@ var ProNumberRange = function ProNumberRange(props) {
       },
       addonBefore: addonBefore
     }, valueProps), {}, {
+      style: addonAfter ? {
+        width: "calc(50% - ".concat(16 + addonAfterDomWidth / 2, "px)")
+      } : null,
       min: min !== null && min !== void 0 ? min : (_valueProps = valueProps) === null || _valueProps === void 0 ? void 0 : _valueProps.min,
       max: (_ref2 = (_ref3 = (_value$ = value === null || value === void 0 ? void 0 : value[1]) !== null && _value$ !== void 0 ? _value$ : range[1]) !== null && _ref3 !== void 0 ? _ref3 : max) !== null && _ref2 !== void 0 ? _ref2 : (_valueProps2 = valueProps) === null || _valueProps2 === void 0 ? void 0 : _valueProps2.max
     }, childProps === null || childProps === void 0 ? void 0 : childProps[0])), (0, _jsxRuntime.jsx)(_antd.Input, {
@@ -214,6 +218,9 @@ var ProNumberRange = function ProNumberRange(props) {
       },
       addonAfter: addonAfter
     }, valueProps), {}, {
+      style: addonAfter ? {
+        width: "calc(50% - ".concat(16 - addonAfterDomWidth / 2, "px)")
+      } : null,
       min: (_ref4 = (_ref5 = (_value$2 = value === null || value === void 0 ? void 0 : value[0]) !== null && _value$2 !== void 0 ? _value$2 : range[0]) !== null && _ref5 !== void 0 ? _ref5 : min) !== null && _ref4 !== void 0 ? _ref4 : (_valueProps3 = valueProps) === null || _valueProps3 === void 0 ? void 0 : _valueProps3.min,
       max: max !== null && max !== void 0 ? max : (_valueProps4 = valueProps) === null || _valueProps4 === void 0 ? void 0 : _valueProps4.max
     }, childProps === null || childProps === void 0 ? void 0 : childProps[1]))]

package/lib/ProForm/components/combination/ProNumberRange/style/index.less

@@ -40,8 +40,12 @@
 
   .range-left,
   .range-right {
-    width: calc(50% - 20px);
+    width: calc(50% - 16px);
     text-align: center;
+    transition: none;
+    .range-left {
+      width: calc(100% + 2px) !important;
+    }
   }
 
   .range-left {

package/lib/ProForm/components/render/ChangedWrapper.d.ts

@@ -10,6 +10,7 @@ interface Props {
     diffConfig?: DiffConfigProps;
     form: FormInstance;
     equalWith?: DiffOriginalParams['equalWith'];
+    valuePropName?: string;
     [name: string]: any;
 }
 declare const ChangedWrapper: React.FC<Props>;

package/lib/ProForm/components/render/ChangedWrapper.js

@@ -6,7 +6,8 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _objectSpread3 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _jsxRuntime = require("react/jsx-runtime");
 var _antd = require("antd");
@@ -18,7 +19,7 @@ var _ProConfigProvider = require("../../../ProConfigProvider");
 var _utils = require("../../../utils");
 var _excluded = ["name", "names", "namesStr", "form", "equalWith", "children", "type", "diffConfig", "valuePropName"];
 var ChangedWrapper = function ChangedWrapper(props) {
-  var _diffConfig$toolTip;
+  var _diffConfig$toolTip, _children$props, _children$props2, _children$props3;
   var name = props.name,
     names = props.names,
     namesStr = props.namesStr,
@@ -36,7 +37,6 @@ var ChangedWrapper = function ChangedWrapper(props) {
     changeTipColor = diffConfig.changeTipColor,
     addTipColor = diffConfig.addTipColor;
   var toolTip = (_diffConfig$toolTip = diffConfig.toolTip) !== null && _diffConfig$toolTip !== void 0 ? _diffConfig$toolTip : true;
-  // 不渲染tooltip
   var isWatch = toolTip && !['FormList', 'ProEditTable'].includes(type);
   var originalValue = (names === null || names === void 0 ? void 0 : names.length) ? names.map(function (name) {
     return (0, _lodash.get)(originalValues, name);
@@ -56,14 +56,16 @@ var ChangedWrapper = function ChangedWrapper(props) {
   var isChanged = diffType === 'changed';
   var tipContent = (0, _react.useMemo)(function () {
     if (!isWatch || noChange) return undefined;
-    return /*#__PURE__*/_react.default.isValidElement(children) ? /*#__PURE__*/_react.default.cloneElement(children, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, children.props), {}, {
-      isView: true,
-      value: originalValue,
-      checked: type === 'Switch' ? originalValue : undefined
-    })) : undefined;
+    return /*#__PURE__*/_react.default.isValidElement(children) ? /*#__PURE__*/_react.default.cloneElement(children, (0, _objectSpread3.default)((0, _objectSpread3.default)({}, children.props), {}, (0, _defineProperty2.default)({
+      isView: true
+    }, valuePropName, originalValue))) : undefined;
   }, [originalValue, children]);
   if (!isWatch || noChange) {
-    return /*#__PURE__*/_react.default.isValidElement(children) && /*#__PURE__*/_react.default.cloneElement(children, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, children.props), rest));
+    // 嵌套子组件
+    var isNestedField = ['ProEditTable'].includes(type);
+    return /*#__PURE__*/_react.default.isValidElement(children) && /*#__PURE__*/_react.default.cloneElement(children, (0, _objectSpread3.default)((0, _objectSpread3.default)({
+      originalValues: isNestedField ? originalValues : undefined
+    }, children.props), rest));
   }
   var tipOpenCalc = function tipOpenCalc() {
     if (!toolTip) return false;
@@ -78,19 +80,33 @@ var ChangedWrapper = function ChangedWrapper(props) {
     'pro-form-item-changed': isChanged,
     'pro-form-item-add': isAdd
   });
+  // @ts-ignore
+  var _showEllipse = ((_children$props = children.props) === null || _children$props === void 0 ? void 0 : _children$props.showEllipse) || ((_children$props2 = children.props) === null || _children$props2 === void 0 ? void 0 : _children$props2.tooltip);
   return (0, _jsxRuntime.jsx)(_antd.Tooltip, {
     open: tipOpenCalc(),
+    mouseEnterDelay: 1,
     getPopupContainer: function getPopupContainer(target) {
       return target.parentElement;
     },
     title: (0, _jsxRuntime.jsxs)(_antd.Space, {
-      children: ["\u521D\u59CB\u503C\uFF1A", tipContent]
+      direction: "vertical",
+      children: [(0, _jsxRuntime.jsxs)(_antd.Space, {
+        children: ["\u521D\u59CB\u503C\uFF1A", tipContent]
+      }), _showEllipse && (0, _jsxRuntime.jsxs)(_antd.Space, {
+        children: ["\u5F53\u524D\u503C\uFF1A", /*#__PURE__*/_react.default.isValidElement(children) ? /*#__PURE__*/_react.default.cloneElement(children, (0, _objectSpread3.default)((0, _objectSpread3.default)((0, _objectSpread3.default)({}, children.props), rest), {}, {
+          isView: true
+        })) : undefined]
+      })]
     }),
     placement: "topLeft",
     children: (0, _jsxRuntime.jsx)("div", {
       className: diffClassName,
       style: style,
-      children: /*#__PURE__*/_react.default.isValidElement(children) ? /*#__PURE__*/_react.default.cloneElement(children, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, children.props), rest)) : undefined
+      children: /*#__PURE__*/_react.default.isValidElement(children) ? /*#__PURE__*/_react.default.cloneElement(children, (0, _objectSpread3.default)((0, _objectSpread3.default)((0, _objectSpread3.default)({}, children.props), rest), {}, {
+        otherProps: (0, _objectSpread3.default)((0, _objectSpread3.default)({}, (_children$props3 = children.props) === null || _children$props3 === void 0 ? void 0 : _children$props3.otherProps), {}, {
+          isDiffChange: isChanged
+        })
+      })) : undefined
     })
   });
 };

package/lib/ProForm/propsType.d.ts

@@ -44,6 +44,7 @@ export interface ProFormOtherProps {
     listName?: any[] | string | number;
     globalControl?: boolean;
     formDisabled?: boolean;
+    isDiffChange?: boolean;
 }
 export interface DiffConfigProps<Values = any> {
     /** 比对原始数据源 */

package/lib/ProForm/style/index.less

@@ -218,7 +218,7 @@
 
     .site-input-left,
     .site-input-right {
-      width: calc(50% - 20px);
+      width: calc(50% - 16px);
     }
 
     .site-input-left {