@teamix/pro 1.5.0-beta.1 → 1.5.0
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 +45535 -35222
- package/dist/pro.min.css +1 -1
- package/dist/pro.min.js +1 -1
- package/dist/pro.min.js.LICENSE.txt +11 -0
- package/es/card/index.js +2 -2
- package/es/form/Filter/layout.scss +1 -1
- package/es/form/ProForm/addCascadeEffect.d.ts +2 -0
- package/es/form/ProForm/addCascadeEffect.js +225 -0
- package/es/form/ProForm/index.js +8 -5
- package/es/form/typing.d.ts +20 -0
- package/es/index.d.ts +1 -1
- package/es/index.js +2 -1
- package/es/sidebar/components/sidebar-container/index.js +18 -2
- package/es/sidebar/components/sidebar-container/index.scss +21 -14
- package/es/sidebar/components/tree/index.js +24 -6
- package/es/sidebar/components/tree-node/index.js +1 -1
- package/es/sidebar/typing.d.ts +4 -0
- package/es/table/components/ToolBar/DensityIcon.js +1 -0
- package/es/table/components/ToolBar/FilterColumnIcon.js +2 -0
- package/es/table/components/ToolBar/FullScreenIcon.js +6 -57
- package/es/table/components/ToolBar/index.d.ts +1 -1
- package/es/table/components/ToolBar/index.js +99 -16
- package/es/table/components/ToolBar/index.scss +22 -2
- package/es/table/index.js +6 -3
- package/es/table/typing.d.ts +4 -1
- package/lib/card/index.js +2 -2
- package/lib/form/Filter/layout.scss +1 -1
- package/lib/form/ProForm/addCascadeEffect.d.ts +2 -0
- package/lib/form/ProForm/addCascadeEffect.js +235 -0
- package/lib/form/ProForm/index.js +9 -5
- package/lib/form/typing.d.ts +20 -0
- package/lib/index.d.ts +1 -1
- package/lib/index.js +2 -1
- package/lib/sidebar/components/sidebar-container/index.js +18 -2
- package/lib/sidebar/components/sidebar-container/index.scss +21 -14
- package/lib/sidebar/components/tree/index.js +24 -6
- package/lib/sidebar/components/tree-node/index.js +1 -1
- package/lib/sidebar/typing.d.ts +4 -0
- package/lib/table/components/ToolBar/DensityIcon.js +1 -0
- package/lib/table/components/ToolBar/FilterColumnIcon.js +2 -0
- package/lib/table/components/ToolBar/FullScreenIcon.js +9 -63
- package/lib/table/components/ToolBar/index.d.ts +1 -1
- package/lib/table/components/ToolBar/index.js +109 -16
- package/lib/table/components/ToolBar/index.scss +22 -2
- package/lib/table/index.js +6 -3
- package/lib/table/typing.d.ts +4 -1
- package/package.json +1 -1
@@ -1,12 +1,13 @@
|
|
1
1
|
.teamix-pro-sidebar-container {
|
2
2
|
min-width: 180px;
|
3
|
-
|
3
|
+
|
4
|
+
.teamix-pro-card.compacted > .next-card-header {
|
4
5
|
padding: 16px 0px;
|
5
6
|
margin: 0;
|
6
|
-
|
7
|
+
|
7
8
|
}
|
8
9
|
|
9
|
-
.next-card .next-card-header-extra{
|
10
|
+
.next-card .next-card-header-extra {
|
10
11
|
margin-top: 2px;
|
11
12
|
}
|
12
13
|
|
@@ -27,38 +28,44 @@
|
|
27
28
|
}
|
28
29
|
|
29
30
|
|
30
|
-
&.teamix-pro-sidebar-container &-context{
|
31
|
-
overflow-y: hidden;
|
32
|
-
|
33
|
-
&:hover{
|
31
|
+
&.teamix-pro-sidebar-container &-context {
|
32
|
+
//overflow-y: hidden;
|
33
|
+
|
34
|
+
&:hover {
|
34
35
|
overflow-y: auto;
|
35
36
|
}
|
37
|
+
|
38
|
+
.next-tree-switcher.next-noop-line.next-noop-line-noroot {
|
39
|
+
flex-shrink: 0;
|
40
|
+
}
|
41
|
+
|
36
42
|
}
|
37
43
|
|
38
44
|
|
39
|
-
&-not-is-tree{
|
45
|
+
&-not-is-tree {
|
40
46
|
|
41
|
-
.teamix-pro-card.compacted
|
47
|
+
.teamix-pro-card.compacted > .next-card-header {
|
42
48
|
padding: 16px 8px;
|
43
49
|
margin: 0;
|
44
50
|
}
|
45
|
-
|
51
|
+
|
52
|
+
.teamix-pro-sidebar-container-context {
|
46
53
|
padding: 0;
|
47
54
|
}
|
48
55
|
|
49
|
-
.teamix-pro-sidebar-container-search{
|
56
|
+
.teamix-pro-sidebar-container-search {
|
50
57
|
padding: 0 8px;
|
51
58
|
}
|
52
59
|
|
53
|
-
.teamix-pro-sidebar-container-search-has-message{
|
60
|
+
.teamix-pro-sidebar-container-search-has-message {
|
54
61
|
padding: 0 8px;
|
55
62
|
}
|
56
63
|
|
57
|
-
.teamix-pro-sidebar-container-notice{
|
64
|
+
.teamix-pro-sidebar-container-notice {
|
58
65
|
padding: 0 8px;
|
59
66
|
}
|
60
67
|
|
61
|
-
.teamix-pro-sidebar-container-fold{
|
68
|
+
.teamix-pro-sidebar-container-fold {
|
62
69
|
padding: 0 8px;
|
63
70
|
}
|
64
71
|
|
@@ -154,21 +154,39 @@ var ProSidebarTree = function ProSidebarTree(props) {
|
|
154
154
|
}, [dataSourceProp]); // 监听展开全部事件
|
155
155
|
|
156
156
|
(0, _hooks.useUpdateEffect)(function () {
|
157
|
+
onChangeExpandAll();
|
158
|
+
}, [expandAll]); // 监听展开层级事件
|
159
|
+
|
160
|
+
(0, _hooks.useUpdateEffect)(function () {
|
161
|
+
onChangeExpandLevel();
|
162
|
+
}, [expandLevel]); // 监听 DataSource 变化事件
|
163
|
+
|
164
|
+
(0, _react.useEffect)(function () {
|
165
|
+
onDataSourceChange === null || onDataSourceChange === void 0 ? void 0 : onDataSourceChange(dataSource); // 更新层级状态
|
166
|
+
|
167
|
+
if (expandAll) {
|
168
|
+
onChangeExpandAll();
|
169
|
+
}
|
170
|
+
|
171
|
+
if (expandLevel > 1) {
|
172
|
+
onChangeExpandLevel();
|
173
|
+
}
|
174
|
+
}, [dataSource]); // 展开全部事件
|
175
|
+
|
176
|
+
var onChangeExpandAll = function onChangeExpandAll() {
|
157
177
|
if (expandAll) {
|
158
178
|
setExpandedKeys((0, _utils2.getAllNodeKey)(dataSource));
|
159
179
|
} else {
|
160
180
|
setExpandedKeys([]);
|
161
181
|
}
|
162
|
-
}
|
182
|
+
}; // 展开层级事件
|
163
183
|
|
164
|
-
|
184
|
+
|
185
|
+
var onChangeExpandLevel = function onChangeExpandLevel() {
|
165
186
|
var keys = (0, _utils2.getTreeLevelKey)(dataSource, expandLevel - 1);
|
166
187
|
setExpandedKeys(keys);
|
167
|
-
}
|
188
|
+
}; // 绑定actionRef
|
168
189
|
|
169
|
-
(0, _react.useEffect)(function () {
|
170
|
-
onDataSourceChange === null || onDataSourceChange === void 0 ? void 0 : onDataSourceChange(dataSource);
|
171
|
-
}, [dataSource]); // 绑定actionRef
|
172
190
|
|
173
191
|
(0, _actionRef.useActionType)(actionRef, {
|
174
192
|
setTreeNode: function setTreeNode(treeNode) {
|
@@ -247,7 +247,7 @@ function renderTreeNodeDependenceValue(data, onBeforeRenderNodeEvent, checkedKey
|
|
247
247
|
newProps = onBeforeRenderNodeEvent(item, checkedKeys, selectedKeys, allData !== null && allData !== void 0 ? allData : data);
|
248
248
|
}
|
249
249
|
|
250
|
-
var _getTreeNodeProps2 = (0, _.getTreeNodeProps)(
|
250
|
+
var _getTreeNodeProps2 = (0, _.getTreeNodeProps)(newProps),
|
251
251
|
nodeProps = _getTreeNodeProps2.nodeProps,
|
252
252
|
labelProps = _getTreeNodeProps2.labelProps;
|
253
253
|
|
package/lib/sidebar/typing.d.ts
CHANGED
@@ -88,6 +88,8 @@ export declare type ProSidebarContainerProps = {
|
|
88
88
|
scrollArea?: 'all' | 'tree';
|
89
89
|
/** 是否显示展开全部 */
|
90
90
|
showExpandAll?: boolean;
|
91
|
+
/** 展开全部 状态 */
|
92
|
+
expandAllState?: boolean;
|
91
93
|
/** 是否显示展开层级 */
|
92
94
|
showExpandLevel?: boolean;
|
93
95
|
/** 展开全部变化回调 */
|
@@ -96,6 +98,8 @@ export declare type ProSidebarContainerProps = {
|
|
96
98
|
onExpandLevelChange?: (state: number) => void;
|
97
99
|
/** 展开层级 层级 */
|
98
100
|
expandLevel?: number;
|
101
|
+
/** 展开层级 当前所展示层级 */
|
102
|
+
expandLevelState?: number;
|
99
103
|
/** 列表 or tree */
|
100
104
|
isTree?: boolean;
|
101
105
|
} & ProCardProps;
|
@@ -284,6 +284,8 @@ var FilterColumnIcon = function FilterColumnIcon(props) {
|
|
284
284
|
setTooltipVisible(false);
|
285
285
|
setDropdownVisible(state);
|
286
286
|
},
|
287
|
+
followTrigger: true,
|
288
|
+
cache: true,
|
287
289
|
triggerType: ['click'],
|
288
290
|
align: "tr br"
|
289
291
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
@@ -1,7 +1,5 @@
|
|
1
1
|
"use strict";
|
2
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); }
|
4
|
-
|
5
3
|
Object.defineProperty(exports, "__esModule", {
|
6
4
|
value: true
|
7
5
|
});
|
@@ -13,40 +11,20 @@ var _icon = _interopRequireDefault(require("@teamix/icon"));
|
|
13
11
|
|
14
12
|
var _utils = require("@teamix/utils");
|
15
13
|
|
16
|
-
var _react =
|
14
|
+
var _react = _interopRequireDefault(require("react"));
|
17
15
|
|
18
16
|
require("./index.scss");
|
19
17
|
|
20
|
-
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); }
|
21
|
-
|
22
|
-
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; }
|
23
|
-
|
24
18
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
25
19
|
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
-
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); }
|
31
|
-
|
32
|
-
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; }
|
33
|
-
|
34
|
-
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; }
|
35
|
-
|
36
|
-
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
37
|
-
|
20
|
+
/**
|
21
|
+
* 全屏展示 Icon
|
22
|
+
*/
|
38
23
|
var cls = (0, _utils.usePrefixCls)('teamix-pro-table-toolbar-icon');
|
39
24
|
|
40
25
|
var FullScreenIcon = function FullScreenIcon(props) {
|
41
|
-
var
|
42
|
-
|
43
|
-
var actionRef = props.actionRef;
|
44
|
-
|
45
|
-
var _useState = (0, _react.useState)(false),
|
46
|
-
_useState2 = _slicedToArray(_useState, 2),
|
47
|
-
fullscreen = _useState2[0],
|
48
|
-
setFullscreen = _useState2[1]; // 点击全屏
|
49
|
-
|
26
|
+
var actionRef = props.actionRef,
|
27
|
+
fullScreenState = props.fullScreenState; // 点击全屏
|
50
28
|
|
51
29
|
var allScreenHandle = function allScreenHandle() {
|
52
30
|
setTimeout(function () {
|
@@ -54,48 +32,16 @@ var FullScreenIcon = function FullScreenIcon(props) {
|
|
54
32
|
|
55
33
|
(_actionRef$current = actionRef.current) === null || _actionRef$current === void 0 ? void 0 : (_actionRef$current$fu = _actionRef$current.fullScreen) === null || _actionRef$current$fu === void 0 ? void 0 : _actionRef$current$fu.call(_actionRef$current);
|
56
34
|
}, 0);
|
57
|
-
};
|
58
|
-
|
59
|
-
|
60
|
-
(0, _react.useEffect)(function () {
|
61
|
-
return function () {
|
62
|
-
var _actionRef$current2, _actionRef$current2$o;
|
63
|
-
|
64
|
-
(_actionRef$current2 = actionRef.current) === null || _actionRef$current2 === void 0 ? void 0 : (_actionRef$current2$o = _actionRef$current2.off) === null || _actionRef$current2$o === void 0 ? void 0 : _actionRef$current2$o.call(_actionRef$current2, 'fullscreenIcon');
|
65
|
-
};
|
66
|
-
}, []); // 监听全屏变化
|
35
|
+
};
|
67
36
|
|
68
|
-
(_actionRef$current3 = actionRef.current) === null || _actionRef$current3 === void 0 ? void 0 : (_actionRef$current3$o = _actionRef$current3.on) === null || _actionRef$current3$o === void 0 ? void 0 : _actionRef$current3$o.call(_actionRef$current3, function (state) {
|
69
|
-
// console.log('dataFilterForm', actionRef.current?.dataFilterForm);
|
70
|
-
setFullscreen(state); // actionRef.current?.dataFilterForm?.setValues(formValues);
|
71
|
-
}, 'fullScreenState', 'fullscreenIcon');
|
72
37
|
return /*#__PURE__*/_react.default.createElement(_components.Button, {
|
73
38
|
iconSize: "small",
|
74
39
|
className: cls(),
|
75
40
|
onClick: allScreenHandle
|
76
41
|
}, /*#__PURE__*/_react.default.createElement(_icon.default, {
|
77
42
|
size: "small",
|
78
|
-
type:
|
79
|
-
}))
|
80
|
-
// trigger={
|
81
|
-
// <Button iconSize="small" className={cls()} onClick={allScreenHandle}>
|
82
|
-
// <TeamixIcon
|
83
|
-
// size="small"
|
84
|
-
// type={fullscreen ? 'close-line' : 'full-screen-line'}
|
85
|
-
// />
|
86
|
-
// </Button>
|
87
|
-
// }
|
88
|
-
// align={fullscreen ? 'b' : 't'}
|
89
|
-
// popupProps={{
|
90
|
-
// visible: visible,
|
91
|
-
// onVisibleChange: (state) => {
|
92
|
-
// setVisible(state);
|
93
|
-
// },
|
94
|
-
// }}
|
95
|
-
// >
|
96
|
-
// {getMessage('fullScreen')}
|
97
|
-
// </Balloon.Tooltip>
|
98
|
-
;
|
43
|
+
type: fullScreenState ? 'close-line' : 'full-screen-line'
|
44
|
+
}));
|
99
45
|
};
|
100
46
|
|
101
47
|
var _default = FullScreenIcon;
|
@@ -1,5 +1,7 @@
|
|
1
1
|
"use strict";
|
2
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); }
|
4
|
+
|
3
5
|
Object.defineProperty(exports, "__esModule", {
|
4
6
|
value: true
|
5
7
|
});
|
@@ -7,7 +9,11 @@ exports.default = void 0;
|
|
7
9
|
|
8
10
|
var _utils = require("@teamix/utils");
|
9
11
|
|
10
|
-
var _react =
|
12
|
+
var _react = _interopRequireWildcard(require("react"));
|
13
|
+
|
14
|
+
var _components = require("@alicloudfe/components");
|
15
|
+
|
16
|
+
var _icon = _interopRequireDefault(require("@teamix/icon"));
|
11
17
|
|
12
18
|
var _FullScreenIcon = _interopRequireDefault(require("./FullScreenIcon"));
|
13
19
|
|
@@ -17,16 +23,36 @@ var _DensityIcon = _interopRequireDefault(require("./DensityIcon"));
|
|
17
23
|
|
18
24
|
var _RefreshIcon = _interopRequireDefault(require("./RefreshIcon"));
|
19
25
|
|
26
|
+
var _hooks = require("@teamix/hooks");
|
27
|
+
|
28
|
+
var _lodash = _interopRequireDefault(require("lodash.debounce"));
|
29
|
+
|
20
30
|
require("./index.scss");
|
21
31
|
|
22
32
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
23
33
|
|
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); }
|
35
|
+
|
36
|
+
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; }
|
37
|
+
|
24
38
|
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; }
|
25
39
|
|
26
40
|
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; }
|
27
41
|
|
28
42
|
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; }
|
29
43
|
|
44
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
45
|
+
|
46
|
+
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."); }
|
47
|
+
|
48
|
+
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); }
|
49
|
+
|
50
|
+
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; }
|
51
|
+
|
52
|
+
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; }
|
53
|
+
|
54
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
55
|
+
|
30
56
|
var cls = (0, _utils.usePrefixCls)('teamix-pro-table-toolbar');
|
31
57
|
var presetToolBarMap = {
|
32
58
|
refresh: _RefreshIcon.default,
|
@@ -54,7 +80,46 @@ var presetToolBar = [{
|
|
54
80
|
}];
|
55
81
|
|
56
82
|
var ToolBar = function ToolBar(props) {
|
57
|
-
var
|
83
|
+
var _toolBarRef$current, _toolBarRef$current$p, _toolBarRef$current$p2;
|
84
|
+
|
85
|
+
var toolBar = props.toolBar,
|
86
|
+
fullScreenState = props.fullScreenState;
|
87
|
+
var toolBarRef = (0, _react.useRef)(null); // const toolBarSize = useSize(toolBarRef);
|
88
|
+
// 用于获取内容宽度
|
89
|
+
|
90
|
+
var toolBarContentRef = (0, _react.useRef)(null); // '.teamix-pro-form-query-filter-layout-inline' 元素
|
91
|
+
|
92
|
+
var layoutInlineDom = (_toolBarRef$current = toolBarRef.current) === null || _toolBarRef$current === void 0 ? void 0 : (_toolBarRef$current$p = _toolBarRef$current.parentElement) === null || _toolBarRef$current$p === void 0 ? void 0 : (_toolBarRef$current$p2 = _toolBarRef$current$p.parentElement) === null || _toolBarRef$current$p2 === void 0 ? void 0 : _toolBarRef$current$p2.parentElement; // 监听它的尺寸变化
|
93
|
+
|
94
|
+
var layoutInlineSize = (0, _hooks.useSize)(layoutInlineDom); // '.teamix-pro-form-query-filter-layout-left' 元素
|
95
|
+
|
96
|
+
var layoutLeftDom = layoutInlineDom === null || layoutInlineDom === void 0 ? void 0 : layoutInlineDom.firstElementChild;
|
97
|
+
var leftWidth = layoutLeftDom === null || layoutLeftDom === void 0 ? void 0 : layoutLeftDom.clientWidth; // 展示形式,是否平铺
|
98
|
+
|
99
|
+
var _useSafeState = (0, _hooks.useSafeState)(),
|
100
|
+
_useSafeState2 = _slicedToArray(_useSafeState, 2),
|
101
|
+
flat = _useSafeState2[0],
|
102
|
+
setFlat = _useSafeState2[1]; // 监听高度,> 32px则切换形态
|
103
|
+
|
104
|
+
|
105
|
+
(0, _react.useEffect)((0, _lodash.default)(function () {
|
106
|
+
// console.log(
|
107
|
+
// layoutInlineSize?.width,
|
108
|
+
// leftWidth,
|
109
|
+
// toolBarContentRef.current?.clientWidth,
|
110
|
+
// );
|
111
|
+
if ((layoutInlineSize === null || layoutInlineSize === void 0 ? void 0 : layoutInlineSize.width) && leftWidth && toolBarContentRef.current) {
|
112
|
+
var _toolBarContentRef$cu;
|
113
|
+
|
114
|
+
var width = layoutInlineSize.width; // console.log('layoutInlineSize-width', width);
|
115
|
+
|
116
|
+
if (width - leftWidth <= ((_toolBarContentRef$cu = toolBarContentRef.current) === null || _toolBarContentRef$cu === void 0 ? void 0 : _toolBarContentRef$cu.clientWidth) + 8) {
|
117
|
+
setFlat(false);
|
118
|
+
} else {
|
119
|
+
setFlat(true);
|
120
|
+
}
|
121
|
+
}
|
122
|
+
}, 300));
|
58
123
|
var toolBarList = toolBar !== false ? presetToolBar : [];
|
59
124
|
|
60
125
|
if (Array.isArray(toolBar)) {
|
@@ -75,21 +140,49 @@ var ToolBar = function ToolBar(props) {
|
|
75
140
|
});
|
76
141
|
}
|
77
142
|
|
143
|
+
var renderFlatShape = function renderFlatShape() {
|
144
|
+
return /*#__PURE__*/_react.default.createElement("div", {
|
145
|
+
className: cls('content')
|
146
|
+
}, toolBarList.map(function (_ref) {
|
147
|
+
var type = _ref.type,
|
148
|
+
name = _ref.name,
|
149
|
+
Component = _ref.component;
|
150
|
+
return /*#__PURE__*/_react.default.createElement("span", {
|
151
|
+
className: cls('item', _defineProperty({}, name, true)),
|
152
|
+
key: name
|
153
|
+
}, type === 'preset' && /*#__PURE__*/_react.default.createElement(Component, _objectSpread({}, props)), type === 'custom' && /*#__PURE__*/_react.default.createElement("div", {
|
154
|
+
className: cls({
|
155
|
+
custom: true
|
156
|
+
})
|
157
|
+
}, Component));
|
158
|
+
}));
|
159
|
+
};
|
160
|
+
|
161
|
+
var renderUnFlatShape = function renderUnFlatShape() {
|
162
|
+
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_components.Balloon.Tooltip, {
|
163
|
+
triggerType: ['click'],
|
164
|
+
popupProps: {
|
165
|
+
cache: true
|
166
|
+
},
|
167
|
+
style: {
|
168
|
+
padding: 8
|
169
|
+
},
|
170
|
+
trigger: /*#__PURE__*/_react.default.createElement(_components.Button, null, /*#__PURE__*/_react.default.createElement(_icon.default, {
|
171
|
+
type: "more-line"
|
172
|
+
})),
|
173
|
+
align: "tr"
|
174
|
+
}, renderFlatShape()));
|
175
|
+
};
|
176
|
+
|
78
177
|
return /*#__PURE__*/_react.default.createElement("div", {
|
79
|
-
className: cls(
|
80
|
-
|
81
|
-
|
82
|
-
|
83
|
-
|
84
|
-
|
85
|
-
|
86
|
-
|
87
|
-
}, type === 'preset' && /*#__PURE__*/_react.default.createElement(Component, _objectSpread({}, props)), type === 'custom' && /*#__PURE__*/_react.default.createElement("div", {
|
88
|
-
className: cls({
|
89
|
-
custom: true
|
90
|
-
})
|
91
|
-
}, Component));
|
92
|
-
}));
|
178
|
+
className: cls('', {
|
179
|
+
flat: flat
|
180
|
+
}),
|
181
|
+
ref: toolBarRef
|
182
|
+
}, !flat && !fullScreenState ? renderUnFlatShape() : renderFlatShape(), /*#__PURE__*/_react.default.createElement("div", {
|
183
|
+
className: cls('shadow'),
|
184
|
+
ref: toolBarContentRef
|
185
|
+
}, renderFlatShape()));
|
93
186
|
};
|
94
187
|
|
95
188
|
var _default = ToolBar;
|
@@ -2,20 +2,40 @@
|
|
2
2
|
width: 100%;
|
3
3
|
text-align: right;
|
4
4
|
margin-bottom: 8px;
|
5
|
+
&-flat {
|
6
|
+
margin-left: 8px;
|
7
|
+
}
|
8
|
+
&-item {
|
9
|
+
display: inline-block;
|
10
|
+
&:not(:first-child) {
|
11
|
+
margin-left: 8px;
|
12
|
+
}
|
13
|
+
}
|
14
|
+
&-content {
|
15
|
+
display: flex;
|
16
|
+
}
|
17
|
+
&-shadow {
|
18
|
+
visibility: hidden;
|
19
|
+
pointer-events: none;
|
20
|
+
opacity: 0;
|
21
|
+
height: 0px;
|
22
|
+
position: absolute;
|
23
|
+
z-index: -1;
|
24
|
+
overflow: hidden;
|
25
|
+
}
|
5
26
|
}
|
6
27
|
.teamix-pro-table-toolbar-custom {
|
7
28
|
display: inline-block;
|
8
|
-
margin-left: 8px;
|
9
29
|
}
|
10
30
|
|
11
31
|
// FullScreen
|
12
32
|
.teamix-pro-table-toolbar-icon {
|
13
|
-
margin-left: 8px;
|
14
33
|
i {
|
15
34
|
color: var(--color-fill1-6, #848484);
|
16
35
|
}
|
17
36
|
}
|
18
37
|
|
38
|
+
|
19
39
|
// FilterColumn
|
20
40
|
.teamix-pro-table-toolbar-filter-column {
|
21
41
|
min-width: 180px;
|
package/lib/table/index.js
CHANGED
@@ -55,7 +55,7 @@ Object.keys(_typing).forEach(function (key) {
|
|
55
55
|
}
|
56
56
|
});
|
57
57
|
});
|
58
|
-
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", "requestWhenMount", "showPagination", "pageSizeList", "responsivePaginationType", "showSkeleton", "skeletonSize", "actionRef", "dataSource", "filterDebounce", "footerSuction", "autoRefresh", "customRequest", "filterColumnType", "defaultFilterParams", "reserveSelectedRecords", "size", "disableSelectAll", "context", "fixedTableBody", "isTree"];
|
58
|
+
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"];
|
59
59
|
|
60
60
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
61
61
|
|
@@ -186,6 +186,7 @@ var ProTable = function ProTable(props) {
|
|
186
186
|
return params;
|
187
187
|
} : _props$formatParams,
|
188
188
|
formatResult = props.formatResult,
|
189
|
+
requestConfig = props.requestConfig,
|
189
190
|
_props$requestWhenMou = props.requestWhenMount,
|
190
191
|
requestWhenMount = _props$requestWhenMou === void 0 ? true : _props$requestWhenMou,
|
191
192
|
_props$showPagination = props.showPagination,
|
@@ -726,7 +727,8 @@ var ProTable = function ProTable(props) {
|
|
726
727
|
}, {
|
727
728
|
// 使用 request 方法代替 fetch
|
728
729
|
requestMethod: function requestMethod(params) {
|
729
|
-
|
730
|
+
// 支持使用 requestConfig 自定义请求配置
|
731
|
+
return (0, _utils.request)(_objectSpread(_objectSpread({}, params), requestConfig));
|
730
732
|
},
|
731
733
|
manual: true,
|
732
734
|
onSuccess: function onSuccess(result) {
|
@@ -948,7 +950,8 @@ var ProTable = function ProTable(props) {
|
|
948
950
|
afterDataFilter: afterDataFilter,
|
949
951
|
dataFilterFormRef: isFullScreen ? fullscreenDataFilterFormRef : normalDataFilterFormRef,
|
950
952
|
rowSelection: rowSelection,
|
951
|
-
filterColumnType: filterColumnType
|
953
|
+
filterColumnType: filterColumnType,
|
954
|
+
fullScreenState: isFullScreen
|
952
955
|
}), /*#__PURE__*/_react.default.createElement(_components.Table.StickyLock, _objectSpread({
|
953
956
|
hasBorder: false,
|
954
957
|
dataSource: showSkeleton ? skeletonDataSource : data || props.dataSource,
|
package/lib/table/typing.d.ts
CHANGED
@@ -7,7 +7,7 @@ import { QueryFilterProps, ProFormType } from '../form';
|
|
7
7
|
import { ProActionGroupProps, ProActionButtonProps } from '../actions';
|
8
8
|
import { PaginationProps } from '@alicloudfe/components/types/pagination';
|
9
9
|
import { HeaderProps as ProTableHeaderProps } from '../field';
|
10
|
-
import { Method } from 'axios';
|
10
|
+
import { Method, AxiosRequestConfig } from 'axios';
|
11
11
|
import React from 'react';
|
12
12
|
declare type IFieldRenderProps = keyof ProFieldRenderProps;
|
13
13
|
/** 列record函数 */
|
@@ -86,6 +86,8 @@ export declare type ProTableProps = {
|
|
86
86
|
onSuccess?: (res: any) => void;
|
87
87
|
/** 内部请求失败时的回调 */
|
88
88
|
onError?: (error: Error) => void;
|
89
|
+
/** 自定义的请求配置 */
|
90
|
+
requestConfig?: AxiosRequestConfig;
|
89
91
|
/** 翻页页数的请求参数名 */
|
90
92
|
pageKey?: string;
|
91
93
|
/** 翻页器页数对应字段 */
|
@@ -274,6 +276,7 @@ export declare type ProTableLayoutProps = {
|
|
274
276
|
actionRef: React.MutableRefObject<ProTableActionType | undefined>;
|
275
277
|
columns?: ProTableColumnProps[];
|
276
278
|
rowSelection?: innerRowSelectionType | rowSelectionType;
|
279
|
+
fullScreenState?: boolean;
|
277
280
|
} & ProTableTopAreaProps;
|
278
281
|
/** columns 列过滤 */
|
279
282
|
export declare type ProTableColumnsFilterItemProps = {
|