@zat-design/sisyphus-react 3.6.10 → 3.6.11

package/es/ProEditTable/utils/index.js

@@ -13,28 +13,33 @@ var _excluded = ["type", "label", "show", "needConfirm", "onHandle", "onClick"],
   _excluded2 = ["title", "icon"];
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
-import { cloneDeep, isArray, isBoolean, isEqual } from 'lodash';
+import { cloneDeep, cloneDeepWith, isArray, isBoolean, isEqual } from 'lodash';
 import classnames from 'classnames';
 import { ReactSVG } from 'react-svg';
 import { tools } from '@zat-design/utils';
 import { actions, defaultBtnNameMap, defaultSingleActionKeys, defaultMultipleActionKeys, defaultEditingActionKeys } from './config';
-import { customValidate, getNamePath, splitNames, handleScrollToError } from './tools';
+import { customValidate, getNamePath, splitNames, handleScrollToError, cloneDeepFilterNode } from './tools';
 import ProTooltip from '../../ProTooltip';
 import { RenderField, ActionButton } from '../components';
 import tipSvg from '../../assets/tip.svg';
 import locale from '../../locale';
 // 渲染操作栏
 var getActionColumn = function getActionColumn(config) {
-  var disabled = config.disabled,
-    name = config.name,
-    form = config.form,
-    virtualKey = config.virtualKey,
-    validateKeys = config.validateKeys,
-    actionWidth = config.actionWidth,
-    actionProps = config.actionProps,
-    page = config.page,
-    rowDisabled = config.rowDisabled,
-    actionDirection = config.actionDirection;
+  var _cloneDeepWith = cloneDeepWith(config, function (value) {
+      if ( /*#__PURE__*/React.isValidElement(value)) {
+        return value;
+      }
+    }),
+    disabled = _cloneDeepWith.disabled,
+    name = _cloneDeepWith.name,
+    form = _cloneDeepWith.form,
+    virtualKey = _cloneDeepWith.virtualKey,
+    validateKeys = _cloneDeepWith.validateKeys,
+    actionWidth = _cloneDeepWith.actionWidth,
+    actionProps = _cloneDeepWith.actionProps,
+    page = _cloneDeepWith.page,
+    rowDisabled = _cloneDeepWith.rowDisabled,
+    actionDirection = _cloneDeepWith.actionDirection;
   var pageNum = tools.calc(page.pageNum, '-', 1);
   var firstIndex = tools.calc(pageNum, '*', page.pageSize);
   // actionProps配置为false 默认不插入
@@ -195,7 +200,8 @@ export var transformColumns = function transformColumns() {
     setState = config.setState,
     page = config.page;
   var isCell = mode === 'cell';
-  var _columns = _toConsumableArray(columns);
+  var _columns = cloneDeepFilterNode(columns);
+  // 你的函数代码
   var _cacheMap = _objectSpread({}, cacheMap.current);
   var pageNum = tools.calc(page.pageNum, '-', 1);
   var firstIndex = tools.calc(pageNum, '*', page.pageSize);

package/es/ProEditTable/utils/tools.d.ts

@@ -29,3 +29,9 @@ export declare const getDisabled: ({ globalControl, formDisabled, column, tabled
 /** 表格自动滚动到报错位置
  */
 export declare const handleScrollToError: () => void;
+/**
+ * 深copy一个对象，并过滤掉其中的React节点
+ * @param value 需要深拷贝的对象
+ * @returns 深拷贝后的对象，其中的React节点会被保留
+ */
+export declare function cloneDeepFilterNode(value: any): any;

package/es/ProEditTable/utils/tools.js

@@ -1,5 +1,6 @@
 import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
-import { cloneDeep, isString, isObject, isEqual, transform, isFunction, isBoolean } from 'lodash';
+import React from 'react';
+import { cloneDeep, cloneDeepWith, isString, isObject, isEqual, transform, isFunction, isBoolean } from 'lodash';
 export var getRandom = function getRandom() {
   return Math.random().toString(36).slice(-6);
 };
@@ -182,4 +183,16 @@ export var handleScrollToError = function handleScrollToError() {
       }
     }
   }, 0);
-};
+};
+/**
+ * 深copy一个对象，并过滤掉其中的React节点
+ * @param value 需要深拷贝的对象
+ * @returns 深拷贝后的对象，其中的React节点会被保留
+ */
+export function cloneDeepFilterNode(value) {
+  return cloneDeepWith(value, function (val) {
+    if ( /*#__PURE__*/React.isValidElement(val)) {
+      return val;
+    }
+  });
+}

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

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

package/es/ProForm/components/render/Changed.d.ts

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

package/es/ProForm/components/render/Changed.js

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

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

@@ -1,7 +1,5 @@
 import "antd/es/col/style";
 import _Col from "antd/es/col";
-import "antd/es/tooltip/style";
-import _Tooltip from "antd/es/tooltip";
 import "antd/es/space/style";
 import _Space from "antd/es/space";
 import _regeneratorRuntime from "@babel/runtime/helpers/esm/regeneratorRuntime";
@@ -13,7 +11,6 @@ import "antd/es/form/style";
 import _Form from "antd/es/form";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 var _excluded = ["labelWidth", "hiddenNames", "trim", "upperCase", "className", "rules", "required", "labelRequired", "tooltip"];
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
@@ -28,10 +25,10 @@ import { isTrim, isUpperCase, findOptionByValue, parseNamePath } from '../../uti
 import { useProConfig } from '../../../ProConfigProvider';
 import transformNames from '../../utils/transformNames';
 import valueTypeMap from '../../utils/valueType';
-import { useChanged } from '../../utils/useChanged';
 import tipSvg from '../../../assets/tip.svg';
 import useRules from '../../utils/useRules';
 import ConfirmWrapper from './ConfirmWrapper';
+import Changed from './Changed';
 // 这个组件只管渲染, 参数的整理在外部处理
 var Render = function Render(props) {
   var _ref2, _ref3, _ref4, _ref5, _otherProps$names2;
@@ -101,18 +98,6 @@ var Render = function Render(props) {
       return Array.isArray(name) ? name.join('_') : name;
     }).join('-');
   }, [otherProps === null || otherProps === void 0 ? void 0 : otherProps.names]);
-  // 判断当前字段是否变更
-  var _useChanged = useChanged({
-      name: formItemProps.name,
-      names: otherProps.names,
-      namesStr: namesStr,
-      originalValues: originalValues,
-      form: form,
-      equalWith: equalWith
-    }),
-    _useChanged2 = _slicedToArray(_useChanged, 2),
-    changed = _useChanged2[0],
-    originalValue = _useChanged2[1];
   var internalRule = useRules({
     names: otherProps.names,
     label: otherFormItemProps.label,
@@ -184,7 +169,7 @@ var Render = function Render(props) {
   var lastComponentProps = _objectSpread(_objectSpread(_objectSpread({}, componentProps), _fieldProps), {}, {
     disabled: lastDisabled
   });
-  var _className = classNames(_defineProperty(_defineProperty(_defineProperty({}, className, className), 'pro-form-item-changed', changed), 'pro-form-item-width-auto', ['Switch'].includes(type)));
+  var _className = classNames(_defineProperty(_defineProperty({}, className, className), 'pro-form-item-width-auto', ['Switch'].includes(type)));
   if (formItemProps.hidden === true || _show === false) {
     // 为了监听shouldUpdate  必须存在一个FormItem, 空Input解决 【[antd: Form.Item] `name` is only used for validate React element】
     return _jsx(_Form.Item, {
@@ -442,6 +427,20 @@ var Render = function Render(props) {
         span: 24 // 默认占一行
       });
     }
+    if (originalValues) {
+      child = _jsx(Changed, {
+        name: formItemProps.name,
+        names: otherProps.names,
+        namesStr: namesStr,
+        originalValues: originalValues,
+        form: form,
+        equalWith: equalWith,
+        originalDiffTip: originalDiffTip,
+        type: type,
+        onChange: handleChange,
+        children: child
+      });
+    }
     var orgFormItem = _jsx(_Form.Item, _objectSpread(_objectSpread({}, omit(_otherFormItemProps, filterFormItemKey)), {}, {
       // @ts-ignore
       _internalItemRender: internalItemRender,
@@ -468,26 +467,7 @@ var Render = function Render(props) {
         })
       });
     }
-    // 不渲染tooltip
-    if (!originalDiffTip || ['FormList', 'ProEditTable'].includes(type)) {
-      return formItem;
-    }
-    var title = _jsxs(_Space, {
-      children: ["\u521D\u59CB\u503C\uFF1A", /*#__PURE__*/React.cloneElement(child, _objectSpread(_objectSpread({}, child), {}, {
-        isView: true,
-        value: originalValue,
-        checked: type === 'Switch' ? originalValue : undefined
-      }))]
-    });
-    return _jsx(_Tooltip, {
-      title: title,
-      open: changed ? undefined : false,
-      // open={true}
-      getPopupContainer: function getPopupContainer(target) {
-        return target.parentElement;
-      },
-      children: formItem
-    });
+    return formItem;
   };
   var FormItem = _jsxs(_Fragment, {
     children: [renderItem(), (otherProps === null || otherProps === void 0 ? void 0 : (_otherProps$names2 = otherProps.names) === null || _otherProps$names2 === void 0 ? void 0 : _otherProps$names2.length) ? otherProps.names.map(function (name) {

package/es/ProForm/style/index.less

@@ -116,58 +116,6 @@
       }
     }
 
-    // 比较原始值场景下  不同时的样式
-    &.pro-form-item-changed {
-      span.@{ant-prefix}-input-affix-wrapper,
-      .@{ant-prefix}-select .@{ant-prefix}-select-selector,
-      .@{ant-prefix}-picker,
-      .@{ant-prefix}-input-number {
-        background: @zaui-contract-bg !important;
-
-        input {
-          background: transparent;
-        }
-        .@{ant-prefix}-select-selection-placeholder {
-          z-index: 9;
-        }
-      }
-
-      .@{ant-prefix}-form-item-control:has(.@{ant-prefix}-switch-handle),
-      .@{ant-prefix}-form-item-control:has(.@{ant-prefix}-checkbox-wrapper-in-form-item) {
-        background: @zaui-contract-bg;
-        border-radius: 4px;
-      }
-
-      // 地址组件
-      .@{ant-prefix}-form-item-control-input-content {
-        // 查看模式
-        & > span {
-          border-radius: 4px;
-          padding: 5px 8px;
-          background: @zaui-contract-bg;
-        }
-
-        & > .pro-address {
-          .@{ant-prefix}-select-selector,
-          .@{ant-prefix}-input-affix-wrapper,
-          .@{ant-prefix}-input-disabled {
-            background: @zaui-contract-bg;
-          }
-        }
-        & > .@{ant-prefix}-input-group {
-          .forever-checkbox {
-            background: @zaui-contract-bg;
-          }
-        }
-      }
-
-      .pro-form-view-container {
-        padding: 4px 8px;
-        background: @zaui-contract-bg;
-        border-radius: 4px;
-      }
-    }
-
     .@{ant-prefix}-row {
       width: 100%;
     }
@@ -373,4 +321,56 @@
       }
     }
   }
+
+  // 比较原始值场景下  不同时的样式
+  .pro-form-item-changed {
+    span.@{ant-prefix}-input-affix-wrapper,
+    .@{ant-prefix}-select .@{ant-prefix}-select-selector,
+    .@{ant-prefix}-picker,
+    .@{ant-prefix}-input-number {
+      background: @zaui-contract-bg !important;
+
+      input {
+        background: transparent !important;
+      }
+      .@{ant-prefix}-select-selection-placeholder {
+        z-index: 9;
+      }
+    }
+
+    .@{ant-prefix}-form-item-control:has(.@{ant-prefix}-switch-handle),
+    .@{ant-prefix}-form-item-control:has(.@{ant-prefix}-checkbox-wrapper-in-form-item) {
+      background: @zaui-contract-bg;
+      border-radius: 4px;
+    }
+
+    // 地址组件
+    .@{ant-prefix}-form-item-control-input-content {
+      // 查看模式
+      & > span {
+        border-radius: 4px;
+        padding: 5px 8px;
+        background: @zaui-contract-bg;
+      }
+
+      & > .pro-address {
+        .@{ant-prefix}-select-selector,
+        .@{ant-prefix}-input-affix-wrapper,
+        .@{ant-prefix}-input-disabled {
+          background: @zaui-contract-bg;
+        }
+      }
+      & > .@{ant-prefix}-input-group {
+        .forever-checkbox {
+          background: @zaui-contract-bg;
+        }
+      }
+    }
+
+    .pro-form-view-container {
+      padding: 4px 8px;
+      background: @zaui-contract-bg;
+      border-radius: 4px;
+    }
+  }
 }

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

@@ -3,7 +3,6 @@ interface Params {
     originalValue: any;
     value: any;
     form: FormInstance;
-    name?: string | any[];
     equalWith?: (originalValue: any, currentValue: any) => boolean;
 }
 export declare const diffOriginal: (params: Params) => boolean;

package/es/ProForm/utils/diffOriginal.js

@@ -1,31 +1,9 @@
-import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
-import { isEqual, isFunction, isString } from 'lodash';
+import { isEqual, isFunction } from 'lodash';
 var nullValue = [null, undefined, '']; // 输入框空值时可能存在的三种值 视为相等
-/** 将解构后的name值，反向转回names,例如 formData {a:1, b:2} names ['a', 'b'] 返回 [1,2] */
-var extractValues = function extractValues(form, pathString) {
-  var _pathString;
-  var result = [];
-  var PrefixesName = isString(pathString) ? [] : pathString.slice(0, -1);
-  if (isString(pathString)) {
-    pathString.split('-').forEach(function (item) {
-      result.push(form.getFieldValue([].concat(_toConsumableArray(PrefixesName), [item])));
-    });
-    return result;
-  }
-  (_pathString = pathString[pathString.length - 1]) === null || _pathString === void 0 ? void 0 : _pathString.split('-').forEach(function (item) {
-    result.push(form.getFieldValue([].concat(_toConsumableArray(PrefixesName), [item])));
-  });
-  return result;
-};
 export var diffOriginal = function diffOriginal(params) {
-  var _name$join;
   var originalValue = params.originalValue,
-    _value = params.value,
-    equalWith = params.equalWith,
-    form = params.form,
-    name = params.name;
-  var isNames = Array.isArray(name) && ((_name$join = name.join(',')) === null || _name$join === void 0 ? void 0 : _name$join.includes('-')) || (name === null || name === void 0 ? void 0 : name.includes('-'));
-  var value = !isNames ? _value : extractValues(form, name);
+    value = params.value,
+    equalWith = params.equalWith;
   // 支持传入自定义比较事件
   if (isFunction(equalWith)) {
     return !equalWith(originalValue, value);
@@ -40,8 +18,7 @@ export var diffOriginal = function diffOriginal(params) {
     });
   }
   if (!nullValue.includes(value) || !nullValue.includes(originalValue)) {
-    var res = !isEqual(value, originalValue);
-    return res;
+    return !isEqual(value, originalValue);
   }
   return false;
 };

package/es/ProForm/utils/useChanged.js

@@ -19,8 +19,7 @@ export var useChanged = function useChanged(_ref) {
     originalValue: originalValue,
     value: value,
     form: form,
-    equalWith: equalWith,
-    name: namesStr || name
+    equalWith: equalWith
   });
   return [changed, originalValue];
 };

package/es/ProForm/utils/useListChanged.js

@@ -1,6 +1,6 @@
 import "antd/es/form/style";
 import _Form from "antd/es/form";
-import { get, isString } from 'lodash';
+import { get } from 'lodash';
 import { diffOriginal } from './diffOriginal';
 var toNamePath = function toNamePath(name) {
   if (Array.isArray(name)) {
@@ -86,8 +86,8 @@ export var useListChanged = function useListChanged(params) {
     value: value,
     originalValue: originalValue,
     form: form,
-    equalWith: equalWith,
-    name: isString(namesStr) ? namesStr : originalName || name
+    equalWith: equalWith
+    // name: isString(namesStr) ? namesStr : originalName || name,
   });
   return [changed, originalValue];
 };

package/es/ProTable/components/RcTable/components/DraggableTable/components/DndWrapper/index.d.ts

@@ -5,12 +5,14 @@ interface RowProps extends React.HTMLAttributes<HTMLTableRowElement> {
     disabled?: boolean;
 }
 export declare const Row: FC<RowProps>;
-declare const DndWrapper: ({ draggable, value, onChange, disabled, children, rowKey }: {
+declare const DndWrapper: ({ draggable, value, onChange, disabled, children, rowKey, onDragStartGuard, onDragEndGuard, }: {
     draggable: any;
     value: any;
     onChange: any;
     disabled: any;
     children: any;
     rowKey: any;
+    onDragStartGuard: any;
+    onDragEndGuard: any;
 }) => any;
 export default DndWrapper;