@teamix/pro 1.2.17 → 1.2.21
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 +2173 -744
- 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 +3 -0
- package/es/actions/index.js +10 -0
- 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 +4 -2
- package/es/form/Components/LightFilter/index.d.ts +1 -0
- package/es/form/Components/LightFilter/index.js +34 -16
- 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 -7
- package/es/form/ProForm/index.scss +3 -0
- package/es/form/ProForm/useFieldRequest.js +1 -8
- package/es/form/ProForm/useFormDisplayValues.js +4 -2
- package/es/form/SchemaForm/index.js +19 -11
- package/es/form/SchemaForm/initializeDataSource.d.ts +2 -2
- package/es/form/SchemaForm/initializeDataSource.js +4 -9
- package/es/form/SchemaForm/initializeRequest.d.ts +2 -2
- package/es/form/SchemaForm/initializeRequest.js +4 -10
- package/es/form/SchemaForm/initializeRules.d.ts +7 -1
- package/es/form/SchemaForm/initializeRules.js +9 -13
- package/es/form/SchemaForm/reactions.d.ts +5 -5
- package/es/form/SchemaForm/reactions.js +27 -29
- package/es/form/typing.d.ts +11 -2
- package/es/form/utils.d.ts +8 -7
- package/es/form/utils.js +5 -4
- package/es/index.d.ts +1 -1
- package/es/index.js +1 -1
- package/es/table/components/Filter/index.js +1 -0
- 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/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 +3 -0
- package/lib/actions/index.js +12 -0
- 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 +6 -4
- package/lib/form/Components/LightFilter/index.d.ts +1 -0
- package/lib/form/Components/LightFilter/index.js +31 -14
- 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 +291 -234
- package/lib/form/Filter/index2.scss +3 -0
- package/lib/form/ProForm/index.js +10 -6
- package/lib/form/ProForm/index.scss +3 -0
- package/lib/form/ProForm/useFieldRequest.js +1 -9
- package/lib/form/ProForm/useFormDisplayValues.js +3 -1
- package/lib/form/SchemaForm/index.js +19 -10
- package/lib/form/SchemaForm/initializeDataSource.d.ts +2 -2
- package/lib/form/SchemaForm/initializeDataSource.js +4 -11
- package/lib/form/SchemaForm/initializeRequest.d.ts +2 -2
- package/lib/form/SchemaForm/initializeRequest.js +4 -11
- package/lib/form/SchemaForm/initializeRules.d.ts +7 -1
- package/lib/form/SchemaForm/initializeRules.js +9 -16
- package/lib/form/SchemaForm/reactions.d.ts +5 -5
- package/lib/form/SchemaForm/reactions.js +29 -31
- package/lib/form/typing.d.ts +11 -2
- package/lib/form/utils.d.ts +8 -7
- package/lib/form/utils.js +6 -5
- package/lib/index.d.ts +1 -1
- package/lib/index.js +1 -1
- 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/package.json +3 -3
package/es/actions/base.d.ts
CHANGED
@@ -1,3 +1,4 @@
|
|
1
|
+
/// <reference types="react" />
|
1
2
|
import { MaybePromise } from '@teamix/utils';
|
2
3
|
export interface BaseAction {
|
3
4
|
/** 事件触发方式,默认是 onClick */
|
@@ -17,7 +18,7 @@ export interface BaseAction {
|
|
17
18
|
/** 事件开始执行完毕的回调函数 */
|
18
19
|
onFinish?: (params?: any) => any;
|
19
20
|
}
|
20
|
-
export declare function eventHandler(action: BaseAction, actionContext: any, onTrigger: (context: any) => void): {
|
21
|
+
export declare function eventHandler(action: BaseAction, actionContext: any, onTrigger: (context: any, e: React.MouseEvent<HTMLElement>) => void): {
|
21
22
|
[x: string]: (e: React.MouseEvent<HTMLElement>) => Promise<void>;
|
22
23
|
};
|
23
24
|
export default eventHandler;
|
package/es/actions/base.js
CHANGED
@@ -56,7 +56,7 @@ export function eventHandler(action, actionContext, onTrigger) {
|
|
56
56
|
return _context.abrupt("return");
|
57
57
|
|
58
58
|
case 14:
|
59
|
-
onTrigger(Object.assign({}, beforeActionContext, actionContext));
|
59
|
+
onTrigger(Object.assign({}, beforeActionContext, actionContext), e);
|
60
60
|
(_action$onTrigger = action.onTrigger) === null || _action$onTrigger === void 0 ? void 0 : _action$onTrigger.call(action);
|
61
61
|
|
62
62
|
case 16:
|
@@ -0,0 +1,5 @@
|
|
1
|
+
import { PopConfirmAction } from './pop-confirm';
|
2
|
+
export declare function useDangerPopConfirmAction(action: PopConfirmAction, context?: any): {
|
3
|
+
[x: string]: (e: import("react").MouseEvent<HTMLElement, MouseEvent>) => Promise<void>;
|
4
|
+
};
|
5
|
+
export default useDangerPopConfirmAction;
|
@@ -0,0 +1,10 @@
|
|
1
|
+
import { deepMerge } from '@teamix/utils';
|
2
|
+
import { useDialogAction } from './dialog';
|
3
|
+
export function useDangerPopConfirmAction(action, context) {
|
4
|
+
return useDialogAction(deepMerge({
|
5
|
+
dialogType: 'pop',
|
6
|
+
popType: 'danger',
|
7
|
+
align: 'br'
|
8
|
+
}, action), context);
|
9
|
+
}
|
10
|
+
export default useDangerPopConfirmAction;
|
package/es/actions/dialog.d.ts
CHANGED
@@ -8,7 +8,7 @@ export interface DialogAction extends Omit<RequestAction, 'url'>, Omit<QuickShow
|
|
8
8
|
/** 点击「确认按钮」后的数据请求地址,非必填,不填就不发请求 */
|
9
9
|
url?: string;
|
10
10
|
/** 弹窗类型,支持普通弹窗和抽屉两种模式,默认为普通弹窗 */
|
11
|
-
dialogType?: 'dialog' | 'drawer';
|
11
|
+
dialogType?: 'dialog' | 'drawer' | 'pop';
|
12
12
|
/** 弹窗快捷调用类型 */
|
13
13
|
dialogQuickShowType?: 'alert' | 'confirm';
|
14
14
|
/** 弹窗消息类型 */
|
package/es/actions/dialog.js
CHANGED
@@ -1,5 +1,5 @@
|
|
1
1
|
var _excluded = ["url", "method", "params", "data", "extendParams", "successMsg", "errorMsg", "formatParams", "formatResult", "onSuccess", "onError"],
|
2
|
-
_excluded2 = ["title", "content", "component", "schema", "onFinish", "dialogType", "dialogQuickShowType", "messageType", "beforeRequest", "onTrigger", "link", "beforeContent", "afterContent", "message", "footerDescription", "footerAlign", "className"];
|
2
|
+
_excluded2 = ["title", "content", "component", "schema", "onFinish", "dialogType", "dialogQuickShowType", "messageType", "popType", "beforeRequest", "onTrigger", "link", "beforeContent", "afterContent", "message", "footerDescription", "footerAlign", "className"];
|
3
3
|
|
4
4
|
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; }
|
5
5
|
|
@@ -31,6 +31,7 @@ import React, { useState, useEffect, useRef } from 'react';
|
|
31
31
|
import classnames from 'classnames';
|
32
32
|
import { useHistory } from 'react-router-dom';
|
33
33
|
import { Dialog, Drawer } from '@alicloudfe/components';
|
34
|
+
import PopConfirm from '@teamix/pop-confirm';
|
34
35
|
import { getTargetValue, uuid, goToLink, getMessage } from '@teamix/utils';
|
35
36
|
import ProForm, { createForm } from '../form';
|
36
37
|
import { renderProMessage } from '../utils/message';
|
@@ -77,7 +78,9 @@ export function useDialogAction(action, actionContext) {
|
|
77
78
|
var footerDescriptionRef = useRef();
|
78
79
|
var history = useHistory();
|
79
80
|
|
80
|
-
var onActionStart = function onActionStart(context) {
|
81
|
+
var onActionStart = function onActionStart(context, e) {
|
82
|
+
var _objectSpread2;
|
83
|
+
|
81
84
|
var url = action.url,
|
82
85
|
method = action.method,
|
83
86
|
params = action.params,
|
@@ -101,6 +104,7 @@ export function useDialogAction(action, actionContext) {
|
|
101
104
|
dialogQuickShowType = _getTargetValue.dialogQuickShowType,
|
102
105
|
_getTargetValue$messa = _getTargetValue.messageType,
|
103
106
|
messageType = _getTargetValue$messa === void 0 ? 'notice' : _getTargetValue$messa,
|
107
|
+
popType = _getTargetValue.popType,
|
104
108
|
beforeRequest = _getTargetValue.beforeRequest,
|
105
109
|
onTrigger = _getTargetValue.onTrigger,
|
106
110
|
link = _getTargetValue.link,
|
@@ -110,20 +114,25 @@ export function useDialogAction(action, actionContext) {
|
|
110
114
|
footerDescription = _getTargetValue.footerDescription,
|
111
115
|
footerAlign = _getTargetValue.footerAlign,
|
112
116
|
className = _getTargetValue.className,
|
113
|
-
|
117
|
+
containerOtherProps = _objectWithoutProperties(_getTargetValue, _excluded2);
|
114
118
|
|
115
119
|
var isDrawer = dialogType === 'drawer';
|
116
|
-
var
|
117
|
-
var
|
120
|
+
var isPop = dialogType === 'pop';
|
121
|
+
var container = isDrawer ? Drawer : isPop ? PopConfirm : Dialog;
|
122
|
+
var containerProps = isDrawer ? {
|
123
|
+
okText: getMessage('ok'),
|
124
|
+
cancelText: getMessage('cancel'),
|
125
|
+
closeable: !loading
|
126
|
+
} : isPop ? {
|
127
|
+
type: popType,
|
128
|
+
trigger: e.currentTarget
|
129
|
+
} : {
|
118
130
|
type: dialogQuickShowType,
|
119
131
|
messageProps: {
|
120
132
|
type: messageType
|
121
|
-
}
|
133
|
+
},
|
134
|
+
closeable: !loading
|
122
135
|
};
|
123
|
-
var containerOtherProps = isDrawer ? {
|
124
|
-
okText: getMessage('ok'),
|
125
|
-
cancelText: getMessage('cancel')
|
126
|
-
} : dialogOnlyProps;
|
127
136
|
|
128
137
|
var renderDialogFooterDescription = function renderDialogFooterDescription(footer) {
|
129
138
|
if (footer instanceof Array || footer.component) {
|
@@ -152,15 +161,12 @@ export function useDialogAction(action, actionContext) {
|
|
152
161
|
while (1) {
|
153
162
|
switch (_context.prev = _context.next) {
|
154
163
|
case 0:
|
155
|
-
if (
|
164
|
+
if (!link) {
|
156
165
|
_context.next = 5;
|
157
166
|
break;
|
158
167
|
}
|
159
168
|
|
160
|
-
|
161
|
-
goToLink(link, history);
|
162
|
-
}
|
163
|
-
|
169
|
+
goToLink(link, history);
|
164
170
|
onFinish && onFinish();
|
165
171
|
resolve(true);
|
166
172
|
return _context.abrupt("return");
|
@@ -218,27 +224,19 @@ export function useDialogAction(action, actionContext) {
|
|
218
224
|
key: uuid()
|
219
225
|
}, addContext(componentProps, dialogContext))) : addContextForReactNode(content, dialogContext);
|
220
226
|
|
221
|
-
var quickShowProps = _objectSpread(_objectSpread({
|
222
|
-
|
223
|
-
|
224
|
-
|
225
|
-
|
226
|
-
|
227
|
-
|
228
|
-
|
229
|
-
|
230
|
-
|
231
|
-
|
232
|
-
|
233
|
-
|
234
|
-
className: classnames('teamix-pro-dialog-footer-description', getFooterAlignClass(isDrawer, footerAlign))
|
235
|
-
}, renderDialogFooterDescription(footerDescription))),
|
236
|
-
closeable: !loading,
|
237
|
-
footerAlign: footerAlign,
|
238
|
-
className: classnames('teamix-pro-action-dialog', {
|
239
|
-
'has-footer-description': !!footerDescription
|
240
|
-
})
|
241
|
-
}, containerOtherProps), containerProps);
|
227
|
+
var quickShowProps = _objectSpread(_objectSpread((_objectSpread2 = {}, _defineProperty(_objectSpread2, "".concat(isPop ? 'onConfirm' : 'onOk'), onOk), _defineProperty(_objectSpread2, "title", addContextForReactNode(title, dialogContext)), _defineProperty(_objectSpread2, "content", /*#__PURE__*/React.createElement(React.Fragment, null, beforeContent && /*#__PURE__*/React.createElement("div", {
|
228
|
+
className: "teamix-pro-dialog-before-content"
|
229
|
+
}, addContextForReactNode(beforeContent, dialogContext)), message && /*#__PURE__*/React.createElement("div", {
|
230
|
+
className: "teamix-pro-dialog-message"
|
231
|
+
}, renderProMessage(message, {
|
232
|
+
type: 'notice'
|
233
|
+
})), dialogContent, afterContent && /*#__PURE__*/React.createElement("div", {
|
234
|
+
className: "teamix-pro-dialog-after-content"
|
235
|
+
}, addContextForReactNode(afterContent, dialogContext)), !isPop && footerDescription && /*#__PURE__*/React.createElement("div", {
|
236
|
+
className: classnames('teamix-pro-dialog-footer-description', getFooterAlignClass(isDrawer, footerAlign))
|
237
|
+
}, renderDialogFooterDescription(footerDescription)))), _defineProperty(_objectSpread2, "footerAlign", footerAlign), _defineProperty(_objectSpread2, "className", classnames('teamix-pro-action-dialog', {
|
238
|
+
'has-footer-description': !!footerDescription
|
239
|
+
})), _objectSpread2), containerProps), containerOtherProps);
|
242
240
|
|
243
241
|
var ret = container.show(quickShowProps);
|
244
242
|
store.hide = ret.hide;
|
package/es/actions/index.d.ts
CHANGED
@@ -7,6 +7,7 @@ import { DialogAction } from './dialog';
|
|
7
7
|
import { DialogFormAction } from './dialog-form';
|
8
8
|
import { DialogTableAction } from './dialog-table';
|
9
9
|
import { DialogInfoAction } from './dialog-info';
|
10
|
+
import { PopConfirmAction } from './pop-confirm';
|
10
11
|
import './index.scss';
|
11
12
|
export declare type ProActionConfig = ({
|
12
13
|
type: 'dialog-form' | 'drawer-form';
|
@@ -15,6 +16,8 @@ export declare type ProActionConfig = ({
|
|
15
16
|
} & DialogTableAction) | ({
|
16
17
|
type: 'dialog-info' | 'drawer-info';
|
17
18
|
} & DialogInfoAction) | ({
|
19
|
+
type: 'pop-confirm' | 'danger-pop-confirm';
|
20
|
+
} & PopConfirmAction) | ({
|
18
21
|
type: 'dialog' | 'drawer' | 'confirm' | 'danger-confirm' | 'notice' | 'error';
|
19
22
|
} & DialogAction) | ({
|
20
23
|
type: 'request';
|
package/es/actions/index.js
CHANGED
@@ -48,6 +48,8 @@ import { useDrawerAction } from './drawer';
|
|
48
48
|
import { useDrawerFormAction } from './drawer-form';
|
49
49
|
import { useDrawerTableAction } from './drawer-table';
|
50
50
|
import { useDrawerInfoAction } from './drawer-info';
|
51
|
+
import { usePopConfirmAction } from './pop-confirm';
|
52
|
+
import { useDangerPopConfirmAction } from './danger-pop-confirm';
|
51
53
|
import './index.scss';
|
52
54
|
var RegistedActions = new Map();
|
53
55
|
export function registerActionHandler(id, extendActionId, defaultConfig) {
|
@@ -120,6 +122,14 @@ export function useAction(config, context) {
|
|
120
122
|
return useDrawerInfoAction(others, context);
|
121
123
|
}
|
122
124
|
|
125
|
+
if (type === 'pop-confirm') {
|
126
|
+
return usePopConfirmAction(others, context);
|
127
|
+
}
|
128
|
+
|
129
|
+
if (type === 'danger-pop-confirm') {
|
130
|
+
return useDangerPopConfirmAction(others, context);
|
131
|
+
}
|
132
|
+
|
123
133
|
var registedAction = RegistedActions.get(type);
|
124
134
|
|
125
135
|
if (!registedAction) {
|
@@ -0,0 +1,9 @@
|
|
1
|
+
import { IPopConfirmProps } from '@teamix/pop-confirm';
|
2
|
+
import { DialogAction } from './dialog';
|
3
|
+
export declare type PopConfirmAction = DialogAction & Omit<IPopConfirmProps, 'type' | 'trigger'> & {
|
4
|
+
popType?: IPopConfirmProps['type'];
|
5
|
+
};
|
6
|
+
export declare function usePopConfirmAction(action: PopConfirmAction, context?: any): {
|
7
|
+
[x: string]: (e: import("react").MouseEvent<HTMLElement, MouseEvent>) => Promise<void>;
|
8
|
+
};
|
9
|
+
export default usePopConfirmAction;
|
@@ -0,0 +1,9 @@
|
|
1
|
+
import { deepMerge } from '@teamix/utils';
|
2
|
+
import useDialogAction from './dialog';
|
3
|
+
export function usePopConfirmAction(action, context) {
|
4
|
+
return useDialogAction(deepMerge({
|
5
|
+
dialogType: 'pop',
|
6
|
+
align: 'br'
|
7
|
+
}, action), context);
|
8
|
+
}
|
9
|
+
export default usePopConfirmAction;
|
@@ -1,5 +1,7 @@
|
|
1
1
|
var componentMap = {
|
2
2
|
Radio: 'Select',
|
3
|
-
Checkbox: 'Select'
|
3
|
+
Checkbox: 'Select',
|
4
|
+
CheckboxGroup: 'MultipleSelect'
|
4
5
|
};
|
5
|
-
|
6
|
+
var inputCategory = ['Input', 'Password', 'TextArea', 'NumberPicker', 'Percent', 'Money'];
|
7
|
+
export { componentMap, inputCategory };
|
@@ -16,27 +16,38 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
|
|
16
16
|
|
17
17
|
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; }
|
18
18
|
|
19
|
-
import React, { useState } from 'react';
|
20
|
-
import {
|
19
|
+
import React, { useState, useCallback } from 'react';
|
20
|
+
import { observer, useFieldSchema, RecursionField } from '@formily/react';
|
21
21
|
import { Select, Button } from '@alicloudfe/components';
|
22
22
|
import TeamixIcon from '@teamix/icon';
|
23
23
|
import cls from 'classnames';
|
24
24
|
import { usePrefixCls } from '@teamix/utils';
|
25
|
-
import componentMap from './componentMap';
|
26
|
-
import './index.scss';
|
25
|
+
import { componentMap, inputCategory } from './componentMap';
|
26
|
+
import './index.scss';
|
27
|
+
|
28
|
+
var formatComponent = function formatComponent(schema) {
|
29
|
+
var _schema$enum;
|
30
|
+
|
31
|
+
var component = schema['x-component'];
|
32
|
+
|
33
|
+
if (component === 'Checkbox' && ((_schema$enum = schema['enum']) === null || _schema$enum === void 0 ? void 0 : _schema$enum.length)) {
|
34
|
+
component = 'CheckboxGroup';
|
35
|
+
}
|
36
|
+
|
37
|
+
return componentMap[component] || component;
|
38
|
+
}; // 主激活区内容
|
39
|
+
|
27
40
|
|
28
41
|
var useMain = function useMain(active) {
|
29
42
|
var schema = useFieldSchema();
|
30
43
|
var main = [];
|
31
44
|
schema.mapProperties(function (schema, name) {
|
32
|
-
// console.log(schema.required); // 添加 *
|
33
|
-
// console.log(schema);
|
34
45
|
if (schema.name === active) {
|
35
46
|
main.push({
|
36
47
|
name: name,
|
37
48
|
schema: _objectSpread(_objectSpread({}, schema), {}, {
|
38
49
|
title: '',
|
39
|
-
'x-component':
|
50
|
+
'x-component': formatComponent(schema)
|
40
51
|
})
|
41
52
|
});
|
42
53
|
}
|
@@ -55,16 +66,21 @@ var useFilterItems = function useFilterItems() {
|
|
55
66
|
});
|
56
67
|
});
|
57
68
|
return filterItems;
|
69
|
+
}; // 是否输入框类型的组件
|
70
|
+
|
71
|
+
|
72
|
+
var isInputCategory = function isInputCategory(currentSchema) {
|
73
|
+
var component = currentSchema === null || currentSchema === void 0 ? void 0 : currentSchema['x-component'];
|
74
|
+
return inputCategory.includes(component);
|
58
75
|
};
|
59
76
|
|
60
77
|
var LightFilter = observer(function (props) {
|
61
|
-
var _filterItems$;
|
78
|
+
var _filterItems$, _main$;
|
62
79
|
|
63
|
-
var field = useField();
|
64
|
-
var schema = useFieldSchema();
|
65
80
|
var filterItems = useFilterItems();
|
66
81
|
var size = props.size,
|
67
82
|
defaultFilterValue = props.defaultFilterValue,
|
83
|
+
onFilterChange = props.onFilterChange,
|
68
84
|
filterProps = props.filterProps,
|
69
85
|
buttonProps = props.buttonProps;
|
70
86
|
|
@@ -74,6 +90,7 @@ var LightFilter = observer(function (props) {
|
|
74
90
|
setActive = _useState2[1];
|
75
91
|
|
76
92
|
var main = useMain(active);
|
93
|
+
var currentSchema = (_main$ = main[0]) === null || _main$ === void 0 ? void 0 : _main$.schema;
|
77
94
|
var defaultCls = usePrefixCls();
|
78
95
|
var prefixCls = usePrefixCls('', {
|
79
96
|
prefix: 'teamix-pro-form-light-filter'
|
@@ -84,20 +101,21 @@ var LightFilter = observer(function (props) {
|
|
84
101
|
return /*#__PURE__*/React.createElement(RecursionField, {
|
85
102
|
key: key,
|
86
103
|
name: name,
|
87
|
-
schema: schema
|
88
|
-
filterProperties: function filterProperties(schema) {
|
89
|
-
return true;
|
90
|
-
}
|
104
|
+
schema: schema
|
91
105
|
});
|
92
106
|
});
|
107
|
+
var onSelectChange = useCallback(function (value) {
|
108
|
+
setActive(value);
|
109
|
+
onFilterChange && onFilterChange(value);
|
110
|
+
}, [onFilterChange]);
|
93
111
|
return /*#__PURE__*/React.createElement("span", {
|
94
|
-
className: cls(prefixCls, "".concat(defaultCls).concat(size))
|
112
|
+
className: cls(prefixCls, "".concat(defaultCls).concat(size), isInputCategory(currentSchema) ? "".concat(prefixCls, "-input-category") : '')
|
95
113
|
}, /*#__PURE__*/React.createElement("span", {
|
96
114
|
className: "".concat(prefixCls, "-main")
|
97
115
|
}, /*#__PURE__*/React.createElement(Select, _objectSpread(_objectSpread({}, filterProps), {}, {
|
98
116
|
className: cls("".concat(prefixCls, "-select"), filterProps === null || filterProps === void 0 ? void 0 : filterProps.className),
|
99
117
|
dataSource: filterItems,
|
100
|
-
onChange:
|
118
|
+
onChange: onSelectChange,
|
101
119
|
value: active
|
102
120
|
})), content), /*#__PURE__*/React.createElement("span", {
|
103
121
|
className: "".concat(prefixCls, "-addonAfter")
|
@@ -18,10 +18,7 @@ $light-filter: #{teamix-pro-form}-light-filter;
|
|
18
18
|
box-sizing: border-box;
|
19
19
|
border: var(--search-normal-normal-border-width, 1px) solid
|
20
20
|
var(--color-line1-2, #d9d9d9);
|
21
|
-
border-right: 0;
|
22
21
|
border-radius: var(--search-normal-corner, 2px);
|
23
|
-
border-top-right-radius: 0;
|
24
|
-
border-bottom-right-radius: 0;
|
25
22
|
// 表单项选择
|
26
23
|
.#{$light-filter}-select {
|
27
24
|
min-width: auto;
|
@@ -30,7 +27,7 @@ $light-filter: #{teamix-pro-form}-light-filter;
|
|
30
27
|
border: 0;
|
31
28
|
box-shadow: none;
|
32
29
|
.#{$css-prefix}input-text-field {
|
33
|
-
padding-right:
|
30
|
+
padding-right: 4px;
|
34
31
|
}
|
35
32
|
}
|
36
33
|
.#{$css-prefix}input {
|
@@ -44,6 +41,7 @@ $light-filter: #{teamix-pro-form}-light-filter;
|
|
44
41
|
|
45
42
|
// 按钮后缀
|
46
43
|
.#{$light-filter}-addonAfter {
|
44
|
+
display: none;
|
47
45
|
.#{$css-prefix}btn {
|
48
46
|
border-top-left-radius: 0;
|
49
47
|
border-bottom-left-radius: 0;
|
@@ -54,6 +52,18 @@ $light-filter: #{teamix-pro-form}-light-filter;
|
|
54
52
|
}
|
55
53
|
}
|
56
54
|
|
55
|
+
// LightFilter输入类
|
56
|
+
.#{$light-filter}-input-category {
|
57
|
+
.#{$light-filter}-main {
|
58
|
+
border-right: 0;
|
59
|
+
border-top-right-radius: 0;
|
60
|
+
border-bottom-right-radius: 0;
|
61
|
+
}
|
62
|
+
.#{$light-filter}-addonAfter {
|
63
|
+
display: block;
|
64
|
+
}
|
65
|
+
}
|
66
|
+
|
57
67
|
// LightFilter无边框
|
58
68
|
.#{$form-item-cls}-bordered-none {
|
59
69
|
.#{$form-item-cls}-control {
|
@@ -0,0 +1,113 @@
|
|
1
|
+
var _excluded = ["schema", "onSubmit", "onReset", "onResetClick", "layout", "labelAlign", "wrapperAlign", "labelCol", "wrapperCol"];
|
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 _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
10
|
+
|
11
|
+
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."); }
|
12
|
+
|
13
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
14
|
+
|
15
|
+
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
16
|
+
|
17
|
+
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
18
|
+
|
19
|
+
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; }
|
20
|
+
|
21
|
+
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; }
|
22
|
+
|
23
|
+
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; }
|
24
|
+
|
25
|
+
import React, { memo, useMemo } from 'react';
|
26
|
+
import cls from 'classnames';
|
27
|
+
import { usePrefixCls, getMessage } from '@teamix/utils';
|
28
|
+
import ProForm from '../ProForm';
|
29
|
+
import { mergeArrayValue } from '../utils';
|
30
|
+
/**
|
31
|
+
* 高级筛选
|
32
|
+
*/
|
33
|
+
|
34
|
+
var AdvancedFilter = /*#__PURE__*/memo(function (props) {
|
35
|
+
var schema = props.schema,
|
36
|
+
onSubmit = props.onSubmit,
|
37
|
+
onReset = props.onReset,
|
38
|
+
onResetClick = props.onResetClick,
|
39
|
+
layout = props.layout,
|
40
|
+
labelAlign = props.labelAlign,
|
41
|
+
wrapperAlign = props.wrapperAlign,
|
42
|
+
labelCol = props.labelCol,
|
43
|
+
wrapperCol = props.wrapperCol,
|
44
|
+
otherProps = _objectWithoutProperties(props, _excluded);
|
45
|
+
|
46
|
+
var prefixCls = usePrefixCls('', {
|
47
|
+
prefix: 'teamix-pro-form-query-filter-advanced'
|
48
|
+
});
|
49
|
+
var gridSchema = useMemo(function () {
|
50
|
+
return [{
|
51
|
+
name: 'FormGrid',
|
52
|
+
component: 'FormGrid',
|
53
|
+
props: {
|
54
|
+
breakpoints: [480, 720, 990, 1200, Infinity],
|
55
|
+
maxColumns: [1, 2, 3, 3, 4],
|
56
|
+
columnGap: 16,
|
57
|
+
rowGap: 12
|
58
|
+
},
|
59
|
+
children: [].concat(_toConsumableArray(schema), [{
|
60
|
+
component: 'FormGrid.GridColumn',
|
61
|
+
props: {
|
62
|
+
gridSpan: -1
|
63
|
+
},
|
64
|
+
children: [{
|
65
|
+
component: 'FormButtonGroup',
|
66
|
+
props: {
|
67
|
+
align: 'right'
|
68
|
+
},
|
69
|
+
children: [{
|
70
|
+
component: 'Reset',
|
71
|
+
props: {
|
72
|
+
onResetValidateSuccess: onReset,
|
73
|
+
onClick: onResetClick,
|
74
|
+
children: getMessage('reset')
|
75
|
+
}
|
76
|
+
}, {
|
77
|
+
component: 'Submit',
|
78
|
+
props: {
|
79
|
+
style: {
|
80
|
+
marginRight: -8
|
81
|
+
},
|
82
|
+
children: getMessage('search')
|
83
|
+
}
|
84
|
+
}]
|
85
|
+
}]
|
86
|
+
}])
|
87
|
+
}];
|
88
|
+
}, [schema, onReset, onResetClick]);
|
89
|
+
var getTeamixLayout = useMemo(function () {
|
90
|
+
return {
|
91
|
+
breakpoints: [990],
|
92
|
+
layout: mergeArrayValue(['vertical'], layout),
|
93
|
+
labelAlign: mergeArrayValue(['left'], labelAlign),
|
94
|
+
wrapperAlign: mergeArrayValue(['left'], wrapperAlign),
|
95
|
+
labelCol: mergeArrayValue([24], labelCol),
|
96
|
+
wrapperCol: mergeArrayValue([24], wrapperCol)
|
97
|
+
};
|
98
|
+
}, [layout, labelAlign, wrapperAlign, labelCol, wrapperCol]);
|
99
|
+
return /*#__PURE__*/React.createElement(ProForm, _objectSpread(_objectSpread(_objectSpread({
|
100
|
+
className: cls(prefixCls, props.className),
|
101
|
+
schema: gridSchema,
|
102
|
+
feedbackLayout: "popover"
|
103
|
+
}, otherProps), getTeamixLayout), {}, {
|
104
|
+
onSubmit: onSubmit
|
105
|
+
}));
|
106
|
+
});
|
107
|
+
AdvancedFilter.defaultProps = {
|
108
|
+
layout: 'horizontal',
|
109
|
+
labelAlign: 'right',
|
110
|
+
labelCol: 6,
|
111
|
+
wrapperCol: 18
|
112
|
+
};
|
113
|
+
export default AdvancedFilter;
|
@@ -0,0 +1,79 @@
|
|
1
|
+
var _excluded = ["form", "schema", "onSubmit", "onChange", "defaultFilterValue"];
|
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
|
+
import React, { memo, useMemo, useCallback, useRef } from 'react';
|
14
|
+
import cls from 'classnames';
|
15
|
+
import { toJS } from '@formily/reactive';
|
16
|
+
import { usePrefixCls } from '@teamix/utils';
|
17
|
+
import ProForm from '../ProForm';
|
18
|
+
/**
|
19
|
+
* 轻量筛选
|
20
|
+
*/
|
21
|
+
|
22
|
+
var LightFilter = /*#__PURE__*/memo(function (props) {
|
23
|
+
var _schema$;
|
24
|
+
|
25
|
+
var form = props.form,
|
26
|
+
schema = props.schema,
|
27
|
+
onSubmit = props.onSubmit,
|
28
|
+
onChange = props.onChange,
|
29
|
+
defaultFilterValue = props.defaultFilterValue,
|
30
|
+
otherProps = _objectWithoutProperties(props, _excluded);
|
31
|
+
|
32
|
+
var filterValue = useRef(defaultFilterValue || ((_schema$ = schema[0]) === null || _schema$ === void 0 ? void 0 : _schema$.name));
|
33
|
+
var prefixCls = usePrefixCls('', {
|
34
|
+
prefix: 'teamix-pro-form-query-filter-light'
|
35
|
+
}); // input类组件的按钮
|
36
|
+
|
37
|
+
var onBtnClick = useCallback(function () {
|
38
|
+
onChange && onChange(toJS(form.values));
|
39
|
+
}, [form]); // 筛选提交切换
|
40
|
+
|
41
|
+
var onFilterChange = useCallback(function (value) {
|
42
|
+
filterValue.current = value;
|
43
|
+
}, [form]); // onChange
|
44
|
+
|
45
|
+
var onCurrentChange = useCallback(function (values) {
|
46
|
+
onChange && onChange(_defineProperty({}, filterValue.current, values[filterValue.current]));
|
47
|
+
}, [onChange, filterValue.current]);
|
48
|
+
var LightSchema = useMemo(function () {
|
49
|
+
return [{
|
50
|
+
component: 'LightFilter',
|
51
|
+
props: {
|
52
|
+
defaultFilterValue: defaultFilterValue,
|
53
|
+
onFilterChange: onFilterChange,
|
54
|
+
buttonProps: {
|
55
|
+
onClick: onBtnClick
|
56
|
+
}
|
57
|
+
},
|
58
|
+
children: schema
|
59
|
+
}, {
|
60
|
+
component: 'Submit',
|
61
|
+
props: {
|
62
|
+
style: {
|
63
|
+
display: 'none'
|
64
|
+
}
|
65
|
+
}
|
66
|
+
}];
|
67
|
+
}, [schema, onBtnClick, onFilterChange, defaultFilterValue]);
|
68
|
+
return /*#__PURE__*/React.createElement(ProForm, _objectSpread(_objectSpread({}, otherProps), {}, {
|
69
|
+
form: form,
|
70
|
+
className: cls(prefixCls, props.className),
|
71
|
+
schema: LightSchema,
|
72
|
+
feedbackLayout: "none",
|
73
|
+
breakpoints: [],
|
74
|
+
bordered: false,
|
75
|
+
onSubmit: onSubmit,
|
76
|
+
onChange: onCurrentChange
|
77
|
+
}));
|
78
|
+
});
|
79
|
+
export default LightFilter;
|