@zat-design/sisyphus-react 3.8.3-beta.9 → 3.9.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.vscode/extensions.json +5 -0
- package/dist/index.esm.css +22 -3
- package/dist/less.esm.css +21 -2
- package/es/ProEditTable/components/RenderField/ListChangedWrapper.js +66 -17
- package/es/ProEditTable/components/RenderField/index.js +6 -9
- package/es/ProEditTable/index.js +18 -8
- package/es/ProEditTable/propsType.d.ts +3 -5
- package/es/ProEditTable/style/index.less +0 -1
- package/es/ProForm/components/base/InputNumber/index.js +1 -1
- package/es/ProForm/components/combination/Group/index.js +3 -4
- package/es/ProForm/components/combination/ProCascader/index.js +1 -1
- package/es/ProForm/components/render/ChangedWrapper.js +17 -10
- package/es/ProForm/propsType.d.ts +2 -0
- package/es/ProForm/style/index.less +28 -9
- package/es/ProTable/components/FormatColumn/index.js +16 -10
- package/es/ProTable/components/RenderColumn/index.js +20 -6
- package/es/ProTable/propsType.d.ts +4 -1
- package/es/style/theme/antd.less +1 -1
- package/es/utils/index.d.ts +1 -0
- package/es/utils/index.js +26 -0
- package/lib/ProEditTable/components/RenderField/ListChangedWrapper.js +66 -19
- package/lib/ProEditTable/components/RenderField/index.js +6 -9
- package/lib/ProEditTable/index.js +18 -8
- package/lib/ProEditTable/propsType.d.ts +3 -5
- package/lib/ProEditTable/style/index.less +0 -1
- package/lib/ProForm/components/base/InputNumber/index.js +1 -1
- package/lib/ProForm/components/combination/Group/index.js +3 -4
- package/lib/ProForm/components/combination/ProCascader/index.js +1 -1
- package/lib/ProForm/components/render/ChangedWrapper.js +17 -10
- package/lib/ProForm/propsType.d.ts +2 -0
- package/lib/ProForm/style/index.less +28 -9
- package/lib/ProTable/components/FormatColumn/index.js +16 -10
- package/lib/ProTable/components/RenderColumn/index.js +18 -6
- package/lib/ProTable/propsType.d.ts +4 -1
- package/lib/style/theme/antd.less +1 -1
- package/lib/utils/index.d.ts +1 -0
- package/lib/utils/index.js +28 -1
- package/package.json +1 -1
@@ -73,7 +73,7 @@ export var formatColumn = function formatColumn(_ref2) {
|
|
73
73
|
_column$toolTipProps = column.toolTipProps,
|
74
74
|
toolTipProps = _column$toolTipProps === void 0 ? {} : _column$toolTipProps,
|
75
75
|
minWidth = column.minWidth,
|
76
|
-
|
76
|
+
onDiff = column.onDiff;
|
77
77
|
// 仅在 {x: 'max-content', y: 300 } 且 column无指定 width minWidth 情况下 才开启 minWidth的自动计算
|
78
78
|
var isMaxContentOverFlow = isObject(scroll) ? (scroll === null || scroll === void 0 ? void 0 : scroll.x) === 'max-content' && Reflect.ownKeys(scroll).includes('y') : false;
|
79
79
|
calcMinWidth({
|
@@ -110,7 +110,7 @@ export var formatColumn = function formatColumn(_ref2) {
|
|
110
110
|
}
|
111
111
|
};
|
112
112
|
if (column === null || column === void 0 ? void 0 : column.render) {
|
113
|
-
if (!originalObj && Object.keys(originalObj !== null && originalObj !== void 0 ? originalObj : {}).length === 0 && !
|
113
|
+
if (!originalObj && Object.keys(originalObj !== null && originalObj !== void 0 ? originalObj : {}).length === 0 && !onDiff) {
|
114
114
|
return;
|
115
115
|
}
|
116
116
|
var originalRender = column.render; // 保存原始的 render 方法
|
@@ -118,20 +118,27 @@ export var formatColumn = function formatColumn(_ref2) {
|
|
118
118
|
column.render = function (value, record, index) {
|
119
119
|
var _originalObj$record$r;
|
120
120
|
var isFn = isFunction(originalRender);
|
121
|
-
var _value = isFn ? originalRender === null || originalRender === void 0 ? void 0 : originalRender(value, record !== null && record !== void 0 ? record : {}, index) :
|
121
|
+
var _value = isFn ? originalRender === null || originalRender === void 0 ? void 0 : originalRender(value, record !== null && record !== void 0 ? record : {}, index) : null;
|
122
122
|
var originalValue = getOriginalValue(value, record !== null && record !== void 0 ? record : {}, originalObj, rowKey, dataIndex);
|
123
|
-
var originalRenderValue = isFn ? originalRender === null || originalRender === void 0 ? void 0 : originalRender(originalValue, (_originalObj$record$r = originalObj === null || originalObj === void 0 ? void 0 : originalObj[record === null || record === void 0 ? void 0 : record[rowKey]]) !== null && _originalObj$record$r !== void 0 ? _originalObj$record$r : {}, index) :
|
123
|
+
var originalRenderValue = isFn ? originalRender === null || originalRender === void 0 ? void 0 : originalRender(originalValue, (_originalObj$record$r = originalObj === null || originalObj === void 0 ? void 0 : originalObj[record === null || record === void 0 ? void 0 : record[rowKey]]) !== null && _originalObj$record$r !== void 0 ? _originalObj$record$r : {}, index) : null;
|
124
124
|
var isInNewRowFlag = isInNewRow(record);
|
125
|
+
var extraDiffFlag = false;
|
125
126
|
// 把比对结果告诉我
|
126
|
-
if (
|
127
|
-
var isDiff =
|
127
|
+
if (onDiff) {
|
128
|
+
var isDiff = onDiff({
|
129
|
+
value: record,
|
130
|
+
originValue: originalObj === null || originalObj === void 0 ? void 0 : originalObj[record === null || record === void 0 ? void 0 : record[rowKey]]
|
131
|
+
});
|
128
132
|
if (!isDiff) {
|
129
|
-
originalValue =
|
133
|
+
originalValue = null;
|
134
|
+
} else {
|
135
|
+
originalValue = true;
|
136
|
+
extraDiffFlag = true;
|
130
137
|
}
|
131
138
|
}
|
132
139
|
return _jsx(RenderColumn, {
|
133
140
|
valueType: valueType,
|
134
|
-
originalValue: originalValue
|
141
|
+
originalValue: !originalValue && originalValue !== 0 ? null : extraDiffFlag ? originalRenderValue !== null && originalRenderValue !== void 0 ? originalRenderValue : originalValue : originalRenderValue,
|
135
142
|
ellipsis: ellipsis,
|
136
143
|
width: width,
|
137
144
|
value: _value,
|
@@ -390,7 +397,6 @@ export var formatColumn = function formatColumn(_ref2) {
|
|
390
397
|
});
|
391
398
|
}
|
392
399
|
var className = classnames({
|
393
|
-
'varied-cell': originalValue !== undefined,
|
394
400
|
'empty-cell': isEmpty
|
395
401
|
});
|
396
402
|
var renderValue = _jsx(ProForm.ProCascader, {
|
@@ -416,7 +422,7 @@ export var formatColumn = function formatColumn(_ref2) {
|
|
416
422
|
var isInNewRowFlag = isInNewRow(record);
|
417
423
|
return _jsx(RenderColumn, {
|
418
424
|
valueType: valueType,
|
419
|
-
originalValue:
|
425
|
+
originalValue: originalValue === undefined ? undefined : originalRenderValue,
|
420
426
|
ellipsis: ellipsis !== null && ellipsis !== void 0 ? ellipsis : true,
|
421
427
|
width: width,
|
422
428
|
node: renderNode,
|
@@ -1,3 +1,5 @@
|
|
1
|
+
import "antd/es/space/style";
|
2
|
+
import _Space from "antd/es/space";
|
1
3
|
import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
|
2
4
|
import "antd/es/tooltip/style";
|
3
5
|
import _Tooltip from "antd/es/tooltip";
|
@@ -32,7 +34,7 @@ var RenderColumn = function RenderColumn(props) {
|
|
32
34
|
_useSetState2 = _slicedToArray(_useSetState, 2),
|
33
35
|
tooltip = _useSetState2[0].tooltip,
|
34
36
|
setState = _useSetState2[1];
|
35
|
-
if (originalValue
|
37
|
+
if ((originalValue || originalValue === 0) && !isInNewRowFlag) {
|
36
38
|
var renderNode = value ? node : '-';
|
37
39
|
if (ellipsis || originalDiffTip) {
|
38
40
|
if (ellipsis) {
|
@@ -53,11 +55,23 @@ var RenderColumn = function RenderColumn(props) {
|
|
53
55
|
width: width,
|
54
56
|
minWidth: minWidth
|
55
57
|
},
|
56
|
-
|
57
|
-
|
58
|
-
|
59
|
-
|
60
|
-
|
58
|
+
overlayClassName: "original-value-tootip",
|
59
|
+
title: _jsx(_Space, {
|
60
|
+
direction: "vertical",
|
61
|
+
className: "changed-tooltip",
|
62
|
+
children: originalDiffTip ? _jsxs(_Fragment, {
|
63
|
+
children: [_jsxs(_Space, {
|
64
|
+
align: "start",
|
65
|
+
className: "original-value-container",
|
66
|
+
children: ["\u521D\u59CB\u503C\uFF1A", originalValue]
|
67
|
+
}), _jsx(_Space, {
|
68
|
+
className: "current-value-container",
|
69
|
+
children: ellipsis ? _jsxs("span", {
|
70
|
+
children: ["\u5F53\u524D\u503C\uFF1A", currentValue]
|
71
|
+
}) : null
|
72
|
+
})]
|
73
|
+
}) : node
|
74
|
+
}),
|
61
75
|
getPopupContainer: function getPopupContainer(triggerNode) {
|
62
76
|
return triggerNode.parentNode;
|
63
77
|
}
|
@@ -41,7 +41,10 @@ export interface ProTableColumn extends Omit<ColumnType<any>, 'dataIndex'> {
|
|
41
41
|
toolTipProps?: TooltipProps & React.RefAttributes<unknown>;
|
42
42
|
transform?: (value: any, record?: any) => string[];
|
43
43
|
show?: boolean | (() => boolean);
|
44
|
-
|
44
|
+
onDiff?: ({ value, originValue }: {
|
45
|
+
value: any;
|
46
|
+
originValue: any;
|
47
|
+
}) => boolean;
|
45
48
|
}
|
46
49
|
export interface CreateTreeFromArrayOptions {
|
47
50
|
itemKey?: string;
|
package/es/style/theme/antd.less
CHANGED
package/es/utils/index.d.ts
CHANGED
package/es/utils/index.js
CHANGED
@@ -1,3 +1,5 @@
|
|
1
|
+
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
2
|
+
import { useEffect, useState } from 'react';
|
1
3
|
var EMPTY_VALUE = [undefined, null, ''];
|
2
4
|
/** 判断一个值是否是空值 */
|
3
5
|
export var isEmpty = function isEmpty(value) {
|
@@ -10,4 +12,28 @@ export var isEmpty = function isEmpty(value) {
|
|
10
12
|
});
|
11
13
|
}
|
12
14
|
return false;
|
15
|
+
};
|
16
|
+
export var useFocus = function useFocus(element) {
|
17
|
+
var _useState = useState(false),
|
18
|
+
_useState2 = _slicedToArray(_useState, 2),
|
19
|
+
focus = _useState2[0],
|
20
|
+
setFocus = _useState2[1];
|
21
|
+
useEffect(function () {
|
22
|
+
if (!element) return;
|
23
|
+
element.addEventListener('focus', function () {
|
24
|
+
setFocus(true);
|
25
|
+
}, true);
|
26
|
+
element.addEventListener('blur', function () {
|
27
|
+
setFocus(false);
|
28
|
+
}, true);
|
29
|
+
return function () {
|
30
|
+
element.removeEventListener('focus', function () {
|
31
|
+
setFocus(true);
|
32
|
+
}, true);
|
33
|
+
element.removeEventListener('blur', function () {
|
34
|
+
setFocus(false);
|
35
|
+
}, true);
|
36
|
+
};
|
37
|
+
}, [element]);
|
38
|
+
return focus;
|
13
39
|
};
|
@@ -17,7 +17,7 @@ var _lodash = require("lodash");
|
|
17
17
|
var _diffOriginal = require("../../../ProForm/utils/diffOriginal");
|
18
18
|
var _ProConfigProvider = require("../../../ProConfigProvider");
|
19
19
|
var _utils = require("../../../utils");
|
20
|
-
var _excluded = ["name", "names", "namesStr", "originalName", "originalNames", "originalValues", "form", "equalWith", "rowKeyPath", "children", "type", "normalize", "getValueProps", "valuePropName", "viewRender"];
|
20
|
+
var _excluded = ["name", "names", "namesStr", "originalName", "originalNames", "originalValues", "form", "equalWith", "rowKeyPath", "children", "type", "normalize", "getValueProps", "valuePropName", "viewRender", "diffConfig", "index"];
|
21
21
|
var toNamePath = function toNamePath(name) {
|
22
22
|
if (Array.isArray(name)) {
|
23
23
|
return name;
|
@@ -39,6 +39,7 @@ var getOriginalValue = function getOriginalValue(_ref) {
|
|
39
39
|
if (!originalValues) {
|
40
40
|
return undefined;
|
41
41
|
}
|
42
|
+
var originalValueRow;
|
42
43
|
if (rowKeyPath) {
|
43
44
|
var rowValueNamePath = namePath.slice(0, rowKeyPath.length - 1); // 表单中变动值所在行
|
44
45
|
var rowKeyName = rowKeyPath[rowKeyPath.length - 1]; // rowKey在行内的name
|
@@ -47,7 +48,7 @@ var getOriginalValue = function getOriginalValue(_ref) {
|
|
47
48
|
var keyValue = rowValue[rowKeyName]; // 获取表单中rowKey值
|
48
49
|
if (!keyValue) return undefined;
|
49
50
|
var originalValueList = (0, _lodash.get)(originalValues, originalName.slice(0, rowKeyPath.length - 2));
|
50
|
-
|
51
|
+
originalValueRow = originalValueList === null || originalValueList === void 0 ? void 0 : originalValueList.find(function (item) {
|
51
52
|
return item[rowKeyPath[rowKeyPath.length - 1]] === keyValue;
|
52
53
|
});
|
53
54
|
var originalValue;
|
@@ -63,14 +64,21 @@ var getOriginalValue = function getOriginalValue(_ref) {
|
|
63
64
|
} else {
|
64
65
|
originalValue = (0, _lodash.get)(originalValueRow, originalName.slice(rowKeyPath.length - 1));
|
65
66
|
}
|
66
|
-
return
|
67
|
+
return {
|
68
|
+
originalValue: originalValue,
|
69
|
+
originalValueRow: originalValueRow
|
70
|
+
};
|
67
71
|
}
|
68
72
|
// 这个方法是给editTable专用的 暂时不存在不传rowKey的情况
|
69
|
-
return
|
70
|
-
|
71
|
-
|
73
|
+
return {
|
74
|
+
originalValue: (originalNames === null || originalNames === void 0 ? void 0 : originalNames.length) ? originalNames.map(function (originalName) {
|
75
|
+
return (0, _lodash.get)(originalValues, originalName);
|
76
|
+
}) : (0, _lodash.get)(originalValues, originalName),
|
77
|
+
originalValueRow: originalValueRow
|
78
|
+
};
|
72
79
|
};
|
73
80
|
var ListChangedWrapper = function ListChangedWrapper(props) {
|
81
|
+
var _diffConfig$toolTip, _children$props, _children$props2, _children$props3;
|
74
82
|
var name = props.name,
|
75
83
|
names = props.names,
|
76
84
|
namesStr = props.namesStr,
|
@@ -89,21 +97,29 @@ var ListChangedWrapper = function ListChangedWrapper(props) {
|
|
89
97
|
_props$valuePropName = props.valuePropName,
|
90
98
|
valuePropName = _props$valuePropName === void 0 ? 'value' : _props$valuePropName,
|
91
99
|
viewRender = props.viewRender,
|
100
|
+
diffConfig = props.diffConfig,
|
101
|
+
index = props.index,
|
92
102
|
rest = (0, _objectWithoutProperties2.default)(props, _excluded);
|
93
103
|
var _ref2 = (0, _ProConfigProvider.useProConfig)('ProEditTable') || {},
|
94
104
|
isDiffAll = _ref2.isDiffAll;
|
105
|
+
var _ref3 = diffConfig || {},
|
106
|
+
_ref3$scrollFollowPar = _ref3.scrollFollowParent,
|
107
|
+
scrollFollowParent = _ref3$scrollFollowPar === void 0 ? true : _ref3$scrollFollowPar;
|
108
|
+
var contentRef = (0, _react.useRef)(null);
|
95
109
|
var namePath = toNamePath(namesStr || name);
|
96
110
|
var originalNamePath = toNamePath(originalName);
|
97
111
|
var originalNamePaths = originalNames && toNamePaths(originalNames);
|
112
|
+
var toolTip = (_diffConfig$toolTip = diffConfig === null || diffConfig === void 0 ? void 0 : diffConfig.toolTip) !== null && _diffConfig$toolTip !== void 0 ? _diffConfig$toolTip : true;
|
98
113
|
var isWatch = Boolean(originalValues);
|
99
|
-
var
|
114
|
+
var originalDTO = getOriginalValue({
|
100
115
|
namePath: namePath,
|
101
116
|
originalName: originalNamePath,
|
102
117
|
originalNames: originalNamePaths,
|
103
118
|
originalValues: originalValues,
|
104
119
|
rowKeyPath: rowKeyPath,
|
105
120
|
form: form
|
106
|
-
})
|
121
|
+
});
|
122
|
+
var originalValue = isWatch ? originalDTO === null || originalDTO === void 0 ? void 0 : originalDTO.originalValue : undefined;
|
107
123
|
var noChange = !equalWith && (!originalValues || isDiffAll ? false : (0, _utils.isEmpty)(originalValue));
|
108
124
|
var diffType = (0, _react.useMemo)(function () {
|
109
125
|
if (!isWatch || noChange) return 'same';
|
@@ -121,12 +137,16 @@ var ListChangedWrapper = function ListChangedWrapper(props) {
|
|
121
137
|
var tipContent = (0, _react.useMemo)(function () {
|
122
138
|
var _getValueProps;
|
123
139
|
if (!isWatch || noChange) return undefined;
|
124
|
-
var orgValue = getValueProps ? (_getValueProps = getValueProps(originalValue)) === null || _getValueProps === void 0 ? void 0 : _getValueProps[valuePropName] : originalValue;
|
140
|
+
var orgValue = getValueProps && !names ? (_getValueProps = getValueProps(originalValue)) === null || _getValueProps === void 0 ? void 0 : _getValueProps[valuePropName] : originalValue;
|
125
141
|
// 兼容viewRender函数和Element场景
|
126
142
|
var _children = children;
|
127
143
|
if (viewRender) {
|
128
144
|
if (! /*#__PURE__*/_react.default.isValidElement(viewRender)) {
|
129
|
-
return viewRender(orgValue)
|
145
|
+
return viewRender(orgValue, (originalDTO === null || originalDTO === void 0 ? void 0 : originalDTO.originalValueRow) || {}, {
|
146
|
+
form: form,
|
147
|
+
name: name,
|
148
|
+
index: index
|
149
|
+
});
|
130
150
|
}
|
131
151
|
_children = viewRender;
|
132
152
|
}
|
@@ -138,24 +158,51 @@ var ListChangedWrapper = function ListChangedWrapper(props) {
|
|
138
158
|
if (!isWatch || noChange) {
|
139
159
|
return /*#__PURE__*/_react.default.isValidElement(children) && /*#__PURE__*/_react.default.cloneElement(children, (0, _objectSpread3.default)((0, _objectSpread3.default)({}, children.props), rest));
|
140
160
|
}
|
161
|
+
// eslint-disable-next-line react-hooks/rules-of-hooks
|
162
|
+
// const isFocus = useFocus(contentRef.current);
|
163
|
+
var tipOpenCalc = function tipOpenCalc() {
|
164
|
+
if (!toolTip) return false;
|
165
|
+
// 传入undefined 鼠标移入显示移出隐藏
|
166
|
+
return isChanged ? undefined : false;
|
167
|
+
};
|
168
|
+
// @ts-ignore
|
169
|
+
var _showEllipse = ((_children$props = children.props) === null || _children$props === void 0 ? void 0 : _children$props.showEllipse) || ((_children$props2 = children.props) === null || _children$props2 === void 0 ? void 0 : _children$props2.tooltip);
|
141
170
|
var diffClassName = (0, _classnames.default)({
|
142
171
|
'pro-form-item-changed': isChanged,
|
143
172
|
'pro-form-item-add': isAdd
|
144
173
|
});
|
145
|
-
|
146
|
-
|
147
|
-
|
148
|
-
|
149
|
-
|
150
|
-
getPopupContainer: function getPopupContainer(target) {
|
151
|
-
return target.parentElement;
|
174
|
+
var open = tipOpenCalc();
|
175
|
+
return (0, _jsxRuntime.jsx)(_antd.Tooltip, {
|
176
|
+
open: open,
|
177
|
+
getPopupContainer: function getPopupContainer(trigger) {
|
178
|
+
return scrollFollowParent ? trigger.parentElement : document.body;
|
152
179
|
},
|
180
|
+
overlayClassName: "original-value-tootip",
|
181
|
+
placement: "topLeft",
|
182
|
+
autoAdjustOverflow: false,
|
153
183
|
title: (0, _jsxRuntime.jsxs)(_antd.Space, {
|
154
|
-
|
184
|
+
direction: "vertical",
|
185
|
+
className: "changed-tooltip",
|
186
|
+
children: [(0, _jsxRuntime.jsxs)(_antd.Space, {
|
187
|
+
align: "start",
|
188
|
+
className: "original-value-container",
|
189
|
+
children: ["\u521D\u59CB\u503C\uFF1A", tipContent]
|
190
|
+
}), _showEllipse && (0, _jsxRuntime.jsxs)(_antd.Space, {
|
191
|
+
className: "current-value-container",
|
192
|
+
children: ["\u5F53\u524D\u503C\uFF1A", /*#__PURE__*/_react.default.isValidElement(children) ? /*#__PURE__*/_react.default.cloneElement(children, (0, _objectSpread3.default)((0, _objectSpread3.default)((0, _objectSpread3.default)({}, children.props), rest), {}, {
|
193
|
+
isView: true,
|
194
|
+
scrollFollowParent: scrollFollowParent
|
195
|
+
})) : undefined]
|
196
|
+
})]
|
155
197
|
}),
|
156
198
|
children: (0, _jsxRuntime.jsx)("div", {
|
157
199
|
className: diffClassName,
|
158
|
-
children: /*#__PURE__*/_react.default.isValidElement(children) ? /*#__PURE__*/_react.default.cloneElement(children, (0, _objectSpread3.default)((0, _objectSpread3.default)({}, children.props), rest)
|
200
|
+
children: /*#__PURE__*/_react.default.isValidElement(children) ? /*#__PURE__*/_react.default.cloneElement(children, (0, _objectSpread3.default)((0, _objectSpread3.default)((0, _objectSpread3.default)({}, children.props), rest), {}, {
|
201
|
+
scrollFollowParent: scrollFollowParent,
|
202
|
+
otherProps: (0, _objectSpread3.default)((0, _objectSpread3.default)({}, (_children$props3 = children.props) === null || _children$props3 === void 0 ? void 0 : _children$props3.otherProps), {}, {
|
203
|
+
isDiffChange: isChanged
|
204
|
+
})
|
205
|
+
})) : undefined
|
159
206
|
})
|
160
207
|
});
|
161
208
|
};
|
@@ -80,7 +80,8 @@ var RenderField = function RenderField(_ref) {
|
|
80
80
|
rowDisabled = config.rowDisabled,
|
81
81
|
_config$validateTrigg = config.validateTrigger,
|
82
82
|
validateTrigger = _config$validateTrigg === void 0 ? ['onChange', 'onBlur', 'onSubmit'] : _config$validateTrigg,
|
83
|
-
otherProps = config.otherProps
|
83
|
+
otherProps = config.otherProps,
|
84
|
+
diffConfig = config.diffConfig;
|
84
85
|
var _fieldProps = fieldProps || formItemProps || {};
|
85
86
|
var _rules = rules || [];
|
86
87
|
var _required = required;
|
@@ -255,19 +256,13 @@ var RenderField = function RenderField(_ref) {
|
|
255
256
|
TargetComponent = _editRender;
|
256
257
|
}
|
257
258
|
}
|
258
|
-
var viewRenderFun = function viewRenderFun(value) {
|
259
|
-
if (/*#__PURE__*/_react.default.isValidElement(viewRender)) {
|
260
|
-
return viewRender;
|
261
|
-
}
|
262
|
-
return viewRender === null || viewRender === void 0 ? void 0 : viewRender(value, record, options);
|
263
|
-
};
|
264
259
|
// 查看模式
|
265
260
|
if (isView) {
|
266
261
|
// 存在viewRender覆盖默认值
|
267
262
|
if (typeof viewRender === 'function') {
|
268
263
|
var _column$dataIndex;
|
269
264
|
currentValue = (column === null || column === void 0 ? void 0 : (_column$dataIndex = column.dataIndex) === null || _column$dataIndex === void 0 ? void 0 : _column$dataIndex.includes('-')) ? value : currentValue;
|
270
|
-
var View =
|
265
|
+
var View = viewRender(currentValue, record || {}, options);
|
271
266
|
TargetComponent = (0, _jsxRuntime.jsx)(_Container.default, {
|
272
267
|
viewEmpty: viewEmpty,
|
273
268
|
children: View
|
@@ -573,7 +568,9 @@ var RenderField = function RenderField(_ref) {
|
|
573
568
|
valuePropName: _formItemProps.valuePropName,
|
574
569
|
normalize: _formItemProps.normalize,
|
575
570
|
getValueProps: _formItemProps.getValueProps,
|
576
|
-
viewRender: viewRender
|
571
|
+
viewRender: viewRender,
|
572
|
+
diffConfig: diffConfig,
|
573
|
+
index: index,
|
577
574
|
children: FieldComponent
|
578
575
|
});
|
579
576
|
}
|
@@ -24,9 +24,9 @@ var _ProForm = _interopRequireDefault(require("../ProForm"));
|
|
24
24
|
var _empty = _interopRequireDefault(require("../assets/empty.png"));
|
25
25
|
var _locale = _interopRequireWildcard(require("../locale"));
|
26
26
|
var _RcTable = require("./components/RcTable");
|
27
|
-
var _excluded = ["value", "onChange", "onDrag", "className", "columns", "type", "mode", "stripe", "draggable", "virtual", "disabled", "insertType", "emptyBtnText", "actionWidth", "actionProps", "toolbarProps", "toolbarSticky", "rowSelection", "onlyOneLineMsg", "deletePoConfirmMsg", "mulDeletePoConfirmMsg", "requiredAlign", "summary", "max", "headerRender", "pagination", "originalValues", "
|
27
|
+
var _excluded = ["value", "onChange", "onDrag", "className", "columns", "type", "mode", "stripe", "draggable", "virtual", "disabled", "insertType", "emptyBtnText", "actionWidth", "actionProps", "toolbarProps", "toolbarSticky", "rowSelection", "onlyOneLineMsg", "deletePoConfirmMsg", "mulDeletePoConfirmMsg", "requiredAlign", "summary", "max", "headerRender", "pagination", "originalValues", "rowKey", "rowDisabled", "rowDraggable", "footerRender", "scroll", "actionDirection", "diffConfig"];
|
28
28
|
var ProEditTable = function ProEditTable(_ref, ref) {
|
29
|
-
var _resetProps$id, _resetProps$id$split, _themeConfig$data2;
|
29
|
+
var _resetProps$id, _resetProps$id$split, _themeConfig$data2, _resetProps$otherProp;
|
30
30
|
var value = _ref.value,
|
31
31
|
onChange = _ref.onChange,
|
32
32
|
onDrag = _ref.onDrag,
|
@@ -54,13 +54,13 @@ var ProEditTable = function ProEditTable(_ref, ref) {
|
|
54
54
|
headerRender = _ref.headerRender,
|
55
55
|
pagination = _ref.pagination,
|
56
56
|
originalValues = _ref.originalValues,
|
57
|
-
originalDiffTip = _ref.originalDiffTip,
|
58
57
|
rowKey = _ref.rowKey,
|
59
58
|
rowDisabled = _ref.rowDisabled,
|
60
59
|
rowDraggable = _ref.rowDraggable,
|
61
60
|
footerRender = _ref.footerRender,
|
62
61
|
scroll = _ref.scroll,
|
63
62
|
actionDirection = _ref.actionDirection,
|
63
|
+
diffConfig = _ref.diffConfig,
|
64
64
|
resetProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
|
65
65
|
// 上下文form
|
66
66
|
var contentForm = _antd.Form.useFormInstance();
|
@@ -169,10 +169,10 @@ var ProEditTable = function ProEditTable(_ref, ref) {
|
|
169
169
|
tableLength: value === null || value === void 0 ? void 0 : value.length,
|
170
170
|
page: page,
|
171
171
|
originalValues: originalValues,
|
172
|
-
originalDiffTip: originalDiffTip,
|
173
172
|
prefixCls: prefixCls,
|
174
173
|
rowDisabled: rowDisabled,
|
175
|
-
actionDirection: actionDirection
|
174
|
+
actionDirection: actionDirection,
|
175
|
+
diffConfig: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, resetProps === null || resetProps === void 0 ? void 0 : (_resetProps$otherProp = resetProps.otherProps) === null || _resetProps$otherProp === void 0 ? void 0 : _resetProps$otherProp.diffConfig), diffConfig)
|
176
176
|
}, resetProps);
|
177
177
|
// 编辑行设置下样式
|
178
178
|
var _rowClassName = function _rowClassName(record) {
|
@@ -277,8 +277,8 @@ var ProEditTable = function ProEditTable(_ref, ref) {
|
|
277
277
|
var _columns = (0, _react.useMemo)(function () {
|
278
278
|
return (0, _utils.transformColumns)(columns, config);
|
279
279
|
}, [valueChangeRef.current, disabled, forceUpdate, columns, page, actionProps, editingKeys, cellNamePath]);
|
280
|
-
|
281
|
-
var _value$every, _originalArr$every;
|
280
|
+
var initDataSource = function initDataSource() {
|
281
|
+
var _value$every, _originalArr$every, _value$some, _originalArr$some;
|
282
282
|
var isAllHasKey = value === null || value === void 0 ? void 0 : (_value$every = value.every) === null || _value$every === void 0 ? void 0 : _value$every.call(value, function (item) {
|
283
283
|
return item.rowKey;
|
284
284
|
});
|
@@ -287,8 +287,15 @@ var ProEditTable = function ProEditTable(_ref, ref) {
|
|
287
287
|
var isOriginalAllHasKey = originalArr ? originalArr === null || originalArr === void 0 ? void 0 : (_originalArr$every = originalArr.every) === null || _originalArr$every === void 0 ? void 0 : _originalArr$every.call(originalArr, function (item) {
|
288
288
|
return item.rowKey;
|
289
289
|
}) : true;
|
290
|
+
// 检测当前rowkey是否与制定key的值是否一致,不一致,则执行覆盖
|
291
|
+
var isNeedCover = value === null || value === void 0 ? void 0 : (_value$some = value.some) === null || _value$some === void 0 ? void 0 : _value$some.call(value, function (item) {
|
292
|
+
return item.rowKey !== getRowKey(item);
|
293
|
+
});
|
294
|
+
var isNeedCoverOriginal = originalArr === null || originalArr === void 0 ? void 0 : (_originalArr$some = originalArr.some) === null || _originalArr$some === void 0 ? void 0 : _originalArr$some.call(originalArr, function (item) {
|
295
|
+
return item.rowKey !== getRowKey(item);
|
296
|
+
});
|
290
297
|
// 初始化默认生成row-key
|
291
|
-
if ((value === null || value === void 0 ? void 0 : value.length) && !isAllHasKey || (originalArr === null || originalArr === void 0 ? void 0 : originalArr.length) && !isOriginalAllHasKey) {
|
298
|
+
if ((value === null || value === void 0 ? void 0 : value.length) && (!isAllHasKey || isNeedCover) || (originalArr === null || originalArr === void 0 ? void 0 : originalArr.length) && (!isOriginalAllHasKey || isNeedCoverOriginal)) {
|
292
299
|
var _originalArr$forEach;
|
293
300
|
var nextValues = value === null || value === void 0 ? void 0 : value.map(function (item) {
|
294
301
|
return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, item), {}, {
|
@@ -303,6 +310,9 @@ var ProEditTable = function ProEditTable(_ref, ref) {
|
|
303
310
|
form.setFieldValue(virtualRowName, nextValues);
|
304
311
|
}
|
305
312
|
}
|
313
|
+
};
|
314
|
+
(0, _react.useEffect)(function () {
|
315
|
+
initDataSource();
|
306
316
|
}, [value, originalValues]);
|
307
317
|
(0, _react.useImperativeHandle)((resetProps === null || resetProps === void 0 ? void 0 : resetProps.ref) || ref, function () {
|
308
318
|
return {
|
@@ -138,11 +138,6 @@ export interface ProEditTableProps<T = any> extends Omit<TableProps<T>, 'onChang
|
|
138
138
|
* @description 原始数据源,是否tooltip显示
|
139
139
|
* @default -
|
140
140
|
*/
|
141
|
-
originalDiffTip?: boolean;
|
142
|
-
/**
|
143
|
-
* @description 可编辑表格的类型,单行、多行、单元格编辑
|
144
|
-
* @default false
|
145
|
-
*/
|
146
141
|
mode?: 'single' | 'multiple' | 'cell';
|
147
142
|
/**
|
148
143
|
* @description 可编辑表格的类型,单行编辑或者多行编辑
|
@@ -275,4 +270,7 @@ export interface ProEditTableProps<T = any> extends Omit<TableProps<T>, 'onChang
|
|
275
270
|
ref?: any;
|
276
271
|
actionDirection?: 'vertical' | 'horizontal';
|
277
272
|
validateTrigger?: string | string[];
|
273
|
+
diffConfig?: {
|
274
|
+
scrollFollowParent?: boolean;
|
275
|
+
};
|
278
276
|
}
|
@@ -290,7 +290,7 @@ var InputNumber = function InputNumber(props) {
|
|
290
290
|
autoComplete: "off",
|
291
291
|
placeholder: placeholder || "".concat(_locale.default.ProForm.inputPlaceholder).concat(label !== null && label !== void 0 ? label : ''),
|
292
292
|
className: _className
|
293
|
-
},
|
293
|
+
}, initialConfig), valueProps), rest), {}, {
|
294
294
|
onBlur: handleBlur,
|
295
295
|
onFocus: handleFocus,
|
296
296
|
min: _min,
|
@@ -32,15 +32,14 @@ var Group = function Group(props) {
|
|
32
32
|
value = props.value,
|
33
33
|
onChange = props.onChange,
|
34
34
|
otherProps = props.otherProps,
|
35
|
-
|
36
|
-
id = props.id,
|
37
|
-
isView = props.isView;
|
35
|
+
id = props.id;
|
38
36
|
var contextProps = _ProForm.default.useFieldProps() || {};
|
39
37
|
var names = contextProps.names,
|
40
38
|
name = contextProps.name,
|
41
39
|
form = contextProps.form,
|
42
40
|
namePath = contextProps.namePath,
|
43
|
-
index = contextProps.index
|
41
|
+
index = contextProps.index,
|
42
|
+
isView = contextProps.isView;
|
44
43
|
var _option = _react.default.useRef([]);
|
45
44
|
// 组合onChange
|
46
45
|
var handleChange = function handleChange(value, option, index) {
|
@@ -79,7 +79,7 @@ var ProCascader = function ProCascader(props) {
|
|
79
79
|
code = _props$code === void 0 ? configCode : _props$code,
|
80
80
|
tooltip = props.tooltip,
|
81
81
|
_props$separator = props.separator,
|
82
|
-
separator = _props$separator === void 0 ? '' : _props$separator,
|
82
|
+
separator = _props$separator === void 0 ? '/' : _props$separator,
|
83
83
|
detailPlaceholder = props.detailPlaceholder,
|
84
84
|
otherProps = (0, _objectWithoutProperties2.default)(props, _excluded);
|
85
85
|
var _ref3 = _.default.useFieldProps() || {},
|
@@ -34,11 +34,14 @@ var ChangedWrapper = function ChangedWrapper(props) {
|
|
34
34
|
getValueProps = props.getValueProps,
|
35
35
|
viewRender = props.viewRender,
|
36
36
|
rest = (0, _objectWithoutProperties2.default)(props, _excluded);
|
37
|
+
// const contentRef = useRef(null);
|
37
38
|
var _useProConfig = (0, _ProConfigProvider.useProConfig)('ProForm'),
|
38
39
|
isDiffAll = _useProConfig.isDiffAll;
|
39
40
|
var originalValues = diffConfig.originalValues,
|
40
41
|
changeTipColor = diffConfig.changeTipColor,
|
41
|
-
addTipColor = diffConfig.addTipColor
|
42
|
+
addTipColor = diffConfig.addTipColor,
|
43
|
+
_diffConfig$scrollFol = diffConfig.scrollFollowParent,
|
44
|
+
scrollFollowParent = _diffConfig$scrollFol === void 0 ? true : _diffConfig$scrollFol;
|
42
45
|
var toolTip = (_diffConfig$toolTip = diffConfig.toolTip) !== null && _diffConfig$toolTip !== void 0 ? _diffConfig$toolTip : true;
|
43
46
|
var isWatch = toolTip && !['FormList', 'ProEditTable'].includes(type);
|
44
47
|
var originalValue = (names === null || names === void 0 ? void 0 : names.length) ? names.map(function (name) {
|
@@ -59,9 +62,8 @@ var ChangedWrapper = function ChangedWrapper(props) {
|
|
59
62
|
var isAdd = diffType === 'add';
|
60
63
|
var isChanged = diffType === 'changed';
|
61
64
|
var viewRenderFun = (0, _react.useMemo)(function () {
|
62
|
-
var record = form.getFieldsValue();
|
63
65
|
return function (orgValue) {
|
64
|
-
return viewRender(orgValue,
|
66
|
+
return viewRender(orgValue, originalValues, {
|
65
67
|
form: form
|
66
68
|
});
|
67
69
|
};
|
@@ -83,27 +85,30 @@ var ChangedWrapper = function ChangedWrapper(props) {
|
|
83
85
|
originalValues: isNestedField ? originalValues : undefined
|
84
86
|
}, children.props), rest));
|
85
87
|
}
|
88
|
+
// eslint-disable-next-line react-hooks/rules-of-hooks
|
89
|
+
// const isFocus = useFocus(contentRef.current);
|
86
90
|
var tipOpenCalc = function tipOpenCalc() {
|
87
91
|
if (!toolTip) return false;
|
88
|
-
// 传入undefined 鼠标移入显示移出隐藏
|
92
|
+
// 传入undefined 鼠标移入显示移出隐藏 获得焦点时不显示气泡
|
89
93
|
return isChanged ? undefined : false;
|
90
94
|
};
|
91
95
|
var style = {
|
92
96
|
'--zaui-contract-bg': changeTipColor,
|
93
97
|
'--zaui-contract-bg-add': addTipColor
|
94
98
|
};
|
99
|
+
// @ts-ignore
|
100
|
+
var _showEllipse = ((_children$props = children.props) === null || _children$props === void 0 ? void 0 : _children$props.showEllipse) || ((_children$props2 = children.props) === null || _children$props2 === void 0 ? void 0 : _children$props2.tooltip);
|
95
101
|
var diffClassName = (0, _classnames.default)({
|
96
102
|
'pro-form-item-changed': isChanged,
|
97
103
|
'pro-form-item-add': isAdd
|
98
104
|
});
|
99
|
-
|
100
|
-
var _showEllipse = ((_children$props = children.props) === null || _children$props === void 0 ? void 0 : _children$props.showEllipse) || ((_children$props2 = children.props) === null || _children$props2 === void 0 ? void 0 : _children$props2.tooltip);
|
105
|
+
var open = tipOpenCalc();
|
101
106
|
return (0, _jsxRuntime.jsx)(_antd.Tooltip, {
|
102
|
-
open:
|
103
|
-
|
104
|
-
|
105
|
-
return target.parentElement;
|
107
|
+
open: open,
|
108
|
+
getPopupContainer: function getPopupContainer(trigger) {
|
109
|
+
return scrollFollowParent ? trigger.parentElement : document.body;
|
106
110
|
},
|
111
|
+
overlayClassName: "original-value-tootip",
|
107
112
|
title: (0, _jsxRuntime.jsxs)(_antd.Space, {
|
108
113
|
direction: "vertical",
|
109
114
|
className: "changed-tooltip",
|
@@ -114,6 +119,7 @@ var ChangedWrapper = function ChangedWrapper(props) {
|
|
114
119
|
}), _showEllipse && (0, _jsxRuntime.jsxs)(_antd.Space, {
|
115
120
|
className: "current-value-container",
|
116
121
|
children: ["\u5F53\u524D\u503C\uFF1A", /*#__PURE__*/_react.default.isValidElement(children) ? /*#__PURE__*/_react.default.cloneElement(children, (0, _objectSpread3.default)((0, _objectSpread3.default)((0, _objectSpread3.default)({}, children.props), rest), {}, {
|
122
|
+
scrollFollowParent: scrollFollowParent,
|
117
123
|
isView: true
|
118
124
|
})) : undefined]
|
119
125
|
})]
|
@@ -123,6 +129,7 @@ var ChangedWrapper = function ChangedWrapper(props) {
|
|
123
129
|
className: diffClassName,
|
124
130
|
style: style,
|
125
131
|
children: /*#__PURE__*/_react.default.isValidElement(children) ? /*#__PURE__*/_react.default.cloneElement(children, (0, _objectSpread3.default)((0, _objectSpread3.default)((0, _objectSpread3.default)({}, children.props), rest), {}, {
|
132
|
+
scrollFollowParent: scrollFollowParent,
|
126
133
|
otherProps: (0, _objectSpread3.default)((0, _objectSpread3.default)({}, (_children$props3 = children.props) === null || _children$props3 === void 0 ? void 0 : _children$props3.otherProps), {}, {
|
127
134
|
isDiffChange: isChanged
|
128
135
|
})
|
@@ -56,6 +56,8 @@ export interface DiffConfigProps<Values = any> {
|
|
56
56
|
changeTipColor?: string;
|
57
57
|
/** 新增提示颜色 */
|
58
58
|
addTipColor?: string;
|
59
|
+
/** 是否跟随父组件滚动 */
|
60
|
+
scrollFollowParent?: string;
|
59
61
|
}
|
60
62
|
export interface ProFormProps<Values = any> extends FormProps<Values> {
|
61
63
|
disabled?: boolean;
|