@zat-design/sisyphus-react 3.6.10-beta.4 → 3.6.11

package/dist/index.esm.css

@@ -2880,47 +2880,6 @@ span.ant-input-group-compact.pro-range-limit .forever-checkbox {
   vertical-align: bottom;
   fill: var(--zaui-aide-text, #909090);
 }
-.pro-form .ant-form-item.pro-form-item-changed span.ant-input-affix-wrapper,
-.pro-form .ant-form-item.pro-form-item-changed .ant-select .ant-select-selector,
-.pro-form .ant-form-item.pro-form-item-changed .ant-picker,
-.pro-form .ant-form-item.pro-form-item-changed .ant-input-number {
-  background: var(--zaui-contract-bg, #fffaa1) !important;
-}
-.pro-form .ant-form-item.pro-form-item-changed span.ant-input-affix-wrapper input,
-.pro-form .ant-form-item.pro-form-item-changed .ant-select .ant-select-selector input,
-.pro-form .ant-form-item.pro-form-item-changed .ant-picker input,
-.pro-form .ant-form-item.pro-form-item-changed .ant-input-number input {
-  background: transparent;
-}
-.pro-form .ant-form-item.pro-form-item-changed span.ant-input-affix-wrapper .ant-select-selection-placeholder,
-.pro-form .ant-form-item.pro-form-item-changed .ant-select .ant-select-selector .ant-select-selection-placeholder,
-.pro-form .ant-form-item.pro-form-item-changed .ant-picker .ant-select-selection-placeholder,
-.pro-form .ant-form-item.pro-form-item-changed .ant-input-number .ant-select-selection-placeholder {
-  z-index: 9;
-}
-.pro-form .ant-form-item.pro-form-item-changed .ant-form-item-control:has(.ant-switch-handle),
-.pro-form .ant-form-item.pro-form-item-changed .ant-form-item-control:has(.ant-checkbox-wrapper-in-form-item) {
-  background: var(--zaui-contract-bg, #fffaa1);
-  border-radius: 4px;
-}
-.pro-form .ant-form-item.pro-form-item-changed .ant-form-item-control-input-content > span {
-  border-radius: 4px;
-  padding: 5px 8px;
-  background: var(--zaui-contract-bg, #fffaa1);
-}
-.pro-form .ant-form-item.pro-form-item-changed .ant-form-item-control-input-content > .pro-address .ant-select-selector,
-.pro-form .ant-form-item.pro-form-item-changed .ant-form-item-control-input-content > .pro-address .ant-input-affix-wrapper,
-.pro-form .ant-form-item.pro-form-item-changed .ant-form-item-control-input-content > .pro-address .ant-input-disabled {
-  background: var(--zaui-contract-bg, #fffaa1);
-}
-.pro-form .ant-form-item.pro-form-item-changed .ant-form-item-control-input-content > .ant-input-group .forever-checkbox {
-  background: var(--zaui-contract-bg, #fffaa1);
-}
-.pro-form .ant-form-item.pro-form-item-changed .pro-form-view-container {
-  padding: 4px 8px;
-  background: var(--zaui-contract-bg, #fffaa1);
-  border-radius: 4px;
-}
 .pro-form .ant-form-item .ant-row {
   width: 100%;
 }
@@ -3073,6 +3032,47 @@ span.ant-input-group-compact.pro-range-limit .forever-checkbox {
 .pro-form .pro-form-list-mode-block .pro-collapse-content .ant-row {
   width: auto;
 }
+.pro-form .pro-form-item-changed span.ant-input-affix-wrapper,
+.pro-form .pro-form-item-changed .ant-select .ant-select-selector,
+.pro-form .pro-form-item-changed .ant-picker,
+.pro-form .pro-form-item-changed .ant-input-number {
+  background: var(--zaui-contract-bg, #fffaa1) !important;
+}
+.pro-form .pro-form-item-changed span.ant-input-affix-wrapper input,
+.pro-form .pro-form-item-changed .ant-select .ant-select-selector input,
+.pro-form .pro-form-item-changed .ant-picker input,
+.pro-form .pro-form-item-changed .ant-input-number input {
+  background: transparent !important;
+}
+.pro-form .pro-form-item-changed span.ant-input-affix-wrapper .ant-select-selection-placeholder,
+.pro-form .pro-form-item-changed .ant-select .ant-select-selector .ant-select-selection-placeholder,
+.pro-form .pro-form-item-changed .ant-picker .ant-select-selection-placeholder,
+.pro-form .pro-form-item-changed .ant-input-number .ant-select-selection-placeholder {
+  z-index: 9;
+}
+.pro-form .pro-form-item-changed .ant-form-item-control:has(.ant-switch-handle),
+.pro-form .pro-form-item-changed .ant-form-item-control:has(.ant-checkbox-wrapper-in-form-item) {
+  background: var(--zaui-contract-bg, #fffaa1);
+  border-radius: 4px;
+}
+.pro-form .pro-form-item-changed .ant-form-item-control-input-content > span {
+  border-radius: 4px;
+  padding: 5px 8px;
+  background: var(--zaui-contract-bg, #fffaa1);
+}
+.pro-form .pro-form-item-changed .ant-form-item-control-input-content > .pro-address .ant-select-selector,
+.pro-form .pro-form-item-changed .ant-form-item-control-input-content > .pro-address .ant-input-affix-wrapper,
+.pro-form .pro-form-item-changed .ant-form-item-control-input-content > .pro-address .ant-input-disabled {
+  background: var(--zaui-contract-bg, #fffaa1);
+}
+.pro-form .pro-form-item-changed .ant-form-item-control-input-content > .ant-input-group .forever-checkbox {
+  background: var(--zaui-contract-bg, #fffaa1);
+}
+.pro-form .pro-form-item-changed .pro-form-view-container {
+  padding: 4px 8px;
+  background: var(--zaui-contract-bg, #fffaa1);
+  border-radius: 4px;
+}
 .pro-upload .pro-upload-dragger .pro-upload-handle-box {
   padding: var(--zaui-space-size-sm, 8px);
   background: #f8f9fa;

package/dist/less.esm.css

@@ -2880,47 +2880,6 @@ span.ant-input-group-compact.pro-range-limit .forever-checkbox {
   vertical-align: bottom;
   fill: var(--zaui-aide-text, #909090);
 }
-.pro-form .ant-form-item.pro-form-item-changed span.ant-input-affix-wrapper,
-.pro-form .ant-form-item.pro-form-item-changed .ant-select .ant-select-selector,
-.pro-form .ant-form-item.pro-form-item-changed .ant-picker,
-.pro-form .ant-form-item.pro-form-item-changed .ant-input-number {
-  background: var(--zaui-contract-bg, #fffaa1) !important;
-}
-.pro-form .ant-form-item.pro-form-item-changed span.ant-input-affix-wrapper input,
-.pro-form .ant-form-item.pro-form-item-changed .ant-select .ant-select-selector input,
-.pro-form .ant-form-item.pro-form-item-changed .ant-picker input,
-.pro-form .ant-form-item.pro-form-item-changed .ant-input-number input {
-  background: transparent;
-}
-.pro-form .ant-form-item.pro-form-item-changed span.ant-input-affix-wrapper .ant-select-selection-placeholder,
-.pro-form .ant-form-item.pro-form-item-changed .ant-select .ant-select-selector .ant-select-selection-placeholder,
-.pro-form .ant-form-item.pro-form-item-changed .ant-picker .ant-select-selection-placeholder,
-.pro-form .ant-form-item.pro-form-item-changed .ant-input-number .ant-select-selection-placeholder {
-  z-index: 9;
-}
-.pro-form .ant-form-item.pro-form-item-changed .ant-form-item-control:has(.ant-switch-handle),
-.pro-form .ant-form-item.pro-form-item-changed .ant-form-item-control:has(.ant-checkbox-wrapper-in-form-item) {
-  background: var(--zaui-contract-bg, #fffaa1);
-  border-radius: 4px;
-}
-.pro-form .ant-form-item.pro-form-item-changed .ant-form-item-control-input-content > span {
-  border-radius: 4px;
-  padding: 5px 8px;
-  background: var(--zaui-contract-bg, #fffaa1);
-}
-.pro-form .ant-form-item.pro-form-item-changed .ant-form-item-control-input-content > .pro-address .ant-select-selector,
-.pro-form .ant-form-item.pro-form-item-changed .ant-form-item-control-input-content > .pro-address .ant-input-affix-wrapper,
-.pro-form .ant-form-item.pro-form-item-changed .ant-form-item-control-input-content > .pro-address .ant-input-disabled {
-  background: var(--zaui-contract-bg, #fffaa1);
-}
-.pro-form .ant-form-item.pro-form-item-changed .ant-form-item-control-input-content > .ant-input-group .forever-checkbox {
-  background: var(--zaui-contract-bg, #fffaa1);
-}
-.pro-form .ant-form-item.pro-form-item-changed .pro-form-view-container {
-  padding: 4px 8px;
-  background: var(--zaui-contract-bg, #fffaa1);
-  border-radius: 4px;
-}
 .pro-form .ant-form-item .ant-row {
   width: 100%;
 }
@@ -3073,6 +3032,47 @@ span.ant-input-group-compact.pro-range-limit .forever-checkbox {
 .pro-form .pro-form-list-mode-block .pro-collapse-content .ant-row {
   width: auto;
 }
+.pro-form .pro-form-item-changed span.ant-input-affix-wrapper,
+.pro-form .pro-form-item-changed .ant-select .ant-select-selector,
+.pro-form .pro-form-item-changed .ant-picker,
+.pro-form .pro-form-item-changed .ant-input-number {
+  background: var(--zaui-contract-bg, #fffaa1) !important;
+}
+.pro-form .pro-form-item-changed span.ant-input-affix-wrapper input,
+.pro-form .pro-form-item-changed .ant-select .ant-select-selector input,
+.pro-form .pro-form-item-changed .ant-picker input,
+.pro-form .pro-form-item-changed .ant-input-number input {
+  background: transparent !important;
+}
+.pro-form .pro-form-item-changed span.ant-input-affix-wrapper .ant-select-selection-placeholder,
+.pro-form .pro-form-item-changed .ant-select .ant-select-selector .ant-select-selection-placeholder,
+.pro-form .pro-form-item-changed .ant-picker .ant-select-selection-placeholder,
+.pro-form .pro-form-item-changed .ant-input-number .ant-select-selection-placeholder {
+  z-index: 9;
+}
+.pro-form .pro-form-item-changed .ant-form-item-control:has(.ant-switch-handle),
+.pro-form .pro-form-item-changed .ant-form-item-control:has(.ant-checkbox-wrapper-in-form-item) {
+  background: var(--zaui-contract-bg, #fffaa1);
+  border-radius: 4px;
+}
+.pro-form .pro-form-item-changed .ant-form-item-control-input-content > span {
+  border-radius: 4px;
+  padding: 5px 8px;
+  background: var(--zaui-contract-bg, #fffaa1);
+}
+.pro-form .pro-form-item-changed .ant-form-item-control-input-content > .pro-address .ant-select-selector,
+.pro-form .pro-form-item-changed .ant-form-item-control-input-content > .pro-address .ant-input-affix-wrapper,
+.pro-form .pro-form-item-changed .ant-form-item-control-input-content > .pro-address .ant-input-disabled {
+  background: var(--zaui-contract-bg, #fffaa1);
+}
+.pro-form .pro-form-item-changed .ant-form-item-control-input-content > .ant-input-group .forever-checkbox {
+  background: var(--zaui-contract-bg, #fffaa1);
+}
+.pro-form .pro-form-item-changed .pro-form-view-container {
+  padding: 4px 8px;
+  background: var(--zaui-contract-bg, #fffaa1);
+  border-radius: 4px;
+}
 .pro-upload .pro-upload-dragger .pro-upload-handle-box {
   padding: var(--zaui-space-size-sm, 8px);
   background: #f8f9fa;

package/es/ProEditTable/components/RenderField/ListChanged.d.ts

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

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

@@ -0,0 +1,124 @@
+import "antd/es/space/style";
+import _Space from "antd/es/space";
+import "antd/es/tooltip/style";
+import _Tooltip from "antd/es/tooltip";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["name", "names", "namesStr", "originalName", "originalNames", "originalValues", "form", "equalWith", "rowKeyPath", "children", "type"];
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React, { useMemo } from 'react';
+import { get } from 'lodash';
+import { diffOriginal } from '../../../ProForm/utils/diffOriginal';
+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 = 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 get(originalValueRow, originalName.slice(rowKeyPath.length - 1));
+      });
+      // 有可能出现数组中全是undefined的情况  视为没有值
+      var fillUndefined = originalNamesValue.every(function (valItem) {
+        return valItem === undefined;
+      });
+      originalValue = fillUndefined ? undefined : originalNamesValue;
+    } else {
+      originalValue = 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 get(originalValues, originalName);
+  }) : 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 = _objectWithoutProperties(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 = useMemo(function () {
+    if (notWatch || noChange) return false;
+    return 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.isValidElement(children) && /*#__PURE__*/React.cloneElement(children, _objectSpread(_objectSpread({}, children.props), rest));
+  }
+  return _jsx(_Tooltip, {
+    open: changed ? undefined : false,
+    getPopupContainer: function getPopupContainer(target) {
+      return target.parentElement;
+    },
+    title: _jsxs(_Space, {
+      children: ["\u521D\u59CB\u503C\uFF1A", /*#__PURE__*/React.isValidElement(children) ? /*#__PURE__*/React.cloneElement(children, _objectSpread(_objectSpread({}, children), {}, {
+        // @ts-ignore
+        isView: true,
+        value: originalValue,
+        checked: type === 'Switch' ? originalValue : undefined
+      })) : undefined]
+    }),
+    children: _jsx("div", {
+      className: changed ? 'pro-form-item-changed' : '',
+      children: /*#__PURE__*/React.isValidElement(children) ? /*#__PURE__*/React.cloneElement(children, _objectSpread(_objectSpread({}, children.props), rest)) : undefined
+    })
+  });
+};
+export default ListChanged;

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

@@ -1,18 +1,13 @@
-import "antd/es/tooltip/style";
-import _Tooltip from "antd/es/tooltip";
-import "antd/es/space/style";
-import _Space from "antd/es/space";
 import "antd/es/form/style";
 import _Form from "antd/es/form";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _regeneratorRuntime from "@babel/runtime/helpers/esm/regeneratorRuntime";
 import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 var _excluded = ["type", "valueType", "names", "fieldProps", "labelRequired", "editRender", "component", "viewRender", "title", "originTitle", "label", "dataIndex", "formItemProps", "isEditable", "required", "rules", "equalWith", "className", "trim", "confirm"];
-import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
 /* eslint-disable prefer-destructuring */
 /* eslint-disable prefer-const */
 import React, { useCallback, useEffect } from 'react';
@@ -26,10 +21,10 @@ import { useProConfig } from '../../../ProConfigProvider';
 import Container from '../../../ProForm/components/Container';
 import transformNames from '../../../ProForm/utils/transformNames';
 import { FieldProvider } from '../../../ProForm/utils/useFieldProps';
-import { useListChanged } from '../../../ProForm/utils/useListChanged';
 import useRules from '../../../ProForm/utils/useRules';
 import { isSelect, isTrim } from '../../../ProForm/utils';
 import ConfirmWrapper from '../../../ProForm/components/render/ConfirmWrapper';
+import ListChanged from './ListChanged';
 var RenderField = function RenderField(_ref) {
   var _type, _type$replace, _fieldProps2, _names, _TargetComponent4, _componentProps, _componentProps2;
   var value = _ref.text,
@@ -489,21 +484,6 @@ var RenderField = function RenderField(_ref) {
       return _ref3.apply(this, arguments);
     };
   }();
-  // 判断当前字段是否变更
-  var _useListChanged = useListChanged({
-      name: cellName,
-      names: names,
-      namesStr: [].concat(_toConsumableArray(baseName), [index, dataIndex]),
-      rowKeyPath: [].concat(_toConsumableArray(baseName), [index, 'rowKey']),
-      originalName: originalName,
-      originalNames: originalNames,
-      originalValues: originalValues,
-      form: form,
-      equalWith: equalWith
-    }),
-    _useListChanged2 = _slicedToArray(_useListChanged, 2),
-    changed = _useListChanged2[0],
-    originalValue = _useListChanged2[1];
   var componentProps = _objectSpread(_objectSpread(_objectSpread({
     form: form,
     name: cellName
@@ -549,16 +529,36 @@ var RenderField = function RenderField(_ref) {
   if (isView) {
     delete _formItemProps.rules;
   }
-  var _className = classNames(_defineProperty(_defineProperty({}, className, className), 'pro-form-item-changed', changed));
+  var _className = classNames(_defineProperty({}, className, className));
   var FormItem = null;
+  var FieldComponent = /*#__PURE__*/React.isValidElement(TargetComponent) ? ( /*#__PURE__*/React.cloneElement(TargetComponent, componentProps)) : _jsx(TargetComponent, _objectSpread({}, componentProps));
+  if (originalValues) {
+    FieldComponent = _jsx(ListChanged, {
+      name: cellName,
+      names: names,
+      namesStr: [].concat(_toConsumableArray(baseName), [index, dataIndex]),
+      rowKeyPath: [].concat(_toConsumableArray(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 = _jsx(ConfirmWrapper, _objectSpread(_objectSpread({}, componentProps), {}, {
+      children: FieldComponent
+    }));
+  }
   FormItem = TargetComponent ? _jsx(_Form.Item, _objectSpread(_objectSpread({
     validateFirst: true
   }, 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) ? _jsx(ConfirmWrapper, _objectSpread(_objectSpread({}, componentProps), {}, {
-      children: /*#__PURE__*/React.isValidElement(TargetComponent) ? ( /*#__PURE__*/React.cloneElement(TargetComponent, componentProps)) : _jsx(TargetComponent, _objectSpread({}, componentProps))
-    })) : /*#__PURE__*/React.isValidElement(TargetComponent) ? ( /*#__PURE__*/React.cloneElement(TargetComponent, componentProps)) : _jsx(TargetComponent, _objectSpread({}, componentProps))
+    children: FieldComponent
   })) : _jsx(Container, {
     viewEmpty: viewEmpty
   });
@@ -576,28 +576,9 @@ var RenderField = function RenderField(_ref) {
       }
     }));
   }
-  var originalTitle = originalDiffTip && originalValues ? _jsxs(_Space, {
-    children: ["\u521D\u59CB\u503C\uFF1A", /*#__PURE__*/React.isValidElement(TargetComponent) ? ( /*#__PURE__*/React.cloneElement(TargetComponent, _objectSpread(_objectSpread({}, componentProps), {}, {
-      isView: true,
-      value: originalValue,
-      checked: type === 'Switch' ? originalValue : undefined
-    }))) : _jsx(TargetComponent, _objectSpread(_objectSpread({}, componentProps), {}, {
-      isView: true,
-      value: originalValue,
-      checked: type === 'Switch' ? originalValue : undefined
-    }))]
-  }) : null;
   return _jsx(FieldProvider, {
     value: (_componentProps2 = componentProps) === null || _componentProps2 === void 0 ? void 0 : _componentProps2.otherProps,
-    children: !originalTitle || ['FormList', 'ProEditTable'].includes(type) ? FormItem : _jsx(_Tooltip, {
-      title: originalTitle,
-      placement: "topLeft",
-      open: changed ? undefined : false,
-      getPopupContainer: function getPopupContainer(target) {
-        return target.parentElement;
-      },
-      children: FormItem
-    })
+    children: FormItem
   });
 };
 export default RenderField;

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

@@ -1,9 +1,9 @@
 import "antd/es/input/style";
 import _Input from "antd/es/input";
-import "antd/es/cascader/style";
-import _Cascader from "antd/es/cascader";
 import "antd/es/tooltip/style";
 import _Tooltip from "antd/es/tooltip";
+import "antd/es/cascader/style";
+import _Cascader from "antd/es/cascader";
 import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import _regeneratorRuntime from "@babel/runtime/helpers/esm/regeneratorRuntime";
 import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
@@ -22,6 +22,7 @@ import { useProConfig } from '../../../../ProConfigProvider';
 import useEnum from '../../../../ProEnum/hooks/useEnum';
 import locale from '../../../../locale';
 import ProForm from '../../..';
+import Container from '../../Container';
 var Text = _Typography.Text;
 var defaultFieldNames = {
   label: 'name',
@@ -82,7 +83,8 @@ var ProCascader = function ProCascader(props) {
     detailPlaceholder = props.detailPlaceholder,
     otherProps = _objectWithoutProperties(props, _excluded);
   var _ref3 = ProForm.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 ? _jsx(_Tooltip, {
-    className: className,
-    title: tooltip === true ? viewValue : tooltip,
-    children: _jsx(Text, {
-      ellipsis: {
-        tooltip: false
-      },
-      children: viewValue
-    })
-  }) : _jsx("span", {
-    className: className,
+  return realIsView ? _jsx(Container, {
+    tooltip: !!tooltip,
+    viewEmpty: viewEmpty,
     children: viewValue
   }) : _jsxs("div", {
     className: "pro-address ".concat(className),

package/es/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/es/ProForm/components/render/Changed.js

@@ -0,0 +1,64 @@
+import "antd/es/space/style";
+import _Space from "antd/es/space";
+import "antd/es/tooltip/style";
+import _Tooltip from "antd/es/tooltip";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["name", "names", "namesStr", "originalValues", "form", "equalWith", "children", "type", "originalDiffTip"];
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { get } from 'lodash';
+import React, { useMemo } from 'react';
+import { diffOriginal } from '../../utils/diffOriginal';
+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 = _objectWithoutProperties(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 get(originalValues, name);
+  }) : get(originalValues, name);
+  var noChange = !equalWith && (!originalValues || originalValue === undefined);
+  var changed = useMemo(function () {
+    if (notWatch || noChange) return false;
+    return diffOriginal({
+      originalValue: originalValue,
+      value: props.value,
+      form: form,
+      equalWith: equalWith
+      // name: namesStr || name,
+    });
+  }, [notWatch, noChange, props.value, originalValue]);
+  var tipContent = useMemo(function () {
+    if (notWatch || noChange) return undefined;
+    return /*#__PURE__*/React.isValidElement(children) ? /*#__PURE__*/React.cloneElement(children, _objectSpread(_objectSpread({}, children.props), {}, {
+      isView: true,
+      value: originalValue,
+      checked: type === 'Switch' ? originalValue : undefined
+    })) : undefined;
+  }, [originalValue, children]);
+  if (notWatch || noChange) {
+    return /*#__PURE__*/React.isValidElement(children) && /*#__PURE__*/React.cloneElement(children, _objectSpread(_objectSpread({}, children.props), rest));
+  }
+  return _jsx(_Tooltip, {
+    open: changed ? undefined : false,
+    getPopupContainer: function getPopupContainer(target) {
+      return target.parentElement;
+    },
+    title: _jsxs(_Space, {
+      children: ["\u521D\u59CB\u503C\uFF1A", tipContent]
+    }),
+    children: _jsx("div", {
+      className: changed ? 'pro-form-item-changed' : '',
+      children: /*#__PURE__*/React.isValidElement(children) ? /*#__PURE__*/React.cloneElement(children, _objectSpread(_objectSpread({}, children.props), rest)) : undefined
+    })
+  });
+};
+export default Changed;