@teamix/pro 1.5.7-beta.1 → 1.5.8
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/pro.js +111 -41
- package/dist/pro.min.js +1 -1
- package/es/index.d.ts +1 -1
- package/es/index.js +1 -1
- package/es/info/components/baseInfo/index.js +4 -2
- package/es/info/index.js +8 -4
- package/es/info/typing.d.ts +2 -0
- package/es/table/components/CardView/index.js +51 -18
- package/es/table/components/ToolBar/Fullscreen.js +2 -2
- package/es/table/index.js +40 -15
- package/es/table/typing.d.ts +15 -0
- package/lib/index.d.ts +1 -1
- package/lib/index.js +1 -1
- package/lib/info/components/baseInfo/index.js +4 -2
- package/lib/info/index.js +8 -4
- package/lib/info/typing.d.ts +2 -0
- package/lib/table/components/CardView/index.js +49 -16
- package/lib/table/components/ToolBar/Fullscreen.js +2 -2
- package/lib/table/index.js +40 -15
- package/lib/table/typing.d.ts +15 -0
- package/package.json +1 -1
package/es/index.d.ts
CHANGED
@@ -28,5 +28,5 @@ export * from './table';
|
|
28
28
|
export * from './sidebar';
|
29
29
|
export * from './utils';
|
30
30
|
export * from './timeline';
|
31
|
-
declare const version = "1.5.
|
31
|
+
declare const version = "1.5.8";
|
32
32
|
export { version, ProAction, ProCard, ProField, ProForm, ProInfo, ProPageContainer, ProPageHeader, ProSkeleton, ProTable, ProSidebar, ProTimeline, TeamixIcon, hooks, nocode, templates, utils, };
|
package/es/index.js
CHANGED
@@ -35,7 +35,7 @@ export * from './table';
|
|
35
35
|
export * from './sidebar';
|
36
36
|
export * from './utils';
|
37
37
|
export * from './timeline';
|
38
|
-
var version = '1.5.
|
38
|
+
var version = '1.5.8';
|
39
39
|
export { version, ProAction, ProCard, ProField, ProForm, ProInfo,
|
40
40
|
// ProLayout,
|
41
41
|
ProPageContainer, ProPageHeader, ProSkeleton, ProTable, ProSidebar, ProTimeline, TeamixIcon, hooks, nocode, templates, utils };
|
@@ -17,7 +17,9 @@ var ProBaseInfo = function ProBaseInfo(props) {
|
|
17
17
|
actionRef = props.actionRef,
|
18
18
|
layout = props.layout,
|
19
19
|
size = props.size,
|
20
|
-
context = props.context
|
20
|
+
context = props.context,
|
21
|
+
_props$disabledAutoSi = props.disabledAutoSize,
|
22
|
+
disabledAutoSize = _props$disabledAutoSi === void 0 ? false : _props$disabledAutoSi;
|
21
23
|
var defaultLayout = defaultLayoutMap[getLayout((_size$width = size === null || size === void 0 ? void 0 : size.width) !== null && _size$width !== void 0 ? _size$width : 0)];
|
22
24
|
// 获取列内的布局参数
|
23
25
|
var getFormItemLayout = function getFormItemLayout(colspan) {
|
@@ -84,7 +86,7 @@ var ProBaseInfo = function ProBaseInfo(props) {
|
|
84
86
|
}));
|
85
87
|
});
|
86
88
|
};
|
87
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, (size === null || size === void 0 ? void 0 : size.width) && /*#__PURE__*/React.createElement(Row, {
|
89
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, ((size === null || size === void 0 ? void 0 : size.width) || disabledAutoSize) && /*#__PURE__*/React.createElement(Row, {
|
88
90
|
wrap: true,
|
89
91
|
className: "teamix-pro-info-content-row",
|
90
92
|
gutter: 20
|
package/es/info/index.js
CHANGED
@@ -1,4 +1,4 @@
|
|
1
|
-
var _excluded = ["type", "url", "method", "formatResult", "formatParams", "params", "actionRef", "header", "onSuccess", "onError", "beforeRequest", "extendParams", "className", "style", "columns", "layout", "dataSource", "loading", "extra", "context"],
|
1
|
+
var _excluded = ["type", "url", "method", "formatResult", "formatParams", "params", "actionRef", "header", "onSuccess", "onError", "beforeRequest", "extendParams", "className", "style", "columns", "layout", "dataSource", "loading", "extra", "context", "disabledAutoSize"],
|
2
2
|
_excluded2 = ["context"];
|
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
|
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; }
|
@@ -47,6 +47,7 @@ var ProInfo = function ProInfo(props) {
|
|
47
47
|
userLoading = props.loading,
|
48
48
|
extra = props.extra,
|
49
49
|
infoContext = props.context,
|
50
|
+
disabledAutoSize = props.disabledAutoSize,
|
50
51
|
others = _objectWithoutProperties(props, _excluded);
|
51
52
|
var _useContext = useContext(ProInfoGroupContext),
|
52
53
|
contextUrl = _useContext.url,
|
@@ -153,7 +154,8 @@ var ProInfo = function ProInfo(props) {
|
|
153
154
|
result: data,
|
154
155
|
actionRef: actionRef,
|
155
156
|
layout: layout,
|
156
|
-
context: context
|
157
|
+
context: context,
|
158
|
+
disabledAutoSize: disabledAutoSize
|
157
159
|
}), type === 'header' && /*#__PURE__*/React.createElement(ProHeaderInfo, {
|
158
160
|
dataSource: dataSource,
|
159
161
|
columns: columns,
|
@@ -163,7 +165,8 @@ var ProInfo = function ProInfo(props) {
|
|
163
165
|
actionRef: actionRef,
|
164
166
|
layout: layout,
|
165
167
|
size: size,
|
166
|
-
context: context
|
168
|
+
context: context,
|
169
|
+
disabledAutoSize: disabledAutoSize
|
167
170
|
}), type === 'base' && /*#__PURE__*/React.createElement(ProBaseInfo, {
|
168
171
|
dataSource: dataSource,
|
169
172
|
columns: columns,
|
@@ -172,7 +175,8 @@ var ProInfo = function ProInfo(props) {
|
|
172
175
|
actionRef: actionRef,
|
173
176
|
layout: layout,
|
174
177
|
size: size,
|
175
|
-
context: context
|
178
|
+
context: context,
|
179
|
+
disabledAutoSize: disabledAutoSize
|
176
180
|
})));
|
177
181
|
};
|
178
182
|
ProInfo.Group = ProInfoGroup;
|
package/es/info/typing.d.ts
CHANGED
@@ -51,6 +51,8 @@ export declare type ProInfoBaseProps = {
|
|
51
51
|
loading?: boolean;
|
52
52
|
/** 上下文传递 */
|
53
53
|
context?: object;
|
54
|
+
/** 是否在获取宽度之后才渲染Info 是否忽略首次响应式计算 **/
|
55
|
+
disabledAutoSize?: boolean;
|
54
56
|
} & ProInfoHeaderProps & ProInfoRequestProps;
|
55
57
|
/** ProInfoColumnsProps info 单元格 定义 */
|
56
58
|
export declare type ProInfoItemProps = ProInfoColumnsProps;
|
@@ -9,19 +9,21 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
|
|
9
9
|
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; }
|
10
10
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
11
11
|
import React, { isValidElement, useEffect, useMemo, useState } from 'react';
|
12
|
-
import { Grid } from '@alicloudfe/components';
|
13
|
-
import { getDeepValue, ProCard, ProInfo } from '../../../';
|
12
|
+
import { Grid, Loading } from '@alicloudfe/components';
|
13
|
+
import { getDeepValue, getMessage, ProCard, ProInfo } from '../../../';
|
14
14
|
import { ProSkeletonRaw } from '../../../skeleton';
|
15
15
|
import { usePrefixCls } from '@teamix/utils';
|
16
16
|
import './index.scss';
|
17
17
|
import { renderCell } from '../../utils/columnRender';
|
18
18
|
import LoadMore from '../LoadMore';
|
19
|
+
import Result from '@teamix/result';
|
19
20
|
var Row = Grid.Row,
|
20
21
|
Col = Grid.Col;
|
21
22
|
var cls = usePrefixCls('teamix-pro-table-card-view');
|
22
23
|
var CardView = function CardView(props) {
|
23
24
|
var _cardViewProps$scroll;
|
24
|
-
var dataSource = props.dataSource,
|
25
|
+
var _props$dataSource = props.dataSource,
|
26
|
+
dataSource = _props$dataSource === void 0 ? [] : _props$dataSource,
|
25
27
|
_props$columns = props.columns,
|
26
28
|
columns = _props$columns === void 0 ? [] : _props$columns,
|
27
29
|
_props$loading = props.loading,
|
@@ -47,11 +49,24 @@ var CardView = function CardView(props) {
|
|
47
49
|
// 加载状态变化回调
|
48
50
|
useEffect(function () {
|
49
51
|
setLoadState(loading ? 'loading' : 'loadMore');
|
50
|
-
|
52
|
+
if (cardViewProps.showSkeleton) {
|
53
|
+
setSkeletonVisible(cardViewProps.showSkeleton);
|
54
|
+
} else {
|
55
|
+
setSkeletonVisible(showSkeleton);
|
56
|
+
}
|
51
57
|
if (showSkeleton) {
|
52
58
|
setLoadState('none');
|
53
59
|
}
|
54
|
-
|
60
|
+
if (dataSource.length === 0) {
|
61
|
+
setLoadState('none');
|
62
|
+
}
|
63
|
+
}, [loading, skeletonVisible, showSkeleton, cardViewProps.showSkeleton, dataSource]);
|
64
|
+
// 数据源变化毁掉
|
65
|
+
useEffect(function () {
|
66
|
+
if (dataSource.length === 0) {
|
67
|
+
setLoadState('none');
|
68
|
+
}
|
69
|
+
}, [dataSource]);
|
55
70
|
var getDataIndexValue = function getDataIndexValue(dataIndex, dataSource) {
|
56
71
|
if (Array.isArray(dataIndex)) {
|
57
72
|
return dataIndex.map(function (item) {
|
@@ -316,16 +331,17 @@ var CardView = function CardView(props) {
|
|
316
331
|
};
|
317
332
|
// 渲染单个卡片
|
318
333
|
var renderCard = function renderCard(record, index) {
|
319
|
-
|
334
|
+
var _cardViewProps$cardRe;
|
335
|
+
return /*#__PURE__*/React.createElement(Col, _objectSpread({
|
320
336
|
xxs: 24,
|
321
337
|
xs: 12,
|
322
|
-
s:
|
338
|
+
s: 12,
|
323
339
|
m: 8,
|
324
340
|
l: 6,
|
325
341
|
xl: 6,
|
326
342
|
key: index,
|
327
343
|
className: cls('card-item')
|
328
|
-
}, /*#__PURE__*/React.createElement(ProCard, _objectSpread({
|
344
|
+
}, (_cardViewProps$cardRe = cardViewProps === null || cardViewProps === void 0 ? void 0 : cardViewProps.cardResponsiveProps) !== null && _cardViewProps$cardRe !== void 0 ? _cardViewProps$cardRe : {}), /*#__PURE__*/React.createElement(ProCard, _objectSpread({
|
329
345
|
title: renderCardTitle(record, index),
|
330
346
|
subTitle: renderCardSubTitle(record, index),
|
331
347
|
extra: getProCardExtra(record, index),
|
@@ -336,24 +352,41 @@ var CardView = function CardView(props) {
|
|
336
352
|
context: {
|
337
353
|
record: record,
|
338
354
|
index: index
|
355
|
+
},
|
356
|
+
disabledAutoSize: true
|
357
|
+
})));
|
358
|
+
};
|
359
|
+
// 渲染卡片主体
|
360
|
+
var renderCardBox = function renderCardBox() {
|
361
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, skeletonVisible && /*#__PURE__*/React.createElement(ProSkeletonRaw.Content, null), !skeletonVisible && (dataSource === null || dataSource === void 0 ? void 0 : dataSource.length) === 0 && /*#__PURE__*/React.createElement(Result, {
|
362
|
+
theme: "hybridcloud-container",
|
363
|
+
img: "noData",
|
364
|
+
title: getMessage('noData'),
|
365
|
+
style: {
|
366
|
+
padding: '50px 0 60px'
|
339
367
|
}
|
368
|
+
}), !skeletonVisible && (dataSource === null || dataSource === void 0 ? void 0 : dataSource.length) > 0 && /*#__PURE__*/React.createElement(Row, {
|
369
|
+
gutter: 16,
|
370
|
+
wrap: true,
|
371
|
+
style: {
|
372
|
+
marginTop: '-16px'
|
373
|
+
}
|
374
|
+
}, dataSource === null || dataSource === void 0 ? void 0 : dataSource.map(function (item, index) {
|
375
|
+
return renderCard(item, index);
|
340
376
|
})));
|
341
377
|
};
|
342
378
|
return /*#__PURE__*/React.createElement("div", {
|
343
379
|
className: cls()
|
344
|
-
}, /*#__PURE__*/React.createElement(
|
380
|
+
}, (cardViewProps === null || cardViewProps === void 0 ? void 0 : cardViewProps.useTablePagination) && /*#__PURE__*/React.createElement(Loading, {
|
381
|
+
visible: loading,
|
382
|
+
style: {
|
383
|
+
width: '100%'
|
384
|
+
}
|
385
|
+
}, renderCardBox()), !(cardViewProps === null || cardViewProps === void 0 ? void 0 : cardViewProps.useTablePagination) && /*#__PURE__*/React.createElement(LoadMore, {
|
345
386
|
onScrollBottom: onScrollBottom,
|
346
387
|
onLoadMore: onLoadMore,
|
347
388
|
loadState: loadState,
|
348
389
|
scrollHeight: (_cardViewProps$scroll = cardViewProps.scrollHeight) !== null && _cardViewProps$scroll !== void 0 ? _cardViewProps$scroll : scrollHeight
|
349
|
-
},
|
350
|
-
gutter: 16,
|
351
|
-
wrap: true,
|
352
|
-
style: {
|
353
|
-
marginTop: '-16px'
|
354
|
-
}
|
355
|
-
}, dataSource === null || dataSource === void 0 ? void 0 : dataSource.map(function (item, index) {
|
356
|
-
return renderCard(item, index);
|
357
|
-
}))));
|
390
|
+
}, renderCardBox()));
|
358
391
|
};
|
359
392
|
export default CardView;
|
@@ -39,7 +39,7 @@ var FullScreen = function FullScreen(props) {
|
|
39
39
|
filterEnableRef.current.fullscreen = false;
|
40
40
|
// 移除类名
|
41
41
|
if (document && ((_document = document) === null || _document === void 0 ? void 0 : _document.body)) {
|
42
|
-
document.body.classList.remove('teamix-pro-table-fullscreen');
|
42
|
+
document.body.classList.remove('teamix-pro-table-fullscreen-for-body');
|
43
43
|
}
|
44
44
|
};
|
45
45
|
// 全屏开启之后
|
@@ -59,7 +59,7 @@ var FullScreen = function FullScreen(props) {
|
|
59
59
|
filterEnableRef.current.normal = false;
|
60
60
|
// 为 body 添加类名,用于判断是否全屏
|
61
61
|
if (document && ((_document2 = document) === null || _document2 === void 0 ? void 0 : _document2.body)) {
|
62
|
-
document.body.classList.add('teamix-pro-table-fullscreen');
|
62
|
+
document.body.classList.add('teamix-pro-table-fullscreen-for-body');
|
63
63
|
}
|
64
64
|
// 消息提示
|
65
65
|
Message.show({
|
package/es/table/index.js
CHANGED
@@ -1,4 +1,5 @@
|
|
1
|
-
var _excluded = ["header", "className", "tableClassName", "mainAction", "extra", "dataFilter", "afterDataFilter", "toolBar", "columns", "useRowSelection", "rowSelection", "onChangeRowSelection", "getRowSelection", "primaryKey", "footerAction", "footer", "url", "pageKey", "pageSizeKey", "method", "params", "formatSort", "formatParams", "formatResult", "requestConfig", "requestWhenMount", "showPagination", "pageSizeList", "responsivePaginationType", "showSkeleton", "skeletonSize", "actionRef", "dataSource", "filterDebounce", "footerSuction", "autoRefresh", "customRequest", "filterColumnType", "defaultFilterParams", "reserveSelectedRecords", "size", "disableSelectAll", "context", "fixedTableBody", "isTree", "toolBarAutoWidth", "data-teamix-spm", "switchCardView", "cardViewProps", "defaultView"]
|
1
|
+
var _excluded = ["header", "className", "tableClassName", "mainAction", "extra", "dataFilter", "afterDataFilter", "toolBar", "columns", "useRowSelection", "rowSelection", "onChangeRowSelection", "getRowSelection", "primaryKey", "footerAction", "footer", "url", "pageKey", "pageSizeKey", "method", "params", "formatSort", "formatParams", "formatResult", "requestConfig", "requestWhenMount", "showPagination", "pageSizeList", "responsivePaginationType", "showSkeleton", "skeletonSize", "actionRef", "dataSource", "filterDebounce", "footerSuction", "autoRefresh", "customRequest", "filterColumnType", "defaultFilterParams", "reserveSelectedRecords", "size", "disableSelectAll", "context", "fixedTableBody", "isTree", "toolBarAutoWidth", "data-teamix-spm", "switchCardView", "cardViewProps", "defaultView"],
|
2
|
+
_excluded2 = ["onChange"];
|
2
3
|
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); }
|
3
4
|
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
4
5
|
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
@@ -179,7 +180,7 @@ var ProTable = function ProTable(props) {
|
|
179
180
|
_useState10 = _slicedToArray(_useState9, 2),
|
180
181
|
sort = _useState10[0],
|
181
182
|
setSort = _useState10[1];
|
182
|
-
var _useState11 = useState(!propsDataSource && requestWhenMount && propsShowSkeleton),
|
183
|
+
var _useState11 = useState(!propsDataSource && requestWhenMount && propsShowSkeleton && !!url),
|
183
184
|
_useState12 = _slicedToArray(_useState11, 2),
|
184
185
|
showSkeleton = _useState12[0],
|
185
186
|
setShowSkeleton = _useState12[1]; // 首次加载,渲染骨架屏
|
@@ -223,6 +224,13 @@ var ProTable = function ProTable(props) {
|
|
223
224
|
// 存储定时器 id
|
224
225
|
var autoRefreshTimerRef = useRef();
|
225
226
|
var onResize = null;
|
227
|
+
// useEffect(() => {
|
228
|
+
// setShowSkeleton(propsShowSkeleton);
|
229
|
+
// }, [propsShowSkeleton]);
|
230
|
+
// useEffect(() => {
|
231
|
+
// console.log('传入的props变化', propsLoading);
|
232
|
+
// setShowLoading(propsLoading ?? false);
|
233
|
+
// }, [propsLoading]);
|
226
234
|
useEffect(function () {
|
227
235
|
var _propsDataFilter$sche, _propsDataFilter$sche2;
|
228
236
|
getHeaderHeight(fullscreenState);
|
@@ -524,7 +532,7 @@ var ProTable = function ProTable(props) {
|
|
524
532
|
},
|
525
533
|
refresh: function refresh(params) {
|
526
534
|
// card视角的刷新等于重新请求
|
527
|
-
if (switchViewState === 'card') {
|
535
|
+
if (switchViewState === 'card' && !propsDataSource) {
|
528
536
|
setCurrentPage(1);
|
529
537
|
_request(_objectSpread(_objectSpread({}, params), {}, _defineProperty({}, targetPageKey, 1)));
|
530
538
|
setShowSkeleton(true);
|
@@ -555,9 +563,13 @@ var ProTable = function ProTable(props) {
|
|
555
563
|
setCurrentPage(1);
|
556
564
|
},
|
557
565
|
nextPage: function nextPage() {
|
566
|
+
var _props$paginationProp, _props$paginationProp2;
|
558
567
|
var newCurrentPage = currentPage + 1;
|
559
568
|
setCurrentPage(newCurrentPage);
|
560
|
-
|
569
|
+
props === null || props === void 0 ? void 0 : (_props$paginationProp = props.paginationProps) === null || _props$paginationProp === void 0 ? void 0 : (_props$paginationProp2 = _props$paginationProp.onChange) === null || _props$paginationProp2 === void 0 ? void 0 : _props$paginationProp2.call(_props$paginationProp, newCurrentPage, {});
|
570
|
+
if (!propsDataSource) {
|
571
|
+
_request(_defineProperty({}, targetPageKey, newCurrentPage));
|
572
|
+
}
|
561
573
|
},
|
562
574
|
rowSelection: rowSelection,
|
563
575
|
clearRowSelection: function clearRowSelection() {
|
@@ -586,17 +598,25 @@ var ProTable = function ProTable(props) {
|
|
586
598
|
},
|
587
599
|
switchView: function switchView(view) {
|
588
600
|
setSwitchViewState(view);
|
589
|
-
|
590
|
-
|
601
|
+
if (!propsDataSource) {
|
602
|
+
setCurrentPage(1);
|
603
|
+
}
|
591
604
|
if (view === 'table') {
|
592
|
-
var _request4;
|
593
605
|
setPageSize(pageSize !== null && pageSize !== void 0 ? pageSize : 20);
|
594
|
-
|
606
|
+
if (!propsDataSource) {
|
607
|
+
var _request4;
|
608
|
+
setShowSkeleton(true);
|
609
|
+
_request((_request4 = {}, _defineProperty(_request4, targetPageSizeKey, pageSize !== null && pageSize !== void 0 ? pageSize : 20), _defineProperty(_request4, targetPageKey, 1), _request4));
|
610
|
+
}
|
595
611
|
}
|
596
612
|
if (view === 'card') {
|
597
|
-
var _cardViewProps$pageSi
|
613
|
+
var _cardViewProps$pageSi;
|
598
614
|
setPageSize((_cardViewProps$pageSi = cardViewProps === null || cardViewProps === void 0 ? void 0 : cardViewProps.pageSize) !== null && _cardViewProps$pageSi !== void 0 ? _cardViewProps$pageSi : 12);
|
599
|
-
|
615
|
+
if (!propsDataSource) {
|
616
|
+
var _cardViewProps$pageSi2, _request5;
|
617
|
+
setShowSkeleton(true);
|
618
|
+
_request((_request5 = {}, _defineProperty(_request5, targetPageSizeKey, (_cardViewProps$pageSi2 = cardViewProps === null || cardViewProps === void 0 ? void 0 : cardViewProps.pageSize) !== null && _cardViewProps$pageSi2 !== void 0 ? _cardViewProps$pageSi2 : 12), _defineProperty(_request5, targetPageKey, 1), _request5));
|
619
|
+
}
|
600
620
|
}
|
601
621
|
getHeaderHeight(fullscreenState);
|
602
622
|
}
|
@@ -953,7 +973,11 @@ var ProTable = function ProTable(props) {
|
|
953
973
|
}
|
954
974
|
}
|
955
975
|
}
|
956
|
-
if (showPagination && switchViewState === 'table') {
|
976
|
+
if (showPagination && switchViewState === 'table' || (cardViewProps === null || cardViewProps === void 0 ? void 0 : cardViewProps.useTablePagination) && switchViewState === 'card') {
|
977
|
+
var _props$paginationProp3;
|
978
|
+
var _ref6 = (_props$paginationProp3 = props === null || props === void 0 ? void 0 : props.paginationProps) !== null && _props$paginationProp3 !== void 0 ? _props$paginationProp3 : {},
|
979
|
+
onPaginationPropsChange = _ref6.onChange,
|
980
|
+
othersPaginationProps = _objectWithoutProperties(_ref6, _excluded2);
|
957
981
|
return /*#__PURE__*/React.createElement("div", {
|
958
982
|
className: cls('footer', {
|
959
983
|
'footer-has-rowSelection': rowSelection,
|
@@ -963,8 +987,9 @@ var ProTable = function ProTable(props) {
|
|
963
987
|
className: cls('footer-right-wrapper')
|
964
988
|
}, showSkeleton ? /*#__PURE__*/React.createElement(Skeleton.Footer.Pagination, null) : /*#__PURE__*/React.createElement(React.Fragment, null, data.length > 0 && /*#__PURE__*/React.createElement(Pagination, _objectSpread({
|
965
989
|
className: cls('pagination'),
|
966
|
-
onChange: function onChange(number) {
|
967
|
-
|
990
|
+
onChange: function onChange(number, e) {
|
991
|
+
onChangePagination(number);
|
992
|
+
onPaginationPropsChange === null || onPaginationPropsChange === void 0 ? void 0 : onPaginationPropsChange(number, e);
|
968
993
|
},
|
969
994
|
total: total,
|
970
995
|
responsivePaginationType: responsivePaginationType,
|
@@ -983,7 +1008,7 @@ var ProTable = function ProTable(props) {
|
|
983
1008
|
onPageSizeChange: function onPageSizeChange(number) {
|
984
1009
|
return onChangePaginationSize(number);
|
985
1010
|
}
|
986
|
-
},
|
1011
|
+
}, othersPaginationProps)))));
|
987
1012
|
} else if (!showPagination && (footerAction || rowSelection || useRowSelection)) {
|
988
1013
|
return /*#__PURE__*/React.createElement("div", {
|
989
1014
|
className: cls('footer', {
|
@@ -1014,7 +1039,7 @@ var ProTable = function ProTable(props) {
|
|
1014
1039
|
return /*#__PURE__*/React.createElement("div", {
|
1015
1040
|
className: cls({
|
1016
1041
|
'': true,
|
1017
|
-
fullscreen:
|
1042
|
+
fullscreen: isFullScreen
|
1018
1043
|
// 'footer-suction': footerSuctionState && footerSuction,
|
1019
1044
|
}),
|
1020
1045
|
ref: tableRef
|
package/es/table/typing.d.ts
CHANGED
@@ -341,10 +341,23 @@ export declare type ProTableCardProps = {
|
|
341
341
|
scrollDom?: HTMLElement;
|
342
342
|
/** 触底事件 **/
|
343
343
|
onScrollBottom?: () => void;
|
344
|
+
/** 使用表格分页 **/
|
345
|
+
useTablePagination?: boolean;
|
346
|
+
/** 使用响应式 **/
|
347
|
+
cardResponsiveProps?: {
|
348
|
+
xxs?: number;
|
349
|
+
xs?: number;
|
350
|
+
s?: number;
|
351
|
+
m?: number;
|
352
|
+
l?: number;
|
353
|
+
xl?: number;
|
354
|
+
};
|
344
355
|
/** 卡片配置 **/
|
345
356
|
cardProps?: {
|
346
357
|
[key in keyof ProCardProps]?: ProCardProps[key] | ((index: number, record: any) => ProCardProps[key]);
|
347
358
|
};
|
359
|
+
/** 是否展示卡片骨架 **/
|
360
|
+
showSkeleton?: boolean;
|
348
361
|
};
|
349
362
|
/** card 视角 Props (内部组件) **/
|
350
363
|
export declare type ProTableCardViewProps = {
|
@@ -367,5 +380,7 @@ export declare type ProTableCardViewProps = {
|
|
367
380
|
showSkeleton?: boolean;
|
368
381
|
/** ProCard 卡片配置 **/
|
369
382
|
cardProps?: ProTableCardProps['cardProps'];
|
383
|
+
/** 表格分页器参数 **/
|
384
|
+
tablePaginationProps?: PaginationProps;
|
370
385
|
};
|
371
386
|
export {};
|
package/lib/index.d.ts
CHANGED
@@ -28,5 +28,5 @@ export * from './table';
|
|
28
28
|
export * from './sidebar';
|
29
29
|
export * from './utils';
|
30
30
|
export * from './timeline';
|
31
|
-
declare const version = "1.5.
|
31
|
+
declare const version = "1.5.8";
|
32
32
|
export { version, ProAction, ProCard, ProField, ProForm, ProInfo, ProPageContainer, ProPageHeader, ProSkeleton, ProTable, ProSidebar, ProTimeline, TeamixIcon, hooks, nocode, templates, utils, };
|
package/lib/index.js
CHANGED
@@ -280,5 +280,5 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
|
|
280
280
|
if (!((_window = window) === null || _window === void 0 ? void 0 : _window.TEAMIXPRO_WITHOUT_ICON)) {
|
281
281
|
_icon.default.setConfig(_utils.default.getTeamixIconConfig());
|
282
282
|
}
|
283
|
-
var version = '1.5.
|
283
|
+
var version = '1.5.8';
|
284
284
|
exports.version = version;
|
@@ -24,7 +24,9 @@ var ProBaseInfo = function ProBaseInfo(props) {
|
|
24
24
|
actionRef = props.actionRef,
|
25
25
|
layout = props.layout,
|
26
26
|
size = props.size,
|
27
|
-
context = props.context
|
27
|
+
context = props.context,
|
28
|
+
_props$disabledAutoSi = props.disabledAutoSize,
|
29
|
+
disabledAutoSize = _props$disabledAutoSi === void 0 ? false : _props$disabledAutoSi;
|
28
30
|
var defaultLayout = _layout.default[(0, _utils.getLayout)((_size$width = size === null || size === void 0 ? void 0 : size.width) !== null && _size$width !== void 0 ? _size$width : 0)];
|
29
31
|
// 获取列内的布局参数
|
30
32
|
var getFormItemLayout = function getFormItemLayout(colspan) {
|
@@ -91,7 +93,7 @@ var ProBaseInfo = function ProBaseInfo(props) {
|
|
91
93
|
}));
|
92
94
|
});
|
93
95
|
};
|
94
|
-
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, (size === null || size === void 0 ? void 0 : size.width) && /*#__PURE__*/_react.default.createElement(Row, {
|
96
|
+
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, ((size === null || size === void 0 ? void 0 : size.width) || disabledAutoSize) && /*#__PURE__*/_react.default.createElement(Row, {
|
95
97
|
wrap: true,
|
96
98
|
className: "teamix-pro-info-content-row",
|
97
99
|
gutter: 20
|
package/lib/info/index.js
CHANGED
@@ -28,7 +28,7 @@ Object.keys(_typing).forEach(function (key) {
|
|
28
28
|
}
|
29
29
|
});
|
30
30
|
});
|
31
|
-
var _excluded = ["type", "url", "method", "formatResult", "formatParams", "params", "actionRef", "header", "onSuccess", "onError", "beforeRequest", "extendParams", "className", "style", "columns", "layout", "dataSource", "loading", "extra", "context"],
|
31
|
+
var _excluded = ["type", "url", "method", "formatResult", "formatParams", "params", "actionRef", "header", "onSuccess", "onError", "beforeRequest", "extendParams", "className", "style", "columns", "layout", "dataSource", "loading", "extra", "context", "disabledAutoSize"],
|
32
32
|
_excluded2 = ["context"];
|
33
33
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
34
34
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
@@ -69,6 +69,7 @@ var ProInfo = function ProInfo(props) {
|
|
69
69
|
userLoading = props.loading,
|
70
70
|
extra = props.extra,
|
71
71
|
infoContext = props.context,
|
72
|
+
disabledAutoSize = props.disabledAutoSize,
|
72
73
|
others = _objectWithoutProperties(props, _excluded);
|
73
74
|
var _useContext = (0, _react.useContext)(_utils.ProInfoGroupContext),
|
74
75
|
contextUrl = _useContext.url,
|
@@ -175,7 +176,8 @@ var ProInfo = function ProInfo(props) {
|
|
175
176
|
result: data,
|
176
177
|
actionRef: actionRef,
|
177
178
|
layout: layout,
|
178
|
-
context: context
|
179
|
+
context: context,
|
180
|
+
disabledAutoSize: disabledAutoSize
|
179
181
|
}), type === 'header' && /*#__PURE__*/_react.default.createElement(_headerInfo.default, {
|
180
182
|
dataSource: dataSource,
|
181
183
|
columns: columns,
|
@@ -185,7 +187,8 @@ var ProInfo = function ProInfo(props) {
|
|
185
187
|
actionRef: actionRef,
|
186
188
|
layout: layout,
|
187
189
|
size: size,
|
188
|
-
context: context
|
190
|
+
context: context,
|
191
|
+
disabledAutoSize: disabledAutoSize
|
189
192
|
}), type === 'base' && /*#__PURE__*/_react.default.createElement(_baseInfo.default, {
|
190
193
|
dataSource: dataSource,
|
191
194
|
columns: columns,
|
@@ -194,7 +197,8 @@ var ProInfo = function ProInfo(props) {
|
|
194
197
|
actionRef: actionRef,
|
195
198
|
layout: layout,
|
196
199
|
size: size,
|
197
|
-
context: context
|
200
|
+
context: context,
|
201
|
+
disabledAutoSize: disabledAutoSize
|
198
202
|
})));
|
199
203
|
};
|
200
204
|
ProInfo.Group = _InfoGroup.default;
|
package/lib/info/typing.d.ts
CHANGED
@@ -51,6 +51,8 @@ export declare type ProInfoBaseProps = {
|
|
51
51
|
loading?: boolean;
|
52
52
|
/** 上下文传递 */
|
53
53
|
context?: object;
|
54
|
+
/** 是否在获取宽度之后才渲染Info 是否忽略首次响应式计算 **/
|
55
|
+
disabledAutoSize?: boolean;
|
54
56
|
} & ProInfoHeaderProps & ProInfoRequestProps;
|
55
57
|
/** ProInfoColumnsProps info 单元格 定义 */
|
56
58
|
export declare type ProInfoItemProps = ProInfoColumnsProps;
|
@@ -12,6 +12,7 @@ var _utils = require("@teamix/utils");
|
|
12
12
|
require("./index.scss");
|
13
13
|
var _columnRender = require("../../utils/columnRender");
|
14
14
|
var _LoadMore = _interopRequireDefault(require("../LoadMore"));
|
15
|
+
var _result = _interopRequireDefault(require("@teamix/result"));
|
15
16
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
16
17
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
17
18
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
@@ -30,7 +31,8 @@ var Row = _components.Grid.Row,
|
|
30
31
|
var cls = (0, _utils.usePrefixCls)('teamix-pro-table-card-view');
|
31
32
|
var CardView = function CardView(props) {
|
32
33
|
var _cardViewProps$scroll;
|
33
|
-
var dataSource = props.dataSource,
|
34
|
+
var _props$dataSource = props.dataSource,
|
35
|
+
dataSource = _props$dataSource === void 0 ? [] : _props$dataSource,
|
34
36
|
_props$columns = props.columns,
|
35
37
|
columns = _props$columns === void 0 ? [] : _props$columns,
|
36
38
|
_props$loading = props.loading,
|
@@ -56,11 +58,24 @@ var CardView = function CardView(props) {
|
|
56
58
|
// 加载状态变化回调
|
57
59
|
(0, _react.useEffect)(function () {
|
58
60
|
setLoadState(loading ? 'loading' : 'loadMore');
|
59
|
-
|
61
|
+
if (cardViewProps.showSkeleton) {
|
62
|
+
setSkeletonVisible(cardViewProps.showSkeleton);
|
63
|
+
} else {
|
64
|
+
setSkeletonVisible(showSkeleton);
|
65
|
+
}
|
60
66
|
if (showSkeleton) {
|
61
67
|
setLoadState('none');
|
62
68
|
}
|
63
|
-
|
69
|
+
if (dataSource.length === 0) {
|
70
|
+
setLoadState('none');
|
71
|
+
}
|
72
|
+
}, [loading, skeletonVisible, showSkeleton, cardViewProps.showSkeleton, dataSource]);
|
73
|
+
// 数据源变化毁掉
|
74
|
+
(0, _react.useEffect)(function () {
|
75
|
+
if (dataSource.length === 0) {
|
76
|
+
setLoadState('none');
|
77
|
+
}
|
78
|
+
}, [dataSource]);
|
64
79
|
var getDataIndexValue = function getDataIndexValue(dataIndex, dataSource) {
|
65
80
|
if (Array.isArray(dataIndex)) {
|
66
81
|
return dataIndex.map(function (item) {
|
@@ -325,16 +340,17 @@ var CardView = function CardView(props) {
|
|
325
340
|
};
|
326
341
|
// 渲染单个卡片
|
327
342
|
var renderCard = function renderCard(record, index) {
|
328
|
-
|
343
|
+
var _cardViewProps$cardRe;
|
344
|
+
return /*#__PURE__*/_react.default.createElement(Col, _objectSpread({
|
329
345
|
xxs: 24,
|
330
346
|
xs: 12,
|
331
|
-
s:
|
347
|
+
s: 12,
|
332
348
|
m: 8,
|
333
349
|
l: 6,
|
334
350
|
xl: 6,
|
335
351
|
key: index,
|
336
352
|
className: cls('card-item')
|
337
|
-
}, /*#__PURE__*/_react.default.createElement(_.ProCard, _objectSpread({
|
353
|
+
}, (_cardViewProps$cardRe = cardViewProps === null || cardViewProps === void 0 ? void 0 : cardViewProps.cardResponsiveProps) !== null && _cardViewProps$cardRe !== void 0 ? _cardViewProps$cardRe : {}), /*#__PURE__*/_react.default.createElement(_.ProCard, _objectSpread({
|
338
354
|
title: renderCardTitle(record, index),
|
339
355
|
subTitle: renderCardSubTitle(record, index),
|
340
356
|
extra: getProCardExtra(record, index),
|
@@ -345,25 +361,42 @@ var CardView = function CardView(props) {
|
|
345
361
|
context: {
|
346
362
|
record: record,
|
347
363
|
index: index
|
364
|
+
},
|
365
|
+
disabledAutoSize: true
|
366
|
+
})));
|
367
|
+
};
|
368
|
+
// 渲染卡片主体
|
369
|
+
var renderCardBox = function renderCardBox() {
|
370
|
+
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, skeletonVisible && /*#__PURE__*/_react.default.createElement(_skeleton.ProSkeletonRaw.Content, null), !skeletonVisible && (dataSource === null || dataSource === void 0 ? void 0 : dataSource.length) === 0 && /*#__PURE__*/_react.default.createElement(_result.default, {
|
371
|
+
theme: "hybridcloud-container",
|
372
|
+
img: "noData",
|
373
|
+
title: (0, _.getMessage)('noData'),
|
374
|
+
style: {
|
375
|
+
padding: '50px 0 60px'
|
348
376
|
}
|
377
|
+
}), !skeletonVisible && (dataSource === null || dataSource === void 0 ? void 0 : dataSource.length) > 0 && /*#__PURE__*/_react.default.createElement(Row, {
|
378
|
+
gutter: 16,
|
379
|
+
wrap: true,
|
380
|
+
style: {
|
381
|
+
marginTop: '-16px'
|
382
|
+
}
|
383
|
+
}, dataSource === null || dataSource === void 0 ? void 0 : dataSource.map(function (item, index) {
|
384
|
+
return renderCard(item, index);
|
349
385
|
})));
|
350
386
|
};
|
351
387
|
return /*#__PURE__*/_react.default.createElement("div", {
|
352
388
|
className: cls()
|
353
|
-
}, /*#__PURE__*/_react.default.createElement(
|
389
|
+
}, (cardViewProps === null || cardViewProps === void 0 ? void 0 : cardViewProps.useTablePagination) && /*#__PURE__*/_react.default.createElement(_components.Loading, {
|
390
|
+
visible: loading,
|
391
|
+
style: {
|
392
|
+
width: '100%'
|
393
|
+
}
|
394
|
+
}, renderCardBox()), !(cardViewProps === null || cardViewProps === void 0 ? void 0 : cardViewProps.useTablePagination) && /*#__PURE__*/_react.default.createElement(_LoadMore.default, {
|
354
395
|
onScrollBottom: onScrollBottom,
|
355
396
|
onLoadMore: onLoadMore,
|
356
397
|
loadState: loadState,
|
357
398
|
scrollHeight: (_cardViewProps$scroll = cardViewProps.scrollHeight) !== null && _cardViewProps$scroll !== void 0 ? _cardViewProps$scroll : scrollHeight
|
358
|
-
},
|
359
|
-
gutter: 16,
|
360
|
-
wrap: true,
|
361
|
-
style: {
|
362
|
-
marginTop: '-16px'
|
363
|
-
}
|
364
|
-
}, dataSource === null || dataSource === void 0 ? void 0 : dataSource.map(function (item, index) {
|
365
|
-
return renderCard(item, index);
|
366
|
-
}))));
|
399
|
+
}, renderCardBox()));
|
367
400
|
};
|
368
401
|
var _default = CardView;
|
369
402
|
exports.default = _default;
|
@@ -48,7 +48,7 @@ var FullScreen = function FullScreen(props) {
|
|
48
48
|
filterEnableRef.current.fullscreen = false;
|
49
49
|
// 移除类名
|
50
50
|
if (document && ((_document = document) === null || _document === void 0 ? void 0 : _document.body)) {
|
51
|
-
document.body.classList.remove('teamix-pro-table-fullscreen');
|
51
|
+
document.body.classList.remove('teamix-pro-table-fullscreen-for-body');
|
52
52
|
}
|
53
53
|
};
|
54
54
|
// 全屏开启之后
|
@@ -68,7 +68,7 @@ var FullScreen = function FullScreen(props) {
|
|
68
68
|
filterEnableRef.current.normal = false;
|
69
69
|
// 为 body 添加类名,用于判断是否全屏
|
70
70
|
if (document && ((_document2 = document) === null || _document2 === void 0 ? void 0 : _document2.body)) {
|
71
|
-
document.body.classList.add('teamix-pro-table-fullscreen');
|
71
|
+
document.body.classList.add('teamix-pro-table-fullscreen-for-body');
|
72
72
|
}
|
73
73
|
// 消息提示
|
74
74
|
_components.Message.show({
|