@hw-component/table 1.9.37 → 1.9.39
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/.eslintcache +1 -1
- package/es/HTableHeader/hooks/config.d.ts +37 -0
- package/es/HTableHeader/hooks/config.js +46 -0
- package/es/HTableHeader/hooks/useHeaderDefaultProps.d.ts +10 -0
- package/es/HTableHeader/hooks/useHeaderDefaultProps.js +37 -0
- package/es/HTableHeader/hooks/useHideMoreTitle.d.ts +4 -0
- package/es/HTableHeader/{hooks.js → hooks/useHideMoreTitle.js} +56 -81
- package/es/HTableHeader/index.d.ts +1 -1
- package/es/HTableHeader/index.js +14 -22
- package/es/render/Text.d.ts +0 -1
- package/lib/HTableHeader/hooks/config.d.ts +37 -0
- package/lib/HTableHeader/hooks/config.js +48 -0
- package/lib/HTableHeader/hooks/useHeaderDefaultProps.d.ts +10 -0
- package/lib/HTableHeader/hooks/useHeaderDefaultProps.js +40 -0
- package/lib/HTableHeader/hooks/useHideMoreTitle.d.ts +4 -0
- package/lib/HTableHeader/{hooks.js → hooks/useHideMoreTitle.js} +58 -81
- package/lib/HTableHeader/index.d.ts +1 -1
- package/lib/HTableHeader/index.js +15 -23
- package/lib/render/Text.d.ts +0 -1
- package/package.json +1 -1
- package/src/components/HTableHeader/hooks/config.tsx +42 -0
- package/src/components/HTableHeader/hooks/useHeaderDefaultProps.ts +29 -0
- package/src/components/HTableHeader/hooks/useHideMoreTitle.tsx +174 -0
- package/src/components/HTableHeader/index.tsx +11 -36
- package/src/components/modal.ts +0 -1
- package/src/pages/DwTable/index.tsx +8 -1
- package/src/pages/Table/index.tsx +2 -4
- package/es/HTableHeader/hooks.d.ts +0 -3
- package/lib/HTableHeader/hooks.d.ts +0 -3
- package/src/components/HTableHeader/hooks.tsx +0 -196
|
@@ -1,5 +1,13 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var _Object$getOwnPropertySymbols = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols');
|
|
6
|
+
var _filterInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/filter');
|
|
7
|
+
var _Object$getOwnPropertyDescriptor = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor');
|
|
8
|
+
var _Object$getOwnPropertyDescriptors = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors');
|
|
9
|
+
var _Object$defineProperties = require('@babel/runtime-corejs3/core-js-stable/object/define-properties');
|
|
10
|
+
var _Object$defineProperty = require('@babel/runtime-corejs3/core-js-stable/object/define-property');
|
|
3
11
|
var _toConsumableArray = require('@babel/runtime-corejs3/helpers/toConsumableArray');
|
|
4
12
|
var _slicedToArray = require('@babel/runtime-corejs3/helpers/slicedToArray');
|
|
5
13
|
var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
|
|
@@ -10,79 +18,15 @@ var _forEachInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/in
|
|
|
10
18
|
var _sliceInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/slice');
|
|
11
19
|
var _mapInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/map');
|
|
12
20
|
var _concatInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/concat');
|
|
13
|
-
var _Object$getOwnPropertySymbols = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols');
|
|
14
|
-
var _filterInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/filter');
|
|
15
|
-
var _Object$getOwnPropertyDescriptor = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor');
|
|
16
|
-
var _Object$getOwnPropertyDescriptors = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors');
|
|
17
|
-
var _Object$defineProperties = require('@babel/runtime-corejs3/core-js-stable/object/define-properties');
|
|
18
|
-
var _Object$defineProperty = require('@babel/runtime-corejs3/core-js-stable/object/define-property');
|
|
19
|
-
var jsxRuntime = require('react/jsx-runtime');
|
|
20
21
|
var React = require('react');
|
|
21
|
-
var
|
|
22
|
-
var
|
|
23
|
-
var
|
|
24
|
-
var defaultFormRender = require('
|
|
22
|
+
var config = require('./config.js');
|
|
23
|
+
var context = require('../../context.js');
|
|
24
|
+
var index = require('../../hooks/index.js');
|
|
25
|
+
var defaultFormRender = require('../defaultFormRender.js');
|
|
25
26
|
|
|
26
27
|
var _excluded = ["searchType", "title", "name", "dataIndex", "itemProps", "searchRender", "childrenDataIndex", "showSearch", "hideInTable", "align", "searchLabel", "titleStr"];
|
|
27
28
|
function ownKeys(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
28
29
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context3, _context4; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context3 = ownKeys(Object(t), !0)).call(_context3, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context4 = ownKeys(Object(t))).call(_context4, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
29
|
-
var sizeObj = {
|
|
30
|
-
xl: {
|
|
31
|
-
min: 1200,
|
|
32
|
-
max: 1600
|
|
33
|
-
},
|
|
34
|
-
xxl: {
|
|
35
|
-
min: 1600
|
|
36
|
-
},
|
|
37
|
-
lg: {
|
|
38
|
-
min: 992,
|
|
39
|
-
max: 1200
|
|
40
|
-
},
|
|
41
|
-
md: {
|
|
42
|
-
min: 768,
|
|
43
|
-
max: 992
|
|
44
|
-
},
|
|
45
|
-
sm: {
|
|
46
|
-
min: 576,
|
|
47
|
-
max: 768
|
|
48
|
-
},
|
|
49
|
-
xs: {
|
|
50
|
-
max: 576
|
|
51
|
-
}
|
|
52
|
-
};
|
|
53
|
-
var defaultSubItem = {
|
|
54
|
-
type: "submit",
|
|
55
|
-
itemProps: {
|
|
56
|
-
position: "end"
|
|
57
|
-
},
|
|
58
|
-
style: {
|
|
59
|
-
padding: 0,
|
|
60
|
-
marginLeft: -20
|
|
61
|
-
},
|
|
62
|
-
render: function render(item, node, form) {
|
|
63
|
-
return jsxRuntime.jsx(defaultSubComponent.DefaultSubComponent, {
|
|
64
|
-
form: form
|
|
65
|
-
});
|
|
66
|
-
}
|
|
67
|
-
};
|
|
68
|
-
var getCuSpanMaxNum = function getCuSpanMaxNum() {
|
|
69
|
-
var searchSpan = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {
|
|
70
|
-
span: 6
|
|
71
|
-
};
|
|
72
|
-
var clientWidth = document.documentElement.clientWidth;
|
|
73
|
-
var keys = _Object$keys(sizeObj);
|
|
74
|
-
var index = _findIndexInstanceProperty(keys).call(keys, function (value) {
|
|
75
|
-
var _sizeObj$value = sizeObj[value],
|
|
76
|
-
_sizeObj$value$min = _sizeObj$value.min,
|
|
77
|
-
min = _sizeObj$value$min === void 0 ? 0 : _sizeObj$value$min,
|
|
78
|
-
_sizeObj$value$max = _sizeObj$value.max,
|
|
79
|
-
max = _sizeObj$value$max === void 0 ? Number.MAX_VALUE : _sizeObj$value$max;
|
|
80
|
-
return clientWidth >= min && clientWidth < max;
|
|
81
|
-
});
|
|
82
|
-
var cuKey = keys[index];
|
|
83
|
-
var cuSpan = searchSpan[cuKey] || searchSpan.span;
|
|
84
|
-
return 24 / cuSpan;
|
|
85
|
-
};
|
|
86
30
|
var formConfigDataItemProvider = function formConfigDataItemProvider(_ref, table) {
|
|
87
31
|
var searchType = _ref.searchType,
|
|
88
32
|
title = _ref.title,
|
|
@@ -116,6 +60,24 @@ var formConfigDataItemProvider = function formConfigDataItemProvider(_ref, table
|
|
|
116
60
|
}
|
|
117
61
|
});
|
|
118
62
|
};
|
|
63
|
+
var getCuSpanMaxNum = function getCuSpanMaxNum() {
|
|
64
|
+
var searchSpan = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {
|
|
65
|
+
span: 6
|
|
66
|
+
};
|
|
67
|
+
var clientWidth = document.documentElement.clientWidth;
|
|
68
|
+
var keys = _Object$keys(config.sizeObj);
|
|
69
|
+
var index = _findIndexInstanceProperty(keys).call(keys, function (value) {
|
|
70
|
+
var _sizeObj$value = config.sizeObj[value],
|
|
71
|
+
_sizeObj$value$min = _sizeObj$value.min,
|
|
72
|
+
min = _sizeObj$value$min === void 0 ? 0 : _sizeObj$value$min,
|
|
73
|
+
_sizeObj$value$max = _sizeObj$value.max,
|
|
74
|
+
max = _sizeObj$value$max === void 0 ? Number.MAX_VALUE : _sizeObj$value$max;
|
|
75
|
+
return clientWidth >= min && clientWidth < max;
|
|
76
|
+
});
|
|
77
|
+
var cuKey = keys[index];
|
|
78
|
+
var cuSpan = searchSpan[cuKey] || searchSpan.span;
|
|
79
|
+
return 24 / cuSpan;
|
|
80
|
+
};
|
|
119
81
|
var mkNewConfig = function mkNewConfig(_ref2) {
|
|
120
82
|
var _ref2$configData = _ref2.configData,
|
|
121
83
|
configData = _ref2$configData === void 0 ? [] : _ref2$configData,
|
|
@@ -162,22 +124,37 @@ var filterHideFormItem = function filterHideFormItem(configData, className, sear
|
|
|
162
124
|
hideData: hideData
|
|
163
125
|
};
|
|
164
126
|
};
|
|
165
|
-
var
|
|
127
|
+
var useDefaultOpen = function useDefaultOpen() {
|
|
128
|
+
var _useState = React.useState(false),
|
|
129
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
130
|
+
open = _useState2[0],
|
|
131
|
+
setOpen = _useState2[1];
|
|
132
|
+
var _useHTableContext = context.useHTableContext(),
|
|
133
|
+
_useHTableContext$hea = _useHTableContext.headerOpen,
|
|
134
|
+
headerOpen = _useHTableContext$hea === void 0 ? open : _useHTableContext$hea,
|
|
135
|
+
_useHTableContext$set = _useHTableContext.setHeaderOpen,
|
|
136
|
+
setHeaderOpen = _useHTableContext$set === void 0 ? setOpen : _useHTableContext$set;
|
|
137
|
+
return {
|
|
138
|
+
headerOpen: headerOpen,
|
|
139
|
+
setHeaderOpen: setHeaderOpen
|
|
140
|
+
};
|
|
141
|
+
};
|
|
142
|
+
var useHideMoreTitle = (function (_ref3) {
|
|
166
143
|
var _context2;
|
|
167
144
|
var searchSpan = _ref3.searchSpan,
|
|
168
145
|
configData = _ref3.configData,
|
|
169
146
|
table = _ref3.table;
|
|
170
|
-
var
|
|
171
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
172
|
-
formConfigData = _useState2[0],
|
|
173
|
-
setFormConfigData = _useState2[1];
|
|
174
|
-
var _useState3 = React.useState(defaultSubItem),
|
|
147
|
+
var _useState3 = React.useState([]),
|
|
175
148
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
var
|
|
179
|
-
|
|
180
|
-
|
|
149
|
+
formConfigData = _useState4[0],
|
|
150
|
+
setFormConfigData = _useState4[1];
|
|
151
|
+
var _useState5 = React.useState(config.defaultSubItem),
|
|
152
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
153
|
+
subData = _useState6[0],
|
|
154
|
+
setSubData = _useState6[1];
|
|
155
|
+
var _useDefaultOpen = useDefaultOpen(),
|
|
156
|
+
headerOpen = _useDefaultOpen.headerOpen,
|
|
157
|
+
setHeaderOpen = _useDefaultOpen.setHeaderOpen;
|
|
181
158
|
var className = index.useClassName("hw-table-header-item-hide");
|
|
182
159
|
var mkNewFn = function mkNewFn() {
|
|
183
160
|
var _context;
|
|
@@ -216,7 +193,7 @@ var useHideMoreTitle = function useHideMoreTitle(_ref3) {
|
|
|
216
193
|
};
|
|
217
194
|
}, [configData, searchSpan, headerOpen]);
|
|
218
195
|
return _concatInstanceProperty(_context2 = []).call(_context2, _toConsumableArray(formConfigData), [subData]);
|
|
219
|
-
};
|
|
196
|
+
});
|
|
220
197
|
|
|
221
|
-
exports.
|
|
198
|
+
exports.default = useHideMoreTitle;
|
|
222
199
|
// powered by h
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import type { IHeaderProps } from "./modal";
|
|
3
|
-
declare const _default: ({
|
|
3
|
+
declare const _default: ({ searchSpan, headerStyle, initValues, onReset, ...props }: IHeaderProps) => JSX.Element;
|
|
4
4
|
export default _default;
|
|
@@ -2,15 +2,17 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
+
var _objectWithoutProperties = require('@babel/runtime-corejs3/helpers/objectWithoutProperties');
|
|
5
6
|
var jsxRuntime = require('react/jsx-runtime');
|
|
6
7
|
var antd = require('antd');
|
|
7
|
-
var context = require('../context.js');
|
|
8
8
|
var form = require('@hw-component/form');
|
|
9
9
|
var index = require('../hooks/index.js');
|
|
10
|
-
var
|
|
10
|
+
var useHeaderDefaultProps = require('./hooks/useHeaderDefaultProps.js');
|
|
11
11
|
var Context = require('./Context.js');
|
|
12
12
|
var TableConfig = require('../TableConfig.js');
|
|
13
|
+
var useHideMoreTitle = require('./hooks/useHideMoreTitle.js');
|
|
13
14
|
|
|
15
|
+
var _excluded = ["searchSpan", "headerStyle", "initValues", "onReset"];
|
|
14
16
|
var defaultSearchSpan = {
|
|
15
17
|
xxl: 4,
|
|
16
18
|
xl: 6,
|
|
@@ -19,35 +21,25 @@ var defaultSearchSpan = {
|
|
|
19
21
|
sm: 24
|
|
20
22
|
};
|
|
21
23
|
var Header = (function (_ref) {
|
|
22
|
-
var
|
|
23
|
-
onFinish = _ref.onFinish,
|
|
24
|
-
_ref$searchSpan = _ref.searchSpan,
|
|
24
|
+
var _ref$searchSpan = _ref.searchSpan,
|
|
25
25
|
searchSpan = _ref$searchSpan === void 0 ? defaultSearchSpan : _ref$searchSpan,
|
|
26
26
|
headerStyle = _ref.headerStyle,
|
|
27
27
|
initValues = _ref.initValues,
|
|
28
|
-
hideLabel = _ref.hideLabel,
|
|
29
|
-
labelWidth = _ref.labelWidth,
|
|
30
28
|
onReset = _ref.onReset,
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
contextLabelWidth = _useHTableContext.labelWidth;
|
|
40
|
-
var tableInstance = table || contextTableInstance;
|
|
41
|
-
var headerConfigData = configData || contextConfigData;
|
|
29
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
30
|
+
var _useHeaderDefaultProp = useHeaderDefaultProps.default(props),
|
|
31
|
+
tableLabelWidth = _useHeaderDefaultProp.tableLabelWidth,
|
|
32
|
+
tableInstance = _useHeaderDefaultProp.tableInstance,
|
|
33
|
+
subOnFinish = _useHeaderDefaultProp.subOnFinish,
|
|
34
|
+
submitLoading = _useHeaderDefaultProp.submitLoading,
|
|
35
|
+
tableHideLabel = _useHeaderDefaultProp.tableHideLabel,
|
|
36
|
+
headerConfigData = _useHeaderDefaultProp.headerConfigData;
|
|
42
37
|
var form$1 = tableInstance.form;
|
|
43
|
-
var
|
|
44
|
-
var nConfigData = hooks.useHideMoreTitle({
|
|
38
|
+
var nConfigData = useHideMoreTitle.default({
|
|
45
39
|
searchSpan: searchSpan,
|
|
46
40
|
configData: headerConfigData,
|
|
47
41
|
table: tableInstance
|
|
48
42
|
});
|
|
49
|
-
var tableHideLabel = typeof hideLabel === "undefined" ? contextHideLabel : hideLabel;
|
|
50
|
-
var tableLabelWidth = labelWidth || contextLabelWidth;
|
|
51
43
|
var className = index.useClassName("hw-table-header");
|
|
52
44
|
var _useHTableConfigConte = TableConfig.useHTableConfigContext({
|
|
53
45
|
headerStyle: headerStyle
|
|
@@ -67,7 +59,7 @@ var Header = (function (_ref) {
|
|
|
67
59
|
children: jsxRuntime.jsx(form.HForm, {
|
|
68
60
|
itemSpan: searchSpan,
|
|
69
61
|
onFinish: subOnFinish,
|
|
70
|
-
submitLoading:
|
|
62
|
+
submitLoading: submitLoading,
|
|
71
63
|
dismissOnPressEnter: false,
|
|
72
64
|
gutter: [20, 0],
|
|
73
65
|
initialValues: initValues,
|
package/lib/render/Text.d.ts
CHANGED
package/package.json
CHANGED
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import {HFormInstance, HItemProps} from "@hw-component/form/es/Form/modal";
|
|
2
|
+
import React from "react";
|
|
3
|
+
import {DefaultSubComponent} from "../defaultSubComponent";
|
|
4
|
+
|
|
5
|
+
export const sizeObj = {
|
|
6
|
+
xl: {
|
|
7
|
+
min: 1200,
|
|
8
|
+
max: 1600,
|
|
9
|
+
},
|
|
10
|
+
xxl: {
|
|
11
|
+
min: 1600,
|
|
12
|
+
},
|
|
13
|
+
lg: {
|
|
14
|
+
min: 992,
|
|
15
|
+
max: 1200,
|
|
16
|
+
},
|
|
17
|
+
md: {
|
|
18
|
+
min: 768,
|
|
19
|
+
max: 992,
|
|
20
|
+
},
|
|
21
|
+
sm: {
|
|
22
|
+
min: 576,
|
|
23
|
+
max: 768,
|
|
24
|
+
},
|
|
25
|
+
xs: {
|
|
26
|
+
max: 576,
|
|
27
|
+
},
|
|
28
|
+
};
|
|
29
|
+
|
|
30
|
+
export const defaultSubItem = {
|
|
31
|
+
type: "submit",
|
|
32
|
+
itemProps: {
|
|
33
|
+
position: "end",
|
|
34
|
+
},
|
|
35
|
+
style: {
|
|
36
|
+
padding: 0,
|
|
37
|
+
marginLeft: -20,
|
|
38
|
+
},
|
|
39
|
+
render: (item: HItemProps, node: React.ReactNode, form: HFormInstance) => {
|
|
40
|
+
return <DefaultSubComponent form={form} />;
|
|
41
|
+
},
|
|
42
|
+
};
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import type { IHeaderProps } from "../modal";
|
|
2
|
+
import { useHTableContext } from "../../context";
|
|
3
|
+
import useHTable from "../../hooks/useHTable";
|
|
4
|
+
|
|
5
|
+
export default ({configData,loading,onFinish,hideLabel,labelWidth,table}:IHeaderProps)=>{
|
|
6
|
+
const {
|
|
7
|
+
tableInstance: contextTableInstance,
|
|
8
|
+
loading: contextLoading,
|
|
9
|
+
onFinish: contextOnFinish,
|
|
10
|
+
configData: contextConfigData,
|
|
11
|
+
hideLabel: contextHideLabel,
|
|
12
|
+
labelWidth: contextLabelWidth,
|
|
13
|
+
} = useHTableContext();
|
|
14
|
+
const defaultTable=useHTable();
|
|
15
|
+
const headerConfigData = configData || contextConfigData;
|
|
16
|
+
const submitLoading=contextLoading || loading;
|
|
17
|
+
const subOnFinish = onFinish || contextOnFinish;
|
|
18
|
+
const tableHideLabel = typeof hideLabel === "undefined" ? contextHideLabel : hideLabel;
|
|
19
|
+
const tableLabelWidth = labelWidth || contextLabelWidth;
|
|
20
|
+
const tableInstance = table || contextTableInstance;
|
|
21
|
+
return {
|
|
22
|
+
tableInstance:tableInstance||defaultTable,
|
|
23
|
+
tableLabelWidth,
|
|
24
|
+
tableHideLabel,
|
|
25
|
+
subOnFinish,
|
|
26
|
+
submitLoading,
|
|
27
|
+
headerConfigData
|
|
28
|
+
}
|
|
29
|
+
}
|
|
@@ -0,0 +1,174 @@
|
|
|
1
|
+
import {FormConfigDataItemProviderModal, IHeaderProps} from "../modal";
|
|
2
|
+
import {useEffect, useState} from "react";
|
|
3
|
+
import {HItemProps} from "@hw-component/form/es/Form/modal";
|
|
4
|
+
import {defaultSubItem, sizeObj} from "./config";
|
|
5
|
+
import {useHTableContext} from "../../context";
|
|
6
|
+
import {useClassName} from "../../hooks";
|
|
7
|
+
import {HTableInstance} from "../../modal";
|
|
8
|
+
import {ColProps} from "antd";
|
|
9
|
+
import {renderData} from "../defaultFormRender";
|
|
10
|
+
|
|
11
|
+
const formConfigDataItemProvider = (
|
|
12
|
+
{
|
|
13
|
+
searchType,
|
|
14
|
+
title,
|
|
15
|
+
name,
|
|
16
|
+
dataIndex,
|
|
17
|
+
itemProps = {},
|
|
18
|
+
searchRender,
|
|
19
|
+
childrenDataIndex,
|
|
20
|
+
showSearch,
|
|
21
|
+
hideInTable,
|
|
22
|
+
align,
|
|
23
|
+
searchLabel,
|
|
24
|
+
titleStr,
|
|
25
|
+
...props
|
|
26
|
+
}: FormConfigDataItemProviderModal,
|
|
27
|
+
table: HTableInstance
|
|
28
|
+
): HItemProps => {
|
|
29
|
+
const { allowClear = true } = itemProps as any;
|
|
30
|
+
|
|
31
|
+
return {
|
|
32
|
+
...props,
|
|
33
|
+
itemProps: {
|
|
34
|
+
...itemProps,
|
|
35
|
+
allowClear,
|
|
36
|
+
},
|
|
37
|
+
label: searchLabel || titleStr || title,
|
|
38
|
+
type: searchType,
|
|
39
|
+
name: name || (dataIndex as string),
|
|
40
|
+
render: (item, node, form) => {
|
|
41
|
+
if (searchRender) {
|
|
42
|
+
return searchRender(item, node, form, table);
|
|
43
|
+
}
|
|
44
|
+
const defaultRender = renderData[searchType || ""];
|
|
45
|
+
|
|
46
|
+
return defaultRender ? defaultRender(item) : node;
|
|
47
|
+
},
|
|
48
|
+
};
|
|
49
|
+
};
|
|
50
|
+
|
|
51
|
+
const getCuSpanMaxNum = (searchSpan: ColProps = { span: 6 }) => {
|
|
52
|
+
const clientWidth = document.documentElement.clientWidth;
|
|
53
|
+
const keys = Object.keys(sizeObj);
|
|
54
|
+
const index = keys.findIndex((value) => {
|
|
55
|
+
const { min = 0, max = Number.MAX_VALUE } = sizeObj[value];
|
|
56
|
+
return clientWidth >= min && clientWidth < max;
|
|
57
|
+
});
|
|
58
|
+
const cuKey = keys[index];
|
|
59
|
+
const cuSpan = searchSpan[cuKey] || searchSpan.span;
|
|
60
|
+
return 24 / cuSpan;
|
|
61
|
+
};
|
|
62
|
+
|
|
63
|
+
|
|
64
|
+
const mkNewConfig = ({ configData = [], table }: IHeaderProps) => {
|
|
65
|
+
let subConfigData: HItemProps | undefined;
|
|
66
|
+
const realConfigData: HItemProps[] = [];
|
|
67
|
+
configData.forEach((value) => {
|
|
68
|
+
const { searchType, showSearch } = value;
|
|
69
|
+
if (!showSearch) {
|
|
70
|
+
return false;
|
|
71
|
+
}
|
|
72
|
+
if (searchType === "submit") {
|
|
73
|
+
subConfigData = formConfigDataItemProvider(
|
|
74
|
+
value,
|
|
75
|
+
table as HTableInstance
|
|
76
|
+
);
|
|
77
|
+
return false;
|
|
78
|
+
}
|
|
79
|
+
realConfigData.push(
|
|
80
|
+
formConfigDataItemProvider(value, table as HTableInstance)
|
|
81
|
+
);
|
|
82
|
+
});
|
|
83
|
+
return {
|
|
84
|
+
realConfigData,
|
|
85
|
+
subConfigData,
|
|
86
|
+
};
|
|
87
|
+
};
|
|
88
|
+
|
|
89
|
+
const filterHideFormItem = (
|
|
90
|
+
configData: HItemProps[],
|
|
91
|
+
className: string,
|
|
92
|
+
searchSpan?: ColProps
|
|
93
|
+
) => {
|
|
94
|
+
const maxNum = getCuSpanMaxNum(searchSpan);
|
|
95
|
+
const len = configData.length;
|
|
96
|
+
const startIndex = maxNum - 1;
|
|
97
|
+
if (len <= startIndex) {
|
|
98
|
+
return {
|
|
99
|
+
lessData: configData,
|
|
100
|
+
hideData: [],
|
|
101
|
+
};
|
|
102
|
+
}
|
|
103
|
+
const index = startIndex === 0 ? 1 : startIndex;
|
|
104
|
+
const lessData = configData.slice(0, index);
|
|
105
|
+
const bigData = configData.slice(index);
|
|
106
|
+
const hideData = bigData.map((value) => {
|
|
107
|
+
return {
|
|
108
|
+
...value,
|
|
109
|
+
className,
|
|
110
|
+
};
|
|
111
|
+
});
|
|
112
|
+
return {
|
|
113
|
+
lessData,
|
|
114
|
+
hideData,
|
|
115
|
+
};
|
|
116
|
+
};
|
|
117
|
+
|
|
118
|
+
const useDefaultOpen=()=>{
|
|
119
|
+
const [open,setOpen]=useState(false);
|
|
120
|
+
const { headerOpen=open, setHeaderOpen=setOpen } = useHTableContext();
|
|
121
|
+
|
|
122
|
+
return {
|
|
123
|
+
headerOpen,
|
|
124
|
+
setHeaderOpen
|
|
125
|
+
}
|
|
126
|
+
}
|
|
127
|
+
export default ({
|
|
128
|
+
searchSpan,
|
|
129
|
+
configData,
|
|
130
|
+
table,
|
|
131
|
+
}: IHeaderProps) => {
|
|
132
|
+
|
|
133
|
+
const [formConfigData, setFormConfigData] = useState<HItemProps[]>([]);
|
|
134
|
+
const [subData, setSubData] = useState<HItemProps>(defaultSubItem as any);
|
|
135
|
+
|
|
136
|
+
const { headerOpen, setHeaderOpen } = useDefaultOpen();
|
|
137
|
+
const className = useClassName("hw-table-header-item-hide");
|
|
138
|
+
const mkNewFn = () => {
|
|
139
|
+
const { realConfigData, subConfigData } = mkNewConfig({
|
|
140
|
+
searchSpan,
|
|
141
|
+
configData,
|
|
142
|
+
table,
|
|
143
|
+
});
|
|
144
|
+
const changeClassName = headerOpen ? "" : className;
|
|
145
|
+
const { lessData, hideData } = filterHideFormItem(
|
|
146
|
+
realConfigData,
|
|
147
|
+
changeClassName,
|
|
148
|
+
searchSpan
|
|
149
|
+
);
|
|
150
|
+
if (subConfigData) {
|
|
151
|
+
setSubData(subConfigData);
|
|
152
|
+
}
|
|
153
|
+
setHeaderOpen((oldVal) => {
|
|
154
|
+
if (hideData.length === 0) {
|
|
155
|
+
return undefined;
|
|
156
|
+
}
|
|
157
|
+
if (typeof oldVal === "undefined") {
|
|
158
|
+
return false;
|
|
159
|
+
}
|
|
160
|
+
return oldVal;
|
|
161
|
+
});
|
|
162
|
+
setFormConfigData([...lessData, ...hideData]);
|
|
163
|
+
};
|
|
164
|
+
useEffect(() => {
|
|
165
|
+
mkNewFn();
|
|
166
|
+
}, [configData, searchSpan, headerOpen]);
|
|
167
|
+
useEffect(() => {
|
|
168
|
+
window.addEventListener("resize", mkNewFn);
|
|
169
|
+
return () => {
|
|
170
|
+
window.removeEventListener("resize", mkNewFn);
|
|
171
|
+
};
|
|
172
|
+
}, [configData, searchSpan, headerOpen]);
|
|
173
|
+
return [...formConfigData, subData];
|
|
174
|
+
};
|
|
@@ -1,12 +1,13 @@
|
|
|
1
1
|
import { Card } from "antd";
|
|
2
|
-
import { useHTableContext } from "../context";
|
|
3
2
|
import { HForm } from "@hw-component/form";
|
|
4
3
|
import React from "react";
|
|
5
4
|
import { useClassName } from "../hooks";
|
|
6
5
|
import type { IHeaderProps } from "./modal";
|
|
7
|
-
import
|
|
6
|
+
import useHeaderDefaultProps from "./hooks/useHeaderDefaultProps";
|
|
8
7
|
import { HeaderProvider } from "./Context";
|
|
9
8
|
import { useHTableConfigContext } from "../TableConfig";
|
|
9
|
+
import useHideMoreTitle from './hooks/useHideMoreTitle'
|
|
10
|
+
|
|
10
11
|
|
|
11
12
|
const defaultSearchSpan = {
|
|
12
13
|
xxl: 4,
|
|
@@ -16,41 +17,17 @@ const defaultSearchSpan = {
|
|
|
16
17
|
sm: 24,
|
|
17
18
|
};
|
|
18
19
|
export default ({
|
|
19
|
-
configData,
|
|
20
|
-
onFinish,
|
|
21
20
|
searchSpan = defaultSearchSpan,
|
|
22
21
|
headerStyle,
|
|
23
22
|
initValues,
|
|
24
|
-
hideLabel,
|
|
25
|
-
labelWidth,
|
|
26
23
|
onReset,
|
|
27
|
-
|
|
28
|
-
loading,
|
|
24
|
+
...props
|
|
29
25
|
}: IHeaderProps) => {
|
|
30
|
-
const {
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
onFinish: contextOnFinish,
|
|
34
|
-
configData: contextConfigData,
|
|
35
|
-
hideLabel: contextHideLabel,
|
|
36
|
-
labelWidth: contextLabelWidth,
|
|
37
|
-
} = useHTableContext();
|
|
38
|
-
const tableInstance = table || contextTableInstance;
|
|
39
|
-
const headerConfigData = configData || contextConfigData;
|
|
40
|
-
const { form } = tableInstance;
|
|
41
|
-
const subOnFinish = onFinish || contextOnFinish;
|
|
42
|
-
const nConfigData = useHideMoreTitle({
|
|
43
|
-
searchSpan,
|
|
44
|
-
configData: headerConfigData,
|
|
45
|
-
table: tableInstance,
|
|
46
|
-
});
|
|
47
|
-
const tableHideLabel =
|
|
48
|
-
typeof hideLabel === "undefined" ? contextHideLabel : hideLabel;
|
|
49
|
-
const tableLabelWidth = labelWidth || contextLabelWidth;
|
|
26
|
+
const {tableLabelWidth,tableInstance,subOnFinish,submitLoading,tableHideLabel,headerConfigData}=useHeaderDefaultProps(props);
|
|
27
|
+
const {form}=tableInstance;
|
|
28
|
+
const nConfigData = useHideMoreTitle({searchSpan, configData: headerConfigData, table: tableInstance});
|
|
50
29
|
const className = useClassName("hw-table-header");
|
|
51
|
-
const { headerStyle: defaultHeaderStyle } = useHTableConfigContext({
|
|
52
|
-
headerStyle,
|
|
53
|
-
});
|
|
30
|
+
const { headerStyle: defaultHeaderStyle } = useHTableConfigContext({headerStyle});
|
|
54
31
|
return (
|
|
55
32
|
<Card
|
|
56
33
|
style={defaultHeaderStyle}
|
|
@@ -62,16 +39,14 @@ export default ({
|
|
|
62
39
|
<HForm
|
|
63
40
|
itemSpan={searchSpan}
|
|
64
41
|
onFinish={subOnFinish}
|
|
65
|
-
submitLoading={
|
|
42
|
+
submitLoading={submitLoading}
|
|
66
43
|
dismissOnPressEnter={false}
|
|
67
44
|
gutter={[20, 0]}
|
|
68
45
|
initialValues={initValues}
|
|
69
|
-
hideLabel={
|
|
70
|
-
typeof tableHideLabel === "undefined" ? true : tableHideLabel
|
|
71
|
-
}
|
|
46
|
+
hideLabel={typeof tableHideLabel === "undefined" ? true : tableHideLabel}
|
|
72
47
|
configData={nConfigData}
|
|
73
48
|
form={form}
|
|
74
|
-
colon
|
|
49
|
+
colon
|
|
75
50
|
labelWidth={tableLabelWidth}
|
|
76
51
|
/>
|
|
77
52
|
</HeaderProvider>
|
package/src/components/modal.ts
CHANGED
|
@@ -10,7 +10,6 @@ import type { ModalProps } from "antd";
|
|
|
10
10
|
import type { TableProps } from "antd/lib/table";
|
|
11
11
|
import type { AffixProps } from "antd/lib/affix";
|
|
12
12
|
import type { OptionModal } from "./HTableBody";
|
|
13
|
-
import { GetRowKey } from "rc-table/lib/interface";
|
|
14
13
|
import type { DrawerProps } from "antd";
|
|
15
14
|
import type { IPaginationProps } from "@/components/HTablePagination";
|
|
16
15
|
|
|
@@ -2,7 +2,7 @@ import {
|
|
|
2
2
|
HTable,
|
|
3
3
|
useHTable,
|
|
4
4
|
HTableConfig,
|
|
5
|
-
HTableHeaderSubBtn,
|
|
5
|
+
HTableHeaderSubBtn, HTableHeader,
|
|
6
6
|
} from "@/components";
|
|
7
7
|
import { Button, Card, Tooltip, Typography, Tag, Row } from "antd";
|
|
8
8
|
import { HFormConfigProvider } from "@hw-component/form";
|
|
@@ -158,6 +158,7 @@ export default () => {
|
|
|
158
158
|
return (
|
|
159
159
|
<HFormConfigProvider>
|
|
160
160
|
<div>
|
|
161
|
+
<HTableHeader configData={[]}/>
|
|
161
162
|
<div
|
|
162
163
|
onClick={() => {
|
|
163
164
|
console.log(hTable.table.getTableSourceData());
|
|
@@ -173,9 +174,6 @@ export default () => {
|
|
|
173
174
|
/>
|
|
174
175
|
<HTable
|
|
175
176
|
configData={configData}
|
|
176
|
-
searchSpan={{
|
|
177
|
-
span: 24,
|
|
178
|
-
}}
|
|
179
177
|
rowKey={(rowData, index) => {
|
|
180
178
|
return index;
|
|
181
179
|
}}
|