@teamix/pro 1.2.9 → 1.2.13
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 +1 -1
- package/dist/pro.css +1 -1
- package/dist/pro.js +2103 -993
- package/dist/pro.min.css +1 -1
- package/dist/pro.min.js +1 -1
- package/es/actions/base.d.ts +16 -6
- package/es/actions/base.js +66 -12
- package/es/actions/confirm.d.ts +1 -1
- package/es/actions/danger-confirm.d.ts +1 -1
- package/es/actions/dialog-component.d.ts +1 -1
- package/es/actions/dialog-form.d.ts +1 -1
- package/es/actions/dialog-form.js +2 -2
- package/es/actions/dialog-info.d.ts +1 -1
- package/es/actions/dialog-table.d.ts +1 -1
- package/es/actions/dialog.d.ts +6 -2
- package/es/actions/dialog.js +9 -5
- package/es/actions/drawer-form.d.ts +1 -1
- package/es/actions/drawer-info.d.ts +1 -1
- package/es/actions/drawer-table.d.ts +1 -1
- package/es/actions/drawer.d.ts +1 -1
- package/es/actions/error.d.ts +1 -1
- package/es/actions/index.js +9 -5
- package/es/actions/index.scss +28 -7
- package/es/actions/link.d.ts +2 -2
- package/es/actions/link.js +2 -2
- package/es/actions/notice.d.ts +1 -1
- package/es/actions/request.d.ts +1 -1
- package/es/actions/request.js +2 -2
- package/es/card/index.d.ts +10 -1
- package/es/card/index.js +20 -5
- package/es/card/index.scss +19 -0
- package/es/card/tab.d.ts +6 -0
- package/es/card/tab.js +27 -0
- package/es/form/Filter/index.d.ts +2 -5
- package/es/form/Filter/index.js +3 -44
- package/es/form/Filter/index.scss +71 -0
- package/es/form/Filter/index2.d.ts +8 -0
- package/es/form/Filter/index2.js +318 -0
- package/es/form/ProForm/index.js +3 -23
- package/es/form/ProForm/index.scss +10 -19
- package/es/form/ProForm/useFormDisplayValues.d.ts +3 -5
- package/es/form/ProForm/useFormDisplayValues.js +44 -38
- package/es/form/SchemaForm/index.js +7 -6
- package/es/form/index.d.ts +11 -10
- package/es/form/index.js +3 -2
- package/es/form/typing.d.ts +3 -0
- package/es/index.d.ts +1 -1
- package/es/index.js +1 -1
- package/es/info/components/ProInfoItem/index.js +3 -1
- package/es/nocode/pages/renderer.d.ts +2 -2
- package/es/page-header/index.d.ts +20 -11
- package/es/page-header/index.js +23 -47
- package/es/page-header/index.scss +0 -11
- package/es/table/components/Filter/index.js +11 -9
- package/es/table/components/Filter/index.scss +7 -3
- package/es/table/components/Layout/index.js +10 -1
- package/es/table/index.js +21 -11
- package/es/table/typing.d.ts +6 -0
- package/es/table/utils/columnRender.js +38 -1
- package/es/table/utils/index.js +15 -1
- package/es/utils/components/tags/index.d.ts +15 -0
- package/es/utils/components/tags/index.js +94 -0
- package/es/utils/components/tags/index.scss +12 -0
- package/lib/actions/base.d.ts +16 -6
- package/lib/actions/base.js +67 -12
- package/lib/actions/confirm.d.ts +1 -1
- package/lib/actions/danger-confirm.d.ts +1 -1
- package/lib/actions/dialog-component.d.ts +1 -1
- package/lib/actions/dialog-form.d.ts +1 -1
- package/lib/actions/dialog-form.js +2 -2
- package/lib/actions/dialog-info.d.ts +1 -1
- package/lib/actions/dialog-table.d.ts +1 -1
- package/lib/actions/dialog.d.ts +6 -2
- package/lib/actions/dialog.js +9 -5
- package/lib/actions/drawer-form.d.ts +1 -1
- package/lib/actions/drawer-info.d.ts +1 -1
- package/lib/actions/drawer-table.d.ts +1 -1
- package/lib/actions/drawer.d.ts +1 -1
- package/lib/actions/error.d.ts +1 -1
- package/lib/actions/index.js +9 -5
- package/lib/actions/index.scss +28 -7
- package/lib/actions/link.d.ts +2 -2
- package/lib/actions/link.js +2 -2
- package/lib/actions/notice.d.ts +1 -1
- package/lib/actions/request.d.ts +1 -1
- package/lib/actions/request.js +2 -2
- package/lib/card/index.d.ts +10 -1
- package/lib/card/index.js +22 -4
- package/lib/card/index.scss +19 -0
- package/lib/card/tab.d.ts +6 -0
- package/lib/card/tab.js +39 -0
- package/lib/form/Filter/index.d.ts +2 -5
- package/lib/form/Filter/index.js +4 -45
- package/lib/form/Filter/index.scss +71 -0
- package/lib/form/Filter/index2.d.ts +8 -0
- package/lib/form/Filter/index2.js +342 -0
- package/lib/form/ProForm/index.js +3 -23
- package/lib/form/ProForm/index.scss +10 -19
- package/lib/form/ProForm/useFormDisplayValues.d.ts +3 -5
- package/lib/form/ProForm/useFormDisplayValues.js +51 -44
- package/lib/form/SchemaForm/index.js +7 -6
- package/lib/form/index.d.ts +11 -10
- package/lib/form/index.js +5 -3
- package/lib/form/typing.d.ts +3 -0
- package/lib/index.d.ts +1 -1
- package/lib/index.js +1 -1
- package/lib/info/components/ProInfoItem/index.js +3 -1
- package/lib/nocode/pages/renderer.d.ts +2 -2
- package/lib/page-header/index.d.ts +20 -11
- package/lib/page-header/index.js +22 -45
- package/lib/page-header/index.scss +0 -11
- package/lib/table/components/Filter/index.js +10 -8
- package/lib/table/components/Filter/index.scss +7 -3
- package/lib/table/components/Layout/index.js +10 -1
- package/lib/table/index.js +20 -10
- package/lib/table/typing.d.ts +6 -0
- package/lib/table/utils/columnRender.js +38 -1
- package/lib/table/utils/index.js +15 -1
- package/lib/utils/components/tags/index.d.ts +15 -0
- package/lib/utils/components/tags/index.js +114 -0
- package/lib/utils/components/tags/index.scss +12 -0
- package/package.json +4 -4
package/es/card/tab.js
ADDED
@@ -0,0 +1,27 @@
|
|
1
|
+
var _excluded = ["className"];
|
2
|
+
|
3
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { 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 from 'react';
|
14
|
+
import classnames from 'classnames';
|
15
|
+
import { Tab } from '@alicloudfe/components';
|
16
|
+
|
17
|
+
var ProCardTab = function ProCardTab(props) {
|
18
|
+
var className = props.className,
|
19
|
+
others = _objectWithoutProperties(props, _excluded);
|
20
|
+
|
21
|
+
return /*#__PURE__*/React.createElement(Tab, _objectSpread({
|
22
|
+
className: classnames('teamix-pro-card-tab', className)
|
23
|
+
}, others));
|
24
|
+
};
|
25
|
+
|
26
|
+
ProCardTab.Item = Tab.Item;
|
27
|
+
export default ProCardTab;
|
@@ -1,16 +1,13 @@
|
|
1
1
|
import React from 'react';
|
2
2
|
import type { IFilterProps } from '../typing';
|
3
|
+
import './index.scss';
|
3
4
|
/**
|
4
5
|
* 简单筛选
|
5
6
|
*/
|
6
7
|
declare const SimpleFilter: React.FC<IFilterProps>;
|
7
|
-
/**
|
8
|
-
* 查询筛选
|
9
|
-
*/
|
10
|
-
declare const QueryFilter: React.FC<IFilterProps>;
|
11
8
|
/**
|
12
9
|
* 高级筛选
|
13
10
|
*/
|
14
11
|
declare const AdvancedFilter: React.FC<IFilterProps>;
|
15
|
-
export { AdvancedFilter, SimpleFilter
|
12
|
+
export { AdvancedFilter, SimpleFilter };
|
16
13
|
export default AdvancedFilter;
|
package/es/form/Filter/index.js
CHANGED
@@ -1,5 +1,4 @@
|
|
1
|
-
var _excluded = ["schema", "triggerType", "onFilter"]
|
2
|
-
_excluded2 = ["schema", "triggerType", "onFilter"];
|
1
|
+
var _excluded = ["schema", "triggerType", "onFilter"];
|
3
2
|
|
4
3
|
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
5
4
|
|
@@ -29,6 +28,7 @@ import { usePrefixCls, getMessage } from '@teamix/utils';
|
|
29
28
|
import { createForm } from '@formily/core';
|
30
29
|
import ProForm from '../ProForm';
|
31
30
|
import { mergeArrayValue } from '../utils';
|
31
|
+
import './index.scss';
|
32
32
|
|
33
33
|
var getEventProps = function getEventProps(triggerType, onFilter) {
|
34
34
|
var keydownEvent = {
|
@@ -89,47 +89,6 @@ var SimpleFilter = /*#__PURE__*/memo(function (props) {
|
|
89
89
|
SimpleFilter.defaultProps = {
|
90
90
|
triggerType: 'change'
|
91
91
|
};
|
92
|
-
/**
|
93
|
-
* 查询筛选
|
94
|
-
*/
|
95
|
-
|
96
|
-
var QueryFilter = /*#__PURE__*/memo(function (props) {
|
97
|
-
var schema = props.schema,
|
98
|
-
triggerType = props.triggerType,
|
99
|
-
onFilter = props.onFilter,
|
100
|
-
otherProps = _objectWithoutProperties(props, _excluded2);
|
101
|
-
|
102
|
-
var prefixCls = usePrefixCls('', {
|
103
|
-
prefix: 'teamix-pro-form-filter-query'
|
104
|
-
});
|
105
|
-
var querySchema = useMemo(function () {
|
106
|
-
return [{
|
107
|
-
component: 'QueryFilter',
|
108
|
-
props: {
|
109
|
-
placeholder: 'placeholder'
|
110
|
-
},
|
111
|
-
children: schema
|
112
|
-
}, {
|
113
|
-
type: 'void',
|
114
|
-
decorator: null,
|
115
|
-
component: 'Submit',
|
116
|
-
props: {
|
117
|
-
style: _objectSpread({}, triggerType === 'submit' ? {} : {
|
118
|
-
display: 'none'
|
119
|
-
})
|
120
|
-
}
|
121
|
-
}];
|
122
|
-
}, []);
|
123
|
-
var eventProps = getEventProps(triggerType, onFilter);
|
124
|
-
return /*#__PURE__*/React.createElement(ProForm, _objectSpread(_objectSpread(_objectSpread({
|
125
|
-
feedbackLayout: "none",
|
126
|
-
breakpoints: [],
|
127
|
-
bordered: false
|
128
|
-
}, otherProps), eventProps), {}, {
|
129
|
-
className: cls(prefixCls, props.className),
|
130
|
-
schema: querySchema
|
131
|
-
}));
|
132
|
-
});
|
133
92
|
/**
|
134
93
|
* 高级筛选
|
135
94
|
*/
|
@@ -221,5 +180,5 @@ AdvancedFilter.defaultProps = {
|
|
221
180
|
labelCol: 6,
|
222
181
|
wrapperCol: 18
|
223
182
|
};
|
224
|
-
export { AdvancedFilter, SimpleFilter
|
183
|
+
export { AdvancedFilter, SimpleFilter };
|
225
184
|
export default AdvancedFilter;
|
@@ -0,0 +1,71 @@
|
|
1
|
+
@import '../global.scss';
|
2
|
+
|
3
|
+
$query-filter: #{$teamix-pro-form}-query-filter;
|
4
|
+
|
5
|
+
.#{$query-filter} {
|
6
|
+
.#{$query-filter}-inline {
|
7
|
+
display: flex;
|
8
|
+
justify-content: space-between;
|
9
|
+
}
|
10
|
+
.#{$query-filter}-left {
|
11
|
+
display: flex;
|
12
|
+
}
|
13
|
+
.#{$query-filter}-addonBefore {
|
14
|
+
flex: 0 1 auto;
|
15
|
+
margin-right: 8px;
|
16
|
+
}
|
17
|
+
.#{$query-filter}-simple {
|
18
|
+
flex: 0 0 auto;
|
19
|
+
margin-right: -8px;
|
20
|
+
margin-bottom: 8px;
|
21
|
+
}
|
22
|
+
.#{$query-filter}-toggle {
|
23
|
+
margin-bottom: 8px;
|
24
|
+
}
|
25
|
+
.#{$query-filter}-addonAfter {
|
26
|
+
flex: 0 1 auto;
|
27
|
+
margin-left: 8px;
|
28
|
+
}
|
29
|
+
.#{$query-filter}-tag-title {
|
30
|
+
margin-right: 12px;
|
31
|
+
color: var(--color-text1-8, #848484);
|
32
|
+
}
|
33
|
+
.#{$query-filter}-tag-content {
|
34
|
+
color: var(--color-text1-2, #5a5a5a);
|
35
|
+
font-weight: bold;
|
36
|
+
}
|
37
|
+
.#{$query-filter}-tag-hidden {
|
38
|
+
display: none;
|
39
|
+
}
|
40
|
+
.#{$query-filter}-advanced {
|
41
|
+
padding: 16px;
|
42
|
+
background-color: var(--color-fill1-2, #f7f7f7);
|
43
|
+
}
|
44
|
+
.#{$query-filter}-advanced-hidden {
|
45
|
+
display: none;
|
46
|
+
}
|
47
|
+
}
|
48
|
+
|
49
|
+
// 筛选
|
50
|
+
.#{$teamix-pro-form}-filter-advanced,
|
51
|
+
.#{$teamix-pro-form}-filter-simple {
|
52
|
+
.#{$form-item-cls}-feedback-layout-popover {
|
53
|
+
margin-bottom: 0;
|
54
|
+
}
|
55
|
+
.#{$css-prefix}date-picker2-input {
|
56
|
+
.#{$css-prefix}input {
|
57
|
+
width: inherit;
|
58
|
+
input {
|
59
|
+
width: inherit;
|
60
|
+
}
|
61
|
+
}
|
62
|
+
}
|
63
|
+
}
|
64
|
+
|
65
|
+
// 筛选和抽屉按钮
|
66
|
+
.#{$teamix-pro-form}-filter-advanced,
|
67
|
+
.#{$css-prefix}drawer-footer {
|
68
|
+
.#{$css-prefix}formily-button-group {
|
69
|
+
margin-top: 0;
|
70
|
+
}
|
71
|
+
}
|
@@ -0,0 +1,318 @@
|
|
1
|
+
var _excluded = ["schema", "triggerType", "onFilter"];
|
2
|
+
|
3
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
4
|
+
|
5
|
+
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
6
|
+
|
7
|
+
function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
8
|
+
|
9
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
10
|
+
|
11
|
+
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
12
|
+
|
13
|
+
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."); }
|
14
|
+
|
15
|
+
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); }
|
16
|
+
|
17
|
+
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
18
|
+
|
19
|
+
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
20
|
+
|
21
|
+
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; }
|
22
|
+
|
23
|
+
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; }
|
24
|
+
|
25
|
+
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; }
|
26
|
+
|
27
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
28
|
+
|
29
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
30
|
+
|
31
|
+
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; }
|
32
|
+
|
33
|
+
import React, { memo, useCallback, useMemo, useState } from 'react';
|
34
|
+
import cls from 'classnames';
|
35
|
+
import { Tag, Button, Badge } from '@alicloudfe/components';
|
36
|
+
import TeamixIcon from '@teamix/icon';
|
37
|
+
import { createForm } from '@formily/core';
|
38
|
+
import { usePrefixCls, getMessage } from '@teamix/utils';
|
39
|
+
import ProForm from '../ProForm';
|
40
|
+
import { getFormDisplayValues } from '../ProForm/useFormDisplayValues';
|
41
|
+
import { mergeArrayValue } from '../utils';
|
42
|
+
import './index.scss';
|
43
|
+
|
44
|
+
var getEventProps = function getEventProps(triggerType, onFilter) {
|
45
|
+
var keydownEvent = {
|
46
|
+
onSubmit: onFilter
|
47
|
+
};
|
48
|
+
var changeEvent = {
|
49
|
+
onChange: onFilter
|
50
|
+
};
|
51
|
+
var eventMap = {
|
52
|
+
keydown: keydownEvent,
|
53
|
+
change: _objectSpread(_objectSpread({}, keydownEvent), changeEvent),
|
54
|
+
submit: keydownEvent
|
55
|
+
};
|
56
|
+
return eventMap[triggerType];
|
57
|
+
};
|
58
|
+
|
59
|
+
var schemaTemp = [{
|
60
|
+
name: 'taskName',
|
61
|
+
title: '实例名称',
|
62
|
+
component: 'Input',
|
63
|
+
required: true,
|
64
|
+
props: {
|
65
|
+
style: {
|
66
|
+
width: 180
|
67
|
+
},
|
68
|
+
placeholder: '请输入'
|
69
|
+
}
|
70
|
+
}];
|
71
|
+
/**
|
72
|
+
* 简单筛选
|
73
|
+
*/
|
74
|
+
|
75
|
+
var SimpleFilter = /*#__PURE__*/memo(function (props) {
|
76
|
+
var schema = props.schema,
|
77
|
+
triggerType = props.triggerType,
|
78
|
+
onFilter = props.onFilter,
|
79
|
+
otherProps = _objectWithoutProperties(props, _excluded);
|
80
|
+
|
81
|
+
var prefixCls = usePrefixCls('', {
|
82
|
+
prefix: 'teamix-pro-form-filter-simple'
|
83
|
+
});
|
84
|
+
var simpleSchema = useMemo(function () {
|
85
|
+
return [{
|
86
|
+
component: 'FormFlex',
|
87
|
+
props: {
|
88
|
+
size: 8
|
89
|
+
},
|
90
|
+
children: [].concat(_toConsumableArray(schema), [{
|
91
|
+
type: 'void',
|
92
|
+
decorator: null,
|
93
|
+
component: 'Submit',
|
94
|
+
props: {
|
95
|
+
style: _objectSpread({}, triggerType === 'submit' ? {} : {
|
96
|
+
display: 'none'
|
97
|
+
})
|
98
|
+
}
|
99
|
+
}])
|
100
|
+
}];
|
101
|
+
}, []);
|
102
|
+
var eventProps = getEventProps(triggerType, onFilter);
|
103
|
+
return /*#__PURE__*/React.createElement(ProForm, _objectSpread(_objectSpread(_objectSpread({
|
104
|
+
feedbackLayout: "popover",
|
105
|
+
breakpoints: [],
|
106
|
+
inset: true
|
107
|
+
}, otherProps), eventProps), {}, {
|
108
|
+
className: cls(prefixCls, props.className),
|
109
|
+
schema: simpleSchema
|
110
|
+
}));
|
111
|
+
});
|
112
|
+
SimpleFilter.defaultProps = {
|
113
|
+
triggerType: 'change'
|
114
|
+
};
|
115
|
+
/**
|
116
|
+
* 高级筛选
|
117
|
+
*/
|
118
|
+
|
119
|
+
var AdvancedFilter = /*#__PURE__*/memo(function (props) {
|
120
|
+
var form = useMemo(function () {
|
121
|
+
return (props === null || props === void 0 ? void 0 : props.form) || createForm();
|
122
|
+
}, []);
|
123
|
+
var schema = props.schema,
|
124
|
+
triggerType = props.triggerType,
|
125
|
+
onFilter = props.onFilter,
|
126
|
+
onReset = props.onReset,
|
127
|
+
layout = props.layout,
|
128
|
+
labelAlign = props.labelAlign,
|
129
|
+
wrapperAlign = props.wrapperAlign,
|
130
|
+
labelCol = props.labelCol,
|
131
|
+
wrapperCol = props.wrapperCol;
|
132
|
+
var prefixCls = usePrefixCls('', {
|
133
|
+
prefix: 'teamix-pro-form-filter-advanced'
|
134
|
+
});
|
135
|
+
var gridSchema = useMemo(function () {
|
136
|
+
return [{
|
137
|
+
name: 'FormGrid',
|
138
|
+
component: 'FormGrid',
|
139
|
+
props: {
|
140
|
+
breakpoints: [480, 720, 990, 1200, Infinity],
|
141
|
+
maxColumns: [1, 2, 3, 3, 4],
|
142
|
+
columnGap: 16,
|
143
|
+
rowGap: 12
|
144
|
+
},
|
145
|
+
children: [].concat(_toConsumableArray(schema), [{
|
146
|
+
component: 'FormGrid.GridColumn',
|
147
|
+
props: {
|
148
|
+
gridSpan: -1
|
149
|
+
},
|
150
|
+
children: [{
|
151
|
+
component: 'FormButtonGroup',
|
152
|
+
props: {
|
153
|
+
align: 'right'
|
154
|
+
},
|
155
|
+
children: [{
|
156
|
+
component: 'Reset',
|
157
|
+
props: {
|
158
|
+
onResetValidateSuccess: onReset,
|
159
|
+
style: _objectSpread({}, triggerType === 'submit' ? {} : {
|
160
|
+
marginRight: -16
|
161
|
+
}),
|
162
|
+
children: getMessage('reset')
|
163
|
+
}
|
164
|
+
}, {
|
165
|
+
component: 'Submit',
|
166
|
+
props: {
|
167
|
+
style: _objectSpread({}, triggerType === 'submit' ? {
|
168
|
+
marginRight: -8
|
169
|
+
} : {
|
170
|
+
display: 'none'
|
171
|
+
}),
|
172
|
+
children: getMessage('search')
|
173
|
+
}
|
174
|
+
}]
|
175
|
+
}]
|
176
|
+
}])
|
177
|
+
}];
|
178
|
+
}, []);
|
179
|
+
var getTeamixLayout = useMemo(function () {
|
180
|
+
return {
|
181
|
+
breakpoints: [990],
|
182
|
+
layout: mergeArrayValue(['vertical'], layout),
|
183
|
+
labelAlign: mergeArrayValue(['left'], labelAlign),
|
184
|
+
wrapperAlign: mergeArrayValue(['left'], wrapperAlign),
|
185
|
+
labelCol: mergeArrayValue([24], labelCol),
|
186
|
+
wrapperCol: mergeArrayValue([24], wrapperCol)
|
187
|
+
};
|
188
|
+
}, [layout, labelAlign, wrapperAlign, labelCol, wrapperCol]);
|
189
|
+
var eventProps = getEventProps(triggerType, onFilter);
|
190
|
+
return /*#__PURE__*/React.createElement(ProForm, _objectSpread(_objectSpread(_objectSpread(_objectSpread({
|
191
|
+
feedbackLayout: "popover"
|
192
|
+
}, props), eventProps), getTeamixLayout), {}, {
|
193
|
+
form: form,
|
194
|
+
className: cls(prefixCls, props.className),
|
195
|
+
schema: gridSchema,
|
196
|
+
onSubmit: onFilter
|
197
|
+
}));
|
198
|
+
});
|
199
|
+
AdvancedFilter.defaultProps = {
|
200
|
+
triggerType: 'change',
|
201
|
+
layout: 'horizontal',
|
202
|
+
labelAlign: 'right',
|
203
|
+
labelCol: 6,
|
204
|
+
wrapperCol: 18
|
205
|
+
};
|
206
|
+
/**
|
207
|
+
* 查询筛选
|
208
|
+
*/
|
209
|
+
|
210
|
+
var QueryFilter = /*#__PURE__*/memo(function (props) {
|
211
|
+
var _useState = useState(true),
|
212
|
+
_useState2 = _slicedToArray(_useState, 2),
|
213
|
+
advancedFilterVisible = _useState2[0],
|
214
|
+
setAdvancedFilterVisible = _useState2[1];
|
215
|
+
|
216
|
+
var _useState3 = useState([]),
|
217
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
218
|
+
tagDataSource = _useState4[0],
|
219
|
+
setTagDataSource = _useState4[1]; // const [values, setValues] = useState<any>();
|
220
|
+
|
221
|
+
|
222
|
+
var form = useMemo(function () {
|
223
|
+
return (props === null || props === void 0 ? void 0 : props.form) || createForm({
|
224
|
+
validateFirst: true
|
225
|
+
});
|
226
|
+
}, []);
|
227
|
+
var schema = props.schema,
|
228
|
+
addonAfter = props.addonAfter,
|
229
|
+
addonBefore = props.addonBefore;
|
230
|
+
var prefixCls = usePrefixCls('', {
|
231
|
+
prefix: 'teamix-pro-form-query-filter'
|
232
|
+
}); // 展开收起高级筛选
|
233
|
+
|
234
|
+
var toggleAdvancedFilter = useCallback(function () {
|
235
|
+
setAdvancedFilterVisible(function (visible) {
|
236
|
+
return !visible;
|
237
|
+
});
|
238
|
+
}, []); // 获取标签数据
|
239
|
+
|
240
|
+
var getTagDataSource = useCallback(function (form) {
|
241
|
+
var displayValues = getFormDisplayValues(form);
|
242
|
+
return Object.entries(displayValues).map(function (_ref) {
|
243
|
+
var _data$displayValue;
|
244
|
+
|
245
|
+
var _ref2 = _slicedToArray(_ref, 2),
|
246
|
+
key = _ref2[0],
|
247
|
+
data = _ref2[1];
|
248
|
+
|
249
|
+
return {
|
250
|
+
key: key,
|
251
|
+
label: data.title,
|
252
|
+
value: (_data$displayValue = data.displayValue) !== null && _data$displayValue !== void 0 ? _data$displayValue : data.value
|
253
|
+
};
|
254
|
+
}); // .filter((item) => isValid(item.value));
|
255
|
+
}, []); // 表单值变化
|
256
|
+
|
257
|
+
var onFormValueChange = useCallback(function (values) {
|
258
|
+
setTagDataSource(getTagDataSource(form));
|
259
|
+
}, []);
|
260
|
+
console.log(tagDataSource); // useEffect(() => {
|
261
|
+
// console.log(form.values);
|
262
|
+
// }, [form.values]);
|
263
|
+
|
264
|
+
return /*#__PURE__*/React.createElement("div", {
|
265
|
+
className: cls(prefixCls, props.className)
|
266
|
+
}, /*#__PURE__*/React.createElement("div", {
|
267
|
+
className: "".concat(prefixCls, "-inline")
|
268
|
+
}, /*#__PURE__*/React.createElement("div", {
|
269
|
+
className: "".concat(prefixCls, "-left")
|
270
|
+
}, addonBefore ? /*#__PURE__*/React.createElement("div", {
|
271
|
+
className: "".concat(prefixCls, "-addonBefore")
|
272
|
+
}, addonBefore) : null, /*#__PURE__*/React.createElement("div", {
|
273
|
+
className: "".concat(prefixCls, "-simple")
|
274
|
+
}, /*#__PURE__*/React.createElement(SimpleFilter, {
|
275
|
+
schema: schemaTemp
|
276
|
+
})), /*#__PURE__*/React.createElement("div", {
|
277
|
+
className: "".concat(prefixCls, "-toggle")
|
278
|
+
}, /*#__PURE__*/React.createElement(Badge, {
|
279
|
+
count: tagDataSource.length,
|
280
|
+
style: _objectSpread({
|
281
|
+
backgroundColor: 'var(--color-brand1-6, #0064c8)',
|
282
|
+
color: 'var(--color-white, #fff)'
|
283
|
+
}, advancedFilterVisible ? {
|
284
|
+
display: 'none'
|
285
|
+
} : {})
|
286
|
+
}, /*#__PURE__*/React.createElement(Button, {
|
287
|
+
onClick: toggleAdvancedFilter
|
288
|
+
}, advancedFilterVisible ? /*#__PURE__*/React.createElement(TeamixIcon, {
|
289
|
+
type: "up-line"
|
290
|
+
}) : /*#__PURE__*/React.createElement(TeamixIcon, {
|
291
|
+
type: "filter-line"
|
292
|
+
}), getMessage('advancedFilter'))))), addonAfter ? /*#__PURE__*/React.createElement("div", {
|
293
|
+
className: "".concat(prefixCls, "-addonAfter")
|
294
|
+
}, addonAfter) : null), /*#__PURE__*/React.createElement("div", {
|
295
|
+
className: "".concat(prefixCls, "-panel")
|
296
|
+
}, /*#__PURE__*/React.createElement("div", {
|
297
|
+
className: cls("".concat(prefixCls, "-tag"), !advancedFilterVisible ? "".concat(prefixCls, "-tag-hidden") : '')
|
298
|
+
}, /*#__PURE__*/React.createElement(Tag.Group, null, tagDataSource.map(function (_ref3) {
|
299
|
+
var key = _ref3.key,
|
300
|
+
label = _ref3.label,
|
301
|
+
value = _ref3.value;
|
302
|
+
return /*#__PURE__*/React.createElement(Tag.Closeable, {
|
303
|
+
key: key,
|
304
|
+
afterClose: console.log
|
305
|
+
}, /*#__PURE__*/React.createElement("span", {
|
306
|
+
className: "".concat(prefixCls, "-tag-title")
|
307
|
+
}, label), /*#__PURE__*/React.createElement("span", {
|
308
|
+
className: "".concat(prefixCls, "-tag-content")
|
309
|
+
}, value));
|
310
|
+
}))), /*#__PURE__*/React.createElement("div", {
|
311
|
+
className: cls("".concat(prefixCls, "-advanced"), !advancedFilterVisible ? "".concat(prefixCls, "-advanced-hidden") : '')
|
312
|
+
}, /*#__PURE__*/React.createElement(AdvancedFilter, _objectSpread(_objectSpread({
|
313
|
+
form: form
|
314
|
+
}, props), {}, {
|
315
|
+
onFilter: onFormValueChange
|
316
|
+
})))));
|
317
|
+
});
|
318
|
+
export { QueryFilter };
|
package/es/form/ProForm/index.js
CHANGED
@@ -57,7 +57,8 @@ var ProForm = /*#__PURE__*/memo(function (_ref) {
|
|
57
57
|
context: context
|
58
58
|
});
|
59
59
|
}, [scope, context]);
|
60
|
-
var onAutoSubmit = useAutoSubmit(onSubmit);
|
60
|
+
var onAutoSubmit = useAutoSubmit(onSubmit); // todo 需要formily支持断点下的属性更新
|
61
|
+
|
61
62
|
var getTeamixLayout = useMemo(function () {
|
62
63
|
return breakpoints ? {
|
63
64
|
breakpoints: breakpoints,
|
@@ -109,28 +110,7 @@ var ProForm = /*#__PURE__*/memo(function (_ref) {
|
|
109
110
|
schema: schema,
|
110
111
|
scope: mergedScope,
|
111
112
|
components: components
|
112
|
-
}), children);
|
113
|
-
// <FormLayout
|
114
|
-
// className={cls(prefixCls, className)}
|
115
|
-
// {...otherProps}
|
116
|
-
// {...getTeamixLayout}
|
117
|
-
// >
|
118
|
-
// <SchemaForm schema={schema} scope={scope} components={components} />
|
119
|
-
// {children}
|
120
|
-
// </FormLayout>
|
121
|
-
// ) : (
|
122
|
-
// <Form
|
123
|
-
// className={cls(prefixCls, className)}
|
124
|
-
// {...otherProps}
|
125
|
-
// {...getTeamixLayout}
|
126
|
-
// form={form}
|
127
|
-
// onAutoSubmit={onAutoSubmit}
|
128
|
-
// onAutoSubmitFailed={onSubmitFailed}
|
129
|
-
// >
|
130
|
-
// <SchemaForm schema={schema} scope={scope} components={components} />
|
131
|
-
// {children}
|
132
|
-
// </Form>
|
133
|
-
// );
|
113
|
+
}), children);
|
134
114
|
});
|
135
115
|
ProForm.defaultProps = {
|
136
116
|
colon: false,
|
@@ -230,14 +230,12 @@
|
|
230
230
|
}
|
231
231
|
}
|
232
232
|
|
233
|
-
//
|
234
|
-
.#{$teamix-pro-form}-filter-advanced,
|
233
|
+
// 抽屉按钮
|
235
234
|
.#{$css-prefix}drawer-footer {
|
236
235
|
.#{$css-prefix}formily-button-group {
|
237
236
|
margin-top: 0;
|
238
237
|
}
|
239
238
|
}
|
240
|
-
|
241
239
|
.#{$teamix-pro-form}-button-affix-auto.#{$css-prefix}affix,
|
242
240
|
.#{$teamix-pro-form}-button-affix-always.#{$css-prefix}affix {
|
243
241
|
left: 0;
|
@@ -259,22 +257,6 @@
|
|
259
257
|
}
|
260
258
|
}
|
261
259
|
|
262
|
-
// 高级筛选
|
263
|
-
.#{$teamix-pro-form}-filter-advanced,
|
264
|
-
.#{$teamix-pro-form}-filter-simple {
|
265
|
-
.#{$form-item-cls}-feedback-layout-popover {
|
266
|
-
margin-bottom: 0;
|
267
|
-
}
|
268
|
-
.#{$css-prefix}date-picker2-input {
|
269
|
-
.#{$css-prefix}input {
|
270
|
-
width: inherit;
|
271
|
-
input {
|
272
|
-
width: inherit;
|
273
|
-
}
|
274
|
-
}
|
275
|
-
}
|
276
|
-
}
|
277
|
-
|
278
260
|
// ArrayItems
|
279
261
|
.#{$css-prefix}formily-array-items {
|
280
262
|
.#{$css-prefix}formily-grid-layout {
|
@@ -288,3 +270,12 @@
|
|
288
270
|
cursor: pointer;
|
289
271
|
}
|
290
272
|
}
|
273
|
+
|
274
|
+
/* hack todo remove */
|
275
|
+
.#{$form-item-cls}-control-content-component {
|
276
|
+
.teamix-pro-field-tooltip.teamix-pro-field-checkbox {
|
277
|
+
.teamix-pro-lable-icon-tip-icon {
|
278
|
+
transform: translate(0px, 4px);
|
279
|
+
}
|
280
|
+
}
|
281
|
+
}
|
@@ -1,6 +1,4 @@
|
|
1
|
-
|
2
|
-
* 获取表单值的可显示值
|
3
|
-
* @returns 如果某字段有dataSource,则返回value对应label
|
4
|
-
*/
|
1
|
+
import type { Form } from '@formily/core';
|
5
2
|
declare const useFormDisplayValues: () => any;
|
6
|
-
|
3
|
+
declare const getFormDisplayValues: (form: Form) => any;
|
4
|
+
export { useFormDisplayValues, getFormDisplayValues };
|