@teamix/pro 1.4.14 → 1.4.15
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.css +1 -1
- package/dist/pro.js +211 -64
- package/dist/pro.min.css +1 -1
- package/dist/pro.min.js +1 -1
- package/es/form/ProForm/index.js +14 -32
- package/es/form/ProForm/useAutoLayout.d.ts +9 -0
- package/es/form/ProForm/useAutoLayout.js +114 -0
- package/es/form/typing.d.ts +4 -0
- package/es/index.d.ts +1 -1
- package/es/index.js +1 -1
- package/es/nocode/index.scss +2 -2
- package/es/nocode/pages/playground.js +1 -1
- package/es/nocode/pages/renderer.js +1 -1
- package/es/nocode/playground.js +1 -1
- package/es/table/components/Layout/index.js +8 -4
- package/es/table/components/QuickAction/index.js +1 -1
- package/es/table/index.js +31 -9
- package/lib/form/ProForm/index.js +13 -31
- package/lib/form/ProForm/useAutoLayout.d.ts +9 -0
- package/lib/form/ProForm/useAutoLayout.js +124 -0
- package/lib/form/typing.d.ts +4 -0
- package/lib/index.d.ts +1 -1
- package/lib/index.js +1 -1
- package/lib/nocode/index.scss +2 -2
- package/lib/nocode/pages/playground.js +1 -1
- package/lib/nocode/pages/renderer.js +1 -1
- package/lib/nocode/playground.js +1 -1
- package/lib/table/components/Layout/index.js +8 -4
- package/lib/table/components/QuickAction/index.js +1 -1
- package/lib/table/index.js +30 -8
- package/package.json +1 -1
@@ -0,0 +1,124 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
4
|
+
value: true
|
5
|
+
});
|
6
|
+
exports.default = void 0;
|
7
|
+
|
8
|
+
var _react = require("react");
|
9
|
+
|
10
|
+
var _utils = require("@teamix/utils");
|
11
|
+
|
12
|
+
var _utils2 = require("../utils");
|
13
|
+
|
14
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
15
|
+
|
16
|
+
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."); }
|
17
|
+
|
18
|
+
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); }
|
19
|
+
|
20
|
+
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; }
|
21
|
+
|
22
|
+
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; }
|
23
|
+
|
24
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
25
|
+
|
26
|
+
var useAutoLayout = function useAutoLayout(_ref, formRef) {
|
27
|
+
var outBreakpoints = _ref.breakpoints,
|
28
|
+
layout = _ref.layout,
|
29
|
+
labelAlign = _ref.labelAlign,
|
30
|
+
wrapperAlign = _ref.wrapperAlign,
|
31
|
+
outLabelCol = _ref.labelCol,
|
32
|
+
outWrapperCol = _ref.wrapperCol,
|
33
|
+
autoLayout = _ref.autoLayout,
|
34
|
+
schema = _ref.schema;
|
35
|
+
|
36
|
+
var _ref2 = (0, _utils.isPlainObj)(autoLayout) ? autoLayout : {
|
37
|
+
autoLabel: autoLayout
|
38
|
+
},
|
39
|
+
autoLabel = _ref2.autoLabel;
|
40
|
+
|
41
|
+
var breakpoints = (0, _react.useMemo)(function () {
|
42
|
+
return autoLabel ? false : breakpoints;
|
43
|
+
}, []); // 当前断点不支持Col更新
|
44
|
+
|
45
|
+
var _useState = (0, _react.useState)({
|
46
|
+
labelCol: outLabelCol,
|
47
|
+
wrapperCol: outWrapperCol
|
48
|
+
}),
|
49
|
+
_useState2 = _slicedToArray(_useState, 2),
|
50
|
+
autoCol = _useState2[0],
|
51
|
+
setAutoCol = _useState2[1];
|
52
|
+
|
53
|
+
var labelCol = autoCol.labelCol,
|
54
|
+
wrapperCol = autoCol.wrapperCol;
|
55
|
+
(0, _react.useEffect)(function () {
|
56
|
+
/**
|
57
|
+
* autolayout
|
58
|
+
*/
|
59
|
+
if (autoLabel) {
|
60
|
+
var formWidth = formRef.current.getBoundingClientRect().width; // 表单宽度
|
61
|
+
|
62
|
+
var labelArray = schema.map(function (item) {
|
63
|
+
var text = item.title;
|
64
|
+
|
65
|
+
if ((0, _utils.isStr)(text)) {
|
66
|
+
var _item$decoratorProps;
|
67
|
+
|
68
|
+
if (item.required) {
|
69
|
+
text += '一'; // 必填 + 12
|
70
|
+
}
|
71
|
+
|
72
|
+
if ((_item$decoratorProps = item.decoratorProps) === null || _item$decoratorProps === void 0 ? void 0 : _item$decoratorProps.tooltip) {
|
73
|
+
text += '一'; // 提示 + 18
|
74
|
+
}
|
75
|
+
|
76
|
+
return text;
|
77
|
+
}
|
78
|
+
|
79
|
+
return '';
|
80
|
+
}); // 标题内容集合
|
81
|
+
|
82
|
+
var labelWidthArray = (0, _utils.getWidthByCharacterMap)(labelArray); // 标题宽度集合
|
83
|
+
|
84
|
+
var _autoWidthBySpace = (0, _utils.autoWidthBySpace)(labelWidthArray),
|
85
|
+
expectedWidth = _autoWidthBySpace.expectedWidth,
|
86
|
+
consoleArray = _autoWidthBySpace.consoleArray; // 智能计算预期宽度
|
87
|
+
|
88
|
+
|
89
|
+
var expectedCol = Math.ceil(expectedWidth / formWidth * 24); // 预期宽度转换为 Col 值
|
90
|
+
|
91
|
+
setAutoCol({
|
92
|
+
labelCol: expectedCol,
|
93
|
+
wrapperCol: wrapperCol
|
94
|
+
});
|
95
|
+
} else {
|
96
|
+
setAutoCol({
|
97
|
+
labelCol: outLabelCol,
|
98
|
+
wrapperCol: outWrapperCol
|
99
|
+
});
|
100
|
+
}
|
101
|
+
}, [outLabelCol, outWrapperCol]); // Layout配置By断点(配置断点后,目前不支持 Col 更新)
|
102
|
+
|
103
|
+
var autoTeamixLayout = (0, _react.useMemo)(function () {
|
104
|
+
return breakpoints === true ? {
|
105
|
+
breakpoints: [480],
|
106
|
+
layout: (0, _utils2.mergeArrayValue)(['vertical'], layout),
|
107
|
+
labelAlign: (0, _utils2.mergeArrayValue)(['left'], labelAlign),
|
108
|
+
wrapperAlign: (0, _utils2.mergeArrayValue)(['left'], wrapperAlign),
|
109
|
+
labelCol: (0, _utils2.mergeArrayValue)([24], labelCol),
|
110
|
+
wrapperCol: (0, _utils2.mergeArrayValue)([24], wrapperCol)
|
111
|
+
} : {
|
112
|
+
breakpoints: (0, _utils.isBool)(breakpoints) ? undefined : breakpoints,
|
113
|
+
layout: layout,
|
114
|
+
labelAlign: labelAlign,
|
115
|
+
wrapperAlign: wrapperAlign,
|
116
|
+
labelCol: labelCol,
|
117
|
+
wrapperCol: wrapperCol
|
118
|
+
};
|
119
|
+
}, [breakpoints, layout, labelAlign, wrapperAlign, labelCol, wrapperCol]);
|
120
|
+
return autoTeamixLayout;
|
121
|
+
};
|
122
|
+
|
123
|
+
var _default = useAutoLayout;
|
124
|
+
exports.default = _default;
|
package/lib/form/typing.d.ts
CHANGED
@@ -59,6 +59,9 @@ export interface ProFormSchemaItem {
|
|
59
59
|
data?: AnyObject;
|
60
60
|
}
|
61
61
|
export declare type ProFormSchema = ProFormSchemaItem[];
|
62
|
+
interface AutoLayout {
|
63
|
+
autoLabel?: boolean;
|
64
|
+
}
|
62
65
|
export interface ProFormProps extends Omit<IFormLayoutProps, 'breakpoints'> {
|
63
66
|
form?: FormType | false;
|
64
67
|
schema?: ProFormSchema;
|
@@ -78,6 +81,7 @@ export interface ProFormProps extends Omit<IFormLayoutProps, 'breakpoints'> {
|
|
78
81
|
onSubmitFailed?: (feedbacks: IFormFeedback[]) => void;
|
79
82
|
onInitialComplete?: (form: FormType) => void;
|
80
83
|
breakpoints?: number[] | boolean;
|
84
|
+
autoLayout?: AutoLayout | boolean;
|
81
85
|
}
|
82
86
|
export interface FilterProps extends ProFormProps {
|
83
87
|
form: FormType;
|
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.4.
|
31
|
+
declare const version = "1.4.15";
|
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
package/lib/nocode/index.scss
CHANGED
@@ -1,4 +1,4 @@
|
|
1
|
-
.teamix-nocode {
|
1
|
+
.teamix-pro-nocode {
|
2
2
|
&-empty {
|
3
3
|
display: flex;
|
4
4
|
flex-direction: column;
|
@@ -75,7 +75,7 @@
|
|
75
75
|
right: 20px;
|
76
76
|
bottom: 20px;
|
77
77
|
|
78
|
-
|
78
|
+
& > i {
|
79
79
|
cursor: pointer;
|
80
80
|
color: var(--color-text1-8, #848484);
|
81
81
|
background-color: rgba(0, 0, 0, 0.06);
|
@@ -51,7 +51,7 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
|
|
51
51
|
|
52
52
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
53
53
|
|
54
|
-
var cls = (0, _utils.usePrefixCls)('teamix-nocode');
|
54
|
+
var cls = (0, _utils.usePrefixCls)('teamix-pro-nocode');
|
55
55
|
|
56
56
|
var PagePlayground = function PagePlayground(props) {
|
57
57
|
var _useState = (0, _react.useState)(undefined),
|
@@ -57,7 +57,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
|
|
57
57
|
|
58
58
|
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; }
|
59
59
|
|
60
|
-
var cls = (0, _utils.usePrefixCls)('teamix-nocode');
|
60
|
+
var cls = (0, _utils.usePrefixCls)('teamix-pro-nocode');
|
61
61
|
|
62
62
|
var Loading = function Loading(props) {
|
63
63
|
return /*#__PURE__*/_react.default.createElement(_pageContainer.default, _objectSpread({
|
package/lib/nocode/playground.js
CHANGED
@@ -37,7 +37,7 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
|
|
37
37
|
|
38
38
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
39
39
|
|
40
|
-
var cls = (0, _utils.usePrefixCls)('teamix-nocode-playground');
|
40
|
+
var cls = (0, _utils.usePrefixCls)('teamix-pro-nocode-playground');
|
41
41
|
|
42
42
|
var PlayGroundLayout = function PlayGroundLayout(props) {
|
43
43
|
return /*#__PURE__*/_react.default.createElement("div", {
|
@@ -143,14 +143,18 @@ var Layout = function Layout(props) {
|
|
143
143
|
}
|
144
144
|
} else if (mainAction) {
|
145
145
|
// 没传 dataFilter 但是传了 mainAction
|
146
|
-
return /*#__PURE__*/_react.default.createElement(_form.QueryFilterLayout, {
|
146
|
+
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_form.QueryFilterLayout, {
|
147
147
|
addonBefore: renderMainAction(),
|
148
148
|
addonAfter: renderAddonAfter()
|
149
|
-
})
|
149
|
+
}), afterDataFilter && /*#__PURE__*/_react.default.createElement("div", {
|
150
|
+
className: "mb8 ".concat(cls('after-data-filter-wrapper'))
|
151
|
+
}, afterDataFilter));
|
150
152
|
} else {
|
151
|
-
return /*#__PURE__*/_react.default.createElement(_form.QueryFilterLayout, {
|
153
|
+
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_form.QueryFilterLayout, {
|
152
154
|
addonAfter: renderAddonAfter()
|
153
|
-
})
|
155
|
+
}), ' ', afterDataFilter && /*#__PURE__*/_react.default.createElement("div", {
|
156
|
+
className: "mb8 ".concat(cls('after-data-filter-wrapper'))
|
157
|
+
}, afterDataFilter));
|
154
158
|
}
|
155
159
|
}; // 区域组合渲染
|
156
160
|
|
@@ -26,7 +26,7 @@ var QuickAction = function QuickAction(props) {
|
|
26
26
|
actionRef = props.actionRef,
|
27
27
|
rowSelection = props.rowSelection; // 如果传对象的话,默认为主要文字类型的 ProActionButton
|
28
28
|
|
29
|
-
if (_typeof(quickAction) === 'object') {
|
29
|
+
if (_typeof(quickAction) === 'object' && (quickAction === null || quickAction === void 0 ? void 0 : quickAction.config)) {
|
30
30
|
// 默认 context
|
31
31
|
var defaultContext = {
|
32
32
|
action: actionRef.current,
|
package/lib/table/index.js
CHANGED
@@ -360,7 +360,11 @@ var ProTable = function ProTable(props) {
|
|
360
360
|
}, []); // 获取header高度,用作全屏吸底吸底高度计算以及固定body高度计算(滚动条在底部)
|
361
361
|
|
362
362
|
var getHeaderHeight = function getHeaderHeight(isFullscreen, offset) {
|
363
|
-
var _tableDom$getElements, _tableDom$getElements2;
|
363
|
+
var _tableDom$getElements, _tableDom$getElements2, _document$querySelect, _document$querySelect2, _document$querySelect3;
|
364
|
+
|
365
|
+
if (!fixedTableBody) {
|
366
|
+
return;
|
367
|
+
}
|
364
368
|
|
365
369
|
var tableDom = tableRef.current;
|
366
370
|
var headerDom = tableDom === null || tableDom === void 0 ? void 0 : (_tableDom$getElements = tableDom.getElementsByClassName('teamix-pro-table-layout')) === null || _tableDom$getElements === void 0 ? void 0 : _tableDom$getElements[0];
|
@@ -370,8 +374,9 @@ var ProTable = function ProTable(props) {
|
|
370
374
|
var tableHeaderDom = tableDom === null || tableDom === void 0 ? void 0 : (_tableDom$getElements2 = tableDom.getElementsByClassName(basePrefix('table-header-inner'))) === null || _tableDom$getElements2 === void 0 ? void 0 : _tableDom$getElements2[0];
|
371
375
|
var pageContainerDom = document.querySelector('.teamix-pro-page-container-header');
|
372
376
|
var teamixNavDom = document.querySelector('.teamix-nav-console');
|
373
|
-
var footerRowSelectionDom = document.querySelector('.teamix-pro-page-container-footer');
|
374
|
-
|
377
|
+
var footerRowSelectionDom = document.querySelector('.teamix-pro-page-container-footer'); // 这边不能直接取 next-table-body
|
378
|
+
|
379
|
+
var tableBodyDom = (_document$querySelect = document.querySelector('.teamix-pro-table')) === null || _document$querySelect === void 0 ? void 0 : (_document$querySelect2 = _document$querySelect.getElementsByTagName('table')) === null || _document$querySelect2 === void 0 ? void 0 : (_document$querySelect3 = _document$querySelect2[1]) === null || _document$querySelect3 === void 0 ? void 0 : _document$querySelect3.parentNode;
|
375
380
|
var headerFixedTopSectionDom = document.querySelector('.teamix-pro-page-container-fixed-top');
|
376
381
|
setTimeout(function () {
|
377
382
|
var _headerDom$offsetHeig, _tableHeaderDom$offse;
|
@@ -389,9 +394,8 @@ var ProTable = function ProTable(props) {
|
|
389
394
|
var teamixNavHeight = (_teamixNavDom$offsetH = teamixNavDom === null || teamixNavDom === void 0 ? void 0 : teamixNavDom.offsetHeight) !== null && _teamixNavDom$offsetH !== void 0 ? _teamixNavDom$offsetH : 0; // 1 为预留值,js无法取出精确高度,会被四舍五入
|
390
395
|
|
391
396
|
var offsetHeaderHeight = headerHeight + tableHeaderHeight + pageHeaderHeight + teamixNavHeight + footerRowSelectionHeight + 16 + (offset !== null && offset !== void 0 ? offset : 0) + 1;
|
392
|
-
var clientTableBodyHeight = document.body.clientHeight - offsetHeaderHeight;
|
393
397
|
|
394
|
-
if (tableBodyDom.clientHeight <
|
398
|
+
if (tableBodyDom.clientHeight < tableBodyDom.scrollHeight) {
|
395
399
|
setFooterSuctionState(true);
|
396
400
|
} else {
|
397
401
|
setFooterSuctionState(false);
|
@@ -449,6 +453,10 @@ var ProTable = function ProTable(props) {
|
|
449
453
|
|
450
454
|
|
451
455
|
var getFooterSuctionState = function getFooterSuctionState() {
|
456
|
+
if (!footerSuction) {
|
457
|
+
return;
|
458
|
+
}
|
459
|
+
|
452
460
|
var containerDom = document.querySelector('.teamix-pro-page-container-scroll-container');
|
453
461
|
|
454
462
|
if (containerDom) {
|
@@ -847,7 +855,7 @@ var ProTable = function ProTable(props) {
|
|
847
855
|
if (Number.isInteger(time) && time >= 1000) {
|
848
856
|
autoRefreshTimerRef.current = setTimeout(function () {
|
849
857
|
// 自动刷新不显示 loading
|
850
|
-
_request(
|
858
|
+
_request(requestData, true);
|
851
859
|
}, Number(time));
|
852
860
|
}
|
853
861
|
});
|
@@ -1083,8 +1091,22 @@ var ProTable = function ProTable(props) {
|
|
1083
1091
|
className: cls('footer-right-wrapper')
|
1084
1092
|
}, showSkeleton ? /*#__PURE__*/_react.default.createElement(_skeleton.ProSkeletonRaw.Footer.Pagination, null) : footer));
|
1085
1093
|
}
|
1086
|
-
};
|
1094
|
+
}; // 判断是否需要吸底
|
1087
1095
|
|
1096
|
+
|
1097
|
+
var fixFooterState = (0, _react.useMemo)(function () {
|
1098
|
+
if (fullscreenState) {
|
1099
|
+
return true;
|
1100
|
+
}
|
1101
|
+
|
1102
|
+
if (fixedTableBody || footerSuction) {
|
1103
|
+
if (footerSuctionState) {
|
1104
|
+
return true;
|
1105
|
+
}
|
1106
|
+
}
|
1107
|
+
|
1108
|
+
return false;
|
1109
|
+
}, [fullscreenState, fixedTableBody, footerSuction, footerSuctionState]);
|
1088
1110
|
return /*#__PURE__*/_react.default.createElement(_Fullscreen.default, {
|
1089
1111
|
visible: fullscreenState,
|
1090
1112
|
actionRef: actionRef
|
@@ -1096,7 +1118,7 @@ var ProTable = function ProTable(props) {
|
|
1096
1118
|
|
1097
1119
|
}),
|
1098
1120
|
ref: tableRef
|
1099
|
-
}, renderTable(isFullScreen),
|
1121
|
+
}, renderTable(isFullScreen), fixFooterState && /*#__PURE__*/_react.default.createElement(_pageContainer.default.FixedFooter, null, renderFooter()), !fixFooterState && renderFooter());
|
1100
1122
|
});
|
1101
1123
|
};
|
1102
1124
|
|