@zat-design/sisyphus-react 3.6.10 → 3.7.0-beta.1

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

@@ -0,0 +1,129 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _jsxRuntime = require("react/jsx-runtime");
+var _react = _interopRequireWildcard(require("react"));
+var _antd = require("antd");
+var _lodash = require("lodash");
+var _diffOriginal = require("../../../ProForm/utils/diffOriginal");
+var _excluded = ["name", "names", "namesStr", "originalName", "originalNames", "originalValues", "form", "equalWith", "rowKeyPath", "children", "type"];
+var toNamePath = function toNamePath(name) {
+  if (Array.isArray(name)) {
+    return name;
+  }
+  return [name];
+};
+var toNamePaths = function toNamePaths(names) {
+  return names.map(function (name) {
+    return toNamePath(name);
+  });
+};
+var getOriginalValue = function getOriginalValue(_ref) {
+  var namePath = _ref.namePath,
+    originalName = _ref.originalName,
+    originalNames = _ref.originalNames,
+    originalValues = _ref.originalValues,
+    rowKeyPath = _ref.rowKeyPath,
+    form = _ref.form;
+  if (!originalValues) {
+    return undefined;
+  }
+  if (rowKeyPath) {
+    var rowValueNamePath = namePath.slice(0, rowKeyPath.length - 1); // 表单中变动值所在行
+    var rowKeyName = rowKeyPath[rowKeyPath.length - 1]; // rowKey在行内的name
+    var rowValue = form.getFieldValue(rowValueNamePath);
+    if (!rowValue) return undefined;
+    var keyValue = rowValue[rowKeyName]; // 获取表单中rowKey值
+    if (!keyValue) return undefined;
+    var originalValueList = (0, _lodash.get)(originalValues, originalName.slice(0, rowKeyPath.length - 2));
+    var originalValueRow = originalValueList.find(function (item) {
+      return item[rowKeyPath[rowKeyPath.length - 1]] === keyValue;
+    });
+    var originalValue;
+    if (originalNames === null || originalNames === void 0 ? void 0 : originalNames.length) {
+      var originalNamesValue = originalNames.map(function (originalName) {
+        return (0, _lodash.get)(originalValueRow, originalName.slice(rowKeyPath.length - 1));
+      });
+      // 有可能出现数组中全是undefined的情况  视为没有值
+      var fillUndefined = originalNamesValue.every(function (valItem) {
+        return valItem === undefined;
+      });
+      originalValue = fillUndefined ? undefined : originalNamesValue;
+    } else {
+      originalValue = (0, _lodash.get)(originalValueRow, originalName.slice(rowKeyPath.length - 1));
+    }
+    return originalValue;
+  }
+  // 这个方法是给editTable专用的  暂时不存在不传rowKey的情况
+  return (originalNames === null || originalNames === void 0 ? void 0 : originalNames.length) ? originalNames.map(function (originalName) {
+    return (0, _lodash.get)(originalValues, originalName);
+  }) : (0, _lodash.get)(originalValues, originalName);
+};
+var ListChanged = function ListChanged(props) {
+  var name = props.name,
+    names = props.names,
+    namesStr = props.namesStr,
+    _props$originalName = props.originalName,
+    originalName = _props$originalName === void 0 ? name : _props$originalName,
+    _props$originalNames = props.originalNames,
+    originalNames = _props$originalNames === void 0 ? names : _props$originalNames,
+    originalValues = props.originalValues,
+    form = props.form,
+    equalWith = props.equalWith,
+    rowKeyPath = props.rowKeyPath,
+    children = props.children,
+    type = props.type,
+    rest = (0, _objectWithoutProperties2.default)(props, _excluded);
+  var namePath = toNamePath(namesStr || name);
+  var originalNamePath = toNamePath(originalName);
+  var originalNamePaths = originalNames && toNamePaths(originalNames);
+  var notWatch = !originalValues || ['FormList', 'ProEditTable'].includes(type);
+  var originalValue = !notWatch ? getOriginalValue({
+    namePath: namePath,
+    originalName: originalNamePath,
+    originalNames: originalNamePaths,
+    originalValues: originalValues,
+    rowKeyPath: rowKeyPath,
+    form: form
+  }) : undefined;
+  var noChange = !equalWith && (!originalValues || originalValue === undefined);
+  var changed = (0, _react.useMemo)(function () {
+    if (notWatch || noChange) return false;
+    return (0, _diffOriginal.diffOriginal)({
+      value: props.value,
+      originalValue: originalValue,
+      form: form,
+      equalWith: equalWith
+      // name: isString(namesStr) ? namesStr : originalName || name,
+    });
+  }, [props.value, originalValue]);
+  if (notWatch || noChange) {
+    return /*#__PURE__*/_react.default.isValidElement(children) && /*#__PURE__*/_react.default.cloneElement(children, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, children.props), rest));
+  }
+  return (0, _jsxRuntime.jsx)(_antd.Tooltip, {
+    open: changed ? undefined : false,
+    getPopupContainer: function getPopupContainer(target) {
+      return target.parentElement;
+    },
+    title: (0, _jsxRuntime.jsxs)(_antd.Space, {
+      children: ["\u521D\u59CB\u503C\uFF1A", /*#__PURE__*/_react.default.isValidElement(children) ? /*#__PURE__*/_react.default.cloneElement(children, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, children), {}, {
+        // @ts-ignore
+        isView: true,
+        value: originalValue,
+        checked: type === 'Switch' ? originalValue : undefined
+      })) : undefined]
+    }),
+    children: (0, _jsxRuntime.jsx)("div", {
+      className: changed ? 'pro-form-item-changed' : '',
+      children: /*#__PURE__*/_react.default.isValidElement(children) ? /*#__PURE__*/_react.default.cloneElement(children, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, children.props), rest)) : undefined
+    })
+  });
+};
+var _default = exports.default = ListChanged;

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

@@ -7,7 +7,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _regeneratorRuntime2 = _interopRequireDefault(require("@babel/runtime/helpers/regeneratorRuntime"));
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
@@ -26,10 +25,10 @@ var _ProConfigProvider = require("../../../ProConfigProvider");
 var _Container = _interopRequireDefault(require("../../../ProForm/components/Container"));
 var _transformNames = _interopRequireDefault(require("../../../ProForm/utils/transformNames"));
 var _useFieldProps = require("../../../ProForm/utils/useFieldProps");
-var _useListChanged3 = require("../../../ProForm/utils/useListChanged");
 var _useRules = _interopRequireDefault(require("../../../ProForm/utils/useRules"));
 var _utils = require("../../../ProForm/utils");
 var _ConfirmWrapper = _interopRequireDefault(require("../../../ProForm/components/render/ConfirmWrapper"));
+var _ListChanged = _interopRequireDefault(require("./ListChanged"));
 var _excluded = ["type", "valueType", "names", "fieldProps", "labelRequired", "editRender", "component", "viewRender", "title", "originTitle", "label", "dataIndex", "formItemProps", "isEditable", "required", "rules", "equalWith", "className", "trim", "confirm"];
 /* eslint-disable prefer-destructuring */
 /* eslint-disable prefer-const */
@@ -492,21 +491,6 @@ var RenderField = function RenderField(_ref) {
       return _ref3.apply(this, arguments);
     };
   }();
-  // 判断当前字段是否变更
-  var _useListChanged = (0, _useListChanged3.useListChanged)({
-      name: cellName,
-      names: names,
-      namesStr: [].concat((0, _toConsumableArray2.default)(baseName), [index, dataIndex]),
-      rowKeyPath: [].concat((0, _toConsumableArray2.default)(baseName), [index, 'rowKey']),
-      originalName: originalName,
-      originalNames: originalNames,
-      originalValues: originalValues,
-      form: form,
-      equalWith: equalWith
-    }),
-    _useListChanged2 = (0, _slicedToArray2.default)(_useListChanged, 2),
-    changed = _useListChanged2[0],
-    originalValue = _useListChanged2[1];
   var componentProps = (0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({
     form: form,
     name: cellName
@@ -552,16 +536,36 @@ var RenderField = function RenderField(_ref) {
   if (isView) {
     delete _formItemProps.rules;
   }
-  var _className = (0, _classnames.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, className, className), 'pro-form-item-changed', changed));
+  var _className = (0, _classnames.default)((0, _defineProperty2.default)({}, className, className));
   var FormItem = null;
+  var FieldComponent = /*#__PURE__*/_react.default.isValidElement(TargetComponent) ? ( /*#__PURE__*/_react.default.cloneElement(TargetComponent, componentProps)) : (0, _jsxRuntime.jsx)(TargetComponent, (0, _objectSpread2.default)({}, componentProps));
+  if (originalValues) {
+    FieldComponent = (0, _jsxRuntime.jsx)(_ListChanged.default, {
+      name: cellName,
+      names: names,
+      namesStr: [].concat((0, _toConsumableArray2.default)(baseName), [index, dataIndex]),
+      rowKeyPath: [].concat((0, _toConsumableArray2.default)(baseName), [index, 'rowKey']),
+      originalName: originalName,
+      originalNames: originalNames,
+      originalValues: originalValues,
+      form: form,
+      equalWith: equalWith,
+      type: type,
+      onChange: _onChange,
+      children: FieldComponent
+    });
+  }
+  if ((_componentProps = componentProps) === null || _componentProps === void 0 ? void 0 : _componentProps.confirm) {
+    FieldComponent = (0, _jsxRuntime.jsx)(_ConfirmWrapper.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, componentProps), {}, {
+      children: FieldComponent
+    }));
+  }
   FormItem = TargetComponent ? (0, _jsxRuntime.jsx)(_antd.Form.Item, (0, _objectSpread2.default)((0, _objectSpread2.default)({
     validateFirst: true
   }, (0, _lodash.omit)(_formItemProps, ['render', 'cache', 'key', 'width', 'hiddenNames', 'name', 'onCell'])), {}, {
     className: _className,
     name: formNamePath ? cellName.slice((formNamePath === null || formNamePath === void 0 ? void 0 : formNamePath.length) - 1) : cellName,
-    children: ((_componentProps = componentProps) === null || _componentProps === void 0 ? void 0 : _componentProps.confirm) ? (0, _jsxRuntime.jsx)(_ConfirmWrapper.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, componentProps), {}, {
-      children: /*#__PURE__*/_react.default.isValidElement(TargetComponent) ? ( /*#__PURE__*/_react.default.cloneElement(TargetComponent, componentProps)) : (0, _jsxRuntime.jsx)(TargetComponent, (0, _objectSpread2.default)({}, componentProps))
-    })) : /*#__PURE__*/_react.default.isValidElement(TargetComponent) ? ( /*#__PURE__*/_react.default.cloneElement(TargetComponent, componentProps)) : (0, _jsxRuntime.jsx)(TargetComponent, (0, _objectSpread2.default)({}, componentProps))
+    children: FieldComponent
   })) : (0, _jsxRuntime.jsx)(_Container.default, {
     viewEmpty: viewEmpty
   });
@@ -579,28 +583,9 @@ var RenderField = function RenderField(_ref) {
       }
     }));
   }
-  var originalTitle = originalDiffTip && originalValues ? (0, _jsxRuntime.jsxs)(_antd.Space, {
-    children: ["\u521D\u59CB\u503C\uFF1A", /*#__PURE__*/_react.default.isValidElement(TargetComponent) ? ( /*#__PURE__*/_react.default.cloneElement(TargetComponent, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, componentProps), {}, {
-      isView: true,
-      value: originalValue,
-      checked: type === 'Switch' ? originalValue : undefined
-    }))) : (0, _jsxRuntime.jsx)(TargetComponent, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, componentProps), {}, {
-      isView: true,
-      value: originalValue,
-      checked: type === 'Switch' ? originalValue : undefined
-    }))]
-  }) : null;
   return (0, _jsxRuntime.jsx)(_useFieldProps.FieldProvider, {
     value: (_componentProps2 = componentProps) === null || _componentProps2 === void 0 ? void 0 : _componentProps2.otherProps,
-    children: !originalTitle || ['FormList', 'ProEditTable'].includes(type) ? FormItem : (0, _jsxRuntime.jsx)(_antd.Tooltip, {
-      title: originalTitle,
-      placement: "topLeft",
-      open: changed ? undefined : false,
-      getPopupContainer: function getPopupContainer(target) {
-        return target.parentElement;
-      },
-      children: FormItem
-    })
+    children: FormItem
   });
 };
 var _default = exports.default = RenderField;

package/lib/ProEditTable/style/index.less

@@ -327,6 +327,7 @@
 
 .pro-edit-table-drag {
   table tr th.@{ant-prefix}-table-selection-column.@{ant-prefix}-table-cell-fix-left{
-    text-align: right;
+    text-align: left;
+    padding-left: 52px;
   }
 }

package/lib/ProEditTable/utils/index.d.ts

@@ -6,4 +6,4 @@
  * @param columns 表格配置数据
  * @param config
  */
-export declare const transformColumns: (columns: any[], config: any) => any[];
+export declare const transformColumns: (columns: any[], config: any) => any;

package/lib/ProEditTable/utils/index.js

@@ -29,16 +29,21 @@ var _excluded = ["type", "label", "show", "needConfirm", "onHandle", "onClick"],
   _excluded2 = ["title", "icon"];
 // 渲染操作栏
 var getActionColumn = function getActionColumn(config) {
-  var disabled = config.disabled,
-    name = config.name,
-    form = config.form,
-    virtualKey = config.virtualKey,
-    validateKeys = config.validateKeys,
-    actionWidth = config.actionWidth,
-    actionProps = config.actionProps,
-    page = config.page,
-    rowDisabled = config.rowDisabled,
-    actionDirection = config.actionDirection;
+  var _cloneDeepWith = (0, _lodash.cloneDeepWith)(config, function (value) {
+      if ( /*#__PURE__*/_react.default.isValidElement(value)) {
+        return value;
+      }
+    }),
+    disabled = _cloneDeepWith.disabled,
+    name = _cloneDeepWith.name,
+    form = _cloneDeepWith.form,
+    virtualKey = _cloneDeepWith.virtualKey,
+    validateKeys = _cloneDeepWith.validateKeys,
+    actionWidth = _cloneDeepWith.actionWidth,
+    actionProps = _cloneDeepWith.actionProps,
+    page = _cloneDeepWith.page,
+    rowDisabled = _cloneDeepWith.rowDisabled,
+    actionDirection = _cloneDeepWith.actionDirection;
   var pageNum = _utils.tools.calc(page.pageNum, '-', 1);
   var firstIndex = _utils.tools.calc(pageNum, '*', page.pageSize);
   // actionProps配置为false 默认不插入
@@ -199,7 +204,8 @@ var transformColumns = exports.transformColumns = function transformColumns() {
     setState = config.setState,
     page = config.page;
   var isCell = mode === 'cell';
-  var _columns = (0, _toConsumableArray2.default)(columns);
+  var _columns = (0, _tools.cloneDeepFilterNode)(columns);
+  // 你的函数代码
   var _cacheMap = (0, _objectSpread2.default)({}, cacheMap.current);
   var pageNum = _utils.tools.calc(page.pageNum, '-', 1);
   var firstIndex = _utils.tools.calc(pageNum, '*', page.pageSize);

package/lib/ProEditTable/utils/tools.d.ts

@@ -29,3 +29,9 @@ export declare const getDisabled: ({ globalControl, formDisabled, column, tabled
 /** 表格自动滚动到报错位置
  */
 export declare const handleScrollToError: () => void;
+/**
+ * 深copy一个对象，并过滤掉其中的React节点
+ * @param value 需要深拷贝的对象
+ * @returns 深拷贝后的对象，其中的React节点会被保留
+ */
+export declare function cloneDeepFilterNode(value: any): any;

package/lib/ProEditTable/utils/tools.js

@@ -4,8 +4,10 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.cloneDeepFilterNode = cloneDeepFilterNode;
 exports.splitNames = exports.onDelete = exports.handleScrollToError = exports.getRandom = exports.getNamePath = exports.getDisabled = exports.difference = exports.customValidate = void 0;
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _react = _interopRequireDefault(require("react"));
 var _lodash = require("lodash");
 var getRandom = exports.getRandom = function getRandom() {
   return Math.random().toString(36).slice(-6);
@@ -189,4 +191,16 @@ var handleScrollToError = exports.handleScrollToError = function handleScrollToE
       }
     }
   }, 0);
-};
+};
+/**
+ * 深copy一个对象，并过滤掉其中的React节点
+ * @param value 需要深拷贝的对象
+ * @returns 深拷贝后的对象，其中的React节点会被保留
+ */
+function cloneDeepFilterNode(value) {
+  return (0, _lodash.cloneDeepWith)(value, function (val) {
+    if ( /*#__PURE__*/_react.default.isValidElement(val)) {
+      return val;
+    }
+  });
+}

package/lib/ProEnum/hooks/useEnumRequest.js

@@ -98,6 +98,9 @@ var useEnumRequest = function useEnumRequest(props, dispatch) {
                 // 忽略清洗的 codes
                 ignoreCodes = (useRequest === null || useRequest === void 0 ? void 0 : (_useRequest$options = useRequest.options) === null || _useRequest$options === void 0 ? void 0 : _useRequest$options.ignoreCodes) || [];
                 Object.keys(response).forEach(function (key) {
+                  if (!response[key] || !Array.isArray(response[key])) {
+                    return;
+                  }
                   var options = (0, _toConsumableArray2.default)(response[key]) || [];
                   if (ignoreCodes.includes(key)) {
                     response[key] = options;

package/lib/ProEnum/utils/index.js

@@ -87,7 +87,7 @@ function cacheFieldNames(fieldNames, dataSource) {
   });
   // 递归去对数据进行清洗
   if (children && Array.isArray(dataSource[children])) {
-    result[children] = dataSource[children].map(function (item) {
+    result.children = dataSource[children].map(function (item) {
       return cacheFieldNames(fieldNames, item);
     });
   }

package/lib/ProForm/components/combination/FormList/components/BlockFields.js

@@ -1,5 +1,6 @@
 "use strict";
 
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
@@ -8,12 +9,14 @@ exports.default = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _jsxRuntime = require("react/jsx-runtime");
 var _antd = require("antd");
-var _react = require("react");
+var _react = _interopRequireWildcard(require("react"));
 var _lodash = require("lodash");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _ActionButton = _interopRequireDefault(require("./ActionButton"));
 var _RenderFields = _interopRequireDefault(require("../../../render/RenderFields"));
 var _ProCollapse = _interopRequireDefault(require("../../../../../ProLayout/components/ProCollapse"));
+var _utils = require("../utils");
+var MemoRenderFields = /*#__PURE__*/_react.default.memo(_RenderFields.default, _utils.memoWith);
 var BlockFields = function BlockFields(props) {
   var title = props.title,
     mode = props.mode,
@@ -70,7 +73,7 @@ var BlockFields = function BlockFields(props) {
       }),
       children: (0, _jsxRuntime.jsx)(_antd.Row, {
         gutter: 24,
-        children: (0, _jsxRuntime.jsx)(_RenderFields.default, {
+        children: (0, _jsxRuntime.jsx)(MemoRenderFields, {
           columns: columns,
           form: form,
           colProps: colProps,

package/lib/ProForm/components/combination/FormList/components/LineFields.js

@@ -9,12 +9,15 @@ var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/obje
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _jsxRuntime = require("react/jsx-runtime");
 var _antd = require("antd");
+var _react = _interopRequireDefault(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _sortable = require("@dnd-kit/sortable");
 var _utilities = require("@dnd-kit/utilities");
 var _ProIcon = _interopRequireDefault(require("../../../../../ProIcon"));
 var _ActionButton = _interopRequireDefault(require("./ActionButton"));
 var _RenderFields = _interopRequireDefault(require("../../../render/RenderFields"));
+var _utils = require("../utils");
+var MemoRenderFields = /*#__PURE__*/_react.default.memo(_RenderFields.default, _utils.memoWith);
 var LineFields = function LineFields(props) {
   var mode = props.mode,
     index = props.index,
@@ -68,7 +71,7 @@ var LineFields = function LineFields(props) {
       })
     })), (0, _jsxRuntime.jsx)(_antd.Row, {
       gutter: isLess ? 0 : 24,
-      children: (0, _jsxRuntime.jsx)(_RenderFields.default, {
+      children: (0, _jsxRuntime.jsx)(MemoRenderFields, {
         columns: columns,
         form: form,
         colProps: colProps,

package/lib/ProForm/components/combination/FormList/utils.d.ts

@@ -9,3 +9,4 @@ export declare const namesPathTransform: ({ names, prefixNamePath, type, }: {
     prefixNamePath: any[];
     type: string;
 }) => string;
+export declare const memoWith: (pre: any, next: any) => boolean;

package/lib/ProForm/components/combination/FormList/utils.js

@@ -1,9 +1,12 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.namesPathTransform = void 0;
+exports.namesPathTransform = exports.memoWith = void 0;
+var _lodash = require("lodash");
+var _react = _interopRequireDefault(require("react"));
 /**
  * namesPath生产 [['list', 0, 'min'], ['list', 0, 'max']] => list_0_min-list_0_max
  * @param names  name的集合
@@ -23,4 +26,15 @@ var namesPathTransform = exports.namesPathTransform = function namesPathTransfor
   return newNamePath === null || newNamePath === void 0 ? void 0 : newNamePath.map(function (name) {
     return Array.isArray(name) ? name.join('_') : name;
   }).join('-');
+};
+// 比较memo
+var memoWith = exports.memoWith = function memoWith(pre, next) {
+  return (0, _lodash.isEqualWith)(pre, next, function (objValue, othValue) {
+    if ( /*#__PURE__*/_react.default.isValidElement(objValue) && /*#__PURE__*/_react.default.isValidElement(othValue)) {
+      return true;
+    }
+    if ((0, _lodash.isFunction)(objValue) && (0, _lodash.isFunction)(othValue)) {
+      return true;
+    }
+  });
 };

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

@@ -21,6 +21,7 @@ var _ProConfigProvider = require("../../../../ProConfigProvider");
 var _useEnum = _interopRequireDefault(require("../../../../ProEnum/hooks/useEnum"));
 var _locale = _interopRequireDefault(require("../../../../locale"));
 var _ = _interopRequireDefault(require("../../.."));
+var _Container = _interopRequireDefault(require("../../Container"));
 var _excluded = ["className", "hasDetail", "detailMaxLength", "fieldNames", "value", "disabled", "dataSource", "onChange", "useRequest", "transformResponse", "level", "isView", "enumCode", "code", "tooltip", "separator", "detailPlaceholder"];
 var Text = _antd.Typography.Text;
 var defaultFieldNames = {
@@ -82,7 +83,8 @@ var ProCascader = function ProCascader(props) {
     detailPlaceholder = props.detailPlaceholder,
     otherProps = (0, _objectWithoutProperties2.default)(props, _excluded);
   var _ref3 = _.default.useFieldProps() || {},
-    isViewCon = _ref3.isView;
+    isViewCon = _ref3.isView,
+    viewEmpty = _ref3.viewEmpty;
   var addressCode = code || enumCode;
   var realIsView = typeof isView === 'boolean' ? isView : isViewCon;
   var realLevel = Math.max(2, level);
@@ -238,17 +240,9 @@ var ProCascader = function ProCascader(props) {
       }
     }
   };
-  return realIsView ? tooltip ? (0, _jsxRuntime.jsx)(_antd.Tooltip, {
-    className: className,
-    title: tooltip === true ? viewValue : tooltip,
-    children: (0, _jsxRuntime.jsx)(Text, {
-      ellipsis: {
-        tooltip: false
-      },
-      children: viewValue
-    })
-  }) : (0, _jsxRuntime.jsx)("span", {
-    className: className,
+  return realIsView ? (0, _jsxRuntime.jsx)(_Container.default, {
+    tooltip: !!tooltip,
+    viewEmpty: viewEmpty,
     children: viewValue
   }) : (0, _jsxRuntime.jsxs)("div", {
     className: "pro-address ".concat(className),

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

@@ -0,0 +1,14 @@
+import { FormInstance } from 'antd';
+import { NamePath } from 'antd/lib/form/interface';
+import React from 'react';
+interface Props {
+    name?: NamePath;
+    names?: NamePath[];
+    namesStr?: string;
+    originalValues?: any;
+    form: FormInstance;
+    equalWith?: (preValue: any, curValue: any) => boolean | undefined;
+    [name: string]: any;
+}
+declare const Changed: React.FC<Props>;
+export default Changed;

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

@@ -0,0 +1,69 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _jsxRuntime = require("react/jsx-runtime");
+var _antd = require("antd");
+var _lodash = require("lodash");
+var _react = _interopRequireWildcard(require("react"));
+var _diffOriginal = require("../../utils/diffOriginal");
+var _excluded = ["name", "names", "namesStr", "originalValues", "form", "equalWith", "children", "type", "originalDiffTip"];
+var Changed = function Changed(props) {
+  var name = props.name,
+    names = props.names,
+    namesStr = props.namesStr,
+    originalValues = props.originalValues,
+    form = props.form,
+    equalWith = props.equalWith,
+    children = props.children,
+    type = props.type,
+    originalDiffTip = props.originalDiffTip,
+    rest = (0, _objectWithoutProperties2.default)(props, _excluded);
+  // 不渲染tooltip
+  var notWatch = !originalDiffTip || ['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);
+  }) : (0, _lodash.get)(originalValues, name);
+  var noChange = !equalWith && (!originalValues || originalValue === undefined);
+  var changed = (0, _react.useMemo)(function () {
+    if (notWatch || noChange) return false;
+    return (0, _diffOriginal.diffOriginal)({
+      originalValue: originalValue,
+      value: props.value,
+      form: form,
+      equalWith: equalWith
+      // name: namesStr || name,
+    });
+  }, [notWatch, noChange, props.value, originalValue]);
+  var tipContent = (0, _react.useMemo)(function () {
+    if (notWatch || 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;
+  }, [originalValue, children]);
+  if (notWatch || noChange) {
+    return /*#__PURE__*/_react.default.isValidElement(children) && /*#__PURE__*/_react.default.cloneElement(children, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, children.props), rest));
+  }
+  return (0, _jsxRuntime.jsx)(_antd.Tooltip, {
+    open: changed ? undefined : false,
+    getPopupContainer: function getPopupContainer(target) {
+      return target.parentElement;
+    },
+    title: (0, _jsxRuntime.jsxs)(_antd.Space, {
+      children: ["\u521D\u59CB\u503C\uFF1A", tipContent]
+    }),
+    children: (0, _jsxRuntime.jsx)("div", {
+      className: changed ? 'pro-form-item-changed' : '',
+      children: /*#__PURE__*/_react.default.isValidElement(children) ? /*#__PURE__*/_react.default.cloneElement(children, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, children.props), rest)) : undefined
+    })
+  });
+};
+var _default = exports.default = Changed;