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

package/dist/index.esm.css

@@ -1784,18 +1784,18 @@
   margin-right: 0;
 }
 .pro-table .ant-table-cell-with-append {
-  white-space: nowrap;
   position: relative;
   z-index: 100;
+  white-space: nowrap;
 }
 .pro-table .ant-table-row-expand-icon {
   position: absolute;
   left: -16px;
 }
 .pro-table .ant-table-content > table .ant-table-summary {
-  background-color: var(--zaui-table-header-bg, #f2f3f5);
   color: var(--zaui-text, #343434);
   font-weight: 600;
+  background-color: var(--zaui-table-header-bg, #f2f3f5);
 }
 .pro-table .ant-table-content > table .ant-table-summary .ant-table-cell-fix-left,
 .pro-table .ant-table-content > table .ant-table-summary .ant-table-cell-fix-right {
@@ -1807,26 +1807,26 @@
 .pro-table .ant-table-content > table td .pro-form-view-container_nowrap {
   white-space: normal;
 }
-.pro-table .ant-table-content > table .ant-table-thead > tr > th:not(.ant-table-selection-column):not(.ant-table-row-expand-icon-cell):not([colspan]).is-required.is-required-right .pro-edit-table-title::before {
+.pro-table .ant-table-content > table .ant-table-thead > tr > th:not(.ant-table-selection-column):not( .ant-table-row-expand-icon-cell):not([colspan]).is-required.is-required-right .pro-edit-table-title::before {
   position: static;
   top: 0;
   display: inline-block;
-  text-indent: -8px;
   color: #ff5050;
   font-size: var(--zaui-font-size-md, 14px);
   line-height: 1;
-  content: "*";
+  text-indent: -8px;
+  content: '*';
 }
-.pro-table .ant-table-content > table .ant-table-thead > tr > th:not(.ant-table-selection-column):not(.ant-table-row-expand-icon-cell):not([colspan]).is-required.is-required-left .pro-edit-table-title::after {
-  width: auto;
+.pro-table .ant-table-content > table .ant-table-thead > tr > th:not(.ant-table-selection-column):not( .ant-table-row-expand-icon-cell):not([colspan]).is-required.is-required-left .pro-edit-table-title::after {
   position: static;
   top: 0;
   display: inline-block;
+  width: auto;
   margin-left: var(--zaui-space-size-xs, 4px);
   color: #ff5050;
   font-size: 14px;
   line-height: 1;
-  content: "*";
+  content: '*';
 }
 .pro-table .drag-wrapper {
   display: -webkit-box;
@@ -1836,8 +1836,8 @@
   width: 20px;
 }
 .pro-table .drag-wrapper .anticon {
-  cursor: pointer;
   margin-right: 12px;
+  cursor: pointer;
 }
 .pro-table .drag-wrapper .anticon .drag-icon {
   margin-right: 0;
@@ -2147,9 +2147,6 @@
 .ant-dropdown-placement-bottomLeft .ant-dropdown-menu-vertical.ant-dropdown-menu-light .ant-dropdown-menu-item-only-child:hover {
   background: rgba(0, 106, 255, 0.08);
 }
-.pro-edit-table-drag table tr th.ant-table-selection-column.ant-table-cell-fix-left {
-  text-align: right;
-}
 .pro-tooltip {
   cursor: pointer;
 }
@@ -2883,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%;
 }
@@ -3076,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;
@@ -4526,7 +4523,8 @@ span.ant-input-group-compact.pro-range-limit .forever-checkbox {
   margin-left: var(--zaui-space-size-xs, 4px);
 }
 .pro-edit-table-drag table tr th.ant-table-selection-column.ant-table-cell-fix-left {
-  text-align: right;
+  text-align: left;
+  padding-left: 52px;
 }
 .pro-edit-label {
   display: inline-block;

package/dist/less.esm.css

@@ -1784,18 +1784,18 @@
   margin-right: 0;
 }
 .pro-table .ant-table-cell-with-append {
-  white-space: nowrap;
   position: relative;
   z-index: 100;
+  white-space: nowrap;
 }
 .pro-table .ant-table-row-expand-icon {
   position: absolute;
   left: -16px;
 }
 .pro-table .ant-table-content > table .ant-table-summary {
-  background-color: var(--zaui-table-header-bg, #f2f3f5);
   color: var(--zaui-text, #343434);
   font-weight: 600;
+  background-color: var(--zaui-table-header-bg, #f2f3f5);
 }
 .pro-table .ant-table-content > table .ant-table-summary .ant-table-cell-fix-left,
 .pro-table .ant-table-content > table .ant-table-summary .ant-table-cell-fix-right {
@@ -1807,26 +1807,26 @@
 .pro-table .ant-table-content > table td .pro-form-view-container_nowrap {
   white-space: normal;
 }
-.pro-table .ant-table-content > table .ant-table-thead > tr > th:not(.ant-table-selection-column):not(.ant-table-row-expand-icon-cell):not([colspan]).is-required.is-required-right .pro-edit-table-title::before {
+.pro-table .ant-table-content > table .ant-table-thead > tr > th:not(.ant-table-selection-column):not( .ant-table-row-expand-icon-cell):not([colspan]).is-required.is-required-right .pro-edit-table-title::before {
   position: static;
   top: 0;
   display: inline-block;
-  text-indent: -8px;
   color: #ff5050;
   font-size: var(--zaui-font-size-md, 14px);
   line-height: 1;
-  content: "*";
+  text-indent: -8px;
+  content: '*';
 }
-.pro-table .ant-table-content > table .ant-table-thead > tr > th:not(.ant-table-selection-column):not(.ant-table-row-expand-icon-cell):not([colspan]).is-required.is-required-left .pro-edit-table-title::after {
-  width: auto;
+.pro-table .ant-table-content > table .ant-table-thead > tr > th:not(.ant-table-selection-column):not( .ant-table-row-expand-icon-cell):not([colspan]).is-required.is-required-left .pro-edit-table-title::after {
   position: static;
   top: 0;
   display: inline-block;
+  width: auto;
   margin-left: var(--zaui-space-size-xs, 4px);
   color: #ff5050;
   font-size: 14px;
   line-height: 1;
-  content: "*";
+  content: '*';
 }
 .pro-table .drag-wrapper {
   display: -webkit-box;
@@ -1836,8 +1836,8 @@
   width: 20px;
 }
 .pro-table .drag-wrapper .anticon {
-  cursor: pointer;
   margin-right: 12px;
+  cursor: pointer;
 }
 .pro-table .drag-wrapper .anticon .drag-icon {
   margin-right: 0;
@@ -2147,9 +2147,6 @@
 .ant-dropdown-placement-bottomLeft .ant-dropdown-menu-vertical.ant-dropdown-menu-light .ant-dropdown-menu-item-only-child:hover {
   background: rgba(0, 106, 255, 0.08);
 }
-.pro-edit-table-drag table tr th.ant-table-selection-column.ant-table-cell-fix-left {
-  text-align: right;
-}
 .pro-tooltip {
   cursor: pointer;
 }
@@ -2883,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%;
 }
@@ -3076,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;
@@ -4526,7 +4523,8 @@ span.ant-input-group-compact.pro-range-limit .forever-checkbox {
   margin-left: var(--zaui-space-size-xs, 4px);
 }
 .pro-edit-table-drag table tr th.ant-table-selection-column.ant-table-cell-fix-left {
-  text-align: right;
+  text-align: left;
+  padding-left: 52px;
 }
 .pro-edit-label {
   display: inline-block;

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/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/es/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;