@teamix/pro 1.5.0 → 1.5.1

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.
Files changed (69) hide show
  1. package/dist/pro.css +1 -1
  2. package/dist/pro.js +1103 -123
  3. package/dist/pro.min.css +1 -1
  4. package/dist/pro.min.js +1 -1
  5. package/es/actions/index.d.ts +4 -0
  6. package/es/actions/index.js +34 -9
  7. package/es/actions/index.scss +5 -0
  8. package/es/card/index.scss +7 -0
  9. package/es/index.d.ts +1 -1
  10. package/es/index.js +1 -1
  11. package/es/sidebar/components/tree-node/components/IconSwitch/index.d.ts +2 -2
  12. package/es/sidebar/components/tree-node/components/IconSwitch/index.scss +1 -1
  13. package/es/sidebar/index.d.ts +2 -0
  14. package/es/sidebar/index.js +3 -1
  15. package/es/table/components/CardView/index.d.ts +5 -0
  16. package/es/table/components/CardView/index.js +446 -0
  17. package/es/table/components/CardView/index.scss +46 -0
  18. package/es/table/components/Filter/index.d.ts +1 -0
  19. package/es/table/components/Filter/index.js +21 -14
  20. package/es/table/components/Layout/index.js +4 -2
  21. package/es/table/components/LoadMore/index.d.ts +20 -0
  22. package/es/table/components/LoadMore/index.js +107 -0
  23. package/es/table/components/LoadMore/index.scss +19 -0
  24. package/es/table/components/QuickAction/index.d.ts +1 -0
  25. package/es/table/components/ToolBar/CardSwitch.d.ts +8 -0
  26. package/es/table/components/ToolBar/CardSwitch.js +63 -0
  27. package/es/table/components/ToolBar/FilterColumnIcon.js +13 -2
  28. package/es/table/components/ToolBar/Fullscreen.js +15 -2
  29. package/es/table/components/ToolBar/index.js +64 -33
  30. package/es/table/components/ToolBar/index.scss +10 -1
  31. package/es/table/index.js +132 -34
  32. package/es/table/typing.d.ts +69 -0
  33. package/es/table/utils/columnRender.d.ts +1 -1
  34. package/es/table/utils/columnRender.js +4 -2
  35. package/es/table/utils/genProColumnToColumn.d.ts +1 -1
  36. package/es/table/utils/genProColumnToColumn.js +3 -1
  37. package/lib/actions/index.d.ts +4 -0
  38. package/lib/actions/index.js +33 -9
  39. package/lib/actions/index.scss +5 -0
  40. package/lib/card/index.scss +7 -0
  41. package/lib/index.d.ts +1 -1
  42. package/lib/index.js +1 -1
  43. package/lib/sidebar/components/tree-node/components/IconSwitch/index.d.ts +2 -2
  44. package/lib/sidebar/components/tree-node/components/IconSwitch/index.scss +1 -1
  45. package/lib/sidebar/index.d.ts +2 -0
  46. package/lib/sidebar/index.js +12 -1
  47. package/lib/table/components/CardView/index.d.ts +5 -0
  48. package/lib/table/components/CardView/index.js +468 -0
  49. package/lib/table/components/CardView/index.scss +46 -0
  50. package/lib/table/components/Filter/index.d.ts +1 -0
  51. package/lib/table/components/Filter/index.js +21 -14
  52. package/lib/table/components/Layout/index.js +4 -2
  53. package/lib/table/components/LoadMore/index.d.ts +20 -0
  54. package/lib/table/components/LoadMore/index.js +128 -0
  55. package/lib/table/components/LoadMore/index.scss +19 -0
  56. package/lib/table/components/QuickAction/index.d.ts +1 -0
  57. package/lib/table/components/ToolBar/CardSwitch.d.ts +8 -0
  58. package/lib/table/components/ToolBar/CardSwitch.js +82 -0
  59. package/lib/table/components/ToolBar/FilterColumnIcon.js +13 -2
  60. package/lib/table/components/ToolBar/Fullscreen.js +15 -2
  61. package/lib/table/components/ToolBar/index.js +65 -32
  62. package/lib/table/components/ToolBar/index.scss +10 -1
  63. package/lib/table/index.js +134 -34
  64. package/lib/table/typing.d.ts +69 -0
  65. package/lib/table/utils/columnRender.d.ts +1 -1
  66. package/lib/table/utils/columnRender.js +4 -2
  67. package/lib/table/utils/genProColumnToColumn.d.ts +1 -1
  68. package/lib/table/utils/genProColumnToColumn.js +3 -1
  69. package/package.json +1 -1
@@ -0,0 +1,446 @@
1
+ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
2
+
3
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
4
+
5
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
6
+
7
+ 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; }
8
+
9
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
10
+
11
+ 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."); }
12
+
13
+ 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); }
14
+
15
+ 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; }
16
+
17
+ 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; }
18
+
19
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
20
+
21
+ import React, { isValidElement, useEffect, useMemo, useState } from 'react';
22
+ import { Grid } from '@alicloudfe/components';
23
+ import { getDeepValue, ProCard, ProInfo } from '../../../';
24
+ import { ProSkeletonRaw } from '../../../skeleton';
25
+ import { usePrefixCls } from '@teamix/utils';
26
+ import './index.scss';
27
+ import { renderCell } from '../../utils/columnRender';
28
+ import LoadMore from '../LoadMore';
29
+ var Row = Grid.Row,
30
+ Col = Grid.Col;
31
+ var cls = usePrefixCls('teamix-pro-table-card-view');
32
+
33
+ var CardView = function CardView(props) {
34
+ var _cardViewProps$scroll;
35
+
36
+ var dataSource = props.dataSource,
37
+ _props$columns = props.columns,
38
+ columns = _props$columns === void 0 ? [] : _props$columns,
39
+ _props$loading = props.loading,
40
+ loading = _props$loading === void 0 ? false : _props$loading,
41
+ originColumns = props.originColumns,
42
+ _props$cardViewProps = props.cardViewProps,
43
+ cardViewProps = _props$cardViewProps === void 0 ? {} : _props$cardViewProps,
44
+ actionRef = props.actionRef,
45
+ context = props.context,
46
+ scrollHeight = props.scrollHeight,
47
+ _props$showSkeleton = props.showSkeleton,
48
+ showSkeleton = _props$showSkeleton === void 0 ? false : _props$showSkeleton; // 加载状态
49
+
50
+ var _useState = useState('none'),
51
+ _useState2 = _slicedToArray(_useState, 2),
52
+ loadState = _useState2[0],
53
+ setLoadState = _useState2[1]; // 骨架屏状态
54
+
55
+
56
+ var _useState3 = useState(true),
57
+ _useState4 = _slicedToArray(_useState3, 2),
58
+ skeletonVisible = _useState4[0],
59
+ setSkeletonVisible = _useState4[1]; // 加载状态变化回调
60
+
61
+
62
+ useEffect(function () {
63
+ setLoadState(loading ? 'loading' : 'loadMore');
64
+ setSkeletonVisible(showSkeleton);
65
+
66
+ if (showSkeleton) {
67
+ setLoadState('none');
68
+ }
69
+ }, [loading, skeletonVisible, showSkeleton]);
70
+
71
+ var getDataIndexValue = function getDataIndexValue(dataIndex, dataSource) {
72
+ if (Array.isArray(dataIndex)) {
73
+ return dataIndex.map(function (item) {
74
+ return getDeepValue(item !== null && item !== void 0 ? item : '', dataSource);
75
+ });
76
+ }
77
+
78
+ return getDeepValue(dataIndex !== null && dataIndex !== void 0 ? dataIndex : '', dataSource);
79
+ }; // 获取卡片 columns
80
+
81
+
82
+ var cardColumns = useMemo(function () {
83
+ return columns.map(function (column) {
84
+ var _originColumn$title;
85
+
86
+ var originColumn = originColumns === null || originColumns === void 0 ? void 0 : originColumns.find(function (item) {
87
+ return item.dataIndex === column.dataIndex;
88
+ });
89
+ var render = column === null || column === void 0 ? void 0 : column.render;
90
+
91
+ if (typeof (column === null || column === void 0 ? void 0 : column.render) === 'function') {
92
+ render = function render(value, record) {
93
+ var _column$render;
94
+
95
+ return column === null || column === void 0 ? void 0 : (_column$render = column.render) === null || _column$render === void 0 ? void 0 : _column$render.call(column, value, undefined, record);
96
+ };
97
+ } else {
98
+ var _Object$entries$map, _Object$entries, _Object$entries$map2, _column$render2;
99
+
100
+ render = Object.fromEntries((_Object$entries$map = (_Object$entries = Object.entries((_column$render2 = column === null || column === void 0 ? void 0 : column.render) !== null && _column$render2 !== void 0 ? _column$render2 : {})) === null || _Object$entries === void 0 ? void 0 : (_Object$entries$map2 = _Object$entries.map) === null || _Object$entries$map2 === void 0 ? void 0 : _Object$entries$map2.call(_Object$entries, function (_ref) {
101
+ var _ref2 = _slicedToArray(_ref, 2),
102
+ k = _ref2[0],
103
+ v = _ref2[1];
104
+
105
+ if (typeof v === 'function') {
106
+ return [k, function (value, record) {
107
+ return v === null || v === void 0 ? void 0 : v(value, undefined, record);
108
+ }];
109
+ }
110
+
111
+ return [k, v];
112
+ })) !== null && _Object$entries$map !== void 0 ? _Object$entries$map : []);
113
+ }
114
+
115
+ return _objectSpread(_objectSpread({}, column), {}, {
116
+ title: (_originColumn$title = originColumn === null || originColumn === void 0 ? void 0 : originColumn.title) !== null && _originColumn$title !== void 0 ? _originColumn$title : column.title,
117
+ render: render
118
+ });
119
+ }).filter(function (item) {
120
+ return !(item === null || item === void 0 ? void 0 : item.actionSchema);
121
+ });
122
+ }, [columns, originColumns]); // 获取单个渲染数据
123
+
124
+ var renderCardInfoItem = function renderCardInfoItem(itemProps, record, index) {
125
+ if (itemProps) {
126
+ if (typeof itemProps === 'string' || Array.isArray(itemProps)) {
127
+ var _titleColumn$cell, _titleColumn$cell2;
128
+
129
+ var titleColumn = cardColumns.find(function (item) {
130
+ return item.dataIndex === itemProps;
131
+ });
132
+ return (_titleColumn$cell = titleColumn === null || titleColumn === void 0 ? void 0 : (_titleColumn$cell2 = titleColumn.cell) === null || _titleColumn$cell2 === void 0 ? void 0 : _titleColumn$cell2.call(titleColumn, getDataIndexValue(itemProps, record), index, record)) !== null && _titleColumn$cell !== void 0 ? _titleColumn$cell : '';
133
+ }
134
+
135
+ return renderCell(getDataIndexValue(itemProps.dataIndex, record), itemProps, index, record, actionRef, context);
136
+ }
137
+ }; // 渲染卡片title
138
+
139
+
140
+ var renderCardTitle = function renderCardTitle(record, index) {
141
+ var _cardColumns$, _cardColumns$$render, _cardColumns$2, _cardColumns$2$cell, _cardColumns$3;
142
+
143
+ var titleProp = cardViewProps.title;
144
+ var title = titleProp;
145
+
146
+ if (typeof titleProp === 'function') {
147
+ title = titleProp === null || titleProp === void 0 ? void 0 : titleProp(index, record);
148
+ }
149
+
150
+ if (titleProp) {
151
+ return renderCardInfoItem(title, record, index);
152
+ } // 【默认情况】看看第一列有没有 description,有的话,只取 title
153
+
154
+
155
+ if (cardColumns === null || cardColumns === void 0 ? void 0 : (_cardColumns$ = cardColumns[0]) === null || _cardColumns$ === void 0 ? void 0 : (_cardColumns$$render = _cardColumns$.render) === null || _cardColumns$$render === void 0 ? void 0 : _cardColumns$$render.description) {
156
+ var _originColumn$render;
157
+
158
+ var column = cardColumns === null || cardColumns === void 0 ? void 0 : cardColumns[0];
159
+ var originColumn = originColumns === null || originColumns === void 0 ? void 0 : originColumns[0]; // 转化为新的 table columns
160
+
161
+ var _columns = _objectSpread(_objectSpread({}, originColumn), {}, {
162
+ render: _objectSpread(_objectSpread({}, originColumn === null || originColumn === void 0 ? void 0 : originColumn.render), {}, {
163
+ value: originColumn === null || originColumn === void 0 ? void 0 : (_originColumn$render = originColumn.render) === null || _originColumn$render === void 0 ? void 0 : _originColumn$render.value,
164
+ description: undefined,
165
+ descriptionCopy: undefined
166
+ })
167
+ });
168
+
169
+ return renderCell(getDataIndexValue(column === null || column === void 0 ? void 0 : column.dataIndex, record), _columns, index, record, actionRef, context);
170
+ } // 【默认情况】直接拿第一列的 cell
171
+
172
+
173
+ return cardColumns === null || cardColumns === void 0 ? void 0 : (_cardColumns$2 = cardColumns[0]) === null || _cardColumns$2 === void 0 ? void 0 : (_cardColumns$2$cell = _cardColumns$2.cell) === null || _cardColumns$2$cell === void 0 ? void 0 : _cardColumns$2$cell.call(_cardColumns$2, getDataIndexValue(cardColumns === null || cardColumns === void 0 ? void 0 : (_cardColumns$3 = cardColumns[0]) === null || _cardColumns$3 === void 0 ? void 0 : _cardColumns$3.dataIndex, record), index, record);
174
+ }; // 渲染卡片subTitle
175
+
176
+
177
+ var renderCardSubTitle = function renderCardSubTitle(record, index) {
178
+ var _cardColumns$4, _cardColumns$4$render;
179
+
180
+ var subTitleProp = cardViewProps.subTitle;
181
+ var subTitle = subTitleProp;
182
+
183
+ if (typeof subTitleProp === 'function') {
184
+ subTitle = subTitleProp === null || subTitleProp === void 0 ? void 0 : subTitleProp(index, record);
185
+ }
186
+
187
+ if (subTitle) {
188
+ return renderCardInfoItem(subTitle, record, index);
189
+ } // 【默认情况】看看第一列有没有 description,有的话,只取 title
190
+
191
+
192
+ if (cardColumns === null || cardColumns === void 0 ? void 0 : (_cardColumns$4 = cardColumns[0]) === null || _cardColumns$4 === void 0 ? void 0 : (_cardColumns$4$render = _cardColumns$4.render) === null || _cardColumns$4$render === void 0 ? void 0 : _cardColumns$4$render.description) {
193
+ var _originColumn$render2, _column$render3;
194
+
195
+ var column = cardColumns === null || cardColumns === void 0 ? void 0 : cardColumns[0];
196
+ var originColumn = originColumns === null || originColumns === void 0 ? void 0 : originColumns[0]; // 转化为新的 table columns
197
+
198
+ var _columns2 = _objectSpread(_objectSpread({}, originColumn), {}, {
199
+ render: {
200
+ value: originColumn === null || originColumn === void 0 ? void 0 : (_originColumn$render2 = originColumn.render) === null || _originColumn$render2 === void 0 ? void 0 : _originColumn$render2.description,
201
+ description: undefined,
202
+ descriptionCopy: undefined
203
+ }
204
+ });
205
+
206
+ return renderCell(getDataIndexValue(column === null || column === void 0 ? void 0 : (_column$render3 = column.render) === null || _column$render3 === void 0 ? void 0 : _column$render3.value, record), _columns2, index, record, actionRef, context);
207
+ }
208
+ }; // 获取ProInfoColumns
209
+
210
+
211
+ var getPropInfoColumns = function getPropInfoColumns(record, index) {
212
+ var contentProp = cardViewProps.content;
213
+ var content = contentProp;
214
+
215
+ if (typeof contentProp === 'function') {
216
+ content = contentProp === null || contentProp === void 0 ? void 0 : contentProp(index, record);
217
+ }
218
+
219
+ if (content) {
220
+ return content.map(function (item) {
221
+ if (typeof item === 'string') {
222
+ return cardColumns.find(function (column) {
223
+ return column.dataIndex === item;
224
+ });
225
+ }
226
+
227
+ return content;
228
+ });
229
+ } // 默认取4条数据
230
+
231
+
232
+ return cardColumns.filter(function (item, index) {
233
+ return index > 0 && index < 5;
234
+ });
235
+ }; // 从表格columns获取Action配置
236
+
237
+
238
+ var getActionGroupFromColumn = function getActionGroupFromColumn(dataIndex, record, index) {
239
+ var actionColumn;
240
+
241
+ if (dataIndex) {
242
+ actionColumn = columns === null || columns === void 0 ? void 0 : columns.find(function (item) {
243
+ return item.dataIndex.toString() === dataIndex.toString();
244
+ });
245
+ } else {
246
+ // 默认继承表格操作列
247
+ // 获取操作列,只能获取最后一列
248
+ actionColumn = columns === null || columns === void 0 ? void 0 : columns[(columns === null || columns === void 0 ? void 0 : columns.length) - 1];
249
+ }
250
+
251
+ if (actionColumn.actionSchema) {
252
+ var _actionColumn, _actionColumn$actionS;
253
+
254
+ var newActionColumn = _objectSpread(_objectSpread({}, actionColumn), {}, {
255
+ actionSchema: {
256
+ actions: (_actionColumn = actionColumn) === null || _actionColumn === void 0 ? void 0 : (_actionColumn$actionS = _actionColumn.actionSchema) === null || _actionColumn$actionS === void 0 ? void 0 : _actionColumn$actionS.actions,
257
+ max: 1
258
+ }
259
+ });
260
+
261
+ return renderCell(null, newActionColumn, index, record, actionRef, context);
262
+ }
263
+
264
+ return /*#__PURE__*/React.createElement(React.Fragment, null);
265
+ }; // 获取Card操作列配置
266
+
267
+
268
+ var getProCardExtra = function getProCardExtra(record, index) {
269
+ var extraProp = cardViewProps.extra;
270
+ var extra = extraProp;
271
+
272
+ if (typeof extraProp === 'function') {
273
+ extra = extraProp === null || extraProp === void 0 ? void 0 : extraProp(index, record);
274
+ }
275
+
276
+ if (Array.isArray(extra)) {
277
+ return /*#__PURE__*/React.createElement("div", {
278
+ className: cls('extra')
279
+ }, extra.map(function (item) {
280
+ if (typeof item === 'string') {
281
+ return /*#__PURE__*/React.createElement("div", {
282
+ className: cls('extra-item')
283
+ }, getActionGroupFromColumn(item, record, index));
284
+ }
285
+
286
+ if ( /*#__PURE__*/isValidElement(item)) {
287
+ return /*#__PURE__*/React.createElement("div", {
288
+ className: cls('extra-item')
289
+ }, item);
290
+ }
291
+
292
+ return /*#__PURE__*/React.createElement("div", {
293
+ className: cls('extra-item')
294
+ }, renderCell(null, item, index, record, actionRef, context));
295
+ }));
296
+ }
297
+
298
+ return getActionGroupFromColumn(undefined, record, index);
299
+ }; // 渲染Tag
300
+
301
+
302
+ var getTags = function getTags(record, index) {
303
+ var tagProp = cardViewProps.tags;
304
+ var tags = tagProp !== null && tagProp !== void 0 ? tagProp : [];
305
+
306
+ if (typeof tagProp === 'function') {
307
+ var _tagProp;
308
+
309
+ tags = (_tagProp = tagProp === null || tagProp === void 0 ? void 0 : tagProp(index, record)) !== null && _tagProp !== void 0 ? _tagProp : [];
310
+ }
311
+
312
+ var getTagFromColumns = function getTagFromColumns(columns, dataIndex) {
313
+ var _columns$render, _columns$render2, _columns$render4, _columns$render5, _columns$render7, _columns$render8;
314
+
315
+ var text = getDataIndexValue(dataIndex, record);
316
+
317
+ if ((columns === null || columns === void 0 ? void 0 : (_columns$render = columns.render) === null || _columns$render === void 0 ? void 0 : _columns$render.value) && typeof (columns === null || columns === void 0 ? void 0 : (_columns$render2 = columns.render) === null || _columns$render2 === void 0 ? void 0 : _columns$render2.value) === 'string') {
318
+ var _columns$render3;
319
+
320
+ text = columns === null || columns === void 0 ? void 0 : (_columns$render3 = columns.render) === null || _columns$render3 === void 0 ? void 0 : _columns$render3.value;
321
+ }
322
+
323
+ if ((columns === null || columns === void 0 ? void 0 : (_columns$render4 = columns.render) === null || _columns$render4 === void 0 ? void 0 : _columns$render4.value) && typeof (columns === null || columns === void 0 ? void 0 : (_columns$render5 = columns.render) === null || _columns$render5 === void 0 ? void 0 : _columns$render5.value) === 'function') {
324
+ var _columns$render6;
325
+
326
+ text = columns === null || columns === void 0 ? void 0 : (_columns$render6 = columns.render) === null || _columns$render6 === void 0 ? void 0 : _columns$render6.value(getDataIndexValue(dataIndex, record), index, record);
327
+ }
328
+
329
+ var color = columns === null || columns === void 0 ? void 0 : (_columns$render7 = columns.render) === null || _columns$render7 === void 0 ? void 0 : _columns$render7.color;
330
+
331
+ if (typeof (columns === null || columns === void 0 ? void 0 : (_columns$render8 = columns.render) === null || _columns$render8 === void 0 ? void 0 : _columns$render8.color) === 'function') {
332
+ var _columns$render9;
333
+
334
+ color = columns === null || columns === void 0 ? void 0 : (_columns$render9 = columns.render) === null || _columns$render9 === void 0 ? void 0 : _columns$render9.color(getDataIndexValue(dataIndex, record), index, record);
335
+ }
336
+
337
+ return {
338
+ children: text,
339
+ color: color
340
+ };
341
+ };
342
+
343
+ return tags.map(function (tagItem) {
344
+ if (typeof tagItem === 'string') {
345
+ var tagColumns = columns.find(function (item) {
346
+ return item.dataIndex === tagItem;
347
+ });
348
+ return getTagFromColumns(tagColumns, tagItem);
349
+ }
350
+
351
+ if (_typeof(tagItem) === 'object') {
352
+ return getTagFromColumns(tagItem, tagItem === null || tagItem === void 0 ? void 0 : tagItem.dataIndex);
353
+ }
354
+ });
355
+ }; // 加载下一页回调
356
+
357
+
358
+ var onLoadMore = function onLoadMore() {
359
+ var _actionRef$current, _actionRef$current$ne;
360
+
361
+ actionRef === null || actionRef === void 0 ? void 0 : (_actionRef$current = actionRef.current) === null || _actionRef$current === void 0 ? void 0 : (_actionRef$current$ne = _actionRef$current.nextPage) === null || _actionRef$current$ne === void 0 ? void 0 : _actionRef$current$ne.call(_actionRef$current);
362
+ }; // 触底回调
363
+
364
+
365
+ var onScrollBottom = function onScrollBottom() {
366
+ if (cardViewProps.autoLoadNextPage !== false) {
367
+ var _cardViewProps$onScro;
368
+
369
+ onLoadMore();
370
+ cardViewProps === null || cardViewProps === void 0 ? void 0 : (_cardViewProps$onScro = cardViewProps.onScrollBottom) === null || _cardViewProps$onScro === void 0 ? void 0 : _cardViewProps$onScro.call(cardViewProps);
371
+ }
372
+ }; // 获取ProCard配置
373
+
374
+
375
+ var getProCardProps = function getProCardProps(record, index) {
376
+ var _cardViewProps$cardPr;
377
+
378
+ var external = ['onCollapse', 'onSelect', 'onClick'];
379
+ return Object.fromEntries(Object.entries((_cardViewProps$cardPr = cardViewProps.cardProps) !== null && _cardViewProps$cardPr !== void 0 ? _cardViewProps$cardPr : {}).map(function (_ref3) {
380
+ var _ref4 = _slicedToArray(_ref3, 2),
381
+ key = _ref4[0],
382
+ value = _ref4[1];
383
+
384
+ if (typeof value === 'function' && !external.includes(key)) {
385
+ return [key, value === null || value === void 0 ? void 0 : value(index, record)];
386
+ }
387
+
388
+ if (typeof value === 'function' && external.includes(key)) {
389
+ return [key, function () {
390
+ for (var _len = arguments.length, others = new Array(_len), _key = 0; _key < _len; _key++) {
391
+ others[_key] = arguments[_key];
392
+ }
393
+
394
+ return value === null || value === void 0 ? void 0 : value.apply(void 0, [index, record].concat(others));
395
+ }];
396
+ }
397
+
398
+ return [key, value];
399
+ }));
400
+ }; // 渲染单个卡片
401
+
402
+
403
+ var renderCard = function renderCard(record, index) {
404
+ return /*#__PURE__*/React.createElement(Col, {
405
+ xxs: 24,
406
+ xs: 12,
407
+ s: 8,
408
+ m: 8,
409
+ l: 6,
410
+ xl: 6,
411
+ key: index,
412
+ className: cls('card-item')
413
+ }, /*#__PURE__*/React.createElement(ProCard, _objectSpread({
414
+ title: renderCardTitle(record, index),
415
+ subTitle: renderCardSubTitle(record, index),
416
+ extra: getProCardExtra(record, index),
417
+ tags: getTags(record, index)
418
+ }, getProCardProps(record, index)), /*#__PURE__*/React.createElement(ProInfo, {
419
+ columns: getPropInfoColumns(record, index),
420
+ dataSource: record,
421
+ context: {
422
+ record: record,
423
+ index: index
424
+ }
425
+ })));
426
+ };
427
+
428
+ return /*#__PURE__*/React.createElement("div", {
429
+ className: cls()
430
+ }, /*#__PURE__*/React.createElement(LoadMore, {
431
+ onScrollBottom: onScrollBottom,
432
+ onLoadMore: onLoadMore,
433
+ loadState: loadState,
434
+ scrollHeight: (_cardViewProps$scroll = cardViewProps.scrollHeight) !== null && _cardViewProps$scroll !== void 0 ? _cardViewProps$scroll : scrollHeight
435
+ }, skeletonVisible && /*#__PURE__*/React.createElement(ProSkeletonRaw.Content, null), !skeletonVisible && /*#__PURE__*/React.createElement(Row, {
436
+ gutter: 16,
437
+ wrap: true,
438
+ style: {
439
+ marginTop: '-16px'
440
+ }
441
+ }, dataSource === null || dataSource === void 0 ? void 0 : dataSource.map(function (item, index) {
442
+ return renderCard(item, index);
443
+ }))));
444
+ };
445
+
446
+ export default CardView;
@@ -0,0 +1,46 @@
1
+ .teamix-pro-table-card-view {
2
+ &-card-item {
3
+ margin-top: 16px;
4
+ }
5
+
6
+ // 样式覆盖
7
+ .teamix-pro-card-title-name.teamix-pro-card-title-name {
8
+
9
+ .teamix-pro-field.teamix-pro-field.teamix-pro-field {
10
+ font-weight: var(--font-weight-medium);
11
+ font-size: var(--card-title-font-size, 14px);
12
+ }
13
+
14
+ .next-form-preview.next-form-preview.next-form-preview {
15
+ font-weight: var(--font-weight-medium);
16
+ font-size: var(--card-title-font-size, 14px);
17
+ }
18
+
19
+
20
+ }
21
+
22
+ .next-card-header-subtitle.next-card-header-subtitle {
23
+
24
+ .teamix-pro-field.teamix-pro-field.teamix-pro-field {
25
+ font-size: var(--card-sub-title-font-size, 12px);
26
+ color: var(--card-sub-title-color, #5a5a5a);
27
+ }
28
+
29
+ .next-form-preview.next-form-preview.next-form-preview {
30
+ font-size: var(--card-sub-title-font-size, 12px);
31
+ color: var(--card-sub-title-color, #5a5a5a);
32
+ }
33
+
34
+
35
+ }
36
+
37
+ &-extra {
38
+ display: flex;
39
+ align-items: center;
40
+
41
+ &-item {
42
+ display: inline-block;
43
+ margin-left: 8px;
44
+ }
45
+ }
46
+ }
@@ -4,6 +4,7 @@ import { ProTableColumnProps, ProTableActionType } from '../../typing';
4
4
  declare type ProTableFilterProps = {
5
5
  column: ProTableColumnProps;
6
6
  actionRef: React.MutableRefObject<ProTableActionType | undefined>;
7
+ switchCardView?: 'table' | 'card';
7
8
  };
8
9
  declare const Filter: React.FC<ProTableFilterProps>;
9
10
  export default Filter;
@@ -36,7 +36,8 @@ var RadioItem = Menu.RadioItem;
36
36
 
37
37
  var Filter = function Filter(props) {
38
38
  var column = props.column,
39
- actionRef = props.actionRef;
39
+ actionRef = props.actionRef,
40
+ switchCardView = props.switchCardView;
40
41
  var _column$filtersWidth = column.filtersWidth,
41
42
  filtersWidth = _column$filtersWidth === void 0 ? 130 : _column$filtersWidth; // 选中过滤项
42
43
 
@@ -172,7 +173,7 @@ var Filter = function Filter(props) {
172
173
  btn: true
173
174
  }),
174
175
  onClick: function onClick() {
175
- var _actionRef$current2, _actionRef$current2$f, _actionRef$current$ge6, _actionRef$current3, _actionRef$current3$g, _actionRef$current3$g2, _actionRef$current4, _actionRef$current4$s, _actionRef$current5, _actionRef$current6, _actionRef$current6$r, _actionRef$current7, _actionRef$current7$r, _actionRef$current8, _actionRef$current8$c;
176
+ var _actionRef$current2, _actionRef$current2$f, _actionRef$current$ge6, _actionRef$current3, _actionRef$current3$g, _actionRef$current3$g2, _actionRef$current4, _actionRef$current4$s, _actionRef$current5, _actionRef$current7, _actionRef$current7$r, _actionRef$current8, _actionRef$current8$r, _actionRef$current9, _actionRef$current9$c;
176
177
 
177
178
  (_actionRef$current2 = actionRef.current) === null || _actionRef$current2 === void 0 ? void 0 : (_actionRef$current2$f = _actionRef$current2.filterDataSource) === null || _actionRef$current2$f === void 0 ? void 0 : _actionRef$current2$f.call(_actionRef$current2, column.dataIndex); // 先获取此列的param
178
179
 
@@ -198,13 +199,19 @@ var Filter = function Filter(props) {
198
199
 
199
200
  if (pageInfo && (pageInfo === null || pageInfo === void 0 ? void 0 : pageInfo.targetPageKey)) {
200
201
  targetPageKey = pageInfo === null || pageInfo === void 0 ? void 0 : pageInfo.targetPageKey;
202
+ }
203
+
204
+ if (switchCardView === 'card') {
205
+ var _actionRef$current6, _actionRef$current6$s;
206
+
207
+ (_actionRef$current6 = actionRef.current) === null || _actionRef$current6 === void 0 ? void 0 : (_actionRef$current6$s = _actionRef$current6.setData) === null || _actionRef$current6$s === void 0 ? void 0 : _actionRef$current6$s.call(_actionRef$current6, []);
201
208
  } // 发送请求
202
209
 
203
210
 
204
- (_actionRef$current6 = actionRef.current) === null || _actionRef$current6 === void 0 ? void 0 : (_actionRef$current6$r = _actionRef$current6.request) === null || _actionRef$current6$r === void 0 ? void 0 : _actionRef$current6$r.call(_actionRef$current6, _defineProperty({}, targetPageKey, 1));
205
- (_actionRef$current7 = actionRef.current) === null || _actionRef$current7 === void 0 ? void 0 : (_actionRef$current7$r = _actionRef$current7.resetPage) === null || _actionRef$current7$r === void 0 ? void 0 : _actionRef$current7$r.call(_actionRef$current7); // 清空表格选择
211
+ (_actionRef$current7 = actionRef.current) === null || _actionRef$current7 === void 0 ? void 0 : (_actionRef$current7$r = _actionRef$current7.request) === null || _actionRef$current7$r === void 0 ? void 0 : _actionRef$current7$r.call(_actionRef$current7, _defineProperty({}, targetPageKey, 1));
212
+ (_actionRef$current8 = actionRef.current) === null || _actionRef$current8 === void 0 ? void 0 : (_actionRef$current8$r = _actionRef$current8.resetPage) === null || _actionRef$current8$r === void 0 ? void 0 : _actionRef$current8$r.call(_actionRef$current8); // 清空表格选择
206
213
 
207
- (_actionRef$current8 = actionRef.current) === null || _actionRef$current8 === void 0 ? void 0 : (_actionRef$current8$c = _actionRef$current8.clearRowSelection) === null || _actionRef$current8$c === void 0 ? void 0 : _actionRef$current8$c.call(_actionRef$current8);
214
+ (_actionRef$current9 = actionRef.current) === null || _actionRef$current9 === void 0 ? void 0 : (_actionRef$current9$c = _actionRef$current9.clearRowSelection) === null || _actionRef$current9$c === void 0 ? void 0 : _actionRef$current9$c.call(_actionRef$current9);
208
215
  setVisible(false);
209
216
  }
210
217
  }, getMessage('ok')), /*#__PURE__*/React.createElement(Button, {
@@ -214,31 +221,31 @@ var Filter = function Filter(props) {
214
221
  btn: true
215
222
  }),
216
223
  onClick: function onClick() {
217
- var _actionRef$current$ge7, _actionRef$current9, _actionRef$current9$g, _actionRef$current9$g2, _actionRef$current10, _actionRef$current10$, _actionRef$current11, _actionRef$current11$;
224
+ var _actionRef$current$ge7, _actionRef$current10, _actionRef$current10$, _actionRef$current10$2, _actionRef$current11, _actionRef$current11$, _actionRef$current12, _actionRef$current12$;
218
225
 
219
226
  setSelected([]);
220
- var rules = (_actionRef$current$ge7 = (_actionRef$current9 = actionRef.current) === null || _actionRef$current9 === void 0 ? void 0 : (_actionRef$current9$g = _actionRef$current9.getState) === null || _actionRef$current9$g === void 0 ? void 0 : (_actionRef$current9$g2 = _actionRef$current9$g.call(_actionRef$current9)) === null || _actionRef$current9$g2 === void 0 ? void 0 : _actionRef$current9$g2.filterRules) !== null && _actionRef$current$ge7 !== void 0 ? _actionRef$current$ge7 : {};
221
- (_actionRef$current10 = actionRef.current) === null || _actionRef$current10 === void 0 ? void 0 : (_actionRef$current10$ = _actionRef$current10.setFilterRules) === null || _actionRef$current10$ === void 0 ? void 0 : _actionRef$current10$.call(_actionRef$current10, _objectSpread(_objectSpread({}, rules), {}, _defineProperty({}, column.dataIndex, {
227
+ var rules = (_actionRef$current$ge7 = (_actionRef$current10 = actionRef.current) === null || _actionRef$current10 === void 0 ? void 0 : (_actionRef$current10$ = _actionRef$current10.getState) === null || _actionRef$current10$ === void 0 ? void 0 : (_actionRef$current10$2 = _actionRef$current10$.call(_actionRef$current10)) === null || _actionRef$current10$2 === void 0 ? void 0 : _actionRef$current10$2.filterRules) !== null && _actionRef$current$ge7 !== void 0 ? _actionRef$current$ge7 : {};
228
+ (_actionRef$current11 = actionRef.current) === null || _actionRef$current11 === void 0 ? void 0 : (_actionRef$current11$ = _actionRef$current11.setFilterRules) === null || _actionRef$current11$ === void 0 ? void 0 : _actionRef$current11$.call(_actionRef$current11, _objectSpread(_objectSpread({}, rules), {}, _defineProperty({}, column.dataIndex, {
222
229
  rules: [],
223
230
  params: ''
224
231
  })));
225
- (_actionRef$current11 = actionRef.current) === null || _actionRef$current11 === void 0 ? void 0 : (_actionRef$current11$ = _actionRef$current11.filterDataSource) === null || _actionRef$current11$ === void 0 ? void 0 : _actionRef$current11$.call(_actionRef$current11, column.dataIndex);
232
+ (_actionRef$current12 = actionRef.current) === null || _actionRef$current12 === void 0 ? void 0 : (_actionRef$current12$ = _actionRef$current12.filterDataSource) === null || _actionRef$current12$ === void 0 ? void 0 : _actionRef$current12$.call(_actionRef$current12, column.dataIndex);
226
233
 
227
234
  if (selected.length > 0) {
228
- var _actionRef$current12, _actionRef$current13, _actionRef$current13$, _actionRef$current14, _actionRef$current14$, _actionRef$current15, _actionRef$current15$;
235
+ var _actionRef$current13, _actionRef$current14, _actionRef$current14$, _actionRef$current15, _actionRef$current15$, _actionRef$current16, _actionRef$current16$;
229
236
 
230
237
  var targetPageKey = 'currentPage';
231
- var pageInfo = (_actionRef$current12 = actionRef.current) === null || _actionRef$current12 === void 0 ? void 0 : _actionRef$current12.pageInfo;
238
+ var pageInfo = (_actionRef$current13 = actionRef.current) === null || _actionRef$current13 === void 0 ? void 0 : _actionRef$current13.pageInfo;
232
239
 
233
240
  if (pageInfo && (pageInfo === null || pageInfo === void 0 ? void 0 : pageInfo.targetPageKey)) {
234
241
  targetPageKey = pageInfo === null || pageInfo === void 0 ? void 0 : pageInfo.targetPageKey;
235
242
  } // 发送请求
236
243
 
237
244
 
238
- (_actionRef$current13 = actionRef.current) === null || _actionRef$current13 === void 0 ? void 0 : (_actionRef$current13$ = _actionRef$current13.request) === null || _actionRef$current13$ === void 0 ? void 0 : _actionRef$current13$.call(_actionRef$current13, _defineProperty({}, targetPageKey, 1));
239
- (_actionRef$current14 = actionRef.current) === null || _actionRef$current14 === void 0 ? void 0 : (_actionRef$current14$ = _actionRef$current14.resetPage) === null || _actionRef$current14$ === void 0 ? void 0 : _actionRef$current14$.call(_actionRef$current14); // 清空表格选择
245
+ (_actionRef$current14 = actionRef.current) === null || _actionRef$current14 === void 0 ? void 0 : (_actionRef$current14$ = _actionRef$current14.request) === null || _actionRef$current14$ === void 0 ? void 0 : _actionRef$current14$.call(_actionRef$current14, _defineProperty({}, targetPageKey, 1));
246
+ (_actionRef$current15 = actionRef.current) === null || _actionRef$current15 === void 0 ? void 0 : (_actionRef$current15$ = _actionRef$current15.resetPage) === null || _actionRef$current15$ === void 0 ? void 0 : _actionRef$current15$.call(_actionRef$current15); // 清空表格选择
240
247
 
241
- (_actionRef$current15 = actionRef.current) === null || _actionRef$current15 === void 0 ? void 0 : (_actionRef$current15$ = _actionRef$current15.clearRowSelection) === null || _actionRef$current15$ === void 0 ? void 0 : _actionRef$current15$.call(_actionRef$current15);
248
+ (_actionRef$current16 = actionRef.current) === null || _actionRef$current16 === void 0 ? void 0 : (_actionRef$current16$ = _actionRef$current16.clearRowSelection) === null || _actionRef$current16$ === void 0 ? void 0 : _actionRef$current16$.call(_actionRef$current16);
242
249
  } // setVisible(!visible);
243
250
 
244
251
  }
@@ -1,4 +1,4 @@
1
- var _excluded = ["header", "mainAction", "extra", "actionRef", "dataFilter", "dataFilterFormRef", "afterDataFilter", "rowSelection", "toolBar"];
1
+ var _excluded = ["header", "mainAction", "extra", "actionRef", "dataFilter", "dataFilterFormRef", "afterDataFilter", "rowSelection", "toolBar", "dataTeamixSpm"];
2
2
 
3
3
  function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
4
4
 
@@ -32,6 +32,7 @@ var Layout = function Layout(props) {
32
32
  afterDataFilter = props.afterDataFilter,
33
33
  rowSelection = props.rowSelection,
34
34
  toolBar = props.toolBar,
35
+ dataTeamixSpm = props.dataTeamixSpm,
35
36
  otherProps = _objectWithoutProperties(props, _excluded); // 渲染主操作区
36
37
 
37
38
 
@@ -56,7 +57,8 @@ var Layout = function Layout(props) {
56
57
  return /*#__PURE__*/React.createElement("div", {
57
58
  className: cls('main-action')
58
59
  }, /*#__PURE__*/React.createElement(ProActionGroup, _objectSpread(_objectSpread({}, mainAction), {}, {
59
- context: _objectSpread(_objectSpread({}, defaultContext), mainAction.context)
60
+ context: _objectSpread(_objectSpread({}, defaultContext), mainAction.context),
61
+ "data-teamix-spm": dataTeamixSpm ? "".concat(dataTeamixSpm, "-mainAction") : undefined
60
62
  })));
61
63
  } else return mainAction;
62
64
  }; // 渲染 addonAfter
@@ -0,0 +1,20 @@
1
+ import React from 'react';
2
+ import './index.scss';
3
+ export declare type LoadMoreProps = {
4
+ /** 内容 **/
5
+ children?: React.ReactNode;
6
+ /** 加载状态 受控 **/
7
+ loadState?: 'loading' | 'loadMore' | 'noMore' | 'none';
8
+ /** 滚动条滚动到底部触发事件 **/
9
+ onScrollBottom?: () => void;
10
+ /** 加载状态改变回调 **/
11
+ onChangeLoadState?: (state: LoadMoreProps['loadState']) => void;
12
+ /** 点击加载更多回调 **/
13
+ onLoadMore?: () => void;
14
+ /** 滚动区域高度 **/
15
+ scrollHeight?: number | string;
16
+ /** 当前滚动区域位置 **/
17
+ scrollPosition?: number;
18
+ };
19
+ declare const LoadMore: React.FC<LoadMoreProps>;
20
+ export default LoadMore;