@zat-design/sisyphus-react 3.3.1 → 3.3.2

package/es/ProForm/utils/useListChanged.d.ts

@@ -0,0 +1,16 @@
+import { FormInstance } from 'antd';
+import { InternalNamePath, NamePath } from 'antd/lib/form/interface';
+interface Params {
+    name?: NamePath;
+    names?: NamePath[];
+    namesStr?: NamePath;
+    originalName?: NamePath;
+    originalNames?: NamePath[];
+    originalNameStr?: NamePath;
+    originalValues: any;
+    form: FormInstance;
+    rowKeyPath?: InternalNamePath;
+    equalWith?: (originalValue: any, currentValue: any) => boolean;
+}
+export declare const useListChanged: (params: Params) => any[];
+export {};

package/es/ProForm/utils/useListChanged.js

@@ -0,0 +1,81 @@
+import "antd/es/form/style";
+import _Form from "antd/es/form";
+import { get } from 'lodash';
+import { contrastOriginal } from './contrastOriginal';
+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);
+    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 = (originalNames === null || originalNames === void 0 ? void 0 : originalNames.length) ? originalNames.map(function (originalName) {
+      return get(originalValueRow, originalName.slice(rowKeyPath.length - 1));
+    }) : get(originalValueRow, originalName.slice(rowKeyPath.length - 1));
+    return originalValue;
+  }
+  return (originalNames === null || originalNames === void 0 ? void 0 : originalNames.length) ? originalNames.map(function (originalName) {
+    return get(originalValues, originalName);
+  }) : get(originalValues, originalName);
+};
+export var useListChanged = function useListChanged(params) {
+  var name = params.name,
+    names = params.names,
+    namesStr = params.namesStr,
+    _params$originalName = params.originalName,
+    originalName = _params$originalName === void 0 ? name : _params$originalName,
+    _params$originalNames = params.originalNames,
+    originalNames = _params$originalNames === void 0 ? names : _params$originalNames,
+    originalValues = params.originalValues,
+    form = params.form,
+    equalWith = params.equalWith,
+    rowKeyPath = params.rowKeyPath;
+  // let _form = form;
+  var namePath = toNamePath(namesStr || name);
+  var originalNamePath = toNamePath(originalName);
+  var originalNamePaths = originalNames && toNamePaths(originalNames);
+  var originalValue = getOriginalValue({
+    namePath: namePath,
+    originalName: originalNamePath,
+    originalNames: originalNamePaths,
+    originalValues: originalValues,
+    rowKeyPath: rowKeyPath,
+    form: form
+  });
+  var notWatch = !originalValues || originalValue === undefined;
+  // @ts-ignore
+  // if (notWatch) _form = [];
+  var value = _Form.useWatch(namePath, form);
+  if (notWatch) return [false];
+  var changed = contrastOriginal({
+    value: value,
+    originalValue: originalValue,
+    form: form,
+    equalWith: equalWith
+  });
+  return [changed, originalValue];
+};

package/es/ProForm/utils/useShouldUpdate.js

@@ -13,7 +13,8 @@ var useShouldUpdate = function useShouldUpdate(props) {
     required = props.required,
     fieldProps = props.fieldProps,
     component = props.component,
-    originComponent = props.originComponent;
+    originComponent = props.originComponent,
+    type = props.type;
   var _shouldUpdate = formItemProps.shouldUpdate,
     name = formItemProps.name,
     clearNotShow = formItemProps.clearNotShow,
@@ -60,11 +61,24 @@ var useShouldUpdate = function useShouldUpdate(props) {
     showRef.current = show;
   }
   if (isFunction(disabled)) {
-    disabledRef.current = Boolean(disabled(values, {
+    // RangePicker返回数组时，特殊处理
+    if (type === 'RangePicker' && Array.isArray(disabled(values, {
       form: form,
       index: index,
       namePath: namePath
-    }));
+    }))) {
+      disabledRef.current = disabled(values, {
+        form: form,
+        index: index,
+        namePath: namePath
+      });
+    } else {
+      disabledRef.current = Boolean(disabled(values, {
+        form: form,
+        index: index,
+        namePath: namePath
+      }));
+    }
   } else {
     disabledRef.current = disabled;
   }

package/es/ProLayout/components/Layout/Menu/FoldMenu/index.js

@@ -26,7 +26,8 @@ var FoldMenu = function FoldMenu(props) {
     'pro-layout-menu-tooltip-nav-open': collapsed
   });
   var _useContext = useContext(LayoutContext),
-    selectedPath = _useContext.selectedPath;
+    selectedPath = _useContext.selectedPath,
+    onSelected = _useContext.onSelected;
   return _jsx("div", {
     className: "pro-layout-menu-fold",
     style: _objectSpread({}, style),
@@ -94,10 +95,17 @@ var FoldMenu = function FoldMenu(props) {
         }, "".concat(id, "-").concat(name)) : !collapsed ? _jsx(_Tooltip, {
           placement: "right",
           title: name,
-          children: _jsx(Link, {
-            to: toPath,
-            children: LiNode
-          }, toPath)
+          children: _jsx("span", {
+            onClick: function onClick() {
+              onSelected({
+                selectedPath: toPath
+              });
+            },
+            children: _jsx(Link, {
+              to: toPath,
+              children: LiNode
+            }, toPath)
+          })
         }, toPath) : _jsx(Link, {
           to: toPath,
           children: LiNode

package/es/ProLayout/components/Layout/Menu/index.js

@@ -3,14 +3,17 @@ import classnames from 'classnames';
 import OpenMenu from './OpenMenu';
 import FoldMenu from './FoldMenu'; // 折叠后菜单
 var Menu = function Menu(props) {
-  var headerHeight = props.headerHeight,
-    dataSource = props.dataSource,
-    iconfontUrl = props.iconfontUrl,
-    collapsed = props.collapsed,
-    notice = props.notice,
-    onToggle = props.onToggle,
-    pure = props.pure,
-    theme = props.theme;
+  var _ref = props || {},
+    headerHeight = _ref.headerHeight,
+    dataSource = _ref.dataSource,
+    iconfontUrl = _ref.iconfontUrl,
+    collapsed = _ref.collapsed,
+    notice = _ref.notice,
+    onToggle = _ref.onToggle,
+    pure = _ref.pure,
+    theme = _ref.theme,
+    sideMenuFooterRender = _ref.sideMenuFooterRender,
+    sideMenuHeaderRender = _ref.sideMenuHeaderRender;
   var menus = [];
   var menuCls = classnames({
     'pro-layout-menu': true,
@@ -29,7 +32,7 @@ var Menu = function Menu(props) {
     style: {
       top: notice ? 80 + headerHeight - 48 : headerHeight
     },
-    children: [_jsx(OpenMenu, {
+    children: [sideMenuHeaderRender, _jsx(OpenMenu, {
       dataSource: {
         menus: menus,
         iconfontUrl: iconfontUrl,
@@ -52,7 +55,7 @@ var Menu = function Menu(props) {
         display: collapsed ? 'none' : 'block',
         height: "calc(100vh - ".concat(headerHeight + (notice ? 32 : 0) + 48 || 0, "px)")
       }
-    }), _jsx("div", {
+    }), sideMenuFooterRender || _jsx("div", {
       className: "pro-layout-menu-collapsed",
       onClick: onToggle,
       children: _jsx("div", {

package/es/ProLayout/propTypes.d.ts

@@ -36,6 +36,8 @@ export interface ProLayoutProps {
     rightContentRender?: ReactNode;
     headerContentRender?: ReactNode;
     headerTitleRender?: ReactNode;
+    sideMenuHeaderRender?: ReactNode;
+    sideMenuFooterRender?: ReactNode;
     headerNotice?: ReactNode | string;
     notice?: ReactNode | string;
     title?: string;

package/es/ProTable/style/index.less

@@ -69,6 +69,7 @@
 
       td {
         background: #d2fff4 !important;
+        border-bottom: 1px solid var(--zaui-form-control-line, #dcdcdc);
       }
     }
 

package/es/ProTooltip/index.js

@@ -6,7 +6,7 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 var _excluded = ["text", "mode", "width", "line", "isResponsiveWidth", "className", "style", "lineHeight"];
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useSize, useSetState, useDebounce } from 'ahooks';
+import { useSize, useSetState, useDebounce, useDebounceEffect } from 'ahooks';
 import { useEffect, useRef } from 'react';
 import classnames from 'classnames';
 import './style/index.less';
@@ -135,7 +135,7 @@ var ProTooltip = function ProTooltip(props) {
     }
     return line > 1 ? _jsx(AutoMixinMulti, {}) : _jsx(AutoMixinSingle, {});
   };
-  useEffect(function () {
+  useDebounceEffect(function () {
     if (isResponsiveWidth && parentElement) {
       var cWidth = parentElement.clientWidth - 32;
       var contentDom = childRef.current;
@@ -149,7 +149,9 @@ var ProTooltip = function ProTooltip(props) {
         localWidth: _width
       });
     }
-  }, [isResponsiveWidth, size]);
+  }, [isResponsiveWidth, size], {
+    wait: 300
+  });
   useEffect(function () {
     if (mode === 'auto' && line === 1) {
       var localDom = ref.current;

package/es/ProTreeModal/components/Trigger.d.ts

@@ -2,6 +2,7 @@ import { CSSProperties } from 'react';
 interface TriggerProps {
     checkedValues: any[];
     value: any;
+    label?: React.ReactNode;
     disabled?: boolean;
     isView?: boolean;
     checkAll?: boolean;

package/es/ProTreeModal/components/Trigger.js

@@ -1,8 +1,8 @@
-import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import "antd/es/input/style";
 import _Input from "antd/es/input";
 import "antd/es/select/style";
 import _Select from "antd/es/select";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import "antd/es/space/style";
 import _Space from "antd/es/space";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
@@ -17,6 +17,7 @@ import viewSvg from '../../assets/view.svg';
 function Trigger(props) {
   var _locale$ProTreeModal2, _locale$ProTreeModal3;
   var value = props.value,
+    label = props.label,
     disabled = props.disabled,
     isView = props.isView,
     triggerStyle = props.triggerStyle,
@@ -34,7 +35,7 @@ function Trigger(props) {
     state = _useSetState2[0],
     setState = _useSetState2[1];
   useEffect(function () {
-    if (checkAll && appoint) {
+    if (allValue === value && appoint) {
       setState({
         mode: 'all'
       });
@@ -51,7 +52,9 @@ function Trigger(props) {
     return _jsxs("div", {
       className: "pro-tree-modal-isView",
       children: [_jsx("div", {
-        children: checkedValues.length === 0 ? '-' : checkAll ? locale === null || locale === void 0 ? void 0 : locale.ProTreeModal.checkAll : formatMessage(locale === null || locale === void 0 ? void 0 : (_locale$ProTreeModal = locale.ProTreeModal) === null || _locale$ProTreeModal === void 0 ? void 0 : _locale$ProTreeModal.checkNumber, {
+        children: checkedValues.length === 0 ? '-' : state.mode === 'all' ? formatMessage(locale === null || locale === void 0 ? void 0 : locale.ProTreeModal.checkAll1, {
+          all: label
+        }) : formatMessage(locale === null || locale === void 0 ? void 0 : (_locale$ProTreeModal = locale.ProTreeModal) === null || _locale$ProTreeModal === void 0 ? void 0 : _locale$ProTreeModal.checkNumber, {
           num: checkedValues.length
         })
       }), _jsx("div", {
@@ -78,7 +81,11 @@ function Trigger(props) {
     if (appoint) {
       return _jsxs(_Space.Compact, {
         block: true,
+        style: _objectSpread({}, triggerStyle),
         children: [_jsxs(_Select, {
+          style: {
+            width: 'auto'
+          },
           disabled: disabled,
           className: classNames(disabled ? 'trigger-no-hover' : '', appoint ? 'pro-tree-modal-input-appoint' : ''),
           defaultValue: "appoint",
@@ -86,10 +93,10 @@ function Trigger(props) {
           onChange: onAppointChange,
           children: [_jsx(_Select.Option, {
             value: "all",
-            children: "\u5168\u90E8"
+            children: locale === null || locale === void 0 ? void 0 : locale.ProTreeModal.specifyMode[0]
           }), _jsx(_Select.Option, {
             value: "appoint",
-            children: "\u6307\u5B9A"
+            children: locale === null || locale === void 0 ? void 0 : locale.ProTreeModal.specifyMode[1]
           })]
         }), props.children]
       });
@@ -100,10 +107,12 @@ function Trigger(props) {
     children: _jsx(_Input, {
       className: classNames(disabled ? 'trigger-no-hover' : '', appoint ? 'pro-tree-modal-input-appoint' : ''),
       onClick: handleClick,
-      value: checkedValues.length === 0 ? null : checkAll ? locale === null || locale === void 0 ? void 0 : locale.ProTreeModal.checkAll : formatMessage(locale === null || locale === void 0 ? void 0 : (_locale$ProTreeModal2 = locale.ProTreeModal) === null || _locale$ProTreeModal2 === void 0 ? void 0 : _locale$ProTreeModal2.checkNumber, {
+      value: checkedValues.length === 0 ? null : state.mode === 'all' ? formatMessage(locale === null || locale === void 0 ? void 0 : locale.ProTreeModal.checkAll1, {
+        all: label
+      }) : formatMessage(locale === null || locale === void 0 ? void 0 : (_locale$ProTreeModal2 = locale.ProTreeModal) === null || _locale$ProTreeModal2 === void 0 ? void 0 : _locale$ProTreeModal2.checkNumber, {
         num: checkedValues.length
       }),
-      addonAfter: _jsxs("div", {
+      addonAfter: state.mode === 'all' ? null : _jsxs("div", {
         className: "pro-enum-input-addonAfter",
         children: [checkedValues.length > 0 && !disabled && _jsx("span", {
           className: "close-icon",
@@ -117,7 +126,7 @@ function Trigger(props) {
         })]
       }),
       placeholder: locale === null || locale === void 0 ? void 0 : (_locale$ProTreeModal3 = locale.ProTreeModal) === null || _locale$ProTreeModal3 === void 0 ? void 0 : _locale$ProTreeModal3.select,
-      disabled: disabled || appoint && value === allValue,
+      disabled: disabled || state.mode === 'all',
       style: _objectSpread({}, triggerStyle)
     })
   });

package/es/ProTreeModal/index.js

@@ -42,7 +42,6 @@ var ProTreeModal = function ProTreeModal(props) {
     _props$title = props.title,
     title = _props$title === void 0 ? locale === null || locale === void 0 ? void 0 : (_locale$ProTreeModal = locale.ProTreeModal) === null || _locale$ProTreeModal === void 0 ? void 0 : _locale$ProTreeModal.select : _props$title,
     useRequest = props.useRequest,
-    allValue = props.allValue,
     _props$showCodeName = props.showCodeName,
     showCodeName = _props$showCodeName === void 0 ? false : _props$showCodeName,
     _props$checkStrictly = props.checkStrictly,
@@ -72,9 +71,14 @@ var ProTreeModal = function ProTreeModal(props) {
     optionRender = props.optionRender,
     openChange = props.openChange,
     maxMessage = props.maxMessage;
+  var allValue = props.allValue;
   var modeType = mode.toUpperCase();
   var fieldNameLabel = fieldNames.label;
   var fieldNameValue = fieldNames.value;
+  if (appoint && !allValue) {
+    console.error('allValue must be input');
+    allValue = 'all';
+  }
   var _useSetState = useSetState({
       open: false,
       checkedValues: [],
@@ -217,8 +221,11 @@ var ProTreeModal = function ProTreeModal(props) {
    */
   var handleFinish = function handleFinish() {
     // 全选的时候返回 allValue 标记即可
+    // 3.3.2 版本全选的时候返回所有值的合集 list
     if (allValue !== undefined && state.checkAll && !draggable) {
-      onChange === null || onChange === void 0 ? void 0 : onChange(allValue);
+      onChange === null || onChange === void 0 ? void 0 : onChange(state.flatTreeData.map(function (item) {
+        return item[fieldNameValue];
+      }));
     } else if (draggable && span) {
       var _listRef$current;
       // 开启 draggable 使用拖拽后的顺序
@@ -269,6 +276,7 @@ var ProTreeModal = function ProTreeModal(props) {
       treeViewData: [],
       checkAll: false
     });
+    onChange === null || onChange === void 0 ? void 0 : onChange(_checkedValues);
   };
   /**
    * Drawer close
@@ -493,6 +501,7 @@ var ProTreeModal = function ProTreeModal(props) {
    * @returns
    */
   var TriggerComponent = useMemo(function () {
+    var _props$otherProps3;
     if (trigger && /*#__PURE__*/React.isValidElement(trigger)) {
       return _jsx("div", {
         onClick: handleClick,
@@ -508,6 +517,7 @@ var ProTreeModal = function ProTreeModal(props) {
       isView: isView,
       appoint: appoint,
       allValue: allValue,
+      label: props === null || props === void 0 ? void 0 : (_props$otherProps3 = props.otherProps) === null || _props$otherProps3 === void 0 ? void 0 : _props$otherProps3.label,
       handleClick: handleClick,
       handleClearAll: handleClearAll,
       appointChange: appointChange

package/es/ProUpload/components/DragRender.js

@@ -52,8 +52,7 @@ var DragRender = function DragRender(props) {
    */
   var handleReSelect = function handleReSelect(file) {
     if (disabled) return;
-    // handleDelFile(file);
-    setFileList([]);
+    handleDelFile(file);
     setTimeout(function () {
       refReSelect.current.click();
     }, 1);

package/es/ProUpload/components/ImageRender.js

@@ -17,12 +17,12 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
  * @Author: wangshengqiang
  * @Date: 2023-07-27 20:13:07
  * @LastEditors: wangshengqiang
- * @LastEditTime: 2023-11-21 15:24:56
+ * @LastEditTime: 2023-11-29 19:33:04
  * @Description: 图片类型
  *
  */
 
-import { useState } from 'react';
+import { useRef, useState } from 'react';
 import { DndContext } from '@dnd-kit/core';
 import { SortableContext, rectSortingStrategy } from '@dnd-kit/sortable';
 import { ReactSVG } from 'react-svg';
@@ -34,6 +34,9 @@ import lookSvg from '../../assets/look.svg';
 import deleteSvg from '../../assets/delete.svg';
 import downloadSvg from '../../assets/download.svg';
 import locale from '../../locale';
+var isImgage = function isImgage(_fileExt) {
+  return ['.PNG', '.JPG', '.JPEG', '.GIF', '.BMP', '.JPE'].includes(_fileExt.toLocaleUpperCase());
+};
 /* 按钮类型 */
 var ImageRender = function ImageRender(props) {
   var _locale$ProUpload4;
@@ -41,6 +44,7 @@ var ImageRender = function ImageRender(props) {
     _useState2 = _slicedToArray(_useState, 2),
     previewImg = _useState2[0],
     setPreviewImg = _useState2[1];
+  var proViewerRef = useRef(null);
   var isView = props.isView,
     disabled = props.disabled,
     headerRender = props.headerRender,
@@ -67,7 +71,13 @@ var ImageRender = function ImageRender(props) {
     if (onPreview) {
       onPreview(file);
     } else {
-      setPreviewImg(file);
+      var _file$url;
+      var _fileExt = getFileExt(file.name || (file === null || file === void 0 ? void 0 : (_file$url = file.url) === null || _file$url === void 0 ? void 0 : _file$url.split('?')[0]));
+      if (isImgage(_fileExt)) {
+        setPreviewImg(file);
+      } else {
+        window.open(file.url, '_blank');
+      }
     }
   };
   /**
@@ -96,12 +106,12 @@ var ImageRender = function ImageRender(props) {
     openFileDialogOnClick: !showDraggerSingleRender,
     disabled: disabled || isView,
     itemRender: function itemRender(originNode, file, fileList, actions) {
-      var _file$url, _locale$ProUpload, _locale$ProUpload2, _locale$ProUpload3;
+      var _file$url2, _locale$ProUpload, _locale$ProUpload2, _locale$ProUpload3;
       var _isShowDownload = !!onDownload && file.status === 'done';
-      var _fileExt = getFileExt(file.name || (file === null || file === void 0 ? void 0 : (_file$url = file.url) === null || _file$url === void 0 ? void 0 : _file$url.split('?')[0]));
+      var _fileExt = getFileExt(file.name || (file === null || file === void 0 ? void 0 : (_file$url2 = file.url) === null || _file$url2 === void 0 ? void 0 : _file$url2.split('?')[0]));
       var _fileIcon = getFileIcon(_fileExt);
-      var isImg = ['.PNG', '.JPG', '.JPEG', '.GIF', '.BMP', '.JPE'].includes(_fileExt.toLocaleUpperCase());
-      var _showPreview = isImg;
+      var isImg = isImgage(_fileExt);
+      var _showPreview = isImg || file.status === 'done';
       return _jsx(DraggableUploadListItem, {
         file: file,
         children: _jsxs("div", {

package/es/locale/en_US.d.ts

@@ -127,10 +127,12 @@ declare const _default: {
         selectMax: string;
         noCheck: string;
         checkAll: string;
+        checkAll1: string;
         check: string;
         clearAll: string;
         checkNumber: string;
         noFinal: string;
+        specifyMode: string[];
     };
     ProTimeLimit: {
         foreverText: string;

package/es/locale/en_US.js

@@ -127,10 +127,12 @@ export default {
     selectMax: 'Select at most {max} items',
     noCheck: 'None selected yet',
     checkAll: 'Select all',
+    checkAll1: 'Select all {all}',
     check: 'selected',
     clearAll: 'Clear all',
     checkNumber: '{num} items selected',
-    noFinal: 'Oops, the content you are looking for is not found.'
+    noFinal: 'Oops, the content you are looking for is not found.',
+    specifyMode: ['all', 'specify']
   },
   ProTimeLimit: {
     foreverText: 'long term'

package/es/locale/zh_CN.d.ts

@@ -127,9 +127,12 @@ declare const _default: {
         selectMax: string;
         noCheck: string;
         checkAll: string;
+        checkAll1: string;
         check: string;
         clearAll: string;
         checkNumber: string;
+        noFinal: string;
+        specifyMode: string[];
     };
     ProTimeLimit: {
         foreverText: string;

package/es/locale/zh_CN.js

@@ -127,9 +127,12 @@ export default {
     selectMax: '最多选择{max}个',
     noCheck: '暂无已选',
     checkAll: '全选',
+    checkAll1: '全部{all}',
     check: '已选',
     clearAll: '清空全部',
-    checkNumber: '已选择{num}项'
+    checkNumber: '已选择{num}项',
+    noFinal: '哎呀，你要找的内容没有找到。',
+    specifyMode: ['全部', '指定']
   },
   ProTimeLimit: {
     foreverText: '长期'

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

@@ -25,11 +25,13 @@ var componentMap = _interopRequireWildcard(require("../../../ProForm/components"
 var _Container = _interopRequireDefault(require("../../../ProForm/components/Container"));
 var _transformNames = _interopRequireDefault(require("../../../ProForm/utils/transformNames"));
 var _useFieldProps = require("../../../ProForm/utils/useFieldProps");
-var _useChanged3 = require("../../../ProForm/utils/useChanged");
+var _useListChanged3 = require("../../../ProForm/utils/useListChanged");
 var _useRules = _interopRequireDefault(require("../../../ProForm/utils/useRules"));
 var _utils = require("../../../ProForm/utils");
 var _locale = _interopRequireDefault(require("../../../locale"));
 var _excluded = ["type", "valueType", "names", "fieldProps", "labelRequired", "editRender", "component", "viewRender", "title", "originTitle", "label", "dataIndex", "formItemProps", "isEditable", "required", "rules", "equalWith", "className"];
+/* eslint-disable prefer-destructuring */
+/* eslint-disable prefer-const */
 var RenderField = function RenderField(_ref) {
   var _type, _type$replace, _fieldProps2, _fieldProps3, _fieldProps4, _names, _formItemChildProps$p, _TargetComponent4, _classNames;
   var value = _ref.text,
@@ -130,7 +132,7 @@ var RenderField = function RenderField(_ref) {
     names: names,
     label: label,
     labelRequired: labelRequired,
-    required: _required,
+    required: !isView && _required,
     rules: isEditing ? _rules : [],
     isSelect: (0, _utils.isSelect)({
       dataSource: (_fieldProps4 = _fieldProps) === null || _fieldProps4 === void 0 ? void 0 : _fieldProps4.dataSource,
@@ -453,19 +455,20 @@ var RenderField = function RenderField(_ref) {
     };
   }();
   // 判断当前字段是否变更
-  var _useChanged = (0, _useChanged3.useChanged)({
+  var _useListChanged = (0, _useListChanged3.useListChanged)({
       name: cellName,
       names: names,
       namesStr: [].concat((0, _toConsumableArray2.default)(baseName), [index, dataIndex]),
+      rowKeyPath: [].concat((0, _toConsumableArray2.default)(baseName), [index, 'rowKey']),
       originalName: originalName,
       originalNames: originalNames,
       originalValues: originalValues,
       form: form,
       equalWith: equalWith
     }),
-    _useChanged2 = (0, _slicedToArray2.default)(_useChanged, 2),
-    changed = _useChanged2[0],
-    originalValue = _useChanged2[1];
+    _useListChanged2 = (0, _slicedToArray2.default)(_useListChanged, 2),
+    changed = _useListChanged2[0],
+    originalValue = _useListChanged2[1];
   var componentProps = (0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({
     form: form,
     name: cellName,

package/lib/ProEditTable/index.js

@@ -109,6 +109,15 @@ var ProEditTable = function ProEditTable(_ref, ref) {
     }
     return key;
   };
+  var IsNew = function IsNew(preArr, record) {
+    var _preArr$find;
+    if (!(preArr === null || preArr === void 0 ? void 0 : preArr.length)) {
+      return false;
+    }
+    return !(preArr === null || preArr === void 0 ? void 0 : (_preArr$find = preArr.find) === null || _preArr$find === void 0 ? void 0 : _preArr$find.call(preArr, function (item) {
+      return getRowKey(item) === getRowKey(record);
+    }));
+  };
   var config = {
     form: form,
     mode: mode,
@@ -145,6 +154,10 @@ var ProEditTable = function ProEditTable(_ref, ref) {
   var _rowClassName = function _rowClassName(record) {
     var isEdit = !virtualKey || editingKeys.includes(record.rowKey);
     var className = isEdit ? 'is-editing' : '';
+    var originalArr = (0, _lodash.get)(originalValues, name);
+    if (!isEdit && IsNew(originalArr, record)) {
+      return "is-new-row ".concat(className);
+    }
     return className;
   };
   // 复选框
@@ -249,11 +262,16 @@ var ProEditTable = function ProEditTable(_ref, ref) {
     var _value$;
     // 初始化默认生成row-key
     if ((value === null || value === void 0 ? void 0 : value.length) && !(value === null || value === void 0 ? void 0 : (_value$ = value[0]) === null || _value$ === void 0 ? void 0 : _value$.rowKey)) {
+      var _originalArr$forEach;
       var nextValues = value === null || value === void 0 ? void 0 : value.map(function (item) {
         return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, item), {}, {
           rowKey: getRowKey(item)
         });
       });
+      var originalArr = (0, _lodash.get)(originalValues, name);
+      originalArr === null || originalArr === void 0 ? void 0 : (_originalArr$forEach = originalArr.forEach) === null || _originalArr$forEach === void 0 ? void 0 : _originalArr$forEach.call(originalArr, function (item) {
+        item.rowKey = getRowKey(item);
+      });
       onChange(nextValues);
       if (virtualKey) {
         form.setFieldValue(virtualRowName, nextValues);

package/lib/ProEditTable/style/index.less

@@ -296,6 +296,11 @@
     }
   }
 
+  .is-new-row, .is-new-row.@{ant-prefix}-table-row:hover {
+    td, .@{ant-prefix}-table-cell-row-hover {
+      background: var(--ant-primary-2) !important;
+    }
+  }
 }
 
 .pro-edit-table-header {