@teamix/pro 1.2.18 → 1.2.19

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.
Files changed (51) hide show
  1. package/dist/pro.css +1 -1
  2. package/dist/pro.js +733 -273
  3. package/dist/pro.min.css +1 -1
  4. package/dist/pro.min.js +1 -1
  5. package/es/actions/base.d.ts +2 -1
  6. package/es/actions/base.js +1 -1
  7. package/es/actions/danger-pop-confirm.d.ts +5 -0
  8. package/es/actions/danger-pop-confirm.js +10 -0
  9. package/es/actions/dialog.d.ts +1 -1
  10. package/es/actions/dialog.js +32 -31
  11. package/es/actions/index.d.ts +3 -0
  12. package/es/actions/index.js +10 -0
  13. package/es/actions/pop-confirm.d.ts +9 -0
  14. package/es/actions/pop-confirm.js +9 -0
  15. package/es/form/Components/LightFilter/componentMap.d.ts +2 -1
  16. package/es/form/Components/LightFilter/componentMap.js +2 -1
  17. package/es/form/Components/LightFilter/index.d.ts +1 -0
  18. package/es/form/Components/LightFilter/index.js +19 -13
  19. package/es/form/Components/LightFilter/index.scss +13 -3
  20. package/es/form/Filter/index2.js +157 -50
  21. package/es/form/Filter/index2.scss +3 -0
  22. package/es/form/ProForm/index.js +3 -2
  23. package/es/form/typing.d.ts +5 -0
  24. package/es/index.d.ts +1 -1
  25. package/es/index.js +1 -1
  26. package/es/table/components/ToolBar/FilterColumnIcon.js +1 -1
  27. package/es/table/index.js +39 -12
  28. package/lib/actions/base.d.ts +2 -1
  29. package/lib/actions/base.js +1 -1
  30. package/lib/actions/danger-pop-confirm.d.ts +5 -0
  31. package/lib/actions/danger-pop-confirm.js +22 -0
  32. package/lib/actions/dialog.d.ts +1 -1
  33. package/lib/actions/dialog.js +33 -31
  34. package/lib/actions/index.d.ts +3 -0
  35. package/lib/actions/index.js +12 -0
  36. package/lib/actions/pop-confirm.d.ts +9 -0
  37. package/lib/actions/pop-confirm.js +23 -0
  38. package/lib/form/Components/LightFilter/componentMap.d.ts +2 -1
  39. package/lib/form/Components/LightFilter/componentMap.js +4 -3
  40. package/lib/form/Components/LightFilter/index.d.ts +1 -0
  41. package/lib/form/Components/LightFilter/index.js +18 -12
  42. package/lib/form/Components/LightFilter/index.scss +13 -3
  43. package/lib/form/Filter/index2.js +157 -49
  44. package/lib/form/Filter/index2.scss +3 -0
  45. package/lib/form/ProForm/index.js +4 -2
  46. package/lib/form/typing.d.ts +5 -0
  47. package/lib/index.d.ts +1 -1
  48. package/lib/index.js +1 -1
  49. package/lib/table/components/ToolBar/FilterColumnIcon.js +1 -1
  50. package/lib/table/index.js +39 -12
  51. package/package.json +2 -2
@@ -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;
@@ -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;
@@ -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
  /** 弹窗消息类型 */
@@ -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
- containerProps = _objectWithoutProperties(_getTargetValue, _excluded2);
117
+ containerOtherProps = _objectWithoutProperties(_getTargetValue, _excluded2);
114
118
 
115
119
  var isDrawer = dialogType === 'drawer';
116
- var container = isDrawer ? Drawer : Dialog;
117
- var dialogOnlyProps = {
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) {
@@ -218,27 +227,19 @@ export function useDialogAction(action, actionContext) {
218
227
  key: uuid()
219
228
  }, addContext(componentProps, dialogContext))) : addContextForReactNode(content, dialogContext);
220
229
 
221
- var quickShowProps = _objectSpread(_objectSpread({
222
- // @ts-ignore
223
- onOk: onOk,
224
- title: addContextForReactNode(title, dialogContext),
225
- content: /*#__PURE__*/React.createElement(React.Fragment, null, beforeContent && /*#__PURE__*/React.createElement("div", {
226
- className: "teamix-pro-dialog-before-content"
227
- }, addContextForReactNode(beforeContent, dialogContext)), message && /*#__PURE__*/React.createElement("div", {
228
- className: "teamix-pro-dialog-message"
229
- }, renderProMessage(message, {
230
- type: 'notice'
231
- })), dialogContent, afterContent && /*#__PURE__*/React.createElement("div", {
232
- className: "teamix-pro-dialog-after-content"
233
- }, addContextForReactNode(afterContent, dialogContext)), footerDescription && /*#__PURE__*/React.createElement("div", {
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);
230
+ 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", {
231
+ className: "teamix-pro-dialog-before-content"
232
+ }, addContextForReactNode(beforeContent, dialogContext)), message && /*#__PURE__*/React.createElement("div", {
233
+ className: "teamix-pro-dialog-message"
234
+ }, renderProMessage(message, {
235
+ type: 'notice'
236
+ })), dialogContent, afterContent && /*#__PURE__*/React.createElement("div", {
237
+ className: "teamix-pro-dialog-after-content"
238
+ }, addContextForReactNode(afterContent, dialogContext)), !isPop && footerDescription && /*#__PURE__*/React.createElement("div", {
239
+ className: classnames('teamix-pro-dialog-footer-description', getFooterAlignClass(isDrawer, footerAlign))
240
+ }, renderDialogFooterDescription(footerDescription)))), _defineProperty(_objectSpread2, "footerAlign", footerAlign), _defineProperty(_objectSpread2, "className", classnames('teamix-pro-action-dialog', {
241
+ 'has-footer-description': !!footerDescription
242
+ })), _objectSpread2), containerProps), containerOtherProps);
242
243
 
243
244
  var ret = container.show(quickShowProps);
244
245
  store.hide = ret.hide;
@@ -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';
@@ -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,2 +1,3 @@
1
1
  declare const componentMap: any;
2
- export default componentMap;
2
+ declare const inputCategory: any[];
3
+ export { componentMap, inputCategory };
@@ -2,4 +2,5 @@ var componentMap = {
2
2
  Radio: 'Select',
3
3
  Checkbox: 'Select'
4
4
  };
5
- export default componentMap;
5
+ var inputCategory = ['Input', 'Password', 'TextArea', 'NumberPicker', 'Percent', 'Money'];
6
+ export { componentMap, inputCategory };
@@ -8,6 +8,7 @@ import './index.scss';
8
8
  interface ILightFiter {
9
9
  size?: 'small' | 'medium' | 'large';
10
10
  defaultFilterValue?: string;
11
+ onFilterChange?: (schema?: any) => any;
11
12
  filterProps?: SelectProps;
12
13
  buttonProps?: ButtonProps;
13
14
  }
@@ -16,13 +16,13 @@ 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 { useField, observer, useFieldSchema, RecursionField } from '@formily/react';
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';
25
+ import { componentMap, inputCategory } from './componentMap';
26
26
  import './index.scss'; // 主激活区内容
27
27
 
28
28
  var useMain = function useMain(active) {
@@ -30,7 +30,6 @@ var useMain = function useMain(active) {
30
30
  var main = [];
31
31
  schema.mapProperties(function (schema, name) {
32
32
  // console.log(schema.required); // 添加 *
33
- // console.log(schema);
34
33
  if (schema.name === active) {
35
34
  main.push({
36
35
  name: name,
@@ -55,16 +54,21 @@ var useFilterItems = function useFilterItems() {
55
54
  });
56
55
  });
57
56
  return filterItems;
57
+ }; // 是否输入框类型的组件
58
+
59
+
60
+ var isInputCategory = function isInputCategory(currentSchema) {
61
+ var component = currentSchema === null || currentSchema === void 0 ? void 0 : currentSchema['x-component'];
62
+ return inputCategory.includes(component);
58
63
  };
59
64
 
60
65
  var LightFilter = observer(function (props) {
61
- var _filterItems$;
66
+ var _filterItems$, _main$;
62
67
 
63
- var field = useField();
64
- var schema = useFieldSchema();
65
68
  var filterItems = useFilterItems();
66
69
  var size = props.size,
67
70
  defaultFilterValue = props.defaultFilterValue,
71
+ onFilterChange = props.onFilterChange,
68
72
  filterProps = props.filterProps,
69
73
  buttonProps = props.buttonProps;
70
74
 
@@ -74,6 +78,7 @@ var LightFilter = observer(function (props) {
74
78
  setActive = _useState2[1];
75
79
 
76
80
  var main = useMain(active);
81
+ var currentSchema = (_main$ = main[0]) === null || _main$ === void 0 ? void 0 : _main$.schema;
77
82
  var defaultCls = usePrefixCls();
78
83
  var prefixCls = usePrefixCls('', {
79
84
  prefix: 'teamix-pro-form-light-filter'
@@ -84,20 +89,21 @@ var LightFilter = observer(function (props) {
84
89
  return /*#__PURE__*/React.createElement(RecursionField, {
85
90
  key: key,
86
91
  name: name,
87
- schema: schema,
88
- filterProperties: function filterProperties(schema) {
89
- return true;
90
- }
92
+ schema: schema
91
93
  });
92
94
  });
95
+ var onSelectChange = useCallback(function (value) {
96
+ setActive(value);
97
+ onFilterChange && onFilterChange(currentSchema);
98
+ }, [onFilterChange]);
93
99
  return /*#__PURE__*/React.createElement("span", {
94
- className: cls(prefixCls, "".concat(defaultCls).concat(size))
100
+ className: cls(prefixCls, "".concat(defaultCls).concat(size), isInputCategory(currentSchema) ? "".concat(prefixCls, "-input-category") : '')
95
101
  }, /*#__PURE__*/React.createElement("span", {
96
102
  className: "".concat(prefixCls, "-main")
97
103
  }, /*#__PURE__*/React.createElement(Select, _objectSpread(_objectSpread({}, filterProps), {}, {
98
104
  className: cls("".concat(prefixCls, "-select"), filterProps === null || filterProps === void 0 ? void 0 : filterProps.className),
99
105
  dataSource: filterItems,
100
- onChange: setActive,
106
+ onChange: onSelectChange,
101
107
  value: active
102
108
  })), content), /*#__PURE__*/React.createElement("span", {
103
109
  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;
@@ -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 {