linkmore-design 1.0.32 → 1.0.33
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/dist/index.umd.js +639 -15
- package/dist/index.umd.min.js +5 -5
- package/es/CustomTableOption/columnsSort.d.ts +4 -0
- package/es/CustomTableOption/columnsSort.js +317 -0
- package/es/CustomTableOption/filterSort.d.ts +4 -0
- package/es/CustomTableOption/filterSort.js +193 -0
- package/es/CustomTableOption/index.d.ts +12 -0
- package/es/CustomTableOption/index.js +122 -0
- package/es/CustomTableOption/style/index.css +548 -0
- package/es/CustomTableOption/style/index.d.ts +1 -0
- package/es/CustomTableOption/style/index.js +1 -0
- package/es/LmTable/Table.js +27 -13
- package/es/LmTable/style/style.css +4 -0
- package/es/Radio/style/style.css +2 -1
- package/es/Tag/index.js +2 -2
- package/es/Tag/style/index.css +4 -0
- package/es/index.js +9 -1
- package/es/message/style/index.css +1 -1
- package/lib/CustomTableOption/columnsSort.d.ts +4 -0
- package/lib/CustomTableOption/columnsSort.js +336 -0
- package/lib/CustomTableOption/filterSort.d.ts +4 -0
- package/lib/CustomTableOption/filterSort.js +213 -0
- package/lib/CustomTableOption/index.d.ts +12 -0
- package/lib/CustomTableOption/index.js +140 -0
- package/lib/CustomTableOption/style/index.css +548 -0
- package/lib/CustomTableOption/style/index.d.ts +1 -0
- package/lib/CustomTableOption/style/index.js +3 -0
- package/lib/LmTable/Table.js +27 -13
- package/lib/LmTable/style/style.css +4 -0
- package/lib/Radio/style/style.css +2 -1
- package/lib/Tag/index.js +2 -2
- package/lib/Tag/style/index.css +4 -0
- package/lib/index.js +9 -1
- package/lib/message/style/index.css +1 -1
- package/package.json +1 -1
package/es/Tag/style/index.css
CHANGED
|
@@ -512,6 +512,10 @@ html {
|
|
|
512
512
|
.lm_tag.ant-tag .anticon-close {
|
|
513
513
|
margin-left: 6px;
|
|
514
514
|
}
|
|
515
|
+
.lm_tag.ant-tag.lm_tag_main_theme {
|
|
516
|
+
background: var(--tree-select-bg);
|
|
517
|
+
color: var(--primary-color);
|
|
518
|
+
}
|
|
515
519
|
.lm_tag.lm_tag_noborder {
|
|
516
520
|
border-color: transparent;
|
|
517
521
|
}
|
package/es/index.js
CHANGED
|
@@ -35,6 +35,12 @@ Object.defineProperty(exports, "CkFilter", {
|
|
|
35
35
|
return _CkFilter.default;
|
|
36
36
|
}
|
|
37
37
|
});
|
|
38
|
+
Object.defineProperty(exports, "CustomTableOption", {
|
|
39
|
+
enumerable: true,
|
|
40
|
+
get: function get() {
|
|
41
|
+
return _CustomTableOption.default;
|
|
42
|
+
}
|
|
43
|
+
});
|
|
38
44
|
Object.defineProperty(exports, "CustomerService", {
|
|
39
45
|
enumerable: true,
|
|
40
46
|
get: function get() {
|
|
@@ -332,4 +338,6 @@ var _Table = _interopRequireDefault(require("./Table"));
|
|
|
332
338
|
|
|
333
339
|
var _Switch = _interopRequireDefault(require("./Switch"));
|
|
334
340
|
|
|
335
|
-
var _Image = _interopRequireDefault(require("./Image"));
|
|
341
|
+
var _Image = _interopRequireDefault(require("./Image"));
|
|
342
|
+
|
|
343
|
+
var _CustomTableOption = _interopRequireDefault(require("./CustomTableOption"));
|
|
@@ -0,0 +1,336 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
|
4
|
+
|
|
5
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
6
|
+
|
|
7
|
+
Object.defineProperty(exports, "__esModule", {
|
|
8
|
+
value: true
|
|
9
|
+
});
|
|
10
|
+
exports.default = void 0;
|
|
11
|
+
|
|
12
|
+
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
13
|
+
|
|
14
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
15
|
+
|
|
16
|
+
var _core = require("@dnd-kit/core");
|
|
17
|
+
|
|
18
|
+
var _sortable = require("@dnd-kit/sortable");
|
|
19
|
+
|
|
20
|
+
var _linkmoreDesign = require("linkmore-design");
|
|
21
|
+
|
|
22
|
+
var _icons = require("@ant-design/icons");
|
|
23
|
+
|
|
24
|
+
var _utilities = require("@dnd-kit/utilities");
|
|
25
|
+
|
|
26
|
+
var _lodash = require("lodash");
|
|
27
|
+
|
|
28
|
+
var SortItem = function SortItem(props) {
|
|
29
|
+
var _a, _b, _c, _d;
|
|
30
|
+
|
|
31
|
+
var _useSortable = (0, _sortable.useSortable)({
|
|
32
|
+
id: "".concat(props.id)
|
|
33
|
+
}),
|
|
34
|
+
attributes = _useSortable.attributes,
|
|
35
|
+
listeners = _useSortable.listeners,
|
|
36
|
+
setNodeRef = _useSortable.setNodeRef,
|
|
37
|
+
transform = _useSortable.transform,
|
|
38
|
+
transition = _useSortable.transition;
|
|
39
|
+
|
|
40
|
+
var style = {
|
|
41
|
+
transform: _utilities.CSS.Transform.toString(transform),
|
|
42
|
+
transition: transition
|
|
43
|
+
};
|
|
44
|
+
return /*#__PURE__*/_react.default.createElement("div", Object.assign({
|
|
45
|
+
ref: setNodeRef,
|
|
46
|
+
className: 'lm_custom_item',
|
|
47
|
+
style: style
|
|
48
|
+
}, attributes), /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Checkbox, {
|
|
49
|
+
checked: ((_a = props.item) === null || _a === void 0 ? void 0 : _a.show) === false ? false : true,
|
|
50
|
+
onChange: function onChange(e) {
|
|
51
|
+
return props.toggleShow(e.target.checked, props.id);
|
|
52
|
+
},
|
|
53
|
+
className: "filter_item-content"
|
|
54
|
+
}, (_b = props.item) === null || _b === void 0 ? void 0 : _b.title), /*#__PURE__*/_react.default.createElement("div", null, ((_c = props.item) === null || _c === void 0 ? void 0 : _c.fixed) && /*#__PURE__*/_react.default.createElement(_linkmoreDesign.IconFont, {
|
|
55
|
+
type: "lmweb-vertical-align-middl",
|
|
56
|
+
className: "lm_custom_icon hover_show",
|
|
57
|
+
onClick: function onClick(e) {
|
|
58
|
+
e.stopPropagation();
|
|
59
|
+
props.clearFiexd(props.id);
|
|
60
|
+
}
|
|
61
|
+
}), !((_d = props.item) === null || _d === void 0 ? void 0 : _d.fixed) && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_linkmoreDesign.IconFont, {
|
|
62
|
+
type: "lmweb-vertical-align-top",
|
|
63
|
+
className: "lm_custom_icon hover_show icon_top",
|
|
64
|
+
onClick: function onClick(e) {
|
|
65
|
+
console.log(e, 'eee');
|
|
66
|
+
e.stopPropagation();
|
|
67
|
+
props.addFiexd(props.id, 'left');
|
|
68
|
+
}
|
|
69
|
+
}), /*#__PURE__*/_react.default.createElement(_linkmoreDesign.IconFont, {
|
|
70
|
+
type: "lmweb-vertical-align-botto",
|
|
71
|
+
className: "lm_custom_icon hover_show icon_bottom",
|
|
72
|
+
onClick: function onClick(e) {
|
|
73
|
+
e.stopPropagation();
|
|
74
|
+
props.addFiexd(props.id, 'right');
|
|
75
|
+
}
|
|
76
|
+
})), /*#__PURE__*/_react.default.createElement(_icons.HolderOutlined, Object.assign({}, listeners, {
|
|
77
|
+
className: 'lm_custom_icon sort_item',
|
|
78
|
+
style: {
|
|
79
|
+
color: 'var(--tip-text-color)'
|
|
80
|
+
}
|
|
81
|
+
}))));
|
|
82
|
+
};
|
|
83
|
+
/** order show fixed */
|
|
84
|
+
|
|
85
|
+
|
|
86
|
+
var ColumnsSort = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
87
|
+
var _ref$columns = _ref.columns,
|
|
88
|
+
columns = _ref$columns === void 0 ? [] : _ref$columns,
|
|
89
|
+
_ref$ColumnsStateValu = _ref.ColumnsStateValue,
|
|
90
|
+
ColumnsStateValue = _ref$ColumnsStateValu === void 0 ? {} : _ref$ColumnsStateValu;
|
|
91
|
+
|
|
92
|
+
var _a, _b, _c, _d, _e, _f, _g;
|
|
93
|
+
|
|
94
|
+
var _useState = (0, _react.useState)([]),
|
|
95
|
+
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
|
96
|
+
localColumns = _useState2[0],
|
|
97
|
+
setLocalColumns = _useState2[1];
|
|
98
|
+
|
|
99
|
+
var _useState3 = (0, _react.useState)({}),
|
|
100
|
+
_useState4 = (0, _slicedToArray2.default)(_useState3, 2),
|
|
101
|
+
colStateValue = _useState4[0],
|
|
102
|
+
setColStateValue = _useState4[1];
|
|
103
|
+
|
|
104
|
+
var sortMenu = (0, _react.useMemo)(function () {
|
|
105
|
+
var cloneCol = (0, _lodash.cloneDeep)(localColumns);
|
|
106
|
+
cloneCol.forEach(function (item, index) {
|
|
107
|
+
var _a, _b;
|
|
108
|
+
|
|
109
|
+
var fixed = (_a = ColumnsStateValue[item.dataIndex]) === null || _a === void 0 ? void 0 : _a.fixed;
|
|
110
|
+
var order = (_b = ColumnsStateValue[item.dataIndex]) === null || _b === void 0 ? void 0 : _b.order;
|
|
111
|
+
|
|
112
|
+
if (!!fixed) {
|
|
113
|
+
item.fixed = fixed;
|
|
114
|
+
}
|
|
115
|
+
|
|
116
|
+
item.order = order !== undefined && order !== null ? order : index;
|
|
117
|
+
});
|
|
118
|
+
var leftSortItem = [];
|
|
119
|
+
var rigthSortItem = [];
|
|
120
|
+
var items = [];
|
|
121
|
+
cloneCol === null || cloneCol === void 0 ? void 0 : cloneCol.forEach(function (item) {
|
|
122
|
+
if ((item === null || item === void 0 ? void 0 : item.fixed) === 'right') {
|
|
123
|
+
rigthSortItem.push(item);
|
|
124
|
+
} else if (!(item === null || item === void 0 ? void 0 : item.fixed)) {
|
|
125
|
+
items.push(item);
|
|
126
|
+
} else {
|
|
127
|
+
leftSortItem.push(item);
|
|
128
|
+
}
|
|
129
|
+
});
|
|
130
|
+
return {
|
|
131
|
+
leftSortItem: leftSortItem,
|
|
132
|
+
rigthSortItem: rigthSortItem,
|
|
133
|
+
items: items
|
|
134
|
+
};
|
|
135
|
+
}, [localColumns, colStateValue]);
|
|
136
|
+
var isCheckAll = (0, _react.useMemo)(function () {
|
|
137
|
+
var showLength = localColumns.filter(function (item) {
|
|
138
|
+
return item.show !== false;
|
|
139
|
+
});
|
|
140
|
+
return {
|
|
141
|
+
indeterminate: (showLength === null || showLength === void 0 ? void 0 : showLength.length) && showLength.length !== localColumns.length ? true : false,
|
|
142
|
+
checkAll: showLength.length === localColumns.length
|
|
143
|
+
};
|
|
144
|
+
}, [localColumns]);
|
|
145
|
+
(0, _react.useEffect)(function () {
|
|
146
|
+
setLocalColumns(columns);
|
|
147
|
+
setColStateValue(ColumnsStateValue);
|
|
148
|
+
}, []);
|
|
149
|
+
var leftSensors = (0, _core.useSensors)((0, _core.useSensor)(_core.PointerSensor), (0, _core.useSensor)(_core.KeyboardSensor, {
|
|
150
|
+
coordinateGetter: _sortable.sortableKeyboardCoordinates
|
|
151
|
+
}));
|
|
152
|
+
var sensors = (0, _core.useSensors)((0, _core.useSensor)(_core.PointerSensor), (0, _core.useSensor)(_core.KeyboardSensor, {
|
|
153
|
+
coordinateGetter: _sortable.sortableKeyboardCoordinates
|
|
154
|
+
}));
|
|
155
|
+
var rightSensors = (0, _core.useSensors)((0, _core.useSensor)(_core.PointerSensor), (0, _core.useSensor)(_core.KeyboardSensor, {
|
|
156
|
+
coordinateGetter: _sortable.sortableKeyboardCoordinates
|
|
157
|
+
}));
|
|
158
|
+
/** 排序结束回调 */
|
|
159
|
+
|
|
160
|
+
var handleDragEnd = function handleDragEnd(event) {
|
|
161
|
+
var active = event.active,
|
|
162
|
+
over = event.over;
|
|
163
|
+
|
|
164
|
+
if (active.id !== over.id) {
|
|
165
|
+
setLocalColumns(function (items) {
|
|
166
|
+
var oldIndex = items.findIndex(function (s) {
|
|
167
|
+
return s.dataIndex === active.id;
|
|
168
|
+
});
|
|
169
|
+
var newIndex = items.findIndex(function (s) {
|
|
170
|
+
return s.dataIndex === over.id;
|
|
171
|
+
});
|
|
172
|
+
console.log((0, _sortable.arrayMove)(items, oldIndex, newIndex), 77);
|
|
173
|
+
return (0, _sortable.arrayMove)(items, oldIndex, newIndex).map(function (item, index) {
|
|
174
|
+
return Object.assign(Object.assign({}, item), {
|
|
175
|
+
order: index
|
|
176
|
+
});
|
|
177
|
+
});
|
|
178
|
+
});
|
|
179
|
+
}
|
|
180
|
+
};
|
|
181
|
+
/** 取消固定 */
|
|
182
|
+
|
|
183
|
+
|
|
184
|
+
var clearFiexd = function clearFiexd(id) {
|
|
185
|
+
var resultColumns = localColumns.map(function (item) {
|
|
186
|
+
if (item.dataIndex === id) {
|
|
187
|
+
return Object.assign(Object.assign({}, item), {
|
|
188
|
+
fixed: undefined
|
|
189
|
+
});
|
|
190
|
+
}
|
|
191
|
+
|
|
192
|
+
return Object.assign({}, item);
|
|
193
|
+
});
|
|
194
|
+
setLocalColumns(resultColumns);
|
|
195
|
+
};
|
|
196
|
+
/** 添加是否显示 */
|
|
197
|
+
|
|
198
|
+
|
|
199
|
+
var toggleShow = function toggleShow(value, id) {
|
|
200
|
+
var resultColumns = localColumns.map(function (item) {
|
|
201
|
+
if (item.dataIndex === id) {
|
|
202
|
+
return Object.assign(Object.assign({}, item), {
|
|
203
|
+
show: item.show === false ? true : false
|
|
204
|
+
});
|
|
205
|
+
}
|
|
206
|
+
|
|
207
|
+
return Object.assign({}, item);
|
|
208
|
+
});
|
|
209
|
+
setLocalColumns(resultColumns);
|
|
210
|
+
};
|
|
211
|
+
/** 添加左右固定 */
|
|
212
|
+
|
|
213
|
+
|
|
214
|
+
var addFiexd = function addFiexd(id, type) {
|
|
215
|
+
var resultColumns = localColumns.map(function (item) {
|
|
216
|
+
if (item.dataIndex === id) {
|
|
217
|
+
return Object.assign(Object.assign({}, item), {
|
|
218
|
+
fixed: type
|
|
219
|
+
});
|
|
220
|
+
}
|
|
221
|
+
|
|
222
|
+
return Object.assign({}, item);
|
|
223
|
+
});
|
|
224
|
+
setLocalColumns(resultColumns);
|
|
225
|
+
};
|
|
226
|
+
/** 切换是否全选 */
|
|
227
|
+
|
|
228
|
+
|
|
229
|
+
var onCheckAllChange = function onCheckAllChange() {
|
|
230
|
+
var resultColumns = localColumns.map(function (item) {
|
|
231
|
+
return Object.assign(Object.assign({}, item), {
|
|
232
|
+
show: isCheckAll.checkAll ? false : true
|
|
233
|
+
});
|
|
234
|
+
});
|
|
235
|
+
setLocalColumns(resultColumns);
|
|
236
|
+
};
|
|
237
|
+
|
|
238
|
+
(0, _react.useImperativeHandle)(ref, function () {
|
|
239
|
+
return {
|
|
240
|
+
getColumns: function getColumns() {
|
|
241
|
+
return localColumns;
|
|
242
|
+
},
|
|
243
|
+
getColStateValue: function getColStateValue() {
|
|
244
|
+
var obj = {};
|
|
245
|
+
localColumns.forEach(function (item) {
|
|
246
|
+
obj[item.dataIndex] = {};
|
|
247
|
+
|
|
248
|
+
if (![undefined, null].includes(item.order)) {
|
|
249
|
+
obj[item.dataIndex]['order'] = item.order;
|
|
250
|
+
}
|
|
251
|
+
|
|
252
|
+
if (![undefined, null].includes(item.order)) {
|
|
253
|
+
obj[item.dataIndex]['show'] = item.show;
|
|
254
|
+
}
|
|
255
|
+
|
|
256
|
+
if (![undefined, null].includes(item.fixed)) {
|
|
257
|
+
obj[item.dataIndex]['fixed'] = item.fixed;
|
|
258
|
+
}
|
|
259
|
+
});
|
|
260
|
+
return obj;
|
|
261
|
+
}
|
|
262
|
+
};
|
|
263
|
+
});
|
|
264
|
+
return /*#__PURE__*/_react.default.createElement("div", {
|
|
265
|
+
className: 'lm_custom_option_columns'
|
|
266
|
+
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
267
|
+
className: 'global_setting'
|
|
268
|
+
}, /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Checkbox, {
|
|
269
|
+
indeterminate: isCheckAll.indeterminate,
|
|
270
|
+
onChange: onCheckAllChange,
|
|
271
|
+
checked: isCheckAll.checkAll
|
|
272
|
+
}, "\u5168\u9009"), /*#__PURE__*/_react.default.createElement("span", {
|
|
273
|
+
onClick: function onClick() {
|
|
274
|
+
return setLocalColumns(columns);
|
|
275
|
+
}
|
|
276
|
+
}, "\u91CD\u7F6E")), !!((_a = sortMenu.leftSortItem) === null || _a === void 0 ? void 0 : _a.length) && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("label", {
|
|
277
|
+
className: 'fixed_title'
|
|
278
|
+
}, "\u56FA\u5B9A\u5728\u5DE6\u4FA7"), /*#__PURE__*/_react.default.createElement(_core.DndContext, {
|
|
279
|
+
sensors: leftSensors,
|
|
280
|
+
collisionDetection: _core.closestCenter,
|
|
281
|
+
onDragEnd: handleDragEnd
|
|
282
|
+
}, /*#__PURE__*/_react.default.createElement(_sortable.SortableContext, {
|
|
283
|
+
items: (_b = sortMenu.leftSortItem) === null || _b === void 0 ? void 0 : _b.map(function (v) {
|
|
284
|
+
return "".concat(v.dataIndex);
|
|
285
|
+
}),
|
|
286
|
+
strategy: _sortable.verticalListSortingStrategy
|
|
287
|
+
}, sortMenu.leftSortItem.map(function (item) {
|
|
288
|
+
return /*#__PURE__*/_react.default.createElement(SortItem, {
|
|
289
|
+
key: item.dataIndex,
|
|
290
|
+
item: item,
|
|
291
|
+
toggleShow: toggleShow,
|
|
292
|
+
clearFiexd: clearFiexd,
|
|
293
|
+
id: item.dataIndex
|
|
294
|
+
});
|
|
295
|
+
})))), !!((_c = sortMenu.items) === null || _c === void 0 ? void 0 : _c.length) && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("label", {
|
|
296
|
+
className: 'fixed_title'
|
|
297
|
+
}, " \u4E0D\u56FA\u5B9A "), /*#__PURE__*/_react.default.createElement(_core.DndContext, {
|
|
298
|
+
sensors: sensors,
|
|
299
|
+
collisionDetection: _core.closestCenter,
|
|
300
|
+
onDragEnd: handleDragEnd
|
|
301
|
+
}, /*#__PURE__*/_react.default.createElement(_sortable.SortableContext, {
|
|
302
|
+
items: (_d = sortMenu.items) === null || _d === void 0 ? void 0 : _d.map(function (v) {
|
|
303
|
+
return "".concat(v.dataIndex);
|
|
304
|
+
}),
|
|
305
|
+
strategy: _sortable.verticalListSortingStrategy
|
|
306
|
+
}, (_e = sortMenu.items) === null || _e === void 0 ? void 0 : _e.map(function (item) {
|
|
307
|
+
return /*#__PURE__*/_react.default.createElement(SortItem, {
|
|
308
|
+
key: item.dataIndex,
|
|
309
|
+
addFiexd: addFiexd,
|
|
310
|
+
toggleShow: toggleShow,
|
|
311
|
+
item: item,
|
|
312
|
+
id: item.dataIndex
|
|
313
|
+
});
|
|
314
|
+
})))), !!((_f = sortMenu.rigthSortItem) === null || _f === void 0 ? void 0 : _f.length) && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("label", {
|
|
315
|
+
className: 'fixed_title'
|
|
316
|
+
}, "\u56FA\u5B9A\u5728\u53F3\u4FA7"), /*#__PURE__*/_react.default.createElement(_core.DndContext, {
|
|
317
|
+
sensors: rightSensors,
|
|
318
|
+
collisionDetection: _core.closestCenter,
|
|
319
|
+
onDragEnd: handleDragEnd
|
|
320
|
+
}, /*#__PURE__*/_react.default.createElement(_sortable.SortableContext, {
|
|
321
|
+
items: (_g = sortMenu.rigthSortItem) === null || _g === void 0 ? void 0 : _g.map(function (v) {
|
|
322
|
+
return "".concat(v.dataIndex);
|
|
323
|
+
}),
|
|
324
|
+
strategy: _sortable.verticalListSortingStrategy
|
|
325
|
+
}, sortMenu.rigthSortItem.map(function (item) {
|
|
326
|
+
return /*#__PURE__*/_react.default.createElement(SortItem, {
|
|
327
|
+
key: item.dataIndex,
|
|
328
|
+
toggleShow: toggleShow,
|
|
329
|
+
clearFiexd: clearFiexd,
|
|
330
|
+
item: item,
|
|
331
|
+
id: item.dataIndex
|
|
332
|
+
});
|
|
333
|
+
})))));
|
|
334
|
+
});
|
|
335
|
+
var _default = ColumnsSort;
|
|
336
|
+
exports.default = _default;
|
|
@@ -0,0 +1,213 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
|
4
|
+
|
|
5
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
6
|
+
|
|
7
|
+
Object.defineProperty(exports, "__esModule", {
|
|
8
|
+
value: true
|
|
9
|
+
});
|
|
10
|
+
exports.default = void 0;
|
|
11
|
+
|
|
12
|
+
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
13
|
+
|
|
14
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
15
|
+
|
|
16
|
+
var _core = require("@dnd-kit/core");
|
|
17
|
+
|
|
18
|
+
var _sortable = require("@dnd-kit/sortable");
|
|
19
|
+
|
|
20
|
+
var _linkmoreDesign = require("linkmore-design");
|
|
21
|
+
|
|
22
|
+
var _icons = require("@ant-design/icons");
|
|
23
|
+
|
|
24
|
+
var _utilities = require("@dnd-kit/utilities");
|
|
25
|
+
|
|
26
|
+
var _lodash = require("lodash");
|
|
27
|
+
|
|
28
|
+
var UNLLVALUE = [null, undefined];
|
|
29
|
+
|
|
30
|
+
var SortItem = function SortItem(props) {
|
|
31
|
+
var _a, _b;
|
|
32
|
+
|
|
33
|
+
var _useSortable = (0, _sortable.useSortable)({
|
|
34
|
+
id: "".concat(props.id)
|
|
35
|
+
}),
|
|
36
|
+
attributes = _useSortable.attributes,
|
|
37
|
+
listeners = _useSortable.listeners,
|
|
38
|
+
setNodeRef = _useSortable.setNodeRef,
|
|
39
|
+
transform = _useSortable.transform,
|
|
40
|
+
transition = _useSortable.transition;
|
|
41
|
+
|
|
42
|
+
var style = {
|
|
43
|
+
transform: _utilities.CSS.Transform.toString(transform),
|
|
44
|
+
transition: transition
|
|
45
|
+
};
|
|
46
|
+
return /*#__PURE__*/_react.default.createElement("div", Object.assign({
|
|
47
|
+
ref: setNodeRef,
|
|
48
|
+
className: 'lm_custom_item',
|
|
49
|
+
style: style
|
|
50
|
+
}, attributes), /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Checkbox, {
|
|
51
|
+
checked: ((_a = props.item) === null || _a === void 0 ? void 0 : _a.show) === false ? false : true,
|
|
52
|
+
onChange: function onChange(e) {
|
|
53
|
+
return props.toggleShow(e.target.checked, props.id);
|
|
54
|
+
},
|
|
55
|
+
className: "filter_item-content"
|
|
56
|
+
}, (_b = props.item) === null || _b === void 0 ? void 0 : _b.title), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_icons.HolderOutlined, Object.assign({}, listeners, {
|
|
57
|
+
className: 'lm_custom_icon sort_item'
|
|
58
|
+
}))));
|
|
59
|
+
};
|
|
60
|
+
/** order show fixed */
|
|
61
|
+
|
|
62
|
+
|
|
63
|
+
var FilterSort = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
64
|
+
var _ref$filter = _ref.filter,
|
|
65
|
+
filter = _ref$filter === void 0 ? [] : _ref$filter,
|
|
66
|
+
_ref$filterStateValue = _ref.filterStateValue,
|
|
67
|
+
filterStateValue = _ref$filterStateValue === void 0 ? {} : _ref$filterStateValue;
|
|
68
|
+
|
|
69
|
+
var _useState = (0, _react.useState)([]),
|
|
70
|
+
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
|
71
|
+
localFilter = _useState2[0],
|
|
72
|
+
setLocalFilter = _useState2[1];
|
|
73
|
+
|
|
74
|
+
var _useState3 = (0, _react.useState)({}),
|
|
75
|
+
_useState4 = (0, _slicedToArray2.default)(_useState3, 2),
|
|
76
|
+
colStateValue = _useState4[0],
|
|
77
|
+
setColStateValue = _useState4[1];
|
|
78
|
+
|
|
79
|
+
var sortMenu = (0, _react.useMemo)(function () {
|
|
80
|
+
var cloneCol = (0, _lodash.cloneDeep)(localFilter);
|
|
81
|
+
cloneCol.forEach(function (item, index) {
|
|
82
|
+
var _a, _b;
|
|
83
|
+
|
|
84
|
+
var order = (_a = filterStateValue[item.field]) === null || _a === void 0 ? void 0 : _a.order;
|
|
85
|
+
item.order = order !== undefined && order !== null ? order : UNLLVALUE.includes(item.order) ? index : item.order;
|
|
86
|
+
item.show = ((_b = filterStateValue[item.field]) === null || _b === void 0 ? void 0 : _b.show) === false ? false : UNLLVALUE.includes(item.show) ? true : !!item.show;
|
|
87
|
+
});
|
|
88
|
+
return cloneCol;
|
|
89
|
+
}, [localFilter, colStateValue]);
|
|
90
|
+
var isCheckAll = (0, _react.useMemo)(function () {
|
|
91
|
+
var showLength = localFilter.filter(function (item) {
|
|
92
|
+
return item.show !== false;
|
|
93
|
+
});
|
|
94
|
+
return {
|
|
95
|
+
indeterminate: (showLength === null || showLength === void 0 ? void 0 : showLength.length) && showLength.length !== localFilter.length ? true : false,
|
|
96
|
+
checkAll: showLength.length === localFilter.length
|
|
97
|
+
};
|
|
98
|
+
}, [localFilter]);
|
|
99
|
+
(0, _react.useEffect)(function () {
|
|
100
|
+
console.log(localFilter, 'localFilter');
|
|
101
|
+
}, [localFilter]);
|
|
102
|
+
(0, _react.useEffect)(function () {
|
|
103
|
+
setLocalFilter(filter);
|
|
104
|
+
setColStateValue(filterStateValue);
|
|
105
|
+
}, []);
|
|
106
|
+
var sensors = (0, _core.useSensors)((0, _core.useSensor)(_core.PointerSensor), (0, _core.useSensor)(_core.KeyboardSensor, {
|
|
107
|
+
coordinateGetter: _sortable.sortableKeyboardCoordinates
|
|
108
|
+
}));
|
|
109
|
+
/** 排序结束回调 */
|
|
110
|
+
|
|
111
|
+
var handleDragEnd = function handleDragEnd(event) {
|
|
112
|
+
var active = event.active,
|
|
113
|
+
over = event.over;
|
|
114
|
+
|
|
115
|
+
if (active.id !== over.id) {
|
|
116
|
+
setLocalFilter(function (items) {
|
|
117
|
+
var oldIndex = items.findIndex(function (s) {
|
|
118
|
+
return s.field === active.id;
|
|
119
|
+
});
|
|
120
|
+
var newIndex = items.findIndex(function (s) {
|
|
121
|
+
return s.field === over.id;
|
|
122
|
+
});
|
|
123
|
+
console.log((0, _sortable.arrayMove)(items, oldIndex, newIndex), 77);
|
|
124
|
+
return (0, _sortable.arrayMove)(items, oldIndex, newIndex).map(function (item, index) {
|
|
125
|
+
return Object.assign(Object.assign({}, item), {
|
|
126
|
+
order: index
|
|
127
|
+
});
|
|
128
|
+
});
|
|
129
|
+
});
|
|
130
|
+
}
|
|
131
|
+
};
|
|
132
|
+
/** 添加是否显示 */
|
|
133
|
+
|
|
134
|
+
|
|
135
|
+
var toggleShow = function toggleShow(value, id) {
|
|
136
|
+
var resultColumns = localFilter.map(function (item) {
|
|
137
|
+
if (item.field === id) {
|
|
138
|
+
return Object.assign(Object.assign({}, item), {
|
|
139
|
+
show: item.show === false ? true : false
|
|
140
|
+
});
|
|
141
|
+
}
|
|
142
|
+
|
|
143
|
+
return Object.assign({}, item);
|
|
144
|
+
});
|
|
145
|
+
setLocalFilter(resultColumns);
|
|
146
|
+
};
|
|
147
|
+
/** 切换是否全选 */
|
|
148
|
+
|
|
149
|
+
|
|
150
|
+
var onCheckAllChange = function onCheckAllChange() {
|
|
151
|
+
var resultColumns = localFilter.map(function (item) {
|
|
152
|
+
return Object.assign(Object.assign({}, item), {
|
|
153
|
+
show: isCheckAll.checkAll ? false : true
|
|
154
|
+
});
|
|
155
|
+
});
|
|
156
|
+
console.log(resultColumns, 'resultColumns');
|
|
157
|
+
setLocalFilter(resultColumns);
|
|
158
|
+
};
|
|
159
|
+
|
|
160
|
+
(0, _react.useImperativeHandle)(ref, function () {
|
|
161
|
+
return {
|
|
162
|
+
getLocalFilter: function getLocalFilter() {
|
|
163
|
+
return localFilter;
|
|
164
|
+
},
|
|
165
|
+
getFilterStateValue: function getFilterStateValue() {
|
|
166
|
+
var obj = {};
|
|
167
|
+
localFilter.forEach(function (item) {
|
|
168
|
+
obj[item.field] = {};
|
|
169
|
+
|
|
170
|
+
if (![undefined, null].includes(item.order)) {
|
|
171
|
+
obj[item.field]['order'] = item.order;
|
|
172
|
+
}
|
|
173
|
+
|
|
174
|
+
if (![undefined, null].includes(item.order)) {
|
|
175
|
+
obj[item.field]['show'] = item.show;
|
|
176
|
+
}
|
|
177
|
+
});
|
|
178
|
+
return obj;
|
|
179
|
+
}
|
|
180
|
+
};
|
|
181
|
+
});
|
|
182
|
+
return /*#__PURE__*/_react.default.createElement("div", {
|
|
183
|
+
className: 'lm_custom_option_columns'
|
|
184
|
+
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
185
|
+
className: 'global_setting'
|
|
186
|
+
}, /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Checkbox, {
|
|
187
|
+
indeterminate: isCheckAll.indeterminate,
|
|
188
|
+
onChange: onCheckAllChange,
|
|
189
|
+
checked: isCheckAll.checkAll
|
|
190
|
+
}, "\u5168\u9009"), /*#__PURE__*/_react.default.createElement("span", {
|
|
191
|
+
onClick: function onClick() {
|
|
192
|
+
return setLocalFilter(filter);
|
|
193
|
+
}
|
|
194
|
+
}, "\u91CD\u7F6E")), !!(sortMenu === null || sortMenu === void 0 ? void 0 : sortMenu.length) && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_core.DndContext, {
|
|
195
|
+
sensors: sensors,
|
|
196
|
+
collisionDetection: _core.closestCenter,
|
|
197
|
+
onDragEnd: handleDragEnd
|
|
198
|
+
}, /*#__PURE__*/_react.default.createElement(_sortable.SortableContext, {
|
|
199
|
+
items: sortMenu === null || sortMenu === void 0 ? void 0 : sortMenu.map(function (v) {
|
|
200
|
+
return "".concat(v.field);
|
|
201
|
+
}),
|
|
202
|
+
strategy: _sortable.verticalListSortingStrategy
|
|
203
|
+
}, sortMenu === null || sortMenu === void 0 ? void 0 : sortMenu.map(function (item) {
|
|
204
|
+
return /*#__PURE__*/_react.default.createElement(SortItem, {
|
|
205
|
+
key: item.field,
|
|
206
|
+
toggleShow: toggleShow,
|
|
207
|
+
item: item,
|
|
208
|
+
id: item.field
|
|
209
|
+
});
|
|
210
|
+
})))));
|
|
211
|
+
});
|
|
212
|
+
var _default = FilterSort;
|
|
213
|
+
exports.default = _default;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { TableProps } from 'antd';
|
|
3
|
+
export interface ICustomTableOptionProps {
|
|
4
|
+
className?: string;
|
|
5
|
+
style?: React.CSSProperties;
|
|
6
|
+
size?: 'small' | 'default' | 'middle';
|
|
7
|
+
filter?: Record<string, any>[];
|
|
8
|
+
columns?: TableProps<any>['columns'];
|
|
9
|
+
onSave?: (data: any) => void;
|
|
10
|
+
}
|
|
11
|
+
declare const LMCustomTableOption: React.FC<ICustomTableOptionProps>;
|
|
12
|
+
export default LMCustomTableOption;
|