@lemon-fe/components 0.1.6 → 0.1.9
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/Actions/index.js +3 -2
- package/es/BaseTable/index.js +49 -51
- package/es/Dropdown/index.d.ts +14 -0
- package/es/Dropdown/index.js +53 -0
- package/es/Dropdown/index.less +13 -0
- package/es/DurationPicker/index.js +30 -27
- package/es/DurationPicker/index.less +1 -1
- package/es/Filter/index.d.ts +1 -0
- package/es/Filter/index.js +69 -29
- package/es/Filter/index.less +11 -28
- package/es/Filter/typings.d.ts +4 -0
- package/es/Section/index.less +1 -4
- package/es/SiderTree/TreeNodeTitle.js +2 -1
- package/es/SiderTree/index.less +2 -1
- package/es/index.d.ts +1 -0
- package/es/index.js +2 -1
- package/es/index.less +1 -0
- package/package.json +8 -6
package/es/Actions/index.js
CHANGED
|
@@ -49,7 +49,7 @@ function Actions(props) {
|
|
|
49
49
|
style: style
|
|
50
50
|
}, /*#__PURE__*/React.createElement(Space, {
|
|
51
51
|
direction: "horizontal",
|
|
52
|
-
size:
|
|
52
|
+
size: 12
|
|
53
53
|
}, visibleBtns.map(function (item, index) {
|
|
54
54
|
if (item === null) {
|
|
55
55
|
return item;
|
|
@@ -118,7 +118,8 @@ function Actions(props) {
|
|
|
118
118
|
}, rest), text, /*#__PURE__*/React.createElement(Icons.Down, {
|
|
119
119
|
style: {
|
|
120
120
|
opacity: 0.7,
|
|
121
|
-
fontSize: 16
|
|
121
|
+
fontSize: 16,
|
|
122
|
+
verticalAlign: -3
|
|
122
123
|
}
|
|
123
124
|
})));
|
|
124
125
|
}
|
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", "
|
|
2
|
+
_excluded2 = ["id", "columns", "defaultColumnProps", "rowKey", "children", "summaryTitle", "summaryRecord", "dataSource", "onSortChange", "sort", "scroll", "virtual", "components", "pagination", "rowHeight", "tableLayout", "rowActions", "style"];
|
|
3
3
|
|
|
4
4
|
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
|
5
5
|
|
|
@@ -37,7 +37,7 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
|
|
|
37
37
|
import React, { useMemo, useState, useEffect, useRef } from 'react';
|
|
38
38
|
import { Table as AntdTable } from 'antd';
|
|
39
39
|
import { get } from 'lodash';
|
|
40
|
-
import
|
|
40
|
+
import ResizeObserver from 'rc-resize-observer';
|
|
41
41
|
import { isColumnType, getColumnKey } from './utils';
|
|
42
42
|
import ResizeHeaderCell from './ResizeHeaderCell';
|
|
43
43
|
import { PREFIX_CLS } from '../constants';
|
|
@@ -116,26 +116,29 @@ function BaseTable(props) {
|
|
|
116
116
|
virtual = props.virtual,
|
|
117
117
|
componentsProp = props.components,
|
|
118
118
|
paginationProp = props.pagination,
|
|
119
|
-
onChangeProp = props.onChange,
|
|
120
119
|
rowHeight = props.rowHeight,
|
|
121
120
|
_props$tableLayout = props.tableLayout,
|
|
122
121
|
tableLayout = _props$tableLayout === void 0 ? 'fixed' : _props$tableLayout,
|
|
123
122
|
rowActions = props.rowActions,
|
|
123
|
+
style = props.style,
|
|
124
124
|
restProps = _objectWithoutProperties(props, _excluded2);
|
|
125
125
|
|
|
126
126
|
var fullTableRef = useRef(null);
|
|
127
127
|
|
|
128
|
-
var _useState = useState(
|
|
128
|
+
var _useState = useState(new Map()),
|
|
129
129
|
_useState2 = _slicedToArray(_useState, 2),
|
|
130
|
-
|
|
131
|
-
|
|
130
|
+
colsState = _useState2[0],
|
|
131
|
+
setColsState = _useState2[1];
|
|
132
132
|
|
|
133
|
-
var
|
|
133
|
+
var scrollYProp = scroll === null || scroll === void 0 ? void 0 : scroll.y;
|
|
134
|
+
|
|
135
|
+
var _useState3 = useState(scrollYProp === true ? 0 : scrollYProp),
|
|
134
136
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
/** auto scroll y */
|
|
137
|
+
scrollY = _useState4[0],
|
|
138
|
+
setScrollY = _useState4[1];
|
|
138
139
|
|
|
140
|
+
var memoHeight = useRef(0);
|
|
141
|
+
/** auto scroll y */
|
|
139
142
|
|
|
140
143
|
var calcScrollY = function calcScrollY() {
|
|
141
144
|
var wrapper = fullTableRef.current;
|
|
@@ -181,31 +184,34 @@ function BaseTable(props) {
|
|
|
181
184
|
return contentHeight;
|
|
182
185
|
};
|
|
183
186
|
|
|
184
|
-
var changeScrollY =
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
if ((scroll === null || scroll === void 0 ? void 0 : scroll.y) === true) {
|
|
188
|
-
var y = calcScrollY();
|
|
189
|
-
nextScrollY = y || undefined;
|
|
190
|
-
} else {
|
|
191
|
-
nextScrollY = scroll === null || scroll === void 0 ? void 0 : scroll.y;
|
|
187
|
+
var changeScrollY = function changeScrollY(height) {
|
|
188
|
+
if (height === memoHeight.current) {
|
|
189
|
+
return;
|
|
192
190
|
}
|
|
193
191
|
|
|
194
|
-
|
|
192
|
+
memoHeight.current = height;
|
|
193
|
+
setScrollY(calcScrollY() || undefined);
|
|
194
|
+
};
|
|
195
195
|
|
|
196
|
-
|
|
196
|
+
useEffect(function () {
|
|
197
|
+
if (scrollYProp !== true) {
|
|
198
|
+
setScrollY(scrollYProp);
|
|
199
|
+
}
|
|
200
|
+
}, [scrollYProp]);
|
|
201
|
+
useEffect(function () {
|
|
202
|
+
if (scrollY !== undefined && fullTableRef.current !== null) {
|
|
197
203
|
var body = fullTableRef.current.querySelector('.ant-table-body');
|
|
198
204
|
|
|
199
205
|
if (body !== null) {
|
|
200
|
-
var dataType = _typeof(
|
|
206
|
+
var dataType = _typeof(scrollY);
|
|
201
207
|
|
|
202
208
|
switch (dataType) {
|
|
203
209
|
case 'string':
|
|
204
|
-
body.style.height =
|
|
210
|
+
body.style.height = scrollY;
|
|
205
211
|
break;
|
|
206
212
|
|
|
207
213
|
case 'number':
|
|
208
|
-
body.style.height =
|
|
214
|
+
body.style.height = scrollY + 'px';
|
|
209
215
|
break;
|
|
210
216
|
|
|
211
217
|
default:
|
|
@@ -213,29 +219,9 @@ function BaseTable(props) {
|
|
|
213
219
|
}
|
|
214
220
|
}
|
|
215
221
|
}
|
|
216
|
-
},
|
|
217
|
-
trailing: true
|
|
218
|
-
});
|
|
219
|
-
useEffect(function () {
|
|
220
|
-
changeScrollY();
|
|
221
|
-
}, [scroll === null || scroll === void 0 ? void 0 : scroll.y, dataSource]);
|
|
222
|
-
useEffect(function () {
|
|
223
|
-
window.addEventListener('resize', changeScrollY);
|
|
224
|
-
return function () {
|
|
225
|
-
window.removeEventListener('resize', changeScrollY);
|
|
226
|
-
};
|
|
227
|
-
}, []);
|
|
228
|
-
|
|
229
|
-
var handleChange = function handleChange() {
|
|
230
|
-
changeScrollY();
|
|
231
|
-
|
|
232
|
-
if (onChangeProp) {
|
|
233
|
-
onChangeProp.apply(void 0, arguments);
|
|
234
|
-
}
|
|
235
|
-
};
|
|
222
|
+
}, [scrollY]);
|
|
236
223
|
/** resizable column */
|
|
237
224
|
|
|
238
|
-
|
|
239
225
|
var _useMemo = useMemo(function () {
|
|
240
226
|
var flattenCols = [];
|
|
241
227
|
var isFixedLayout = tableLayout === 'fixed';
|
|
@@ -400,22 +386,22 @@ function BaseTable(props) {
|
|
|
400
386
|
rowHeight: rowHeight
|
|
401
387
|
};
|
|
402
388
|
}, [scrollY, rowHeight]);
|
|
403
|
-
|
|
404
|
-
value: ctx
|
|
405
|
-
}, /*#__PURE__*/React.createElement(AntdTable, _objectSpread(_objectSpread({
|
|
389
|
+
var tableNode = /*#__PURE__*/React.createElement(AntdTable, _objectSpread(_objectSpread({
|
|
406
390
|
size: "small",
|
|
407
391
|
ref: fullTableRef,
|
|
408
392
|
columns: formatedColumns,
|
|
409
393
|
dataSource: dataSource,
|
|
410
394
|
rowKey: rowKey,
|
|
411
395
|
summary: summary,
|
|
396
|
+
components: components,
|
|
397
|
+
tableLayout: tableLayout,
|
|
412
398
|
scroll: {
|
|
413
399
|
x: (scroll === null || scroll === void 0 ? void 0 : scroll.x) || '100%',
|
|
414
400
|
y: scrollY
|
|
415
401
|
},
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
402
|
+
style: scrollYProp === true ? _objectSpread(_objectSpread({}, style), {}, {
|
|
403
|
+
height: '100%'
|
|
404
|
+
}) : style,
|
|
419
405
|
locale: {
|
|
420
406
|
emptyText: /*#__PURE__*/React.createElement("div", {
|
|
421
407
|
className: "".concat(PREFIX_CLS, "-table-empty")
|
|
@@ -434,7 +420,19 @@ function BaseTable(props) {
|
|
|
434
420
|
},
|
|
435
421
|
defaultPageSize: 20
|
|
436
422
|
}, paginationProp) : false
|
|
437
|
-
}))
|
|
423
|
+
}));
|
|
424
|
+
|
|
425
|
+
if (scrollYProp === true) {
|
|
426
|
+
tableNode = /*#__PURE__*/React.createElement(ResizeObserver, {
|
|
427
|
+
onResize: function onResize(size) {
|
|
428
|
+
return changeScrollY(size.height);
|
|
429
|
+
}
|
|
430
|
+
}, tableNode);
|
|
431
|
+
}
|
|
432
|
+
|
|
433
|
+
return /*#__PURE__*/React.createElement(BaseTableContext.Provider, {
|
|
434
|
+
value: ctx
|
|
435
|
+
}, tableNode);
|
|
438
436
|
}
|
|
439
437
|
|
|
440
438
|
BaseTable.Summary = AntdTable.Summary;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import type { PopoverProps } from 'antd';
|
|
2
|
+
import type { ReactElement } from 'react';
|
|
3
|
+
interface Props {
|
|
4
|
+
actions: ({
|
|
5
|
+
text: string | ReactElement;
|
|
6
|
+
onClick: () => void;
|
|
7
|
+
disabled?: boolean;
|
|
8
|
+
} | null)[];
|
|
9
|
+
overlayClassName?: string;
|
|
10
|
+
placement?: PopoverProps['placement'];
|
|
11
|
+
children?: ReactElement | null;
|
|
12
|
+
}
|
|
13
|
+
export default function Dropdown(props: Props): JSX.Element;
|
|
14
|
+
export {};
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
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; }
|
|
2
|
+
|
|
3
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
4
|
+
|
|
5
|
+
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
6
|
+
|
|
7
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
8
|
+
|
|
9
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
|
10
|
+
|
|
11
|
+
function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
|
12
|
+
|
|
13
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
14
|
+
|
|
15
|
+
import { Popover } from 'antd';
|
|
16
|
+
import React, { useState } from 'react';
|
|
17
|
+
import classNames from 'classnames';
|
|
18
|
+
import { PREFIX_CLS } from '../constants';
|
|
19
|
+
export default function Dropdown(props) {
|
|
20
|
+
var actions = props.actions,
|
|
21
|
+
overlayClassName = props.overlayClassName,
|
|
22
|
+
_props$placement = props.placement,
|
|
23
|
+
placement = _props$placement === void 0 ? 'bottomRight' : _props$placement,
|
|
24
|
+
children = props.children;
|
|
25
|
+
|
|
26
|
+
var _useState = useState(false),
|
|
27
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
28
|
+
visible = _useState2[0],
|
|
29
|
+
setVisible = _useState2[1];
|
|
30
|
+
|
|
31
|
+
var prefixCls = "".concat(PREFIX_CLS, "-dropdown");
|
|
32
|
+
return /*#__PURE__*/React.createElement(Popover, {
|
|
33
|
+
trigger: "click",
|
|
34
|
+
placement: placement,
|
|
35
|
+
visible: visible,
|
|
36
|
+
onVisibleChange: setVisible,
|
|
37
|
+
overlayClassName: classNames(prefixCls, overlayClassName),
|
|
38
|
+
content: actions.map(function (item, index) {
|
|
39
|
+
return item !== null && /*#__PURE__*/React.createElement("div", {
|
|
40
|
+
className: classNames("".concat(prefixCls, "-item"), _defineProperty({}, "".concat(prefixCls, "-item-disabled"), item.disabled)),
|
|
41
|
+
key: index,
|
|
42
|
+
onClick: function onClick() {
|
|
43
|
+
if (item.disabled) {
|
|
44
|
+
return;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
setVisible(false);
|
|
48
|
+
item.onClick();
|
|
49
|
+
}
|
|
50
|
+
}, item.text);
|
|
51
|
+
})
|
|
52
|
+
}, children);
|
|
53
|
+
}
|
|
@@ -136,11 +136,6 @@ export default function DurationPicker(props) {
|
|
|
136
136
|
value = _useState2[0],
|
|
137
137
|
setValue = _useState2[1];
|
|
138
138
|
|
|
139
|
-
useEffect(function () {
|
|
140
|
-
if (value !== defaultValue && value !== valueProp && onChange) {
|
|
141
|
-
onChange(value);
|
|
142
|
-
}
|
|
143
|
-
}, [value]);
|
|
144
139
|
useEffect(function () {
|
|
145
140
|
if (valueProp !== undefined) {
|
|
146
141
|
setValue(valueProp);
|
|
@@ -164,40 +159,48 @@ export default function DurationPicker(props) {
|
|
|
164
159
|
}, [value]);
|
|
165
160
|
|
|
166
161
|
var handleChangeType = function handleChangeType(item) {
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
return prev;
|
|
170
|
-
}
|
|
171
|
-
|
|
172
|
-
return _objectSpread(_objectSpread({}, prev), {}, {
|
|
162
|
+
if (value.type !== item.value) {
|
|
163
|
+
var newValue = _objectSpread(_objectSpread({}, value), {}, {
|
|
173
164
|
type: item.value
|
|
174
165
|
});
|
|
175
|
-
});
|
|
176
|
-
};
|
|
177
166
|
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
if (
|
|
181
|
-
|
|
167
|
+
setValue(newValue);
|
|
168
|
+
|
|
169
|
+
if (onChange) {
|
|
170
|
+
onChange(newValue);
|
|
182
171
|
}
|
|
172
|
+
}
|
|
173
|
+
};
|
|
183
174
|
|
|
184
|
-
|
|
185
|
-
|
|
175
|
+
var handleChangeOption = function handleChangeOption(item) {
|
|
176
|
+
if (value.option !== item.label) {
|
|
177
|
+
var newValue = _objectSpread(_objectSpread({}, value), {}, {
|
|
186
178
|
dates: item.value !== null ? item.value().map(function (date) {
|
|
187
179
|
return date.format(dateFormat);
|
|
188
|
-
}) : undefined
|
|
180
|
+
}) : undefined,
|
|
181
|
+
option: item.label
|
|
189
182
|
});
|
|
190
|
-
|
|
183
|
+
|
|
184
|
+
setValue(newValue);
|
|
185
|
+
|
|
186
|
+
if (onChange) {
|
|
187
|
+
onChange(newValue);
|
|
188
|
+
}
|
|
189
|
+
}
|
|
191
190
|
};
|
|
192
191
|
|
|
193
192
|
var handleChangeDates = function handleChangeDates(dates) {
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
}) : undefined
|
|
199
|
-
});
|
|
193
|
+
var newValue = _objectSpread(_objectSpread({}, value), {}, {
|
|
194
|
+
dates: dates ? dates.map(function (item) {
|
|
195
|
+
return item.format(dateFormat);
|
|
196
|
+
}) : undefined
|
|
200
197
|
});
|
|
198
|
+
|
|
199
|
+
setValue(newValue);
|
|
200
|
+
|
|
201
|
+
if (onChange) {
|
|
202
|
+
onChange(newValue);
|
|
203
|
+
}
|
|
201
204
|
};
|
|
202
205
|
|
|
203
206
|
return /*#__PURE__*/React.createElement("div", {
|
package/es/Filter/index.d.ts
CHANGED
|
@@ -2,5 +2,6 @@ import type { ComponentOption, FilterProps } from './typings';
|
|
|
2
2
|
declare function Filter<T extends Record<string, any> = Record<string, any>>(props: FilterProps<T>): JSX.Element;
|
|
3
3
|
declare namespace Filter {
|
|
4
4
|
var setComponents: (items: ComponentOption[]) => void;
|
|
5
|
+
var setStorage: <T>(getData: (storageKey: string) => T | Promise<T>, setData: <T_1>(storageKey: string, data: T_1) => void | Promise<void>) => void;
|
|
5
6
|
}
|
|
6
7
|
export default Filter;
|
package/es/Filter/index.js
CHANGED
|
@@ -29,13 +29,15 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
|
|
|
29
29
|
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; }
|
|
30
30
|
|
|
31
31
|
import React, { useEffect, useMemo, useState } from 'react';
|
|
32
|
-
import { Button, Checkbox, Form, Input, Popover, Space,
|
|
32
|
+
import { Button, Checkbox, Form, Input, Popover, Space, Modal, message, Select, Empty, InputNumber } from 'antd';
|
|
33
33
|
import { useDebounce, useRequest } from '@lemon-fe/hooks';
|
|
34
|
+
import classNames from 'classnames';
|
|
34
35
|
import Icons from '../Icons';
|
|
35
36
|
import DurationPicker from '../DurationPicker';
|
|
36
37
|
import FormLayout from '../FormLayout';
|
|
37
38
|
import { PREFIX_CLS } from '../constants';
|
|
38
39
|
import TabBar from '../TabBar';
|
|
40
|
+
import Dropdown from '../Dropdown';
|
|
39
41
|
var components = [{
|
|
40
42
|
type: 'input',
|
|
41
43
|
render: function render(item) {
|
|
@@ -67,6 +69,21 @@ var components = [{
|
|
|
67
69
|
}, item.extraProps));
|
|
68
70
|
}
|
|
69
71
|
}];
|
|
72
|
+
|
|
73
|
+
var getStorageData = function getData(storageKey) {
|
|
74
|
+
var data = localStorage.getItem("filter-storage-".concat(storageKey));
|
|
75
|
+
|
|
76
|
+
if (data) {
|
|
77
|
+
return JSON.parse(data);
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
return null;
|
|
81
|
+
};
|
|
82
|
+
|
|
83
|
+
var setStorageData = function setData(storageKey, data) {
|
|
84
|
+
localStorage.setItem("filter-storage-".concat(storageKey), JSON.stringify(data));
|
|
85
|
+
};
|
|
86
|
+
|
|
70
87
|
var DEFAULT_TAB_TITLE = '默认';
|
|
71
88
|
|
|
72
89
|
function setComponents(items) {
|
|
@@ -79,6 +96,11 @@ function setComponents(items) {
|
|
|
79
96
|
components = _toConsumableArray(compMap.values());
|
|
80
97
|
}
|
|
81
98
|
|
|
99
|
+
function setStorage(getData, setData) {
|
|
100
|
+
getStorageData = getData;
|
|
101
|
+
setStorageData = setData;
|
|
102
|
+
}
|
|
103
|
+
|
|
82
104
|
function Filter(props) {
|
|
83
105
|
var data = props.data,
|
|
84
106
|
defaultValueProp = props.defaultValue,
|
|
@@ -87,7 +109,8 @@ function Filter(props) {
|
|
|
87
109
|
defaultActiveKeys = props.defaultActiveKeys,
|
|
88
110
|
storageKey = props.storageKey,
|
|
89
111
|
onValuesChange = props.onValuesChange,
|
|
90
|
-
style = props.style
|
|
112
|
+
style = props.style,
|
|
113
|
+
simple = props.simple;
|
|
91
114
|
var prefixCls = PREFIX_CLS;
|
|
92
115
|
var defaultValue = useMemo(function () {
|
|
93
116
|
return defaultValueProp || value;
|
|
@@ -144,7 +167,7 @@ function Filter(props) {
|
|
|
144
167
|
form = _Form$useForm4[0];
|
|
145
168
|
|
|
146
169
|
var _useRequest = useRequest( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
|
|
147
|
-
var
|
|
170
|
+
var tabsData;
|
|
148
171
|
return regeneratorRuntime.wrap(function _callee$(_context) {
|
|
149
172
|
while (1) {
|
|
150
173
|
switch (_context.prev = _context.next) {
|
|
@@ -157,17 +180,12 @@ function Filter(props) {
|
|
|
157
180
|
return _context.abrupt("return", null);
|
|
158
181
|
|
|
159
182
|
case 2:
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
if (!tabsJson) {
|
|
163
|
-
_context.next = 5;
|
|
164
|
-
break;
|
|
165
|
-
}
|
|
166
|
-
|
|
167
|
-
return _context.abrupt("return", JSON.parse(tabsJson));
|
|
183
|
+
_context.next = 4;
|
|
184
|
+
return getStorageData(storageKey);
|
|
168
185
|
|
|
169
|
-
case
|
|
170
|
-
|
|
186
|
+
case 4:
|
|
187
|
+
tabsData = _context.sent;
|
|
188
|
+
return _context.abrupt("return", tabsData);
|
|
171
189
|
|
|
172
190
|
case 6:
|
|
173
191
|
case "end":
|
|
@@ -227,6 +245,10 @@ function Filter(props) {
|
|
|
227
245
|
next.push(tab);
|
|
228
246
|
}
|
|
229
247
|
|
|
248
|
+
if (!!storageKey) {
|
|
249
|
+
setStorageData(storageKey, next.slice(1));
|
|
250
|
+
}
|
|
251
|
+
|
|
230
252
|
setTabs(next);
|
|
231
253
|
setActive(index);
|
|
232
254
|
setShowModal(false);
|
|
@@ -306,6 +328,12 @@ function Filter(props) {
|
|
|
306
328
|
return next;
|
|
307
329
|
});
|
|
308
330
|
setActive(active - 1);
|
|
331
|
+
|
|
332
|
+
if (!!storageKey) {
|
|
333
|
+
setStorageData(storageKey, tabs.filter(function (item) {
|
|
334
|
+
return item.title !== tabs[active].title && item.title !== '默认';
|
|
335
|
+
}));
|
|
336
|
+
}
|
|
309
337
|
}
|
|
310
338
|
});
|
|
311
339
|
};
|
|
@@ -382,10 +410,10 @@ function Filter(props) {
|
|
|
382
410
|
initialValues: defaultValue,
|
|
383
411
|
onFinish: handleFinish,
|
|
384
412
|
form: form,
|
|
385
|
-
className: "".concat(prefixCls, "-filter"),
|
|
413
|
+
className: classNames("".concat(prefixCls, "-filter"), _defineProperty({}, "".concat(prefixCls, "-simple-filter"), simple)),
|
|
386
414
|
onValuesChange: handleValuesChange,
|
|
387
415
|
style: style
|
|
388
|
-
}, /*#__PURE__*/React.createElement(TabBar, {
|
|
416
|
+
}, !simple && /*#__PURE__*/React.createElement(TabBar, {
|
|
389
417
|
tabs: tabs,
|
|
390
418
|
activeKey: tabs[active].title,
|
|
391
419
|
onTabClick: function onTabClick(_, index) {
|
|
@@ -417,18 +445,33 @@ function Filter(props) {
|
|
|
417
445
|
type: "primary",
|
|
418
446
|
htmlType: "submit"
|
|
419
447
|
}, "\u67E5\u8BE2")
|
|
420
|
-
}, /*#__PURE__*/React.createElement(Space, null, /*#__PURE__*/React.createElement(
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
448
|
+
}, simple ? /*#__PURE__*/React.createElement(Space, null, /*#__PURE__*/React.createElement(Button, {
|
|
449
|
+
className: "".concat(prefixCls, "-filter-btn"),
|
|
450
|
+
onClick: handleReset
|
|
451
|
+
}, /*#__PURE__*/React.createElement("svg", {
|
|
452
|
+
width: "20",
|
|
453
|
+
height: "20",
|
|
454
|
+
viewBox: "0 0 20 20",
|
|
455
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
456
|
+
}, /*#__PURE__*/React.createElement("path", {
|
|
457
|
+
d: "m15 12 .98 3.314a8 8 0 1 0-3.293 2.223",
|
|
458
|
+
stroke: "currentColor",
|
|
459
|
+
strokeWidth: "1.5",
|
|
460
|
+
strokeLinecap: "round",
|
|
461
|
+
strokeLinejoin: "round",
|
|
462
|
+
fill: "none",
|
|
463
|
+
fillRule: "evenodd"
|
|
464
|
+
})))) : /*#__PURE__*/React.createElement(Space, null, /*#__PURE__*/React.createElement(Dropdown, {
|
|
465
|
+
actions: [{
|
|
466
|
+
text: '重置',
|
|
424
467
|
onClick: handleReset
|
|
425
|
-
},
|
|
426
|
-
|
|
468
|
+
}, {
|
|
469
|
+
text: '保存方案',
|
|
427
470
|
onClick: handleAddTab
|
|
428
|
-
},
|
|
429
|
-
|
|
471
|
+
}, {
|
|
472
|
+
text: '删除方案',
|
|
430
473
|
onClick: handleDelete
|
|
431
|
-
}
|
|
474
|
+
}]
|
|
432
475
|
}, /*#__PURE__*/React.createElement(Button, {
|
|
433
476
|
icon: /*#__PURE__*/React.createElement(Icons.More, null)
|
|
434
477
|
})), /*#__PURE__*/React.createElement(Popover, {
|
|
@@ -439,11 +482,7 @@ function Filter(props) {
|
|
|
439
482
|
placeholder: "\u641C\u7D22\u9009\u9879",
|
|
440
483
|
allowClear: true,
|
|
441
484
|
className: "".concat(prefixCls, "-filter-items-search"),
|
|
442
|
-
|
|
443
|
-
style: {
|
|
444
|
-
color: '#686868'
|
|
445
|
-
}
|
|
446
|
-
}),
|
|
485
|
+
prefix: /*#__PURE__*/React.createElement(Icons.Search, null),
|
|
447
486
|
onChange: function onChange(e) {
|
|
448
487
|
return handleChangeKeywords(e.currentTarget.value);
|
|
449
488
|
}
|
|
@@ -525,4 +564,5 @@ function Filter(props) {
|
|
|
525
564
|
}
|
|
526
565
|
|
|
527
566
|
Filter.setComponents = setComponents;
|
|
567
|
+
Filter.setStorage = setStorage;
|
|
528
568
|
export default Filter;
|
package/es/Filter/index.less
CHANGED
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
@import '../theme.less';
|
|
2
|
-
|
|
3
1
|
.@{prefixCls}-filter {
|
|
4
2
|
&-tab {
|
|
5
3
|
height: 100%;
|
|
@@ -38,45 +36,30 @@
|
|
|
38
36
|
}
|
|
39
37
|
|
|
40
38
|
&-popover {
|
|
41
|
-
|
|
42
|
-
padding-top: 0;
|
|
43
|
-
|
|
44
|
-
.ant-popover-arrow {
|
|
45
|
-
display: none;
|
|
46
|
-
}
|
|
39
|
+
.popover(220px);
|
|
47
40
|
|
|
48
41
|
.ant-popover-inner {
|
|
49
|
-
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
.ant-popover-inner-content {
|
|
53
|
-
padding: 4px 5px 16px;
|
|
42
|
+
padding: 16px 0;
|
|
54
43
|
}
|
|
55
44
|
}
|
|
56
45
|
|
|
57
|
-
&-items-search
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
border: none;
|
|
61
|
-
outline: none;
|
|
62
|
-
box-shadow: none;
|
|
63
|
-
|
|
64
|
-
input {
|
|
65
|
-
background-color: transparent;
|
|
66
|
-
}
|
|
46
|
+
&-items-search {
|
|
47
|
+
width: auto;
|
|
48
|
+
margin: 0 16px 8px;
|
|
67
49
|
}
|
|
68
50
|
|
|
69
51
|
&-items {
|
|
70
52
|
max-height: 400px;
|
|
71
|
-
padding: 0 20px;
|
|
72
53
|
overflow: auto;
|
|
73
54
|
}
|
|
74
55
|
|
|
75
56
|
&-item {
|
|
76
|
-
|
|
57
|
+
.popoverItem();
|
|
77
58
|
|
|
78
|
-
|
|
79
|
-
color: #888;
|
|
80
|
-
}
|
|
59
|
+
overflow: hidden;
|
|
81
60
|
}
|
|
82
61
|
}
|
|
62
|
+
|
|
63
|
+
.@{prefixCls}-section-body > .@{prefixCls}-filter:not(.@{prefixCls}-simple-filter):first-child {
|
|
64
|
+
margin-top: -16px;
|
|
65
|
+
}
|
package/es/Filter/typings.d.ts
CHANGED
|
@@ -19,6 +19,10 @@ export interface FilterProps<T extends Record<string, any> = Record<string, any>
|
|
|
19
19
|
defaultActiveKeys?: string[];
|
|
20
20
|
storageKey?: string;
|
|
21
21
|
style?: CSSProperties;
|
|
22
|
+
/**
|
|
23
|
+
* @description 是否简化筛选器,简化版不包含标签以及选项保存
|
|
24
|
+
*/
|
|
25
|
+
simple?: boolean;
|
|
22
26
|
}
|
|
23
27
|
|
|
24
28
|
export interface ComponentOption {
|
package/es/Section/index.less
CHANGED
|
@@ -18,6 +18,7 @@
|
|
|
18
18
|
|
|
19
19
|
&-flex &-body {
|
|
20
20
|
flex: 1 1 100%;
|
|
21
|
+
min-height: 0;
|
|
21
22
|
}
|
|
22
23
|
|
|
23
24
|
&-header {
|
|
@@ -53,10 +54,6 @@
|
|
|
53
54
|
&.ant-tabs-tabpane {
|
|
54
55
|
border-top-left-radius: 0;
|
|
55
56
|
}
|
|
56
|
-
|
|
57
|
-
& > .@{prefixCls}-filter:first-child {
|
|
58
|
-
margin-top: -16px;
|
|
59
|
-
}
|
|
60
57
|
}
|
|
61
58
|
|
|
62
59
|
&-footer {
|
|
@@ -63,7 +63,8 @@ export default function TreeNodeTitle(props) {
|
|
|
63
63
|
var others = (_operation$others = operation.others) === null || _operation$others === void 0 ? void 0 : _operation$others.call(operation, item);
|
|
64
64
|
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
|
|
65
65
|
className: "".concat(prefixCls, "-title-content"),
|
|
66
|
-
ref: trigger
|
|
66
|
+
ref: trigger,
|
|
67
|
+
title: item.title.toString()
|
|
67
68
|
}, item.title), /*#__PURE__*/React.createElement("div", {
|
|
68
69
|
className: "".concat(prefixCls, "-title-operators"),
|
|
69
70
|
style: {
|
package/es/SiderTree/index.less
CHANGED
|
@@ -69,6 +69,7 @@
|
|
|
69
69
|
&-unit {
|
|
70
70
|
display: inline-block;
|
|
71
71
|
width: @indentWidth;
|
|
72
|
+
vertical-align: top;
|
|
72
73
|
}
|
|
73
74
|
}
|
|
74
75
|
|
|
@@ -121,7 +122,7 @@
|
|
|
121
122
|
flex: 1;
|
|
122
123
|
align-items: center;
|
|
123
124
|
justify-content: space-between;
|
|
124
|
-
min-width:
|
|
125
|
+
min-width: 56px;
|
|
125
126
|
padding: 0 8px;
|
|
126
127
|
border-radius: 4px;
|
|
127
128
|
cursor: pointer;
|
package/es/index.d.ts
CHANGED
|
@@ -27,3 +27,4 @@ export { default as FormTable } from './FormTable';
|
|
|
27
27
|
export type { FormTableColumnType, FormTableProps, FormTableRef } from './FormTable/typings';
|
|
28
28
|
export { default as TabBar } from './TabBar';
|
|
29
29
|
export { default as SymbolIcon } from './SymbolIcon';
|
|
30
|
+
export { default as Dropdown } from './Dropdown';
|
package/es/index.js
CHANGED
|
@@ -21,4 +21,5 @@ export { default as FormHorizontal } from './FormHorizontal';
|
|
|
21
21
|
export { default as FormInline } from './FormInline';
|
|
22
22
|
export { default as FormTable } from './FormTable';
|
|
23
23
|
export { default as TabBar } from './TabBar';
|
|
24
|
-
export { default as SymbolIcon } from './SymbolIcon';
|
|
24
|
+
export { default as SymbolIcon } from './SymbolIcon';
|
|
25
|
+
export { default as Dropdown } from './Dropdown';
|
package/es/index.less
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@lemon-fe/components",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.9",
|
|
4
4
|
"description": "> TODO: description",
|
|
5
5
|
"author": "鲁盛杰 <lusj@cnlemon.net>",
|
|
6
6
|
"homepage": "",
|
|
@@ -17,11 +17,8 @@
|
|
|
17
17
|
},
|
|
18
18
|
"dependencies": {
|
|
19
19
|
"@lemon-fe/hooks": "^0.1.2",
|
|
20
|
-
"antd": "^4.20.2",
|
|
21
20
|
"classnames": "^2.2.6",
|
|
22
21
|
"lodash": "^4.17.21",
|
|
23
|
-
"react": "^17.0.2",
|
|
24
|
-
"react-dom": "^17.0.2",
|
|
25
22
|
"react-resizable": "^3.0.4"
|
|
26
23
|
},
|
|
27
24
|
"peerDependencies": {
|
|
@@ -30,6 +27,7 @@
|
|
|
30
27
|
"classnames": ">=2.2.6",
|
|
31
28
|
"color-string": ">=1.0.0",
|
|
32
29
|
"lodash": ">=4.17.0",
|
|
30
|
+
"rc-resize-observer": "^1.0.0",
|
|
33
31
|
"rc-tree": ">=4.0.0",
|
|
34
32
|
"react": ">=16.9.0",
|
|
35
33
|
"react-dom": ">=16.9.0"
|
|
@@ -37,7 +35,11 @@
|
|
|
37
35
|
"devDependencies": {
|
|
38
36
|
"@types/color-string": "^1.5.2",
|
|
39
37
|
"@types/lodash": "^4.14.179",
|
|
40
|
-
"@types/react-resizable": "^1.7.4"
|
|
38
|
+
"@types/react-resizable": "^1.7.4",
|
|
39
|
+
"antd": "^4.20.2",
|
|
40
|
+
"rc-resize-observer": "^1.2.0",
|
|
41
|
+
"react": "^17.0.2",
|
|
42
|
+
"react-dom": "^17.0.2"
|
|
41
43
|
},
|
|
42
|
-
"gitHead": "
|
|
44
|
+
"gitHead": "f43d8d68fe859bd2d30478c18b85fafc2310595d"
|
|
43
45
|
}
|