@zat-design/sisyphus-react 3.2.1 → 3.2.2-beta.1

package/dist/index.esm.css

@@ -789,14 +789,14 @@
 }
 .pro-footer {
   position: fixed;
-  bottom: 0;
   right: 0;
+  bottom: 0;
+  z-index: 101;
   width: 100%;
-  padding: var(--zaui-space-size-md, 16px) var(--zaui-space-size-lg, 32px);
+  padding: calc(var(--zaui-space-size-md, 16px) * var(--zaui-size, 1)) var(--zaui-space-size-lg, 32px);
   background: var(--zaui-base-bg, #ffffff);
   -webkit-box-shadow: 3px 2px 12px 0 hsla(0, 0%, 59.2%, 0.32);
           box-shadow: 3px 2px 12px 0 hsla(0, 0%, 59.2%, 0.32);
-  z-index: 101;
 }
 .back-button-container.ant-btn {
   color: var(--zaui-text);
@@ -819,6 +819,9 @@
   background-color: var(--zaui-base-bg, #ffffff);
   padding: 24px 0 0 0;
 }
+.pro-header.pro-header-no-back.pro-header-has-describe .pro-header-top {
+  padding-left: var(--zaui-space-size-md, 16px);
+}
 .pro-header.pro-header-no-back .pro-header-top {
   padding-left: 0;
 }
@@ -905,6 +908,10 @@
 }
 .pro-header .ant-breadcrumb .ant-breadcrumb-link {
   font-size: var(--zaui-font-size-xl, 18px);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
 }
 .pro-header .ant-breadcrumb .ant-breadcrumb-separator {
   font-weight: 500;
@@ -1509,7 +1516,7 @@
   width: 48px;
 }
 .pro-tabs .ant-tabs .ant-tabs-nav-list .ant-tabs-tab {
-  padding: 0;
+  padding: 0 !important;
 }
 .pro-tabs .ant-tabs-top > .ant-tabs-nav::before,
 .pro-tabs .ant-tabs-bottom > .ant-tabs-nav::before,
@@ -1529,7 +1536,7 @@
 }
 .pro-tabs .pro-tabs-card {
   width: 200px;
-  padding: 14px 16px 14px 24px;
+  padding: calc(9px * var(--zaui-size, 1)) 16px calc(9px * var(--zaui-size, 1)) 24px;
   border: 1px solid var(--zaui-line, #dddddd);
   border-left: none;
 }
@@ -1538,14 +1545,14 @@
   text-shadow: none;
 }
 .pro-tabs .pro-tabs-card .pro-tabs-card-left .pro-tabs-card-left-total {
-  font-size: var(--zaui-font-size-lg-title, 24px);
-  font-weight: 600;
   color: var(--zaui-text, #343434);
+  font-weight: 600;
+  font-size: var(--zaui-font-size-lg-title, 24px);
 }
 .pro-tabs .pro-tabs-card .pro-tabs-card-left .pro-tabs-card-left-label {
-  font-size: var(--zaui-font-size, 14px);
-  font-weight: 400;
   color: var(--aui-text, #343434);
+  font-weight: 400;
+  font-size: var(--zaui-font-size, 14px);
 }
 .pro-tabs .pro-tabs-card .pro-tabs-card-right {
   display: -webkit-box;
@@ -1557,9 +1564,9 @@
   width: 48px;
 }
 .pro-tabs-tab .pro-tabs-card .ant-tag {
-  border-radius: 10px;
-  padding: 0 var(--zaui-space-size-xs, 4px);
   margin-right: 0;
+  padding: 0 var(--zaui-space-size-xs, 4px);
+  border-radius: 10px;
 }
 .pro-tabs-tab .pro-tabs-card .ant-space-item {
   display: -webkit-box;
@@ -1618,6 +1625,10 @@
 .pro-table .custom-column-btn .anticon {
   height: 16px;
 }
+.pro-table .ant-table-tbody .ant-table-cell-fix-left,
+.pro-table .ant-table-tbody .ant-table-cell-fix-right {
+  background: unset !important;
+}
 .pro-table .ant-table-body .ant-table-cell .varied-cell {
   margin-left: -8px;
   background: var(--zaui-contract-bg, #fffaa1);
@@ -1926,10 +1937,6 @@ div.pro-textarea-view::after {
   display: flex;
   padding-bottom: 0;
 }
-.pro-form-list.pro-form-list-last .pro-form-list-drag-handle,
-.pro-form-list.pro-form-list-last .ant-form-item {
-  margin-bottom: 0 !important;
-}
 .pro-form-list .single-delete {
   width: 14px !important;
   height: 14px !important;
@@ -1967,6 +1974,7 @@ div.pro-textarea-view::after {
 }
 .pro-form-list-line {
   padding: var(--zaui-height-size-md, 16px);
+  padding-bottom: 0;
 }
 .pro-form-list-line:hover {
   background: rgba(0, 0, 0, 0.018);
@@ -2125,7 +2133,7 @@ span.ant-input-group-compact.pro-range-limit .forever-checkbox {
 .pro-modal-select .ant-input-group-wrapper:hover .close-icon > span,
 .pro-tree-modal .ant-input-group-wrapper:hover .close-icon > span {
   position: relative;
-  font-size: var(--zaui-font-size, 14px);
+  font-size: 10px;
   border: none;
   border-radius: 50%;
 }
@@ -2419,8 +2427,8 @@ span.ant-input-group-compact.pro-range-limit .forever-checkbox {
   -webkit-align-items: center;
       -ms-flex-align: center;
           align-items: center;
-  margin-bottom: 0;
   height: auto;
+  margin-bottom: 0;
   padding-top: 6px;
 }
 .pro-form.ant-form-vertical .pro-form-custom-footer .ant-space-align-center {
@@ -2505,13 +2513,23 @@ span.ant-input-group-compact.pro-range-limit .forever-checkbox {
 .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-selector,
 .pro-form .ant-form-item.pro-form-item-changed .ant-picker {
-  background: var(--zaui-contract-bg, #fffaa1);
+  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-selector input,
 .pro-form .ant-form-item.pro-form-item-changed .ant-picker input {
   background: var(--zaui-contract-bg, #fffaa1);
 }
+.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-selector .ant-select-selection-placeholder,
+.pro-form .ant-form-item.pro-form-item-changed .ant-picker .ant-select-selection-placeholder {
+  z-index: 9;
+}
+.pro-form .ant-form-item.pro-form-item-changed .ant-form-item-control-input-content > span {
+  background: var(--zaui-contract-bg, #fffaa1);
+  padding: 4px 8px;
+  border-radius: 4px;
+}
 .pro-form .ant-form-item .ant-row {
   width: 100%;
 }
@@ -3778,7 +3796,7 @@ span.ant-input-group-compact.pro-range-limit .forever-checkbox {
   fill: var(--zaui-aide-text, #909090);
 }
 .pro-drawer .pro-drawer-close .close-icon:hover {
-  fill: var(--zaui-brand-active, #005AD9);
+  fill: var(--zaui-brand-active, #005ad9);
 }
 .pro-drawer .pro-drawer-close .close-icon > div {
   height: 20px;
@@ -3829,7 +3847,7 @@ span.ant-input-group-compact.pro-range-limit .forever-checkbox {
   left: 0;
   z-index: 101;
   width: 100%;
-  padding: var(--zaui-space-size-md, 16px) var(--zaui-space-size-lg, 32px);
+  padding: calc(var(--zaui-space-size-md, 16px) * var(--zaui-size, 1)) var(--zaui-space-size-lg, 32px);
   background-color: var(--zaui-global-bg, #fff);
   -webkit-box-shadow: 8px 2px 8px 0 var(--zaui-shadow, rgba(56, 56, 56, 0.15));
           box-shadow: 8px 2px 8px 0 var(--zaui-shadow, rgba(56, 56, 56, 0.15));
@@ -3891,10 +3909,10 @@ span.ant-input-group-compact.pro-range-limit .forever-checkbox {
   z-index: 1;
 }
 .pro-modal-scrolling .ant-modal-header {
-  -webkit-box-shadow: -12px 14px 14px -18px var(--zaui-shadow, rgba(56, 56, 56, 0.15));
-          box-shadow: -12px 14px 14px -18px var(--zaui-shadow, rgba(56, 56, 56, 0.15));
   position: relative;
   z-index: 1;
+  -webkit-box-shadow: -12px 14px 14px -18px var(--zaui-shadow, rgba(56, 56, 56, 0.15));
+          box-shadow: -12px 14px 14px -18px var(--zaui-shadow, rgba(56, 56, 56, 0.15));
 }
 .pro-modal-footer-shadow .ant-modal-footer {
   position: relative;
@@ -4894,11 +4912,11 @@ input[type='button'] {
   -webkit-flex: 0 0 var(--zaui-form-label-width, 130px);
       -ms-flex: 0 0 var(--zaui-form-label-width, 130px);
           flex: 0 0 var(--zaui-form-label-width, 130px);
+  padding-right: calc(var(--zaui-space-size-sm, 8px) * var(--zaui-size, 1));
   overflow: initial;
   line-height: 1;
-  text-align: var(--zaui-form-align, left);
   white-space: pre-wrap;
-  padding-right: calc(var(--zaui-space-size-sm, 8px) * var(--zaui-size, 1));
+  text-align: var(--zaui-form-align, left);
 }
 .ant-form .ant-form-item .ant-form-item-label .ant-form-item-required::after,
 .ant-drawer .ant-form-item .ant-form-item-label .ant-form-item-required::after,
@@ -4913,8 +4931,8 @@ input[type='button'] {
 .ant-form .ant-form-item .ant-form-item-label > label::after,
 .ant-drawer .ant-form-item .ant-form-item-label > label::after,
 .ant-modal .ant-form-item .ant-form-item-label > label::after {
-  margin: 0;
   display: none;
+  margin: 0;
 }
 .ant-form .ant-form-item .ant-form-item-label .ant-form-item-required::before,
 .ant-drawer .ant-form-item .ant-form-item-label .ant-form-item-required::before,
@@ -5047,6 +5065,12 @@ input[type='button'] {
 .ant-table.ant-table-scroll-horizontal table .ant-table-tbody .ant-table-row:nth-child(even) td {
   background: var(--zaui-table-strip-bg, #fafafa);
 }
+.ant-table table .ant-table-thead > tr > th,
+.ant-table table .ant-table-tbody > tr > td,
+.ant-table table .ant-table tfoot > tr > th,
+.ant-table table .ant-table tfoot > tr > td {
+  padding: calc(5px + var(--zaui-size) * 8px) 16px;
+}
 .ant-table.ant-table-scroll-horizontal table .ant-table-thead > tr > th,
 .ant-table.ant-table-scroll-horizontal table .ant-table-tbody > tr > td,
 .ant-table.ant-table-scroll-horizontal table .ant-table tfoot > tr > th,
@@ -5078,31 +5102,31 @@ input[type='button'] {
 .ant-table.ant-table-scroll-horizontal table .ant-table-tbody .ant-table-row:nth-child(even) td,
 .ant-table.ant-table-scroll-horizontal table .ant-table-tbody .ant-table-row:nth-child(even) td.ant-table-cell-fix-right,
 .ant-table.ant-table-scroll-horizontal table .ant-table-tbody .ant-table-row:nth-child(even) td.ant-table-cell-fix-left {
-  background-color: #fff;
+  background-color: #fff !important;
 }
 .ant-table.ant-table-scroll-horizontal table .ant-table-tbody .ant-table-row:nth-child(even) td {
   background-color: #fff;
 }
 .ant-table.ant-table-scroll-horizontal table .ant-table-tbody .ant-table-row:nth-child(odd) {
-  background-color: var(--zaui-table-strip-bg, #fafafa);
+  background-color: var(--zaui-table-strip-bg, #fafafa) !important;
 }
 .ant-table.ant-table-scroll-horizontal table .ant-table-tbody .ant-table-row:nth-child(odd) td {
-  background-color: var(--zaui-table-strip-bg, #fafafa);
+  background-color: var(--zaui-table-strip-bg, #fafafa) !important;
 }
 .ant-table .ant-table-cell .ant-btn-link {
-  padding: 0;
   height: auto;
+  padding: 0;
   -webkit-user-select: text;
      -moz-user-select: text;
       -ms-user-select: text;
           user-select: text;
 }
 .ant-table .ant-table-cell a {
+  color: var(--zaui-brand, #006aff);
   -webkit-user-select: text;
      -moz-user-select: text;
       -ms-user-select: text;
           user-select: text;
-  color: var(--zaui-brand, #006aFF);
 }
 .ant-table.ant-table-fixed-header .ant-table-tbody .ant-table-row:nth-child(even) td {
   background: #ffffff !important;
@@ -5118,13 +5142,13 @@ input[type='button'] {
   color: var(--zaui-text, #464646);
 }
 .ant-tabs .ant-tabs-nav-list.ant-tabs-card .ant-tabs-tab {
-  padding: 8px var(--zaui-space-size-md, 16px);
   margin-right: 10px;
+  padding: 8px var(--zaui-space-size-md, 16px);
 }
 .ant-tabs .ant-tabs-nav-list .ant-tabs-tab {
   font-size: calc(var(--zaui-font-size, 14px) + var(--zaui-base-font-size, 0px));
-  padding: 12px var(--zaui-space-size-md, 16px);
   margin-left: 0;
+  padding: 12px var(--zaui-space-size-md, 16px);
 }
 .ant-tabs .ant-tabs-nav {
   margin-bottom: calc(var(--zaui-space-size-md, 16px) * var(--zaui-size, 1));
@@ -5132,6 +5156,10 @@ input[type='button'] {
 .ant-tabs .ant-tabs-nav .ant-tabs-tab-btn {
   font-size: var(--zaui-font-size-lg, 16px);
 }
+.ant-tabs.ant-tabs-card .ant-tabs-tab {
+  margin-right: 10px !important;
+  padding: 8px calc(var(--zaui-space-size-md, 16px) * var(--zaui-size, 1)) !important;
+}
 .ant-tabs.ant-tabs-card .ant-tabs-nav .ant-tabs-tab-btn {
   font-size: var(--zaui-font-size, 14px);
 }
@@ -5160,7 +5188,7 @@ input[type='button'] {
 .ant-btn.ant-btn-link[disabled]:hover,
 .ant-btn.ant-btn-link[disabled]:focus,
 .ant-btn.ant-btn-link[disabled]:active {
-  color: #BCBCBC;
+  color: #bcbcbc;
   text-shadow: none;
   background: none;
   border-color: none;
@@ -5363,10 +5391,10 @@ input[type='button'] {
   position: absolute;
   right: 16px;
   bottom: 1px;
-  margin-bottom: 0;
-  background: #fff;
   width: calc(100% - 18px);
+  margin-bottom: 0;
   text-align: right;
+  background: #fff;
 }
 .ant-space.ant-space-vertical {
   display: -webkit-box;

package/es/ProDrawerForm/style/index.less

@@ -1,82 +1,83 @@
 .pro-drawer {
   .pro-drawer-close {
-    position       : absolute;
-    top            : 6px;
-    left           : -34px;
-    display        : flex;
-    align-items    : center;
+    position: absolute;
+    top: 6px;
+    left: -34px;
+    display: flex;
+    align-items: center;
     justify-content: center;
-    width          : 32px;
-    height         : 38px;
-    color          : var(--zaui-global-bg, #fff);
-    cursor         : pointer;
+    width: 32px;
+    height: 38px;
+    color: var(--zaui-global-bg, #fff);
+    cursor: pointer;
 
     .close-icon {
-      position : relative;
-      left     : 2px;
-      z-index  : 1;
+      position: relative;
+      left: 2px;
+      z-index: 1;
       font-size: var(--zaui-font-size-lg, 16px);
       transform: translateZ(100px);
-      fill     : var(--zaui-aide-text, #909090);
+      fill: var(--zaui-aide-text, #909090);
 
       &:hover {
-        fill: var(--zaui-brand-active, #005AD9);
+        fill: var(--zaui-brand-active, #005ad9);
       }
 
-      >div {
+      > div {
         height: 20px;
       }
     }
   }
 
   .pro-drawer-close::after {
-    position        : absolute;
-    top             : 0;
-    right           : 0;
-    bottom          : 0;
-    left            : 0;
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
     background-color: var(--zaui-global-bg, #fff);
-    border-radius   : 4px 0px 0px 4px;
-    transform       : perspective(0.15em) rotateY(-2deg);
-    content         : '';
+    border-radius: 4px 0px 0px 4px;
+    transform: perspective(0.15em) rotateY(-2deg);
+    content: '';
   }
 
   .pro-drawer-title {
-    position        : absolute;
-    top             : 0;
-    left            : 0;
-    width           : 100%;
-    height          : 64px;
-    padding         : var(--zaui-space-size-md, 16px) var(--zaui-space-size-lg, 32px);
-    color           : var(--zaui-text, #343434);
-    font-weight     : 600;
-    font-size       : var(--zaui-font-size-xxl, 20px);
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 64px;
+    padding: var(--zaui-space-size-md, 16px) var(--zaui-space-size-lg, 32px);
+    color: var(--zaui-text, #343434);
+    font-weight: 600;
+    font-size: var(--zaui-font-size-xxl, 20px);
     background-color: var(--zaui-global-bg, #fff);
   }
 
   .pro-drawer-scrolling {
-    z-index   : 1;
+    z-index: 1;
     box-shadow: -12px 14px 14px -18px var(--zaui-shadow, rgba(56, 56, 56, 0.15));
   }
 
   .pro-drawer-content {
-    flex       : 1;
-    width      : 100%;
-    padding    : var(--zaui-space-size-md, 16px) var(--zaui-space-size-lg, 32px);
+    flex: 1;
+    width: 100%;
+    padding: var(--zaui-space-size-md, 16px) var(--zaui-space-size-lg, 32px);
     padding-top: 0;
-    overflow-x : hidden;
-    overflow-y : auto;
+    overflow-x: hidden;
+    overflow-y: auto;
   }
 
   .pro-drawer-footer {
-    position        : absolute;
-    bottom          : 0;
-    left            : 0;
-    z-index         : 101;
-    width           : 100%;
-    padding         : var(--zaui-space-size-md, 16px) var(--zaui-space-size-lg, 32px);
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    z-index: 101;
+    width: 100%;
+    padding: calc(var(--zaui-space-size-md; 16px) * var(--zaui-size; 1))
+      var(--zaui-space-size-lg, 32px);
     background-color: var(--zaui-global-bg, #fff);
-    box-shadow      : 8px 2px 8px 0 var(--zaui-shadow, rgba(56, 56, 56, 0.15));
+    box-shadow: 8px 2px 8px 0 var(--zaui-shadow, rgba(56, 56, 56, 0.15));
 
     button {
       margin-right: var(--zaui-space-size-sm, 8px);
@@ -88,8 +89,8 @@
   }
 
   .ant-drawer-body {
-    height    : 100vh;
-    padding   : 0;
+    height: 100vh;
+    padding: 0;
     overflow-y: hidden;
   }
 
@@ -116,7 +117,7 @@
   }
 
   .ant-modal-header {
-    padding      : var(--zaui-space-size-md, 16px);
+    padding: var(--zaui-space-size-md, 16px);
     border-bottom: none;
 
     .ant-modal-title {
@@ -125,30 +126,29 @@
   }
 
   .ant-modal-footer {
-    padding   : var(--zaui-space-size-md, 16px);
+    padding: var(--zaui-space-size-md, 16px);
     border-top: none;
 
     .pro-modal-footer {
-      display        : flex;
+      display: flex;
       justify-content: space-between;
     }
   }
 
   .ant-modal-content {
     .ant-modal-body {
-      max-height : 450px;
-      padding    : 0 var(--zaui-space-size-md, 16px);
+      max-height: 450px;
+      padding: 0 var(--zaui-space-size-md, 16px);
       padding-top: 0;
-      overflow   : auto;
+      overflow: auto;
     }
   }
-
 }
 
 .pro-modal-no-footer {
   .ant-modal-content {
     .ant-modal-body {
-      padding-bottom: calc(var(--zaui-space-size-md; 16px) * var(--zaui-size; 1))
+      padding-bottom: calc(var(--zaui-space-size-md; 16px) * var(--zaui-size; 1));
     }
   }
 }
@@ -157,16 +157,16 @@
   z-index: 1;
 
   .ant-modal-header {
+    position: relative;
+    z-index: 1;
     box-shadow: -12px 14px 14px -18px var(--zaui-shadow, rgba(56, 56, 56, 0.15));
-    position  : relative;
-    z-index   : 1;
   }
 }
 
 .pro-modal-footer-shadow {
   .ant-modal-footer {
-    position  : relative;
-    z-index   : 1;
+    position: relative;
+    z-index: 1;
     box-shadow: 3px 2px 12px 0px var(--zaui-shadow, rgba(56, 56, 56, 0.15));
   }
 }

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

@@ -1,15 +1,22 @@
+import "antd/es/tooltip/style";
+import _Tooltip from "antd/es/tooltip";
 import "antd/es/form/style";
 import _Form from "antd/es/form";
+import "antd/es/space/style";
+import _Space from "antd/es/space";
+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"];
-import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+var _excluded = ["type", "valueType", "names", "fieldProps", "labelRequired", "editRender", "component", "viewRender", "title", "originTitle", "label", "dataIndex", "formItemProps", "isEditable", "required", "rules", "equalWith", "className"];
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /* eslint-disable prefer-destructuring */
 /* eslint-disable prefer-const */
 import React, { useCallback, useEffect } from 'react';
+import classNames from 'classnames';
 import { cloneDeep, isEqual, debounce, omit, isFunction, isString } from 'lodash';
 import valueTypeMap from '../../../ProForm/utils/valueType';
 import transformMap from '../../utils/transform';
@@ -18,11 +25,12 @@ import * as componentMap from '../../../ProForm/components';
 import Container from '../../../ProForm/components/Container';
 import transformNames from '../../../ProForm/utils/transformNames';
 import { FieldProvider } from '../../../ProForm/utils/useFieldProps';
+import { useChanged } from '../../../ProForm/utils/useChanged';
 import useRules from '../../../ProForm/utils/useRules';
 import { isSelect } from '../../../ProForm/utils';
 import locale from '../../../locale';
 var RenderField = function RenderField(_ref) {
-  var _type, _type$replace, _fieldProps2, _fieldProps3, _fieldProps4, _names, _formItemChildProps$p, _TargetComponent4;
+  var _type, _type$replace, _fieldProps2, _fieldProps3, _fieldProps4, _names, _formItemChildProps$p, _TargetComponent4, _classNames;
   var value = _ref.text,
     record = _ref.record,
     index = _ref.index,
@@ -47,6 +55,8 @@ var RenderField = function RenderField(_ref) {
     required = _column$required === void 0 ? false : _column$required,
     _column$rules = column.rules,
     rules = _column$rules === void 0 ? [] : _column$rules,
+    equalWith = column.equalWith,
+    className = column.className,
     resetProps = _objectWithoutProperties(column, _excluded);
   // editRender弃用使用component同ProForm
   var _editRender = component || editRender;
@@ -61,7 +71,9 @@ var RenderField = function RenderField(_ref) {
     setState = config.setState,
     name = config.name,
     virtualKey = config.virtualKey,
-    viewEmpty = config.viewEmpty;
+    viewEmpty = config.viewEmpty,
+    originalValues = config.originalValues,
+    originalTip = config.originalTip;
   var _fieldProps = fieldProps || formItemProps || {};
   var _rules = rules || [];
   var _required = required;
@@ -175,13 +187,23 @@ var RenderField = function RenderField(_ref) {
       return [].concat(_toConsumableArray(baseName), [index, key]);
     });
   }
+  var originalName = cellName;
+  var originalNames = names;
+  if (virtualKey) {
+    var _cellName$slice, _names2, _names2$map;
+    originalName = [].concat(_toConsumableArray(name), _toConsumableArray(cellName === null || cellName === void 0 ? void 0 : (_cellName$slice = cellName.slice) === null || _cellName$slice === void 0 ? void 0 : _cellName$slice.call(cellName, 1)));
+    originalNames = (_names2 = names) === null || _names2 === void 0 ? void 0 : (_names2$map = _names2.map) === null || _names2$map === void 0 ? void 0 : _names2$map.call(_names2, function (item) {
+      var _item$slice;
+      return [].concat(_toConsumableArray(name), _toConsumableArray(item === null || item === void 0 ? void 0 : (_item$slice = item.slice) === null || _item$slice === void 0 ? void 0 : _item$slice.call(item, 1)));
+    });
+  }
   /**
    * 配置names时，基于formItem的normalize与getValueProps进行值类型转换
    * @returns {}
    */
   var namesTransform = function namesTransform() {
-    var _names2;
-    if (!((_names2 = names) === null || _names2 === void 0 ? void 0 : _names2.length)) {
+    var _names3;
+    if (!((_names3 = names) === null || _names3 === void 0 ? void 0 : _names3.length)) {
       return {};
     }
     var namesStr = [baseName, index, dataIndex];
@@ -341,14 +363,6 @@ var RenderField = function RenderField(_ref) {
               d: Date.now()
             }
           });
-          // if (virtualKey) {
-          //   // 单行编辑时需要 强制更新视图
-          //   setState({
-          //     forceUpdate: {
-          //       d: Date.now(),
-          //     },
-          //   });
-          // }
         case 30:
         case "end":
           return _context.stop();
@@ -437,6 +451,20 @@ var RenderField = function RenderField(_ref) {
       return _ref3.apply(this, arguments);
     };
   }();
+  // 判断当前字段是否变更
+  var _useChanged = useChanged({
+      name: cellName,
+      names: names,
+      namesStr: [].concat(_toConsumableArray(baseName), [index, dataIndex]),
+      originalName: originalName,
+      originalNames: originalNames,
+      originalValues: originalValues,
+      form: form,
+      equalWith: equalWith
+    }),
+    _useChanged2 = _slicedToArray(_useChanged, 2),
+    changed = _useChanged2[0],
+    originalValue = _useChanged2[1];
   var componentProps = _objectSpread(_objectSpread(_objectSpread({
     form: form,
     name: cellName,
@@ -477,15 +505,32 @@ var RenderField = function RenderField(_ref) {
   if (!isEditing) {
     delete _formItemProps.rules;
   }
+  var _className = classNames((_classNames = {}, _defineProperty(_classNames, className, className), _defineProperty(_classNames, 'pro-form-item-changed', changed), _classNames));
+  var originalTitle = _jsxs(_Space, {
+    children: ["\u521D\u59CB\u503C\uFF1A", /*#__PURE__*/React.isValidElement(TargetComponent) ? /*#__PURE__*/React.cloneElement(TargetComponent, _objectSpread(_objectSpread({}, omit(componentProps, ['onFieldChange'])), {}, {
+      isView: true,
+      value: originalValue,
+      checked: type === 'Switch' ? originalValue : undefined
+    })) : _jsx(TargetComponent, _objectSpread(_objectSpread({}, omit(componentProps, ['onFieldChange'])), {}, {
+      isView: true,
+      value: originalValue,
+      checked: type === 'Switch' ? originalValue : undefined
+    }))]
+  });
+  var FormItem = _jsx(_Form.Item, _objectSpread(_objectSpread({
+    validateFirst: true
+  }, omit(_formItemProps, ['render', 'cache', 'key', 'width', 'hiddenNames', 'name'])), {}, {
+    className: _className,
+    name: cellName,
+    children: /*#__PURE__*/React.isValidElement(TargetComponent) ? /*#__PURE__*/React.cloneElement(TargetComponent, _objectSpread({}, omit(componentProps, ['onFieldChange']))) : _jsx(TargetComponent, _objectSpread({}, omit(componentProps, ['onFieldChange'])))
+  }));
   return _jsx(FieldProvider, {
     value: componentProps === null || componentProps === void 0 ? void 0 : componentProps.otherProps,
-    children: _jsx(_Form.Item, _objectSpread(_objectSpread({
-      validateFirst: true,
-      noStyle: !isEditing
-    }, omit(_formItemProps, ['render', 'cache', 'key', 'width', 'hiddenNames', 'name'])), {}, {
-      name: cellName,
-      children: /*#__PURE__*/React.isValidElement(TargetComponent) ? /*#__PURE__*/React.cloneElement(TargetComponent, _objectSpread({}, omit(componentProps, ['onFieldChange']))) : _jsx(TargetComponent, _objectSpread({}, omit(componentProps, ['onFieldChange'])))
-    }))
+    children: !originalTip || ['FormList', 'ProEditTable'].includes(type) ? FormItem : _jsx(_Tooltip, {
+      title: originalTitle,
+      open: changed ? undefined : false,
+      children: FormItem
+    })
   });
 };
 export default RenderField;