@lemon-fe/components 0.1.50 → 0.1.55
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/es/BaseTable/index.js +22 -13
- package/es/BaseTable/index.less +4 -4
- package/es/EditableTable/typings.d.ts +1 -0
- package/es/SelectView/index.js +27 -35
- package/es/Table/index.js +15 -3
- package/package.json +2 -2
package/es/BaseTable/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
var _excluded = ["onWidthChange", "width", "fullTableRef", "children", "className"],
|
|
2
|
-
_excluded2 = ["id", "columns", "defaultColumnProps", "rowKey", "children", "summaryTitle", "summaryRecord", "dataSource", "onSortChange", "sort", "scroll", "virtual", "components", "pagination", "rowHeight", "tableLayout", "rowActions", "style"];
|
|
2
|
+
_excluded2 = ["id", "columns", "defaultColumnProps", "rowKey", "children", "summaryTitle", "summaryRecord", "dataSource", "onSortChange", "sort", "scroll", "virtual", "components", "pagination", "rowHeight", "tableLayout", "rowActions", "style", "locale"];
|
|
3
3
|
|
|
4
4
|
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
|
5
5
|
|
|
@@ -34,7 +34,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
|
|
|
34
34
|
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
35
35
|
|
|
36
36
|
/// <reference path="../../typings.d.ts" />
|
|
37
|
-
import React, { useMemo, useState, useEffect, useRef
|
|
37
|
+
import React, { useMemo, useState, useEffect, useRef } from 'react';
|
|
38
38
|
import { Table as AntdTable } from 'antd';
|
|
39
39
|
import { get } from 'lodash';
|
|
40
40
|
import ResizeObserver from 'rc-resize-observer';
|
|
@@ -121,6 +121,7 @@ function BaseTable(props) {
|
|
|
121
121
|
tableLayout = _props$tableLayout === void 0 ? 'fixed' : _props$tableLayout,
|
|
122
122
|
rowActions = props.rowActions,
|
|
123
123
|
style = props.style,
|
|
124
|
+
localeProp = props.locale,
|
|
124
125
|
restProps = _objectWithoutProperties(props, _excluded2);
|
|
125
126
|
|
|
126
127
|
var fullTableRef = useRef(null);
|
|
@@ -204,8 +205,10 @@ function BaseTable(props) {
|
|
|
204
205
|
hasPagination = paginationProp !== undefined && !!paginationProp.total || dataSource.length > 0;
|
|
205
206
|
}
|
|
206
207
|
|
|
207
|
-
|
|
208
|
-
|
|
208
|
+
useEffect(function () {
|
|
209
|
+
if (scrollYProp === true) {
|
|
210
|
+
setScrollY(calcScrollY() || 0);
|
|
211
|
+
}
|
|
209
212
|
}, [hasPagination]);
|
|
210
213
|
useEffect(function () {
|
|
211
214
|
if (scrollYProp !== true) {
|
|
@@ -324,7 +327,7 @@ function BaseTable(props) {
|
|
|
324
327
|
/** row actions */
|
|
325
328
|
|
|
326
329
|
|
|
327
|
-
useMemo(function () {
|
|
330
|
+
var _useMemo3 = useMemo(function () {
|
|
328
331
|
if (rowActions !== undefined) {
|
|
329
332
|
var actionCol = {
|
|
330
333
|
title: '',
|
|
@@ -339,13 +342,19 @@ function BaseTable(props) {
|
|
|
339
342
|
});
|
|
340
343
|
}
|
|
341
344
|
};
|
|
342
|
-
formatedColumns.
|
|
343
|
-
flattenColumns.push(actionCol);
|
|
345
|
+
return [[].concat(_toConsumableArray(formatedColumns), [actionCol]), [].concat(_toConsumableArray(flattenColumns), [actionCol])];
|
|
344
346
|
}
|
|
347
|
+
|
|
348
|
+
return [formatedColumns, flattenColumns];
|
|
345
349
|
}, [rowActions, flattenColumns, formatedColumns]);
|
|
346
|
-
/** virtualize scroll */
|
|
347
350
|
|
|
348
|
-
var
|
|
351
|
+
var _useMemo4 = _slicedToArray(_useMemo3, 2);
|
|
352
|
+
|
|
353
|
+
formatedColumns = _useMemo4[0];
|
|
354
|
+
flattenColumns = _useMemo4[1];
|
|
355
|
+
|
|
356
|
+
/** virtualize scroll */
|
|
357
|
+
var _useMemo5 = useMemo(function () {
|
|
349
358
|
return {
|
|
350
359
|
components: _objectSpread({
|
|
351
360
|
header: {
|
|
@@ -357,7 +366,7 @@ function BaseTable(props) {
|
|
|
357
366
|
}, componentsProp)
|
|
358
367
|
};
|
|
359
368
|
}, [virtual]),
|
|
360
|
-
components =
|
|
369
|
+
components = _useMemo5.components;
|
|
361
370
|
/** summary row */
|
|
362
371
|
|
|
363
372
|
|
|
@@ -416,13 +425,13 @@ function BaseTable(props) {
|
|
|
416
425
|
style: scrollYProp === true ? _objectSpread(_objectSpread({}, style), {}, {
|
|
417
426
|
height: '100%'
|
|
418
427
|
}) : style,
|
|
419
|
-
locale: {
|
|
428
|
+
locale: _objectSpread({
|
|
420
429
|
emptyText: /*#__PURE__*/React.createElement("div", {
|
|
421
430
|
className: "".concat(PREFIX_CLS, "-table-empty")
|
|
422
431
|
}, /*#__PURE__*/React.createElement("img", {
|
|
423
432
|
src: empty
|
|
424
433
|
}), /*#__PURE__*/React.createElement("div", null, "\u6682\u65E0\u6570\u636E"))
|
|
425
|
-
}
|
|
434
|
+
}, localeProp)
|
|
426
435
|
}, restProps), {}, {
|
|
427
436
|
pagination: paginationProp !== false ? _objectSpread({
|
|
428
437
|
size: 'small',
|
|
@@ -439,7 +448,7 @@ function BaseTable(props) {
|
|
|
439
448
|
if (scrollYProp === true) {
|
|
440
449
|
tableNode = /*#__PURE__*/React.createElement(ResizeObserver, {
|
|
441
450
|
onResize: function onResize(size) {
|
|
442
|
-
|
|
451
|
+
changeScrollY(size.height);
|
|
443
452
|
}
|
|
444
453
|
}, tableNode);
|
|
445
454
|
}
|
package/es/BaseTable/index.less
CHANGED
|
@@ -23,8 +23,8 @@
|
|
|
23
23
|
height: 100%;
|
|
24
24
|
padding-left: 16px;
|
|
25
25
|
white-space: nowrap;
|
|
26
|
-
background-color: @table-row-hover-bg;
|
|
27
|
-
background-clip: content-box;
|
|
26
|
+
// background-color: @table-row-hover-bg;
|
|
27
|
+
// background-clip: content-box;
|
|
28
28
|
|
|
29
29
|
&::before {
|
|
30
30
|
position: absolute;
|
|
@@ -32,7 +32,7 @@
|
|
|
32
32
|
left: 0;
|
|
33
33
|
width: 16px;
|
|
34
34
|
height: 100%;
|
|
35
|
-
background: linear-gradient(90deg, rgba(248, 248, 248, 0) 0%, @table-row-hover-bg 100%);
|
|
35
|
+
// background: linear-gradient(90deg, rgba(248, 248, 248, 0) 0%, @table-row-hover-bg 100%);
|
|
36
36
|
content: '';
|
|
37
37
|
}
|
|
38
38
|
|
|
@@ -172,9 +172,9 @@
|
|
|
172
172
|
text-align: center;
|
|
173
173
|
|
|
174
174
|
& > img {
|
|
175
|
-
display: block;
|
|
176
175
|
width: 120px;
|
|
177
176
|
height: 120px;
|
|
177
|
+
vertical-align: top;
|
|
178
178
|
}
|
|
179
179
|
}
|
|
180
180
|
}
|
|
@@ -76,6 +76,7 @@ export interface EditableTableProps<T>
|
|
|
76
76
|
error?: string | EditableTableRowError[];
|
|
77
77
|
onChange?: (value: T[]) => void;
|
|
78
78
|
rowSelection?: BaseTableProps<RowType>['rowSelection'];
|
|
79
|
+
rowActions?: BaseTableProps<RowType>['rowActions'];
|
|
79
80
|
columns: EditableTableColumnType<T>[];
|
|
80
81
|
}
|
|
81
82
|
|
package/es/SelectView/index.js
CHANGED
|
@@ -50,22 +50,17 @@ export default function SelectView(props) {
|
|
|
50
50
|
data = _useState2[0],
|
|
51
51
|
setData = _useState2[1];
|
|
52
52
|
|
|
53
|
-
var _useState3 = useState(
|
|
53
|
+
var _useState3 = useState((filter === null || filter === void 0 ? void 0 : filter.defaultValue) || {}),
|
|
54
54
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
var _useState5 = useState((filter === null || filter === void 0 ? void 0 : filter.defaultValue) || {}),
|
|
59
|
-
_useState6 = _slicedToArray(_useState5, 2),
|
|
60
|
-
params = _useState6[0],
|
|
61
|
-
setParams = _useState6[1];
|
|
55
|
+
params = _useState4[0],
|
|
56
|
+
setParams = _useState4[1];
|
|
62
57
|
|
|
63
58
|
var list = useRef(null);
|
|
64
59
|
|
|
65
|
-
var
|
|
66
|
-
|
|
67
|
-
tabFlag =
|
|
68
|
-
setTabFlag =
|
|
60
|
+
var _useState5 = useState('list'),
|
|
61
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
62
|
+
tabFlag = _useState6[0],
|
|
63
|
+
setTabFlag = _useState6[1];
|
|
69
64
|
|
|
70
65
|
useEffect(function () {
|
|
71
66
|
var _list$current;
|
|
@@ -96,7 +91,6 @@ export default function SelectView(props) {
|
|
|
96
91
|
|
|
97
92
|
var handleClear = function handleClear() {
|
|
98
93
|
var empty = [];
|
|
99
|
-
setSelected(empty);
|
|
100
94
|
setData(empty);
|
|
101
95
|
onChange === null || onChange === void 0 ? void 0 : onChange(empty);
|
|
102
96
|
};
|
|
@@ -113,7 +107,6 @@ export default function SelectView(props) {
|
|
|
113
107
|
|
|
114
108
|
return false;
|
|
115
109
|
});
|
|
116
|
-
setSelected(newRows);
|
|
117
110
|
setData(newRows);
|
|
118
111
|
onChange === null || onChange === void 0 ? void 0 : onChange(newRows);
|
|
119
112
|
};
|
|
@@ -155,9 +148,6 @@ export default function SelectView(props) {
|
|
|
155
148
|
var dataKeys = useMemo(function () {
|
|
156
149
|
return data.map(getRowKey);
|
|
157
150
|
}, [data, rowKey]);
|
|
158
|
-
var selectedKeys = useMemo(function () {
|
|
159
|
-
return selected.map(getRowKey);
|
|
160
|
-
}, [rowKey, selected]);
|
|
161
151
|
var selectTable = /*#__PURE__*/React.createElement("div", {
|
|
162
152
|
className: "".concat(prefixCls, "-layout")
|
|
163
153
|
}, siderNode !== null && /*#__PURE__*/React.createElement("div", {
|
|
@@ -191,20 +181,19 @@ export default function SelectView(props) {
|
|
|
191
181
|
return {
|
|
192
182
|
onClick: function onClick() {
|
|
193
183
|
var key = getRowKey(row);
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
keys.splice(index, 1);
|
|
184
|
+
var keys = new Set(_toConsumableArray(dataKeys));
|
|
185
|
+
|
|
186
|
+
if (multiple) {
|
|
187
|
+
if (keys.has(key)) {
|
|
188
|
+
keys.delete(key);
|
|
189
|
+
} else {
|
|
190
|
+
keys.add(key);
|
|
191
|
+
}
|
|
203
192
|
} else {
|
|
204
|
-
keys
|
|
193
|
+
keys = new Set([key]);
|
|
205
194
|
}
|
|
206
195
|
|
|
207
|
-
handleChangeData(keys, [row]);
|
|
196
|
+
handleChangeData(_toConsumableArray(keys.values()), [row]);
|
|
208
197
|
}
|
|
209
198
|
};
|
|
210
199
|
},
|
|
@@ -244,13 +233,16 @@ export default function SelectView(props) {
|
|
|
244
233
|
}, /*#__PURE__*/React.createElement(Table, {
|
|
245
234
|
dataSource: data,
|
|
246
235
|
columns: selectedColumns,
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
236
|
+
rowActions: function rowActions(row) {
|
|
237
|
+
return [{
|
|
238
|
+
text: '删除',
|
|
239
|
+
onClick: function onClick() {
|
|
240
|
+
var keys = new Set(_toConsumableArray(dataKeys));
|
|
241
|
+
keys.delete(getRowKey(row));
|
|
242
|
+
handleChangeData(keys, [row]);
|
|
243
|
+
}
|
|
244
|
+
}];
|
|
245
|
+
},
|
|
254
246
|
rowKey: rowKey
|
|
255
247
|
}))))));
|
|
256
248
|
}
|
package/es/Table/index.js
CHANGED
|
@@ -30,6 +30,8 @@ import React, { useMemo, useState, useImperativeHandle, useEffect } from 'react'
|
|
|
30
30
|
import { useRequest } from '@lemon-fe/hooks';
|
|
31
31
|
import BaseTable from '../BaseTable';
|
|
32
32
|
import { isSortValue } from './utils';
|
|
33
|
+
import empty from '../BaseTable/empty.png';
|
|
34
|
+
import { PREFIX_CLS } from '../constants';
|
|
33
35
|
export default function Table(props) {
|
|
34
36
|
var _props$dataSource = props.dataSource,
|
|
35
37
|
dataSource = _props$dataSource === void 0 ? [] : _props$dataSource,
|
|
@@ -115,16 +117,19 @@ export default function Table(props) {
|
|
|
115
117
|
onLoading(false);
|
|
116
118
|
}
|
|
117
119
|
|
|
118
|
-
setRemote(res.result)
|
|
120
|
+
setRemote(_objectSpread(_objectSpread({}, res.result), {}, {
|
|
121
|
+
error: undefined
|
|
122
|
+
}));
|
|
119
123
|
},
|
|
120
|
-
onError: function onError() {
|
|
124
|
+
onError: function onError(error) {
|
|
121
125
|
if (onLoading) {
|
|
122
126
|
onLoading(false);
|
|
123
127
|
}
|
|
124
128
|
|
|
125
129
|
setRemote({
|
|
126
130
|
data: [],
|
|
127
|
-
total: 0
|
|
131
|
+
total: 0,
|
|
132
|
+
error: error
|
|
128
133
|
});
|
|
129
134
|
}
|
|
130
135
|
}),
|
|
@@ -215,6 +220,13 @@ export default function Table(props) {
|
|
|
215
220
|
});
|
|
216
221
|
}
|
|
217
222
|
},
|
|
223
|
+
locale: remote.error ? {
|
|
224
|
+
emptyText: /*#__PURE__*/React.createElement("div", {
|
|
225
|
+
className: "".concat(PREFIX_CLS, "-table-empty")
|
|
226
|
+
}, /*#__PURE__*/React.createElement("img", {
|
|
227
|
+
src: empty
|
|
228
|
+
}), /*#__PURE__*/React.createElement("div", null, remote.error.message))
|
|
229
|
+
} : undefined,
|
|
218
230
|
pagination: {
|
|
219
231
|
current: current,
|
|
220
232
|
pageSize: pageSize,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@lemon-fe/components",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.55",
|
|
4
4
|
"description": "> TODO: description",
|
|
5
5
|
"author": "鲁盛杰 <lusj@cnlemon.net>",
|
|
6
6
|
"homepage": "",
|
|
@@ -41,5 +41,5 @@
|
|
|
41
41
|
"react": "^17.0.2",
|
|
42
42
|
"react-dom": "^17.0.2"
|
|
43
43
|
},
|
|
44
|
-
"gitHead": "
|
|
44
|
+
"gitHead": "26cf3c526e121d460bee164784fdd9a16a5b5cdc"
|
|
45
45
|
}
|