@teamix/pro 1.2.16 → 1.2.20
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/212.js +49 -49
- package/dist/pro.css +1 -1
- package/dist/pro.js +2147 -686
- package/dist/pro.min.css +1 -1
- package/dist/pro.min.js +1 -1
- package/es/actions/base.d.ts +2 -1
- package/es/actions/base.js +1 -1
- package/es/actions/danger-pop-confirm.d.ts +5 -0
- package/es/actions/danger-pop-confirm.js +10 -0
- package/es/actions/dialog.d.ts +1 -1
- package/es/actions/dialog.js +34 -36
- package/es/actions/index.d.ts +5 -0
- package/es/actions/index.js +38 -14
- package/es/actions/pop-confirm.d.ts +9 -0
- package/es/actions/pop-confirm.js +9 -0
- package/es/form/Components/LightFilter/componentMap.d.ts +2 -1
- package/es/form/Components/LightFilter/componentMap.js +2 -1
- package/es/form/Components/LightFilter/index.d.ts +1 -0
- package/es/form/Components/LightFilter/index.js +19 -13
- package/es/form/Components/LightFilter/index.scss +14 -4
- package/es/form/Filter/AdvancedFilter.d.ts +7 -0
- package/es/form/Filter/AdvancedFilter.js +113 -0
- package/es/form/Filter/LightFilter.d.ts +7 -0
- package/es/form/Filter/LightFilter.js +79 -0
- package/es/form/Filter/SimpleFilter.d.ts +7 -0
- package/es/form/Filter/SimpleFilter.js +74 -0
- package/es/form/Filter/index2.js +288 -235
- package/es/form/Filter/index2.scss +3 -0
- package/es/form/ProForm/index.js +11 -8
- package/es/form/ProForm/index.scss +3 -0
- package/es/form/ProForm/useFieldRequest.js +1 -8
- package/es/form/SchemaForm/index.js +3 -1
- package/es/form/typing.d.ts +11 -2
- package/es/index.d.ts +1 -1
- package/es/index.js +1 -1
- package/es/nocode/configurators/ProTable.js +1 -0
- package/es/table/components/Filter/index.js +42 -16
- package/es/table/components/Pagination/index.d.ts +3 -0
- package/es/table/components/Pagination/index.js +82 -0
- package/es/table/components/ToolBar/FilterColumnIcon.js +18 -5
- package/es/table/components/ToolBar/index.scss +8 -2
- package/es/table/index.js +71 -18
- package/es/table/index.scss +7 -1
- package/es/table/typing.d.ts +5 -0
- package/es/table/utils/columnRender.js +1 -1
- package/lib/actions/base.d.ts +2 -1
- package/lib/actions/base.js +1 -1
- package/lib/actions/danger-pop-confirm.d.ts +5 -0
- package/lib/actions/danger-pop-confirm.js +22 -0
- package/lib/actions/dialog.d.ts +1 -1
- package/lib/actions/dialog.js +35 -36
- package/lib/actions/index.d.ts +5 -0
- package/lib/actions/index.js +40 -14
- package/lib/actions/pop-confirm.d.ts +9 -0
- package/lib/actions/pop-confirm.js +23 -0
- package/lib/form/Components/LightFilter/componentMap.d.ts +2 -1
- package/lib/form/Components/LightFilter/componentMap.js +4 -3
- package/lib/form/Components/LightFilter/index.d.ts +1 -0
- package/lib/form/Components/LightFilter/index.js +18 -12
- package/lib/form/Components/LightFilter/index.scss +14 -4
- package/lib/form/Filter/AdvancedFilter.d.ts +7 -0
- package/lib/form/Filter/AdvancedFilter.js +133 -0
- package/lib/form/Filter/LightFilter.d.ts +7 -0
- package/lib/form/Filter/LightFilter.js +99 -0
- package/lib/form/Filter/SimpleFilter.d.ts +7 -0
- package/lib/form/Filter/SimpleFilter.js +93 -0
- package/lib/form/Filter/index2.js +290 -234
- package/lib/form/Filter/index2.scss +3 -0
- package/lib/form/ProForm/index.js +11 -7
- package/lib/form/ProForm/index.scss +3 -0
- package/lib/form/ProForm/useFieldRequest.js +1 -9
- package/lib/form/SchemaForm/index.js +3 -1
- package/lib/form/typing.d.ts +11 -2
- package/lib/index.d.ts +1 -1
- package/lib/index.js +1 -1
- package/lib/nocode/configurators/ProTable.js +1 -0
- package/lib/table/components/Filter/index.js +42 -16
- package/lib/table/components/Pagination/index.d.ts +3 -0
- package/lib/table/components/Pagination/index.js +95 -0
- package/lib/table/components/ToolBar/FilterColumnIcon.js +18 -5
- package/lib/table/components/ToolBar/index.scss +8 -2
- package/lib/table/index.js +69 -17
- package/lib/table/index.scss +7 -1
- package/lib/table/typing.d.ts +5 -0
- package/lib/table/utils/columnRender.js +1 -1
- package/package.json +3 -3
package/es/form/ProForm/index.js
CHANGED
@@ -12,7 +12,7 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
|
|
12
12
|
|
13
13
|
import React, { memo, useEffect, useMemo } from 'react';
|
14
14
|
import cls from 'classnames';
|
15
|
-
import { createForm,
|
15
|
+
import { createForm, onFieldValueChange, registerValidateLocale, setValidateLanguage } from '@formily/core';
|
16
16
|
import { toJS } from '@formily/reactive';
|
17
17
|
import { Form } from '@teamix/formily';
|
18
18
|
import { usePrefixCls, getLanguage } from '@teamix/utils';
|
@@ -21,6 +21,7 @@ import { mergeArrayValue } from '../utils';
|
|
21
21
|
import useAutoSubmit from './useAutoSubmit';
|
22
22
|
import useInitialRequest from './useInitialRequest';
|
23
23
|
import validateLocale from '../locales/validate';
|
24
|
+
import debounce from 'lodash.debounce';
|
24
25
|
import './index.scss';
|
25
26
|
registerValidateLocale(validateLocale);
|
26
27
|
var ProForm = /*#__PURE__*/memo(function (_ref) {
|
@@ -78,13 +79,11 @@ var ProForm = /*#__PURE__*/memo(function (_ref) {
|
|
78
79
|
}, [breakpoints, layout, labelAlign, wrapperAlign, labelCol, wrapperCol]); // 添加onChange
|
79
80
|
|
80
81
|
useEffect(function () {
|
81
|
-
form.removeEffects('
|
82
|
-
form.addEffects('
|
83
|
-
|
84
|
-
|
85
|
-
|
86
|
-
}
|
87
|
-
});
|
82
|
+
form.removeEffects('onFieldValueChange');
|
83
|
+
form.addEffects('onFieldValueChange', function () {
|
84
|
+
onFieldValueChange('*', debounce(function (field, form) {
|
85
|
+
onChange && onChange(toJS(form.values), toJS(field.value), field.props.name);
|
86
|
+
}, 300));
|
88
87
|
});
|
89
88
|
}, [form, onChange]); // 配置表单默认值
|
90
89
|
|
@@ -94,6 +93,10 @@ var ProForm = /*#__PURE__*/memo(function (_ref) {
|
|
94
93
|
} else if (initialRequest) {
|
95
94
|
useInitialRequest(initialRequest).then(function (values) {
|
96
95
|
form.setInitialValues(values);
|
96
|
+
}).finally(function () {
|
97
|
+
initialRequest.onComplete && initialRequest.onComplete(undefined, undefined, {
|
98
|
+
form: form
|
99
|
+
});
|
97
100
|
});
|
98
101
|
}
|
99
102
|
}, []); // 配置国际化
|
@@ -5,18 +5,11 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
|
|
5
5
|
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; }
|
6
6
|
|
7
7
|
import { useField } from '@formily/react';
|
8
|
-
import { isPlainObj } from '@teamix/utils';
|
9
8
|
export default (function () {
|
10
9
|
var field = useField();
|
11
10
|
|
12
11
|
var refresh = function refresh() {
|
13
|
-
|
14
|
-
field.data = {
|
15
|
-
refresh: {}
|
16
|
-
};
|
17
|
-
} else {
|
18
|
-
field.data.refresh = _objectSpread({}, field.data.refresh);
|
19
|
-
}
|
12
|
+
field.data.refresh = _objectSpread({}, field.data.refresh);
|
20
13
|
};
|
21
14
|
|
22
15
|
return {
|
@@ -223,7 +223,9 @@ export default /*#__PURE__*/memo(function (_ref) {
|
|
223
223
|
rules: defaultRules,
|
224
224
|
reactions: defaultReactions,
|
225
225
|
dataSource: defaultDataSource,
|
226
|
-
data: data
|
226
|
+
data: data || {
|
227
|
+
placeholder: true
|
228
|
+
}
|
227
229
|
})); // 递归子组件
|
228
230
|
|
229
231
|
var recursiveProperties = (children === null || children === void 0 ? void 0 : children.length) ? {
|
package/es/form/typing.d.ts
CHANGED
@@ -58,12 +58,18 @@ export interface ProFormProps extends IFormLayoutProps {
|
|
58
58
|
};
|
59
59
|
children?: React.ReactNode;
|
60
60
|
initialValues?: AnyObject;
|
61
|
-
initialRequest?:
|
61
|
+
initialRequest?: ProFormRequestConfig;
|
62
62
|
previewTextPlaceholder?: ReactNode;
|
63
|
-
onChange?: (values: any,
|
63
|
+
onChange?: (values: any, fieldValue?: any, fieldName?: string) => any;
|
64
64
|
onSubmit?: ((values: any) => any) | CommonRequestConfig;
|
65
65
|
onSubmitFailed?: (feedbacks: IFormFeedback[]) => void;
|
66
66
|
}
|
67
|
+
export interface FilterProps extends ProFormProps {
|
68
|
+
form: FormType;
|
69
|
+
defaultFilterValue?: string;
|
70
|
+
onReset?: (payload?: any) => void;
|
71
|
+
onResetClick?: () => void;
|
72
|
+
}
|
67
73
|
export interface QueryFilterProps extends ProFormProps {
|
68
74
|
/**
|
69
75
|
* @deprecated triggerType已弃用
|
@@ -73,6 +79,9 @@ export interface QueryFilterProps extends ProFormProps {
|
|
73
79
|
expand?: boolean;
|
74
80
|
addonBefore?: ReactNode;
|
75
81
|
addonAfter?: ReactNode;
|
82
|
+
defaultFilterValue?: string;
|
83
|
+
formRef?: React.MutableRefObject<any>;
|
84
|
+
onInit?: (values: any) => boolean;
|
76
85
|
onFilter?: (values: any) => void;
|
77
86
|
onReset?: (payload?: any) => void;
|
78
87
|
}
|
package/es/index.d.ts
CHANGED
@@ -21,5 +21,5 @@ export * from './page-container';
|
|
21
21
|
export * from './page-header';
|
22
22
|
export * from './skeleton';
|
23
23
|
export * from './table';
|
24
|
-
declare const version = "1.2.
|
24
|
+
declare const version = "1.2.19";
|
25
25
|
export { version, ProAction, ProCard, ProField, ProForm, ProInfo, ProPageContainer, ProPageHeader, ProSkeleton, ProTable, hooks, nocode, templates, utils, };
|
package/es/index.js
CHANGED
@@ -27,7 +27,7 @@ export * from './page-header';
|
|
27
27
|
export * from './skeleton';
|
28
28
|
export * from './table'; // export * from './sidebar';
|
29
29
|
|
30
|
-
var version = '1.2.
|
30
|
+
var version = '1.2.19';
|
31
31
|
export { version, ProAction, ProCard, ProField, ProForm, ProInfo, // ProLayout,
|
32
32
|
ProPageContainer, ProPageHeader, ProSkeleton, ProTable, // ProSidebar,
|
33
33
|
hooks, nocode, templates, utils };
|
@@ -140,7 +140,7 @@ var Filter = function Filter(props) {
|
|
140
140
|
return /*#__PURE__*/React.createElement(Dropdown, {
|
141
141
|
trigger: /*#__PURE__*/React.createElement(TeamixIcon, {
|
142
142
|
size: "small",
|
143
|
-
type:
|
143
|
+
type: selected.length > 0 && visible === false ? 'filter-fill' : 'filter-line',
|
144
144
|
className: cls({
|
145
145
|
icon: true,
|
146
146
|
'icon-selected': selected.length > 0
|
@@ -149,6 +149,8 @@ var Filter = function Filter(props) {
|
|
149
149
|
setVisible(!visible);
|
150
150
|
}
|
151
151
|
}),
|
152
|
+
//@ts-ignore
|
153
|
+
v2: true,
|
152
154
|
triggerType: ['click'],
|
153
155
|
align: "tl bl",
|
154
156
|
visible: visible,
|
@@ -171,7 +173,7 @@ var Filter = function Filter(props) {
|
|
171
173
|
btn: true
|
172
174
|
}),
|
173
175
|
onClick: function onClick() {
|
174
|
-
var _actionRef$current2, _actionRef$current2$f, _actionRef$current$ge5, _actionRef$current3, _actionRef$current3$g, _actionRef$current3$g2, _actionRef$current4, _actionRef$
|
176
|
+
var _actionRef$current2, _actionRef$current2$f, _actionRef$current$ge5, _actionRef$current3, _actionRef$current3$g, _actionRef$current3$g2, _actionRef$current4, _actionRef$current4$s;
|
175
177
|
|
176
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
|
177
179
|
|
@@ -199,24 +201,30 @@ var Filter = function Filter(props) {
|
|
199
201
|
return null;
|
200
202
|
})), [[column.dataIndex, param]]).filter(function (item) {
|
201
203
|
return item && (item === null || item === void 0 ? void 0 : item[1]);
|
202
|
-
}));
|
203
|
-
var targetPageKey = 'currentPage';
|
204
|
-
var pageInfo = (_actionRef$current4 = actionRef.current) === null || _actionRef$current4 === void 0 ? void 0 : _actionRef$current4.pageInfo;
|
204
|
+
})); // 再设置所有的列筛选状态
|
205
205
|
|
206
|
-
|
207
|
-
targetPageKey = pageInfo === null || pageInfo === void 0 ? void 0 : pageInfo.targetPageKey;
|
208
|
-
} // 再设置所有的列筛选状态
|
209
|
-
|
210
|
-
|
211
|
-
(_actionRef$current5 = actionRef.current) === null || _actionRef$current5 === void 0 ? void 0 : (_actionRef$current5$s = _actionRef$current5.setFilterRules) === null || _actionRef$current5$s === void 0 ? void 0 : _actionRef$current5$s.call(_actionRef$current5, _objectSpread(_objectSpread({}, rules), {}, _defineProperty({}, column.dataIndex, {
|
206
|
+
(_actionRef$current4 = actionRef.current) === null || _actionRef$current4 === void 0 ? void 0 : (_actionRef$current4$s = _actionRef$current4.setFilterRules) === null || _actionRef$current4$s === void 0 ? void 0 : _actionRef$current4$s.call(_actionRef$current4, _objectSpread(_objectSpread({}, rules), {}, _defineProperty({}, column.dataIndex, {
|
212
207
|
rules: selected,
|
213
208
|
params: param
|
214
|
-
})));
|
209
|
+
})));
|
210
|
+
|
211
|
+
if (selected.length > 0) {
|
212
|
+
var _actionRef$current5, _actionRef$current6, _actionRef$current6$r, _actionRef$current7, _actionRef$current7$r, _actionRef$current8, _actionRef$current8$c;
|
213
|
+
|
214
|
+
var targetPageKey = 'currentPage';
|
215
|
+
var pageInfo = (_actionRef$current5 = actionRef.current) === null || _actionRef$current5 === void 0 ? void 0 : _actionRef$current5.pageInfo;
|
216
|
+
|
217
|
+
if (pageInfo && (pageInfo === null || pageInfo === void 0 ? void 0 : pageInfo.targetPageKey)) {
|
218
|
+
targetPageKey = pageInfo === null || pageInfo === void 0 ? void 0 : pageInfo.targetPageKey;
|
219
|
+
} // 发送请求
|
220
|
+
|
221
|
+
|
222
|
+
(_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, _objectSpread(_objectSpread({}, params), {}, _defineProperty({}, targetPageKey, 1)));
|
223
|
+
(_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); // 清空表格选择
|
215
224
|
|
216
|
-
|
217
|
-
|
225
|
+
(_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);
|
226
|
+
}
|
218
227
|
|
219
|
-
(_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);
|
220
228
|
setVisible(false);
|
221
229
|
}
|
222
230
|
}, getMessage('ok')), /*#__PURE__*/React.createElement(Button, {
|
@@ -234,7 +242,25 @@ var Filter = function Filter(props) {
|
|
234
242
|
rules: [],
|
235
243
|
params: ''
|
236
244
|
})));
|
237
|
-
(_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);
|
245
|
+
(_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);
|
246
|
+
|
247
|
+
if (selected.length > 0) {
|
248
|
+
var _actionRef$current12, _actionRef$current13, _actionRef$current13$, _actionRef$current14, _actionRef$current14$, _actionRef$current15, _actionRef$current15$;
|
249
|
+
|
250
|
+
var targetPageKey = 'currentPage';
|
251
|
+
var pageInfo = (_actionRef$current12 = actionRef.current) === null || _actionRef$current12 === void 0 ? void 0 : _actionRef$current12.pageInfo;
|
252
|
+
|
253
|
+
if (pageInfo && (pageInfo === null || pageInfo === void 0 ? void 0 : pageInfo.targetPageKey)) {
|
254
|
+
targetPageKey = pageInfo === null || pageInfo === void 0 ? void 0 : pageInfo.targetPageKey;
|
255
|
+
} // 发送请求
|
256
|
+
|
257
|
+
|
258
|
+
(_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));
|
259
|
+
(_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); // 清空表格选择
|
260
|
+
|
261
|
+
(_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);
|
262
|
+
} // setVisible(!visible);
|
263
|
+
|
238
264
|
}
|
239
265
|
}, getMessage('reset'))))));
|
240
266
|
};
|
@@ -0,0 +1,82 @@
|
|
1
|
+
var _excluded = ["className", "onChange", "total", "totalRender", "pageSize", "current", "pageSizeList", "pageSizeSelector", "type", "onPageSizeChange"];
|
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 _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
10
|
+
|
11
|
+
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
12
|
+
|
13
|
+
// 自适应宽度的翻页器
|
14
|
+
import React from 'react';
|
15
|
+
import { Pagination } from '@alicloudfe/components';
|
16
|
+
import { useResponsiveProps } from '@teamix/hooks';
|
17
|
+
export default (function (props) {
|
18
|
+
var className = props.className,
|
19
|
+
onChange = props.onChange,
|
20
|
+
total = props.total,
|
21
|
+
totalRender = props.totalRender,
|
22
|
+
pageSize = props.pageSize,
|
23
|
+
current = props.current,
|
24
|
+
pageSizeList = props.pageSizeList,
|
25
|
+
pageSizeSelector = props.pageSizeSelector,
|
26
|
+
type = props.type,
|
27
|
+
onPageSizeChange = props.onPageSizeChange,
|
28
|
+
otherProps = _objectWithoutProperties(props, _excluded);
|
29
|
+
|
30
|
+
var _useResponsiveProps = useResponsiveProps([480, 580, 680], ['mini', 'small', 'simple', 'normal']),
|
31
|
+
responsiveProps = _useResponsiveProps.responsiveProps,
|
32
|
+
paginationWrapperRef = _useResponsiveProps.ref;
|
33
|
+
|
34
|
+
var commonPaginationProps = {
|
35
|
+
className: className,
|
36
|
+
onChange: onChange,
|
37
|
+
total: total,
|
38
|
+
pageSize: pageSize,
|
39
|
+
current: current,
|
40
|
+
shape: 'arrow-only',
|
41
|
+
pageSizeList: pageSizeList,
|
42
|
+
pageSizeSelector: pageSizeSelector,
|
43
|
+
pageSizePosition: 'end',
|
44
|
+
onPageSizeChange: onPageSizeChange
|
45
|
+
};
|
46
|
+
|
47
|
+
var renderPagination = function renderPagination() {
|
48
|
+
switch (responsiveProps) {
|
49
|
+
case 'normal':
|
50
|
+
return /*#__PURE__*/React.createElement(Pagination, _objectSpread(_objectSpread({}, commonPaginationProps), otherProps));
|
51
|
+
|
52
|
+
case 'simple':
|
53
|
+
return /*#__PURE__*/React.createElement(Pagination, _objectSpread(_objectSpread({}, commonPaginationProps), {}, {
|
54
|
+
pageShowCount: 3
|
55
|
+
}, otherProps));
|
56
|
+
|
57
|
+
case 'small':
|
58
|
+
return /*#__PURE__*/React.createElement(Pagination, _objectSpread(_objectSpread({}, commonPaginationProps), {}, {
|
59
|
+
pageSizeSelector: false,
|
60
|
+
type: "simple"
|
61
|
+
}, otherProps));
|
62
|
+
|
63
|
+
case 'mini':
|
64
|
+
return /*#__PURE__*/React.createElement(Pagination, _objectSpread(_objectSpread({}, commonPaginationProps), {}, {
|
65
|
+
pageSizeSelector: false,
|
66
|
+
type: "mini"
|
67
|
+
}, otherProps));
|
68
|
+
|
69
|
+
default:
|
70
|
+
return /*#__PURE__*/React.createElement(Pagination, _objectSpread(_objectSpread({}, commonPaginationProps), otherProps));
|
71
|
+
}
|
72
|
+
};
|
73
|
+
|
74
|
+
return (
|
75
|
+
/*#__PURE__*/
|
76
|
+
// 用于获取翻页器响应式 ref
|
77
|
+
React.createElement("div", {
|
78
|
+
ref: paginationWrapperRef,
|
79
|
+
className: "pagination-wrapper"
|
80
|
+
}, renderPagination())
|
81
|
+
);
|
82
|
+
});
|
@@ -54,7 +54,8 @@ var processColumns = function processColumns(columns) {
|
|
54
54
|
var FilterColumnIcon = function FilterColumnIcon(props) {
|
55
55
|
var _props$columns = props.columns,
|
56
56
|
columns = _props$columns === void 0 ? [] : _props$columns,
|
57
|
-
actionRef = props.actionRef
|
57
|
+
actionRef = props.actionRef,
|
58
|
+
filterColumnType = props.filterColumnType;
|
58
59
|
|
59
60
|
var _useState = useState(true),
|
60
61
|
_useState2 = _slicedToArray(_useState, 2),
|
@@ -241,7 +242,9 @@ var FilterColumnIcon = function FilterColumnIcon(props) {
|
|
241
242
|
align: "tr br"
|
242
243
|
}, /*#__PURE__*/React.createElement("div", {
|
243
244
|
className: cls()
|
244
|
-
}, /*#__PURE__*/React.createElement(Menu,
|
245
|
+
}, /*#__PURE__*/React.createElement(Menu, {
|
246
|
+
className: cls('all-select')
|
247
|
+
}, /*#__PURE__*/React.createElement(CheckboxItem, {
|
245
248
|
indeterminate: indeterminate,
|
246
249
|
checked: allVisible,
|
247
250
|
onChange: onChangeAllColumns
|
@@ -254,7 +257,9 @@ var FilterColumnIcon = function FilterColumnIcon(props) {
|
|
254
257
|
type: "primary"
|
255
258
|
}, getMessage('reset'))), /*#__PURE__*/React.createElement(Menu.Divider, {
|
256
259
|
key: "divider"
|
257
|
-
}),
|
260
|
+
})), /*#__PURE__*/React.createElement(Menu, {
|
261
|
+
className: cls('checkbox-group')
|
262
|
+
}, newColumns.map(function (_ref9, index) {
|
258
263
|
var _newColumns$find;
|
259
264
|
|
260
265
|
var dataIndex = _ref9.dataIndex,
|
@@ -344,12 +349,20 @@ var FilterColumnIcon = function FilterColumnIcon(props) {
|
|
344
349
|
},
|
345
350
|
disabled: columnFiltersDisabled
|
346
351
|
}, /*#__PURE__*/React.createElement(Ellipsis, {
|
347
|
-
tooltip:
|
352
|
+
tooltip: title
|
348
353
|
}, title)));
|
349
354
|
}))));
|
350
355
|
};
|
351
356
|
|
352
|
-
if (
|
357
|
+
if (filterColumnType === 'dialog') {
|
358
|
+
return renderDialog();
|
359
|
+
}
|
360
|
+
|
361
|
+
if (filterColumnType === 'dropdown') {
|
362
|
+
return renderDropdown();
|
363
|
+
}
|
364
|
+
|
365
|
+
if (newColumns.length >= 20) {
|
353
366
|
return renderDialog();
|
354
367
|
}
|
355
368
|
|
@@ -18,8 +18,6 @@
|
|
18
18
|
// FilterColumn
|
19
19
|
.teamix-pro-table-toolbar-filter-column {
|
20
20
|
min-width: 180px;
|
21
|
-
max-height: 350px;
|
22
|
-
overflow: auto;
|
23
21
|
box-shadow: var(--popup-local-shadow, 0px 6px 24px 0px rgba(0, 0, 0, 0.1));
|
24
22
|
background: var(--menu-background);
|
25
23
|
&-reset {
|
@@ -76,6 +74,14 @@
|
|
76
74
|
align-items: center;
|
77
75
|
}
|
78
76
|
}
|
77
|
+
.teamix-pro-table-toolbar-filter-column-all-select.teamix-pro-table-toolbar-filter-column-all-select {
|
78
|
+
padding-bottom: 0;
|
79
|
+
}
|
80
|
+
.teamix-pro-table-toolbar-filter-column-checkbox-group.teamix-pro-table-toolbar-filter-column-checkbox-group {
|
81
|
+
padding-top: 0;
|
82
|
+
max-height: 310px;
|
83
|
+
overflow: auto;
|
84
|
+
}
|
79
85
|
|
80
86
|
// fullscreen
|
81
87
|
.teamix-pro-table-full-screen {
|
package/es/table/index.js
CHANGED
@@ -1,4 +1,4 @@
|
|
1
|
-
var _excluded = ["header", "className", "tableClassName", "mainAction", "extra", "dataFilter", "toolBar", "columns", "useRowSelection", "rowSelection", "onChangeRowSelection", "getRowSelection", "primaryKey", "footerAction", "footer", "url", "pageKey", "pageSizeKey", "method", "params", "formatSort", "formatParams", "formatResult", "requestWhenMount", "showPagination", "pageSizeList", "showSkeleton", "skeletonSize", "actionRef", "dataSource", "filterDebounce", "footerSuction", "autoRefresh", "customRequest"];
|
1
|
+
var _excluded = ["header", "className", "tableClassName", "mainAction", "extra", "dataFilter", "toolBar", "columns", "useRowSelection", "rowSelection", "onChangeRowSelection", "getRowSelection", "primaryKey", "footerAction", "footer", "url", "pageKey", "pageSizeKey", "method", "params", "formatSort", "formatParams", "formatResult", "requestWhenMount", "showPagination", "pageSizeList", "showSkeleton", "skeletonSize", "actionRef", "dataSource", "filterDebounce", "footerSuction", "autoRefresh", "customRequest", "filterColumnType"];
|
2
2
|
|
3
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
4
|
|
@@ -33,7 +33,8 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
|
|
33
33
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
34
34
|
|
35
35
|
import React, { useState, useEffect, useRef, useMemo } from 'react';
|
36
|
-
import { Table,
|
36
|
+
import { Table, Checkbox, Pagination } from '@alicloudfe/components'; // import Pagination from './components/Pagination';
|
37
|
+
|
37
38
|
import genProColumnToColumn from './utils/genProColumnToColumn';
|
38
39
|
import { baseClass, useRequest, request as utilResquest, getDeepValue, getMessage, pickProps } from '@teamix/utils';
|
39
40
|
import { ProSkeletonRaw as Skeleton } from '../skeleton';
|
@@ -59,10 +60,36 @@ var toJS = formilyReactive.toJS;
|
|
59
60
|
* @returns
|
60
61
|
*/
|
61
62
|
|
62
|
-
var processColumns = function processColumns(columns) {
|
63
|
-
|
63
|
+
var processColumns = function processColumns(columns, initialColumns) {
|
64
|
+
var filterColumns = columns.filter(function (item) {
|
64
65
|
return item.columnFilters !== false;
|
65
|
-
});
|
66
|
+
}); // 处理只剩一列批量选择的情况下宽度错乱问题
|
67
|
+
|
68
|
+
if (filterColumns === null || filterColumns === void 0 ? void 0 : filterColumns.length) {
|
69
|
+
if ((filterColumns === null || filterColumns === void 0 ? void 0 : filterColumns.length) === 1) {
|
70
|
+
var _filterColumns$, _filterColumns$2;
|
71
|
+
|
72
|
+
if ((_filterColumns$ = filterColumns[0]) === null || _filterColumns$ === void 0 ? void 0 : _filterColumns$.width) {
|
73
|
+
delete filterColumns[0].width;
|
74
|
+
}
|
75
|
+
|
76
|
+
if ((_filterColumns$2 = filterColumns[0]) === null || _filterColumns$2 === void 0 ? void 0 : _filterColumns$2.lock) {
|
77
|
+
filterColumns[0].lock = false;
|
78
|
+
}
|
79
|
+
} else {
|
80
|
+
var _initialColumns$, _initialColumns$2;
|
81
|
+
|
82
|
+
if ((_initialColumns$ = initialColumns[0]) === null || _initialColumns$ === void 0 ? void 0 : _initialColumns$.width) {
|
83
|
+
filterColumns[0].width = initialColumns[0].width;
|
84
|
+
}
|
85
|
+
|
86
|
+
if ((_initialColumns$2 = initialColumns[0]) === null || _initialColumns$2 === void 0 ? void 0 : _initialColumns$2.lock) {
|
87
|
+
filterColumns[0].lock = initialColumns[0].lock;
|
88
|
+
}
|
89
|
+
}
|
90
|
+
}
|
91
|
+
|
92
|
+
return filterColumns;
|
66
93
|
};
|
67
94
|
/** 默认请求翻页参数 */
|
68
95
|
|
@@ -132,6 +159,8 @@ var ProTable = function ProTable(props) {
|
|
132
159
|
return false;
|
133
160
|
} : _props$autoRefresh,
|
134
161
|
customRequest = props.customRequest,
|
162
|
+
_props$filterColumnTy = props.filterColumnType,
|
163
|
+
filterColumnType = _props$filterColumnTy === void 0 ? 'auto' : _props$filterColumnTy,
|
135
164
|
otherProps = _objectWithoutProperties(props, _excluded);
|
136
165
|
|
137
166
|
var targetPageKey = pageKey || globalPageKey;
|
@@ -163,7 +192,7 @@ var ProTable = function ProTable(props) {
|
|
163
192
|
sort = _useState10[0],
|
164
193
|
setSort = _useState10[1];
|
165
194
|
|
166
|
-
var _useState11 = useState(requestWhenMount && propsShowSkeleton),
|
195
|
+
var _useState11 = useState(!propsDataSource && requestWhenMount && propsShowSkeleton),
|
167
196
|
_useState12 = _slicedToArray(_useState11, 2),
|
168
197
|
showSkeleton = _useState12[0],
|
169
198
|
setShowSkeleton = _useState12[1]; // 首次加载,渲染骨架屏
|
@@ -180,7 +209,7 @@ var ProTable = function ProTable(props) {
|
|
180
209
|
var tableRef = useRef(null);
|
181
210
|
var actionRef = useRef(); // 传给 table 的过滤后的 columns
|
182
211
|
|
183
|
-
var _useState15 = useState(processColumns(propsColumns !== null && propsColumns !== void 0 ? propsColumns : [])),
|
212
|
+
var _useState15 = useState(processColumns(propsColumns !== null && propsColumns !== void 0 ? propsColumns : [], propsColumns)),
|
184
213
|
_useState16 = _slicedToArray(_useState15, 2),
|
185
214
|
filteredColumns = _useState16[0],
|
186
215
|
setFilteredColumns = _useState16[1];
|
@@ -351,10 +380,16 @@ var ProTable = function ProTable(props) {
|
|
351
380
|
useEffect(function () {
|
352
381
|
var _actionRef$current, _actionRef$current$se;
|
353
382
|
|
354
|
-
var columns = processColumns(propsColumns !== null && propsColumns !== void 0 ? propsColumns : []);
|
383
|
+
var columns = processColumns(propsColumns !== null && propsColumns !== void 0 ? propsColumns : [], propsColumns);
|
355
384
|
setFilteredColumns(columns);
|
356
385
|
(_actionRef$current = actionRef.current) === null || _actionRef$current === void 0 ? void 0 : (_actionRef$current$se = _actionRef$current.setState) === null || _actionRef$current$se === void 0 ? void 0 : _actionRef$current$se.call(_actionRef$current, 'filterColumns', columns);
|
357
|
-
}, [propsColumns]); //
|
386
|
+
}, [propsColumns]); // dataSource 受控
|
387
|
+
|
388
|
+
useEffect(function () {
|
389
|
+
if (propsDataSource) {
|
390
|
+
setData(propsDataSource);
|
391
|
+
}
|
392
|
+
}, [propsDataSource]); // 绑定 Actions
|
358
393
|
|
359
394
|
useActionType(actionRef, {
|
360
395
|
fullScreen: function fullScreen() {
|
@@ -369,7 +404,7 @@ var ProTable = function ProTable(props) {
|
|
369
404
|
setColumn: function setColumn(newColumns) {
|
370
405
|
var _actionRef$current2, _actionRef$current2$s;
|
371
406
|
|
372
|
-
var columns = processColumns(newColumns);
|
407
|
+
var columns = processColumns(newColumns, propsColumns);
|
373
408
|
setFilteredColumns(columns);
|
374
409
|
(_actionRef$current2 = actionRef.current) === null || _actionRef$current2 === void 0 ? void 0 : (_actionRef$current2$s = _actionRef$current2.setState) === null || _actionRef$current2$s === void 0 ? void 0 : _actionRef$current2$s.call(_actionRef$current2, 'filterColumns', columns);
|
375
410
|
},
|
@@ -381,6 +416,15 @@ var ProTable = function ProTable(props) {
|
|
381
416
|
},
|
382
417
|
request: function request(params) {
|
383
418
|
if (dataFilterForm.validate()) {
|
419
|
+
// 如果请求中还有翻页相关信息,需要自动设置到指定页
|
420
|
+
if (params === null || params === void 0 ? void 0 : params[targetPageKey]) {
|
421
|
+
setCurrentPage(params[targetPageKey]);
|
422
|
+
}
|
423
|
+
|
424
|
+
if (params === null || params === void 0 ? void 0 : params[targetPageSizeKey]) {
|
425
|
+
setPageSize(params[targetPageSizeKey]);
|
426
|
+
}
|
427
|
+
|
384
428
|
_request(params);
|
385
429
|
}
|
386
430
|
},
|
@@ -411,6 +455,7 @@ var ProTable = function ProTable(props) {
|
|
411
455
|
targetPageSizeKey: targetPageSizeKey,
|
412
456
|
pageSize: pageSize
|
413
457
|
},
|
458
|
+
data: data,
|
414
459
|
dataFilterForm: dataFilterForm,
|
415
460
|
resetTableMaxBodyHeight: function resetTableMaxBodyHeight() {
|
416
461
|
getHeaderHeight().then(function (height) {
|
@@ -609,10 +654,11 @@ var ProTable = function ProTable(props) {
|
|
609
654
|
(propsDataFilter === null || propsDataFilter === void 0 ? void 0 : propsDataFilter.onFilter) && (propsDataFilter === null || propsDataFilter === void 0 ? void 0 : propsDataFilter.onFilter(_objectSpread({}, toJS(dataFilterForm.values))));
|
610
655
|
|
611
656
|
if (dataFilterForm.validate()) {
|
612
|
-
|
613
|
-
|
614
|
-
//
|
615
|
-
|
657
|
+
var _actionRef$current6, _actionRef$current6$c;
|
658
|
+
|
659
|
+
// 搜索变化时,暂时先清空选择
|
660
|
+
(_actionRef$current6 = actionRef.current) === null || _actionRef$current6 === void 0 ? void 0 : (_actionRef$current6$c = _actionRef$current6.clearRowSelection) === null || _actionRef$current6$c === void 0 ? void 0 : _actionRef$current6$c.call(_actionRef$current6);
|
661
|
+
setCurrentPage(1);
|
616
662
|
|
617
663
|
_request(_defineProperty({}, targetPageKey, 1));
|
618
664
|
}
|
@@ -647,7 +693,8 @@ var ProTable = function ProTable(props) {
|
|
647
693
|
columns: propsColumns,
|
648
694
|
dataFilter: dataFilter,
|
649
695
|
dataFilterForm: dataFilterForm,
|
650
|
-
rowSelection: rowSelection
|
696
|
+
rowSelection: rowSelection,
|
697
|
+
filterColumnType: filterColumnType
|
651
698
|
}), /*#__PURE__*/React.createElement(Table.StickyLock, _objectSpread({
|
652
699
|
hasBorder: false,
|
653
700
|
dataSource: showSkeleton ? skeletonDataSource : data || props.dataSource,
|
@@ -705,15 +752,21 @@ var ProTable = function ProTable(props) {
|
|
705
752
|
|
706
753
|
var renderFooter = function renderFooter() {
|
707
754
|
function onChangePagination(currentPage) {
|
755
|
+
var _actionRef$current7, _actionRef$current7$c;
|
756
|
+
|
708
757
|
var params = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
758
|
+
// 翻页暂时先清空选择
|
759
|
+
(_actionRef$current7 = actionRef.current) === null || _actionRef$current7 === void 0 ? void 0 : (_actionRef$current7$c = _actionRef$current7.clearRowSelection) === null || _actionRef$current7$c === void 0 ? void 0 : _actionRef$current7$c.call(_actionRef$current7);
|
709
760
|
setCurrentPage(currentPage);
|
710
761
|
|
711
762
|
_request(_objectSpread(_defineProperty({}, targetPageKey, currentPage), params));
|
712
763
|
}
|
713
764
|
|
714
765
|
function onChangePaginationSize(currentPageSize) {
|
715
|
-
var _request5;
|
766
|
+
var _actionRef$current8, _actionRef$current8$c, _request5;
|
716
767
|
|
768
|
+
// 翻页暂时先清空选择
|
769
|
+
(_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);
|
717
770
|
setPageSize(currentPageSize);
|
718
771
|
setCurrentPage(1);
|
719
772
|
|
@@ -753,6 +806,8 @@ var ProTable = function ProTable(props) {
|
|
753
806
|
return onChangePagination(number);
|
754
807
|
},
|
755
808
|
total: total,
|
809
|
+
shape: "arrow-only",
|
810
|
+
pageSizePosition: "end",
|
756
811
|
totalRender: function totalRender(total) {
|
757
812
|
return getMessage('total', {
|
758
813
|
total: total
|
@@ -760,10 +815,8 @@ var ProTable = function ProTable(props) {
|
|
760
815
|
},
|
761
816
|
pageSize: pageSize,
|
762
817
|
current: currentPage,
|
763
|
-
shape: "arrow-only",
|
764
818
|
pageSizeList: pageSizeList,
|
765
819
|
pageSizeSelector: total > (props.pageSize || 10) * 2 ? 'dropdown' : false,
|
766
|
-
pageSizePosition: "end",
|
767
820
|
type: total / pageSize <= 2 ? 'simple' : 'normal',
|
768
821
|
onPageSizeChange: function onPageSizeChange(number) {
|
769
822
|
return onChangePaginationSize(number);
|
package/es/table/index.scss
CHANGED
@@ -32,12 +32,18 @@ $fullscreenPadding: 24px;
|
|
32
32
|
}
|
33
33
|
&-footer-left-wrapper {
|
34
34
|
display: flex;
|
35
|
-
flex:
|
35
|
+
flex-shrink: 0;
|
36
36
|
align-items: center;
|
37
37
|
}
|
38
38
|
&-footer-right-wrapper {
|
39
39
|
display: flex;
|
40
40
|
justify-content: flex-end;
|
41
|
+
width: 100%;
|
42
|
+
}
|
43
|
+
.pagination-wrapper {
|
44
|
+
display: flex;
|
45
|
+
justify-content: flex-end;
|
46
|
+
width: 100%;
|
41
47
|
}
|
42
48
|
&-footer-action {
|
43
49
|
margin-left: 16px;
|