@zat-design/sisyphus-react 3.10.2 → 3.10.3-beta.3

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

@@ -18,7 +18,7 @@ var _react = _interopRequireWildcard(require("react"));
 var _diffOriginal = require("../../utils/diffOriginal");
 var _ProConfigProvider = require("../../../ProConfigProvider");
 var _utils = require("../../../utils");
-var _excluded = ["name", "names", "namesStr", "form", "equalWith", "children", "type", "diffConfig", "valuePropName", "normalize", "getValueProps", "viewRender"];
+var _excluded = ["name", "names", "namesStr", "form", "onDiff", "children", "type", "diffConfig", "valuePropName", "normalize", "getValueProps", "viewRender"];
 var componentsWithFloatWindow = ['Select', 'ProSelect', 'ProEnum', 'ProTimeLimit', 'ProModalSelect', 'ProCascader', 'DataPicker', 'RangePicker', 'TimePicker'];
 var ChangedWrapper = function ChangedWrapper(props) {
   var _diffConfig$toolTip, _children$props, _children$props2, _children$props3;
@@ -26,7 +26,7 @@ var ChangedWrapper = function ChangedWrapper(props) {
     names = props.names,
     namesStr = props.namesStr,
     form = props.form,
-    equalWith = props.equalWith,
+    onDiff = props.onDiff,
     children = props.children,
     type = props.type,
     diffConfig = props.diffConfig,
@@ -48,7 +48,7 @@ var ChangedWrapper = function ChangedWrapper(props) {
   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 || isDiffAll ? false : (0, _utils.isEmpty)(originalValue));
+  var noChange = !onDiff && (!originalValues || isDiffAll ? false : (0, _utils.isEmpty)(originalValue));
   var diffType = (0, _react.useMemo)(function () {
     if (!isWatch || noChange) return 'same';
     var _value = normalize ? normalize(props[valuePropName], undefined, undefined, true) // true 代表是值比对时的调用
@@ -63,10 +63,10 @@ var ChangedWrapper = function ChangedWrapper(props) {
       value: _value,
       originalValue: _originalValue,
       form: form,
-      equalWith: equalWith
+      onDiff: onDiff
       // name: namesStr || name,
     });
-  }, [isWatch, noChange, props[valuePropName], originalValue, (0, _typeof2.default)(equalWith)]);
+  }, [isWatch, noChange, props[valuePropName], originalValue, (0, _typeof2.default)(onDiff)]);
   var isAdd = diffType === 'add';
   var isChanged = diffType === 'changed';
   var tipContent = (0, _react.useMemo)(function () {
@@ -91,7 +91,6 @@ var ChangedWrapper = function ChangedWrapper(props) {
     }, children.props), rest));
   }
   // eslint-disable-next-line react-hooks/rules-of-hooks
-  // const isFocus = useFocus(contentRef.current);
   var tipOpenCalc = function tipOpenCalc() {
     if (!toolTip) return false;
     // 传入undefined 鼠标移入显示移出隐藏 获得焦点时不显示气泡

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

@@ -28,25 +28,25 @@ var ConfirmWrapper = function ConfirmWrapper(props) {
   var _ProForm$useFieldProp = _index.default.useFieldProps(),
     form = _ProForm$useFieldProp.form;
   var handleChange = /*#__PURE__*/function () {
-    var _ref = (0, _asyncToGenerator2.default)(/*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee(value) {
+    var _ref = (0, _asyncToGenerator2.default)(/*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee2(value) {
       var _len,
         other,
         _key,
         _value,
         confirmProps,
-        _args = arguments;
-      return (0, _regeneratorRuntime2.default)().wrap(function _callee$(_context) {
-        while (1) switch (_context.prev = _context.next) {
+        _args2 = arguments;
+      return (0, _regeneratorRuntime2.default)().wrap(function _callee2$(_context2) {
+        while (1) switch (_context2.prev = _context2.next) {
           case 0:
-            for (_len = _args.length, other = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
-              other[_key - 1] = _args[_key];
+            for (_len = _args2.length, other = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+              other[_key - 1] = _args2[_key];
             }
             _value = (value === null || value === void 0 ? void 0 : value.target) ? value.target.value : value;
             if (!(0, _lodash.isFunction)(confirm)) {
-              _context.next = 8;
+              _context2.next = 8;
               break;
             }
-            _context.next = 5;
+            _context2.next = 5;
             return confirm(value, form.getFieldsValue(), {
               option: other[0],
               form: form,
@@ -56,13 +56,13 @@ var ConfirmWrapper = function ConfirmWrapper(props) {
               preValue: form.getFieldValue(otherProps.listName || otherProps.name)
             });
           case 5:
-            _context.t0 = _context.sent;
-            _context.next = 9;
+            _context2.t0 = _context2.sent;
+            _context2.next = 9;
             break;
           case 8:
-            _context.t0 = confirm;
+            _context2.t0 = confirm;
           case 9:
-            confirmProps = _context.t0;
+            confirmProps = _context2.t0;
             // 只处理 false, true 和 对象的情况
             if (confirmProps === false) {
               onChange === null || onChange === void 0 ? void 0 : onChange.apply(void 0, [_value].concat(other));
@@ -76,21 +76,41 @@ var ConfirmWrapper = function ConfirmWrapper(props) {
             }
             if ((0, _lodash.isObject)(confirmProps)) {
               _antd.Modal.confirm((0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, 'title' in confirmProps || 'content' in confirmProps ? {} : defaultConfirmProps), confirmProps), {}, {
-                onOk: function onOk() {
-                  var _confirmProps$onOk;
-                  for (var _len2 = arguments.length, arg = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
-                    arg[_key2] = arguments[_key2];
+                onOk: function () {
+                  var _onOk = (0, _asyncToGenerator2.default)(/*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee() {
+                    var _confirmProps$onOk;
+                    var _len2,
+                      arg,
+                      _key2,
+                      _args = arguments;
+                    return (0, _regeneratorRuntime2.default)().wrap(function _callee$(_context) {
+                      while (1) switch (_context.prev = _context.next) {
+                        case 0:
+                          for (_len2 = _args.length, arg = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+                            arg[_key2] = _args[_key2];
+                          }
+                          _context.next = 3;
+                          return (_confirmProps$onOk = confirmProps.onOk) === null || _confirmProps$onOk === void 0 ? void 0 : _confirmProps$onOk.call.apply(_confirmProps$onOk, [confirmProps].concat(arg));
+                        case 3:
+                          onChange === null || onChange === void 0 ? void 0 : onChange.apply(void 0, [_value].concat(other));
+                        case 4:
+                        case "end":
+                          return _context.stop();
+                      }
+                    }, _callee);
+                  }));
+                  function onOk() {
+                    return _onOk.apply(this, arguments);
                   }
-                  (_confirmProps$onOk = confirmProps.onOk) === null || _confirmProps$onOk === void 0 ? void 0 : _confirmProps$onOk.call.apply(_confirmProps$onOk, [confirmProps].concat(arg));
-                  onChange === null || onChange === void 0 ? void 0 : onChange.apply(void 0, [_value].concat(other));
-                }
+                  return onOk;
+                }()
               }));
             }
           case 13:
           case "end":
-            return _context.stop();
+            return _context2.stop();
         }
-      }, _callee);
+      }, _callee2);
     }));
     return function handleChange(_x) {
       return _ref.apply(this, arguments);

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

@@ -46,7 +46,7 @@ var Render = function Render(props) {
     formDisabled = props.formDisabled,
     type = props.type,
     isSelect = props.isSelect,
-    equalWith = props.equalWith,
+    onDiff = props.onDiff,
     requiredOnView = props.requiredOnView,
     confirm = props.confirm,
     globalControl = props.globalControl,
@@ -447,9 +447,10 @@ var Render = function Render(props) {
         namesStr: namesStr,
         diffConfig: diffConfig,
         form: form,
-        equalWith: equalWith,
+        onDiff: onDiff,
         type: type,
         onChange: handleChange,
+        onBlur: handleBlur,
         valuePropName: _otherFormItemProps.valuePropName,
         normalize: _otherFormItemProps.normalize,
         getValueProps: _otherFormItemProps.getValueProps,

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

@@ -17,7 +17,7 @@ var componentMap = _interopRequireWildcard(require("../index"));
 var _utils = require("../../utils");
 var _useFieldProps = require("../../utils/useFieldProps");
 var _locale = _interopRequireDefault(require("../../../locale"));
-var _excluded = ["show", "type", "viewRender", "viewType", "valueType", "formItemProps", "colProps", "formItemChildProps", "fieldProps", "equalWith", "onDiff", "clearNotShow", "required", "confirm", "desensitization"];
+var _excluded = ["show", "type", "viewRender", "viewType", "valueType", "formItemProps", "colProps", "formItemChildProps", "fieldProps", "onDiff", "clearNotShow", "required", "confirm", "desensitization"];
 var RenderFields = function RenderFields(props) {
   var isView = props.isView,
     _props$columns = props.columns,
@@ -77,7 +77,6 @@ var RenderFields = function RenderFields(props) {
       formItemChildProps = _column$formItemChild === void 0 ? {} : _column$formItemChild,
       _column$fieldProps = column.fieldProps,
       fieldProps = _column$fieldProps === void 0 ? {} : _column$fieldProps,
-      equalWith = column.equalWith,
       onDiff = column.onDiff,
       _column$clearNotShow = column.clearNotShow,
       clearNotShow = _column$clearNotShow === void 0 ? outerClearNotShow : _column$clearNotShow,
@@ -220,7 +219,7 @@ var RenderFields = function RenderFields(props) {
         fieldProps: (0, _lodash.isFunction)(fieldProps) ? fieldProps : null,
         isSelect: _isSelect,
         diffConfig: diffConfig,
-        equalWith: onDiff || equalWith,
+        onDiff: onDiff,
         requiredOnView: requiredOnView,
         globalControl: globalControl,
         viewRender: viewRender,

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

@@ -206,8 +206,7 @@ export interface ProFormColumnProps<Values = any> extends Omit<FormItemProps<Val
     upperCase?: boolean;
     hiddenNames?: string[] | any[];
     rules?: ProRule[] | ReactiveFunction<Values, ProRule[]>;
-    equalWith?: DiffOriginalParams['equalWith'];
-    onDiff?: DiffOriginalParams['equalWith'];
+    onDiff?: DiffOriginalParams['onDiff'];
     required?: boolean | boolean[] | ReactiveFunction<Values, boolean | boolean[]>;
     labelRequired?: boolean;
     toISOString?: boolean;

package/lib/ProForm/utils/_useChanged.d.ts

@@ -1,8 +1,8 @@
-export declare const useChanged: ({ name, names, namesStr, originalValues, form, equalWith }: {
+export declare const useChanged: ({ name, names, namesStr, originalValues, form, onDiff }: {
     name: any;
     names: any;
     namesStr: any;
     originalValues: any;
     form: any;
-    equalWith: any;
+    onDiff: any;
 }) => any[];

package/lib/ProForm/utils/_useChanged.js

@@ -13,18 +13,18 @@ var useChanged = exports.useChanged = function useChanged(_ref) {
     namesStr = _ref.namesStr,
     originalValues = _ref.originalValues,
     form = _ref.form,
-    equalWith = _ref.equalWith;
+    onDiff = _ref.onDiff;
   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 notWatch = !equalWith && (!originalValues || originalValue === undefined);
+  var notWatch = !onDiff && (!originalValues || originalValue === undefined);
   if (notWatch) return [false];
   var value = _antd.Form.useWatch(namesStr || name, form);
   var changed = (0, _diffOriginal.diffOriginal)({
     originalValue: originalValue,
     value: value,
     form: form,
-    equalWith: equalWith
+    onDiff: onDiff
   });
   return [changed, originalValue];
 };

package/lib/ProForm/utils/_useListChanged.d.ts

@@ -10,7 +10,7 @@ interface Params {
     originalValues: any;
     form: FormInstance;
     rowKeyPath?: InternalNamePath;
-    equalWith?: (originalValue: any, currentValue: any) => boolean;
+    onDiff?: (originalValue: any, currentValue: any) => boolean;
 }
 export declare const useListChanged: (params: Params) => any[];
 export {};

package/lib/ProForm/utils/_useListChanged.js

@@ -69,7 +69,7 @@ var useListChanged = exports.useListChanged = function useListChanged(params) {
     originalNames = _params$originalNames === void 0 ? names : _params$originalNames,
     originalValues = params.originalValues,
     form = params.form,
-    equalWith = params.equalWith,
+    onDiff = params.onDiff,
     rowKeyPath = params.rowKeyPath;
   var namePath = toNamePath(namesStr || name);
   var originalNamePath = toNamePath(originalName);
@@ -83,7 +83,7 @@ var useListChanged = exports.useListChanged = function useListChanged(params) {
     rowKeyPath: rowKeyPath,
     form: form
   }) : undefined;
-  var noChange = !equalWith && (!originalValues || originalValue === undefined);
+  var noChange = !onDiff && (!originalValues || originalValue === undefined);
   var _form = form;
   if (notWatch || noChange) return [false];
   var value = _antd.Form.useWatch(namePath, _form);
@@ -91,7 +91,7 @@ var useListChanged = exports.useListChanged = function useListChanged(params) {
     value: value,
     originalValue: originalValue,
     form: form,
-    equalWith: equalWith
+    onDiff: onDiff
     // name: isString(namesStr) ? namesStr : originalName || name,
   });
   return [changed, originalValue];

package/lib/ProForm/utils/diffOriginal.d.ts

@@ -3,7 +3,7 @@ export interface DiffOriginalParams {
     originalValue: any;
     value: any;
     form: FormInstance;
-    equalWith?: (originalValue: any, currentValue: any) => DiffType | boolean | undefined;
+    onDiff?: (originalValue: any, currentValue: any) => DiffType | boolean | undefined;
 }
 export type DiffType = 'same' | 'add' | 'changed';
 export declare const diffOriginal: (params: DiffOriginalParams) => DiffType;

package/lib/ProForm/utils/diffOriginal.js

@@ -36,10 +36,10 @@ var filterObject = function filterObject(data) {
 var diffOriginal = exports.diffOriginal = function diffOriginal(params) {
   var originalValue = params.originalValue,
     value = params.value,
-    equalWith = params.equalWith;
+    onDiff = params.onDiff;
   // 支持传入自定义比较事件
-  if ((0, _lodash.isFunction)(equalWith)) {
-    var diffRes = equalWith(originalValue, value);
+  if ((0, _lodash.isFunction)(onDiff)) {
+    var diffRes = onDiff(originalValue, value);
     // 如果返回undefined走内置比较逻辑
     if (diffRes !== undefined) {
       if (typeof diffRes === 'boolean') {

package/lib/ProForm/utils/transformValue.js

@@ -22,21 +22,21 @@ var transformValue = exports.transformValue = function transformValue(names, for
       }
       names.forEach(function (name, index) {
         var _value2;
-        // @ts-ignore
         (0, _lodash.set)(form.getFieldsValue(true), name, (_value2 = _value) === null || _value2 === void 0 ? void 0 : _value2[index]);
       });
       return _value;
     },
-    getValueProps: function getValueProps(value, isOrg) {
+    getValueProps: function getValueProps(value, isOrigin) {
       var _curValue;
       var _value = [];
-      if (!isOrg) {
+      if (isOrigin) {
+        _value = value;
+      } else {
+        // 非比对names场景
         names.forEach(function (name, index) {
           var value = form.getFieldValue(name);
           _value[index] = value;
         });
-      } else {
-        _value = value;
       }
       // 支持外部传入转换函数
       var res = (_getValueProps === null || _getValueProps === void 0 ? void 0 : _getValueProps(_value)) || {
@@ -50,8 +50,10 @@ var transformValue = exports.transformValue = function transformValue(names, for
       })) {
         curValue = undefined;
       }
-      // @ts-ignore
-      (0, _lodash.set)(form.getFieldsValue(true), fieldName, curValue);
+      // 如果来源是比对且有names场景, 则不更新表单值
+      if (!isOrigin) {
+        (0, _lodash.set)(form.getFieldsValue(true), fieldName, curValue);
+      }
       // 如果表单里的值和组合得到的值不全等  更新表单里的值、
       return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, res), {}, {
         value: curValue

package/lib/ProStep/components/Anchor/index.js

@@ -7,6 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = exports.MenuItem = void 0;
 var _jsxRuntime = require("react/jsx-runtime");
 var _classnames = _interopRequireDefault(require("classnames"));
+var _antd = require("antd");
 var _utils = require("../../utils");
 var AnchorSvg = function AnchorSvg(_ref) {
   var color = _ref.color;
@@ -51,7 +52,7 @@ var MenuItem = exports.MenuItem = function MenuItem(props) {
   var renderMenuIcon = function renderMenuIcon() {
     if (isCurrentStep) {
       return (0, _jsxRuntime.jsx)("span", {
-        className: (0, _classnames.default)('dot-icon', {
+        className: (0, _classnames.default)('pro-step-dot-icon', {
           errored: !!errorNum,
           disabled: isDisabled
         }),
@@ -72,14 +73,14 @@ var MenuItem = exports.MenuItem = function MenuItem(props) {
       });
     }
     return (0, _jsxRuntime.jsx)("div", {
-      className: (0, _classnames.default)('dot', {
+      className: (0, _classnames.default)('pro-step-dot', {
         errored: !!errorNum,
         disabled: isDisabled
       })
     });
   };
   return (0, _jsxRuntime.jsxs)("div", {
-    className: (0, _classnames.default)('com-menu-item', {
+    className: (0, _classnames.default)('pro-step-com-menu-item', {
       errored: !!errorNum,
       disabled: isDisabled,
       current: isCurrentStep && onOff
@@ -91,22 +92,22 @@ var MenuItem = exports.MenuItem = function MenuItem(props) {
       });
     },
     children: [(0, _jsxRuntime.jsxs)("div", {
-      className: "menu-item",
+      className: "pro-step-menu-item",
       children: [(0, _jsxRuntime.jsx)("div", {
-        className: "menu-icon",
+        className: "pro-step-menu-icon",
         children: renderMenuIcon()
       }), onOff && (0, _jsxRuntime.jsx)("div", {
-        className: (0, _classnames.default)('menu-name', {
+        className: (0, _classnames.default)('pro-step-menu-name', {
           disabled: isDisabled
         }),
         children: name
       })]
     }), !isDisabled && onOff && (0, _jsxRuntime.jsxs)("div", {
-      className: "checked-status",
+      className: "pro-step-checked-status",
       children: [isChecked && (0, _jsxRuntime.jsx)(SuccessSvg, {}), errorNum > 0 && (0, _jsxRuntime.jsx)("div", {
-        className: "errorDot",
-        children: (0, _jsxRuntime.jsx)("span", {
-          children: errorNum <= 3 ? errorNum : '!'
+        className: "pro-step-error-dot",
+        children: (0, _jsxRuntime.jsx)(_antd.Badge, {
+          count: errorNum
         })
       })]
     })]

package/lib/ProStep/components/Listener/index.js

@@ -13,6 +13,26 @@ var _lodash = require("lodash");
 var _react = _interopRequireDefault(require("react"));
 var _index = require("../../index");
 var _excluded = ["children", "delayTime", "excludes"];
+var checkErrorList = function checkErrorList(arr) {
+  for (var i = 0; i < arr.length; i++) {
+    if (arr[i].className.includes('errored')) {
+      return {
+        errorDom: arr[i],
+        index: i
+      };
+    }
+  }
+  return null;
+};
+var findFirstErrorDom = function findFirstErrorDom() {
+  var errorList = document.querySelectorAll('.pro-step-com-menu-item') || [];
+  var hasErrorItem = document.querySelectorAll('.pro-step-com-menu-item .errored');
+  var hasFormError = document.querySelector('.ant-form-item-explain-error');
+  if ((hasErrorItem === null || hasErrorItem === void 0 ? void 0 : hasErrorItem.length) && !hasFormError) {
+    return checkErrorList(errorList);
+  }
+  return null;
+};
 var _default = exports.default = function _default(_ref) {
   var children = _ref.children,
     delayTime = _ref.delayTime,
@@ -35,6 +55,11 @@ var _default = exports.default = function _default(_ref) {
             values = _context.sent;
             setTimeout(function () {
               var localData = localStorage.getItem('cache-pro-step');
+              var _ref3 = findFirstErrorDom() || {},
+                errorDom = _ref3.errorDom;
+              if (errorDom) {
+                errorDom.click();
+              }
               if (localData !== 'false') {
                 var _children$props, _children$props$onCli;
                 children === null || children === void 0 ? void 0 : (_children$props = children.props) === null || _children$props === void 0 ? void 0 : (_children$props$onCli = _children$props.onClick) === null || _children$props$onCli === void 0 ? void 0 : _children$props$onCli.call(_children$props, values);

package/lib/ProStep/components/Step/index.js

@@ -67,10 +67,10 @@ var Step = exports.Step = function Step(_ref) {
     onMouseEnter: handleMouseEnter,
     onMouseLeave: handleMouseLeave,
     children: [(0, _jsxRuntime.jsxs)("div", {
-      className: "step-menu",
+      className: "pro-step-menu",
       children: [(0, _jsxRuntime.jsx)(_index.default, {
         src: _catalog.default,
-        className: "menu-icon",
+        className: "pro-step-menu-icon",
         actionMap: {}
       }), onOff && (0, _jsxRuntime.jsx)("div", {
         children: _locale.default === null || _locale.default === void 0 ? void 0 : (_locale$ProStep = _locale.default.ProStep) === null || _locale$ProStep === void 0 ? void 0 : _locale$ProStep.catalogue

package/lib/ProStep/style/index.less

@@ -20,7 +20,7 @@
   cursor: pointer;
   transition: width 0.2s;
 
-  > .step-menu {
+  > .pro-step-menu {
     display: flex;
     align-items: center;
     width: 100%;
@@ -33,7 +33,7 @@
       justify-content: center;
       width: 48px;
       height: 24px;
-      > .menu-icon {
+      > .pro-step-menu-icon {
         width: auto !important;
         height: auto !important;
         font-size: var(--zaui-font-size-lg-title, 24px);
@@ -49,7 +49,7 @@
       > button {
         width: auto !important;
         height: auto !important;
-        > .menu-icon {
+        > .pro-step-menu-icon {
           width: auto !important;
           height: auto !important;
           font-size: var(--zaui-font-size-lg-title, 24px);
@@ -79,7 +79,7 @@
     }
   }
 
-  .menu-content {
+  .pro-step-menu-content {
     overflow: hidden;
 
     &:hover {
@@ -87,7 +87,7 @@
     }
   }
 
-  .com-menu-item {
+  .pro-step-com-menu-item {
     display: flex;
     align-items: center;
     justify-content: space-between;
@@ -107,11 +107,11 @@
       }
     }
 
-    > .menu-item {
+    > .pro-step-menu-item {
       display: flex;
       align-items: center;
 
-      > .menu-icon {
+      > .pro-step-menu-icon {
         display: flex;
         align-items: center;
         justify-content: center;
@@ -122,14 +122,19 @@
           fill: var(--zaui-brand, #006aff);
         }
 
-        > .dot {
+        > .pro-step-dot {
           width: 6px;
           height: 6px;
           background: var(--zaui-brand, #006aff);
           border-radius: 3px;
 
+          
+
           &.errored {
+            width: 12px;
+            height: 12px;
             background: #ff5050;
+            border-radius: 50%;
             fill: #ff5050;
           }
 
@@ -139,7 +144,7 @@
           }
         }
 
-        .dot-icon {
+        .pro-step-dot-icon {
           display: flex;
           align-items: center;
           justify-content: center;
@@ -162,7 +167,7 @@
         }
       }
 
-      > .menu-name {
+      > .pro-step-menu-name {
         color: #0a0a0a;
 
         &.disabled {
@@ -171,21 +176,28 @@
       }
     }
 
-    > .checked-status {
+    > .pro-step-checked-status {
       height: 18px;
 
       > svg {
         fill: var(--zaui-brand, #006aff);
       }
 
-      .errorDot {
+      .pro-step-error-dot {
         display: flex;
         align-items: center;
         justify-content: center;
-        width: 16px;
-        height: 16px;
-        background: rgba(255, 80, 80, 0.2);
-        border-radius: 8px;
+
+        .@{ant-prefix}-badge{
+          .@{ant-prefix}-badge-count{
+             background: rgba(255, 80, 80, 0.15);
+             color: #ff5050;
+             .@{ant-prefix}-scroll-number-only-unit, .@{ant-prefix}-scroll-number{
+              font-weight: 600;
+             }
+          }
+        
+        }
 
         > span {
           color: #ff5050;

package/lib/ProTable/components/FormatColumn/index.js

@@ -347,11 +347,6 @@ var formatColumn = exports.formatColumn = function formatColumn(_ref2) {
       if (!originalValue) {
         originalRenderValue = '-';
       }
-      if (originalObj && renderValue !== originalRenderValue) {
-        otherProps.isChanged = true;
-      } else {
-        otherProps.isChanged = false;
-      }
       var node = (0, _jsxRuntime.jsxs)(_antd.Space, {
         size: 8,
         children: [prefixNode(value, record, index), renderValue, suffixNode(value, record, index)]