tntd 1.4.4 → 1.4.7

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 (88) hide show
  1. package/components/Layout/HeaderActions.js +90 -128
  2. package/components/LoadingButton/index.js +11 -15
  3. package/components/QueryListScene/QueryForm.js +7 -4
  4. package/dist/stats.json +4990 -4990
  5. package/dist/tntd.js +1 -1
  6. package/es/Layout/HeaderActions.js +10 -10
  7. package/es/LoadingButton/index.js +20 -10
  8. package/es/QueryListScene/QueryForm.js +6 -3
  9. package/lib/ArrayInput/icon.js +27 -31
  10. package/lib/ArrayInput/index.js +211 -298
  11. package/lib/AuthContext.js +2 -13
  12. package/lib/Columns/index.js +71 -100
  13. package/lib/DevelopmentLogin/LoginModal.js +79 -141
  14. package/lib/DevelopmentLogin/index.js +28 -55
  15. package/lib/Ellipsis/Svg/CopySVG.js +23 -71
  16. package/lib/Ellipsis/Svg/TickSVG.js +17 -49
  17. package/lib/Ellipsis/index.js +148 -154
  18. package/lib/Handle/index.js +72 -109
  19. package/lib/Icon/fonts/iconfont.js +1 -43
  20. package/lib/Icon/iconList.js +119 -8
  21. package/lib/Icon/index.js +13 -45
  22. package/lib/Img/Contain.js +49 -81
  23. package/lib/Img/Cover.js +88 -136
  24. package/lib/Img/index.js +36 -89
  25. package/lib/Layout/ActionsContext.js +2 -11
  26. package/lib/Layout/AppList.js +262 -256
  27. package/lib/Layout/Application.js +119 -135
  28. package/lib/Layout/Avatar.js +137 -137
  29. package/lib/Layout/CompatibleLanguage.js +214 -195
  30. package/lib/Layout/EnterpriseLayout/Avatar.js +156 -168
  31. package/lib/Layout/EnterpriseLayout/Language.js +75 -100
  32. package/lib/Layout/EnterpriseLayout/Theme.js +96 -94
  33. package/lib/Layout/EnterpriseLayout/index.js +32 -45
  34. package/lib/Layout/GlobalNavigation/NavigationPopup.js +335 -407
  35. package/lib/Layout/GlobalNavigation/index.js +110 -158
  36. package/lib/Layout/Header.js +165 -116
  37. package/lib/Layout/HeaderActions.js +132 -129
  38. package/lib/Layout/HeaderNavs.js +90 -113
  39. package/lib/Layout/HeaderTabs.js +312 -278
  40. package/lib/Layout/Iconfont.js +2 -15
  41. package/lib/Layout/Language.js +63 -102
  42. package/lib/Layout/Layout.js +272 -261
  43. package/lib/Layout/Logo.js +132 -87
  44. package/lib/Layout/OrgAppList.js +440 -319
  45. package/lib/Layout/SideMenu.js +429 -343
  46. package/lib/Layout/Theme.js +95 -124
  47. package/lib/Layout/checkAuth.js +21 -35
  48. package/lib/Layout/createActions.js +38 -51
  49. package/lib/Layout/images/index.js +33 -41
  50. package/lib/Layout/index.js +110 -161
  51. package/lib/Layout/paaslayout/CompactSideMenu.js +200 -178
  52. package/lib/Layout/paaslayout/Header.js +84 -90
  53. package/lib/Layout/paaslayout/Logo.js +27 -32
  54. package/lib/Layout/paaslayout/SideMenu.js +161 -174
  55. package/lib/Layout/paaslayout/index.js +240 -261
  56. package/lib/Layout/storage.js +20 -78
  57. package/lib/Layout/utils.js +93 -143
  58. package/lib/LoadingButton/index.js +25 -57
  59. package/lib/Modal/index.js +83 -108
  60. package/lib/Page/Box.js +56 -81
  61. package/lib/Page/index.js +151 -173
  62. package/lib/Page/utils.js +12 -30
  63. package/lib/QueryForm/Field/Checkbox.js +11 -33
  64. package/lib/QueryForm/Field/Select.js +63 -99
  65. package/lib/QueryForm/Field/SelectInput.js +69 -114
  66. package/lib/QueryForm/Field/fieldsMap.js +30 -52
  67. package/lib/QueryForm/Field/index.js +76 -158
  68. package/lib/QueryForm/createActions.js +50 -65
  69. package/lib/QueryForm/index.js +304 -383
  70. package/lib/QueryForm/useForm.js +6 -17
  71. package/lib/QueryListScene/List.js +290 -366
  72. package/lib/QueryListScene/QueryForm.js +93 -158
  73. package/lib/QueryListScene/QueryListScene.js +33 -87
  74. package/lib/QueryListScene/Title.js +10 -20
  75. package/lib/QueryListScene/Toolbar.js +8 -31
  76. package/lib/QueryListScene/createActions.js +64 -79
  77. package/lib/QueryListScene/index.js +23 -40
  78. package/lib/QueryListScene/useActions.js +6 -17
  79. package/lib/Select/DropDownWrap.js +60 -124
  80. package/lib/Select/index.js +425 -561
  81. package/lib/Table/ResizableTable/index.js +77 -121
  82. package/lib/Table/index.js +19 -51
  83. package/lib/Title/index.js +34 -52
  84. package/lib/index.js +19 -159
  85. package/lib/locale.js +48 -63
  86. package/package.json +1 -1
  87. package/lib/Layout/EnterpriseLayout/Header.js +0 -113
  88. package/lib/Layout/EnterpriseLayout/HeaderActions.js +0 -104
@@ -1,415 +1,336 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports["default"] = void 0;
7
-
8
- require("antd/lib/form/style");
9
-
10
- var _form = _interopRequireDefault(require("antd/lib/form"));
11
-
12
- require("antd/lib/drawer/style");
13
-
14
- var _drawer = _interopRequireDefault(require("antd/lib/drawer"));
15
-
16
- require("antd/lib/badge/style");
17
-
18
- var _badge = _interopRequireDefault(require("antd/lib/badge"));
19
-
20
- require("antd/lib/button/style");
21
-
22
- var _button = _interopRequireDefault(require("antd/lib/button"));
23
-
24
- var _react = _interopRequireWildcard(require("react"));
25
-
26
- var _classnames3 = _interopRequireDefault(require("classnames"));
27
-
28
- var _lodash = require("lodash");
29
-
30
- var _useForm = _interopRequireDefault(require("./useForm"));
31
-
32
- var _createActions = _interopRequireDefault(require("./createActions"));
33
-
34
- var _Icon = _interopRequireDefault(require("../Icon"));
35
-
36
- var _Field = _interopRequireDefault(require("./Field"));
37
-
38
- var _locale = require("../locale");
39
-
40
- require("./index.less");
41
-
42
- function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
43
-
44
- function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
45
-
46
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
47
-
48
- function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
49
-
50
- function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
51
-
52
- 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; }
53
-
54
- 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; }
55
-
56
- 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; }
57
-
58
- function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
59
-
60
- function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
61
-
62
- function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
63
-
64
- function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
65
-
66
- function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
67
-
68
- function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
69
-
70
- function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
71
-
72
- function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
73
-
74
- var clsPrefix = 'tnt-queryform';
75
-
76
- var QueryForm =
77
- /*#__PURE__*/
78
- function (_React$PureComponent) {
79
- _inherits(QueryForm, _React$PureComponent);
80
-
81
- function QueryForm(props) {
82
- var _this;
83
-
84
- _classCallCheck(this, QueryForm);
85
-
86
- _this = _possibleConstructorReturn(this, _getPrototypeOf(QueryForm).call(this, props));
87
- _this.onWindowResize = (0, _lodash.debounce)(function () {
88
- var current = _this.fieldsRef.current;
1
+ import React, { createRef } from 'react';
2
+ import classnames from 'classnames';
3
+ import { debounce } from 'lodash';
4
+ import { Form, Button, Drawer, Badge } from 'antd';
5
+ import useForm from './useForm';
6
+ import createActions from './createActions';
7
+ import Icon from '../Icon';
8
+ import Field from './Field';
9
+ import { getText, getLanguage } from '../locale';
10
+ import './index.less';
11
+
12
+ const clsPrefix = 'tnt-queryform';
13
+
14
+ class QueryForm extends React.PureComponent {
15
+ constructor(props) {
16
+ super(props);
17
+ const { form, initialValues, showExpand = true, renderActions, defaultExpanded } = props;
18
+ this.state = {
19
+ showMore: false,
20
+ expanded: (defaultExpanded || (!showExpand || renderActions)) ? true : false,
21
+ drawerVisible: false,
22
+ drawerFieldsValueCount: 0
23
+ };
24
+ this.fieldsRef = createRef();
25
+ this.formBoxRef = createRef();
26
+
27
+ this.form = form || createActions();
28
+ this.form.setData('initialValues', initialValues);
29
+ this.form.setData('values', { ...initialValues });
30
+ }
89
31
 
90
- if (current) {
91
- setTimeout(function () {
92
- _this.setState({
93
- showMore: _this.isFieldsWidthOverflow()
94
- });
95
- }, 25);
96
- }
97
- }, 50);
32
+ render() {
33
+ const {
34
+ children,
35
+ className = '',
36
+ initialValues = {},
37
+ renderActions,
38
+ showSearch = true,
39
+ showReset = true,
40
+ showFieldCount,
41
+ drawerProps = {},
42
+ size
43
+ } = this.props;
44
+ const extraActions = this.props.extraActions;
45
+ const { expanded, showMore, drawerVisible, drawerFieldsValueCount } = this.state;
46
+ const renderFormActions = renderActions || (() => (
47
+ <>
48
+ {
49
+ showFieldCount && (
50
+ <Badge count={drawerFieldsValueCount}>
51
+ <Button onClick={this.onShowDrawer}>
52
+ <Icon type="filter" />
53
+ {this.getText('moreFiltering')}
54
+ </Button>
55
+ </Badge>
56
+ )
57
+ }
58
+ {
59
+ showSearch && (
60
+ <Button type="primary" onClick={this.onSearch}>
61
+ {this.getText('search')}
62
+ </Button>
63
+ )
64
+ }
65
+ {
66
+ showReset && (
67
+ <Button onClick={this.onReset}>
68
+ {this.getText('reset')}
69
+ </Button>
70
+ )
71
+ }
72
+ {
73
+ showMore && !showFieldCount && (
74
+ <Button
75
+ className="expand-link"
76
+ type="link"
77
+ onClick={this.onToggleExpand}
78
+ >
79
+ {this.getText(expanded ? 'collapse' : 'expand')}
80
+ </Button>
81
+ )
82
+ }
83
+ {
84
+ React.Children.map(
85
+ children,
86
+ child => (
87
+ child && child?.props?.align === 'right' && React.cloneElement(child)
88
+ )
89
+ )
90
+ }
91
+ </>
92
+ ));
93
+
94
+ return (
95
+ <div ref={this.formBoxRef} className={classnames(clsPrefix, { [className]: className })}>
96
+ <Form layout="inline" className={classnames({ expanded: !showMore || expanded, showMore })}>
97
+ <div ref={this.fieldsRef}>
98
+ {
99
+ React.Children.map(
100
+ children,
101
+ (child, index) => (
102
+ child
103
+ && child?.props?.align !== 'right'
104
+ && (!showFieldCount || showFieldCount > index)
105
+ && React.cloneElement(child, {
106
+ form: this.form,
107
+ initialValue: initialValues?.[child.props.name],
108
+ onChange: this.onFieldChange
109
+ })
110
+ )
111
+ )
112
+ }
113
+ </div>
114
+ <div className={`${clsPrefix}-actions`}>
115
+ {renderFormActions()}
116
+ </div>
117
+ {
118
+ showFieldCount && (
119
+ <Drawer
120
+ title={this.getText('moreFiltering')}
121
+ visible={drawerVisible}
122
+ onClose={() => this.setState({ drawerVisible: false })}
123
+ width={300}
124
+ size={size}
125
+ getContainer={false}
126
+ {...drawerProps}
127
+ className={classnames(`${clsPrefix}-drawer`, { 'large-size': size === 'large', [className]: className })}
128
+ >
129
+ {
130
+ React.Children.map(
131
+ children,
132
+ (child, index) => (
133
+ child
134
+ && (index >= showFieldCount)
135
+ && React.cloneElement(child, {
136
+ form: this.form,
137
+ isFieldInDrawer: true,
138
+ initialValue: initialValues?.[child.props.name],
139
+ onChange: this.onFieldChange,
140
+ onSearch: this.onSearch
141
+ })
142
+ )
143
+ )
144
+ }
145
+ <Button type="primary" onClick={this.onSearch}>
146
+ {this.getText('search')}
147
+ </Button>
148
+ <Button onClick={this.onReset}>
149
+ {this.getText('reset')}
150
+ </Button>
151
+ </Drawer>
152
+ )
153
+ }
154
+ </Form>
155
+ {
156
+ extraActions && (
157
+ <div className={`${clsPrefix}-extra`}>
158
+ {extraActions}
159
+ </div>
160
+ )
161
+ }
162
+ </div>
163
+ );
164
+ }
98
165
 
99
- _this.search = function (params) {
100
- _this.props.onSearch(_objectSpread({}, _this.form.getValues(), {}, params));
101
- };
166
+ getText(key) {
167
+ return getText(key, this.props.language || getLanguage());
168
+ }
102
169
 
103
- _this.onSearch = function () {
104
- _this.props.onSearch == null ? void 0 : _this.props.onSearch(_this.form.getValues());
105
- };
170
+ isFieldsWidthOverflow() {
171
+ const { current } = this.fieldsRef;
106
172
 
107
- _this.onReset = function () {
108
- var _this$props = _this.props,
109
- initialValues = _this$props.initialValues,
110
- onReset = _this$props.onReset;
173
+ if (current) {
174
+ return current.offsetWidth < [].reduce.call(current.children, (acc, cur) => {
175
+ const marginArray = window.getComputedStyle(cur).margin.split(' ').map(str => parseInt(str, 10));
176
+ acc += cur.offsetWidth + marginArray[1];
177
+ return acc;
178
+ }, 0);
179
+ }
111
180
 
112
- _this.form.setValues(_objectSpread({}, initialValues));
181
+ return false;
182
+ }
113
183
 
114
- _this.updateDrawerFieldsValueCount();
184
+ updateFieldHeight() {
185
+ const { formBoxRef, fieldsRef } = this;
186
+ const getFieldHeight = () => {
187
+ const { current } = fieldsRef;
188
+ let height = '32px';
189
+
190
+ if (current && current.children?.[0]) {
191
+ height = window.getComputedStyle(current.children[0]).height;
192
+ }
193
+
194
+ return height;
195
+ };
196
+ const queryFormActionsDom = formBoxRef?.current?.querySelector(`.${clsPrefix}-actions`);
197
+ const queryFormExtraDom = formBoxRef?.current?.querySelector(`.${clsPrefix}-extra`);
198
+ const formItemsDomList = fieldsRef?.current?.querySelectorAll('.ant-form-item-control');
199
+ const fieldHeight = getFieldHeight();
200
+
201
+ fieldsRef.current.style.height = fieldHeight;
202
+ [queryFormActionsDom, queryFormExtraDom].forEach(item => {
203
+ item && Object.assign(item.style, {
204
+ height: fieldHeight,
205
+ lineHeight: fieldHeight
206
+ });
207
+ });
208
+ [].forEach.call(formItemsDomList, item => {
209
+ item.style.lineHeight = fieldHeight;
210
+ });
211
+ }
115
212
 
116
- onReset == null ? void 0 : onReset(initialValues);
117
- };
213
+ onWindowResize = debounce(() => {
214
+ const { current } = this.fieldsRef;
118
215
 
119
- _this.onToggleExpand = function () {
120
- _this.setState({
121
- expanded: !_this.state.expanded
122
- });
216
+ if (current) {
217
+ setTimeout(() => {
218
+ this.setState({
219
+ showMore: this.isFieldsWidthOverflow()
220
+ });
221
+ }, 25);
222
+ }
223
+ }, 50)
123
224
 
124
- _this.props.onToggleExpand == null ? void 0 : _this.props.onToggleExpand(!_this.state.expanded);
125
- };
225
+ search = params => {
226
+ this.props.onSearch({
227
+ ...this.form.getValues(),
228
+ ...params
229
+ });
230
+ }
126
231
 
127
- _this.onShowDrawer = function () {
128
- _this.setState({
129
- drawerVisible: true
130
- });
232
+ onSearch = () => {
233
+ this.props.onSearch?.(this.form.getValues());
131
234
  };
132
235
 
133
- _this.onFieldChange = function (name, value) {
134
- var values = _this.form.getValues();
135
-
136
- var newValues = _objectSpread({}, values, _defineProperty({}, name, value));
137
-
138
- var changedInfo = {
139
- name: name,
140
- value: value,
141
- preValue: values == null ? void 0 : values[name]
142
- };
143
- var onChange = _this.props.onChange;
144
-
145
- _this.form.setData('values', newValues);
146
-
147
- for (var _len = arguments.length, rest = new Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
148
- rest[_key - 2] = arguments[_key];
149
- }
150
236
 
151
- onChange && onChange.apply(void 0, [newValues, changedInfo].concat(rest));
237
+ onReset = () => {
238
+ const { initialValues, onReset } = this.props;
152
239
 
153
- _this.updateDrawerFieldsValueCount(newValues);
240
+ this.form.setValues({ ...initialValues });
241
+ this.updateDrawerFieldsValueCount();
242
+ onReset?.(initialValues);
154
243
  };
155
244
 
156
- _this.updateDrawerFieldsValueCount = function () {
157
- var values = _this.form.getValues();
158
-
159
- var _this$props2 = _this.props,
160
- showFieldCount = _this$props2.showFieldCount,
161
- children = _this$props2.children;
162
-
163
- if (showFieldCount) {
164
- var drawerFieldsValueCount = children.reduce(function (acc, cur, index) {
165
- var _cur$props;
245
+ onToggleExpand = () => {
246
+ this.setState({
247
+ expanded: !this.state.expanded
248
+ });
249
+ this.props.onToggleExpand?.(!this.state.expanded);
250
+ }
166
251
 
167
- if (index >= showFieldCount && (values == null ? void 0 : values[cur == null ? void 0 : (_cur$props = cur.props) == null ? void 0 : _cur$props.name])) {
168
- acc++;
169
- }
252
+ onShowDrawer = () => {
253
+ this.setState({ drawerVisible: true });
254
+ }
170
255
 
171
- return acc;
172
- }, 0);
256
+ onFieldChange = (name, value, ...rest) => {
257
+ const values = this.form.getValues();
258
+ const newValues = {
259
+ ...values,
260
+ [name]: value
261
+ };
262
+ const changedInfo = { name, value, preValue:values?.[name] };
263
+ const { onChange } = this.props;
264
+
265
+ this.form.setData('values', newValues);
266
+
267
+ onChange && onChange(
268
+ newValues,
269
+ changedInfo,
270
+ ...rest
271
+ );
272
+ this.updateDrawerFieldsValueCount(newValues);
273
+ }
173
274
 
174
- if (drawerFieldsValueCount !== _this.state.drawerFieldsValueCount) {
175
- _this.setState({
176
- drawerFieldsValueCount: drawerFieldsValueCount
177
- });
275
+ updateDrawerFieldsValueCount = () => {
276
+ const values = this.form.getValues();
277
+ const { showFieldCount, children } = this.props;
278
+
279
+ if (showFieldCount) {
280
+ const drawerFieldsValueCount = children.reduce((acc, cur, index) => {
281
+ if (index >= showFieldCount && values?.[cur?.props?.name]) {
282
+ acc++;
283
+ }
284
+ return acc;
285
+ }, 0);
286
+
287
+ if (drawerFieldsValueCount !== this.state.drawerFieldsValueCount) {
288
+ this.setState({
289
+ drawerFieldsValueCount
290
+ });
291
+ }
178
292
  }
179
- }
180
- };
181
-
182
- var form = props.form,
183
- _initialValues = props.initialValues,
184
- _props$showExpand = props.showExpand,
185
- showExpand = _props$showExpand === void 0 ? true : _props$showExpand,
186
- renderActions = props.renderActions,
187
- defaultExpanded = props.defaultExpanded;
188
- _this.state = {
189
- showMore: false,
190
- expanded: defaultExpanded || !showExpand || renderActions ? true : false,
191
- drawerVisible: false,
192
- drawerFieldsValueCount: 0
193
- };
194
- _this.fieldsRef = (0, _react.createRef)();
195
- _this.formBoxRef = (0, _react.createRef)();
196
- _this.form = form || (0, _createActions["default"])();
197
-
198
- _this.form.setData('initialValues', _initialValues);
199
-
200
- _this.form.setData('values', _objectSpread({}, _initialValues));
201
-
202
- return _this;
203
- }
204
-
205
- _createClass(QueryForm, [{
206
- key: "render",
207
- value: function render() {
208
- var _this2 = this;
209
-
210
- var _this$props3 = this.props,
211
- children = _this$props3.children,
212
- _this$props3$classNam = _this$props3.className,
213
- className = _this$props3$classNam === void 0 ? '' : _this$props3$classNam,
214
- _this$props3$initialV = _this$props3.initialValues,
215
- initialValues = _this$props3$initialV === void 0 ? {} : _this$props3$initialV,
216
- renderActions = _this$props3.renderActions,
217
- _this$props3$showSear = _this$props3.showSearch,
218
- showSearch = _this$props3$showSear === void 0 ? true : _this$props3$showSear,
219
- _this$props3$showRese = _this$props3.showReset,
220
- showReset = _this$props3$showRese === void 0 ? true : _this$props3$showRese,
221
- showFieldCount = _this$props3.showFieldCount,
222
- _this$props3$drawerPr = _this$props3.drawerProps,
223
- drawerProps = _this$props3$drawerPr === void 0 ? {} : _this$props3$drawerPr,
224
- size = _this$props3.size;
225
- var extraActions = this.props.extraActions;
226
- var _this$state = this.state,
227
- expanded = _this$state.expanded,
228
- showMore = _this$state.showMore,
229
- drawerVisible = _this$state.drawerVisible,
230
- drawerFieldsValueCount = _this$state.drawerFieldsValueCount;
231
-
232
- var renderFormActions = renderActions || function () {
233
- return _react["default"].createElement(_react["default"].Fragment, null, showFieldCount && _react["default"].createElement(_badge["default"], {
234
- count: drawerFieldsValueCount
235
- }, _react["default"].createElement(_button["default"], {
236
- onClick: _this2.onShowDrawer
237
- }, _react["default"].createElement(_Icon["default"], {
238
- type: "filter"
239
- }), _this2.getText('moreFiltering'))), showSearch && _react["default"].createElement(_button["default"], {
240
- type: "primary",
241
- onClick: _this2.onSearch
242
- }, _this2.getText('search')), showReset && _react["default"].createElement(_button["default"], {
243
- onClick: _this2.onReset
244
- }, _this2.getText('reset')), showMore && !showFieldCount && _react["default"].createElement(_button["default"], {
245
- className: "expand-link",
246
- type: "link",
247
- onClick: _this2.onToggleExpand
248
- }, _this2.getText(expanded ? 'collapse' : 'expand')), _react["default"].Children.map(children, function (child) {
249
- var _child$props;
250
-
251
- return child && (child == null ? void 0 : (_child$props = child.props) == null ? void 0 : _child$props.align) === 'right' && _react["default"].cloneElement(child);
252
- }));
253
- };
254
-
255
- return _react["default"].createElement("div", {
256
- ref: this.formBoxRef,
257
- className: (0, _classnames3["default"])(clsPrefix, _defineProperty({}, className, className))
258
- }, _react["default"].createElement(_form["default"], {
259
- layout: "inline",
260
- className: (0, _classnames3["default"])({
261
- expanded: !showMore || expanded,
262
- showMore: showMore
263
- })
264
- }, _react["default"].createElement("div", {
265
- ref: this.fieldsRef
266
- }, _react["default"].Children.map(children, function (child, index) {
267
- var _child$props2;
268
-
269
- return child && (child == null ? void 0 : (_child$props2 = child.props) == null ? void 0 : _child$props2.align) !== 'right' && (!showFieldCount || showFieldCount > index) && _react["default"].cloneElement(child, {
270
- form: _this2.form,
271
- initialValue: initialValues == null ? void 0 : initialValues[child.props.name],
272
- onChange: _this2.onFieldChange
273
- });
274
- })), _react["default"].createElement("div", {
275
- className: "".concat(clsPrefix, "-actions")
276
- }, renderFormActions()), showFieldCount && _react["default"].createElement(_drawer["default"], _extends({
277
- title: this.getText('moreFiltering'),
278
- visible: drawerVisible,
279
- onClose: function onClose() {
280
- return _this2.setState({
281
- drawerVisible: false
282
- });
283
- },
284
- width: 300,
285
- size: size,
286
- getContainer: false
287
- }, drawerProps, {
288
- className: (0, _classnames3["default"])("".concat(clsPrefix, "-drawer"), _defineProperty({
289
- 'large-size': size === 'large'
290
- }, className, className))
291
- }), _react["default"].Children.map(children, function (child, index) {
292
- return child && index >= showFieldCount && _react["default"].cloneElement(child, {
293
- form: _this2.form,
294
- isFieldInDrawer: true,
295
- initialValue: initialValues == null ? void 0 : initialValues[child.props.name],
296
- onChange: _this2.onFieldChange,
297
- onSearch: _this2.onSearch
298
- });
299
- }), _react["default"].createElement(_button["default"], {
300
- type: "primary",
301
- onClick: this.onSearch
302
- }, this.getText('search')), _react["default"].createElement(_button["default"], {
303
- onClick: this.onReset
304
- }, this.getText('reset')))), extraActions && _react["default"].createElement("div", {
305
- className: "".concat(clsPrefix, "-extra")
306
- }, extraActions));
307
- }
308
- }, {
309
- key: "getText",
310
- value: function getText(key) {
311
- return (0, _locale.getText)(key, this.props.language || (0, _locale.getLanguage)());
312
293
  }
313
- }, {
314
- key: "isFieldsWidthOverflow",
315
- value: function isFieldsWidthOverflow() {
316
- var current = this.fieldsRef.current;
317
-
318
- if (current) {
319
- return current.offsetWidth < [].reduce.call(current.children, function (acc, cur) {
320
- var marginArray = window.getComputedStyle(cur).margin.split(' ').map(function (str) {
321
- return parseInt(str, 10);
322
- });
323
- acc += cur.offsetWidth + marginArray[1];
324
- return acc;
325
- }, 0);
326
- }
327
-
328
- return false;
329
- }
330
- }, {
331
- key: "updateFieldHeight",
332
- value: function updateFieldHeight() {
333
- var _formBoxRef$current, _formBoxRef$current2, _fieldsRef$current;
334
294
 
335
- var formBoxRef = this.formBoxRef,
336
- fieldsRef = this.fieldsRef;
295
+ componentDidMount() {
296
+ const { current } = this.fieldsRef;
297
+ const { showFieldCount, showExpand = true, renderActions } = this.props;
337
298
 
338
- var getFieldHeight = function getFieldHeight() {
339
- var _current$children;
299
+ this.updateFieldHeight();
340
300
 
341
- var current = fieldsRef.current;
342
- var height = '32px';
301
+ this.form.on('search', this.search);
343
302
 
344
- if (current && ((_current$children = current.children) == null ? void 0 : _current$children[0])) {
345
- height = window.getComputedStyle(current.children[0]).height;
303
+ // 未设置第一行显示数量且禁止了展开操作 自定义了操作区域,则不需要处理展开计算逻辑
304
+ // || renderActions
305
+ if (!showFieldCount && !showExpand) {
306
+ return;
346
307
  }
347
308
 
348
- return height;
349
- };
350
-
351
- var queryFormActionsDom = formBoxRef == null ? void 0 : (_formBoxRef$current = formBoxRef.current) == null ? void 0 : _formBoxRef$current.querySelector(".".concat(clsPrefix, "-actions"));
352
- var queryFormExtraDom = formBoxRef == null ? void 0 : (_formBoxRef$current2 = formBoxRef.current) == null ? void 0 : _formBoxRef$current2.querySelector(".".concat(clsPrefix, "-extra"));
353
- var formItemsDomList = fieldsRef == null ? void 0 : (_fieldsRef$current = fieldsRef.current) == null ? void 0 : _fieldsRef$current.querySelectorAll('.ant-form-item-control');
354
- var fieldHeight = getFieldHeight();
355
- fieldsRef.current.style.height = fieldHeight;
356
- [queryFormActionsDom, queryFormExtraDom].forEach(function (item) {
357
- item && Object.assign(item.style, {
358
- height: fieldHeight,
359
- lineHeight: fieldHeight
360
- });
361
- });
362
- [].forEach.call(formItemsDomList, function (item) {
363
- item.style.lineHeight = fieldHeight;
364
- });
365
- }
366
- }, {
367
- key: "componentDidMount",
368
- value: function componentDidMount() {
369
- var current = this.fieldsRef.current;
370
- var _this$props4 = this.props,
371
- showFieldCount = _this$props4.showFieldCount,
372
- _this$props4$showExpa = _this$props4.showExpand,
373
- showExpand = _this$props4$showExpa === void 0 ? true : _this$props4$showExpa,
374
- renderActions = _this$props4.renderActions;
375
- this.updateFieldHeight();
376
- this.form.on('search', this.search); // 未设置第一行显示数量且禁止了展开操作 或 自定义了操作区域,则不需要处理展开计算逻辑
377
- // || renderActions
378
-
379
- if (!showFieldCount && !showExpand) {
380
- return;
381
- }
382
-
383
- if (!showFieldCount) {
384
- if (current && this.isFieldsWidthOverflow()) {
385
- this.setState({
386
- showMore: true
387
- });
309
+ if (!showFieldCount) {
310
+ if (current && this.isFieldsWidthOverflow()) {
311
+ this.setState({
312
+ showMore: true
313
+ });
314
+ }
315
+
316
+ window.addEventListener('resize', this.onWindowResize);
317
+ } else {
318
+ this.updateDrawerFieldsValueCount();
319
+ this.form.on('setValues', this.updateDrawerFieldsValueCount);
320
+ this.form.on('setValue', this.updateDrawerFieldsValueCount);
388
321
  }
389
-
390
- window.addEventListener('resize', this.onWindowResize);
391
- } else {
392
- this.updateDrawerFieldsValueCount();
393
- this.form.on('setValues', this.updateDrawerFieldsValueCount);
394
- this.form.on('setValue', this.updateDrawerFieldsValueCount);
395
- }
396
322
  }
397
- }, {
398
- key: "componentWillUnmount",
399
- value: function componentWillUnmount() {
400
- window.removeEventListener('resize', this.onWindowResize);
401
- this.form.off('setValues', this.updateDrawerFieldsValueCount);
402
- this.form.off('setValue', this.updateDrawerFieldsValueCount);
403
- this.form.off('search', this.search);
323
+
324
+ componentWillUnmount() {
325
+ window.removeEventListener('resize', this.onWindowResize);
326
+ this.form.off('setValues', this.updateDrawerFieldsValueCount);
327
+ this.form.off('setValue', this.updateDrawerFieldsValueCount);
328
+ this.form.off('search', this.search);
404
329
  }
405
- }]);
330
+ };
406
331
 
407
- return QueryForm;
408
- }(_react["default"].PureComponent);
332
+ QueryForm.Field = Field;
333
+ QueryForm.useForm = useForm;
334
+ QueryForm.createForm = createActions;
409
335
 
410
- ;
411
- QueryForm.Field = _Field["default"];
412
- QueryForm.useForm = _useForm["default"];
413
- QueryForm.createForm = _createActions["default"];
414
- var _default = QueryForm;
415
- exports["default"] = _default;
336
+ export default QueryForm;