@hsu-react/ui 0.0.9 → 0.0.11
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/README.md +2 -2
- package/es/components/FormItem/ItemContainer/index.d.ts +2 -0
- package/es/components/FormItem/ItemContainer/index.js +4 -15
- package/es/components/Search/{_components → SearchAdvanced/_components}/AdvancedFiltersDrawer/index.d.ts +3 -3
- package/es/components/Search/{_components → SearchAdvanced/_components}/AdvancedFiltersDrawer/index.js +3 -3
- package/es/components/Search/SearchAdvanced/index.js +26 -148
- package/es/components/Search/SearchCard/index.js +1 -1
- package/es/components/Search/{_components → SearchCollapsible/_components}/CollapseToggle/index.js +2 -2
- package/es/components/Search/SearchCollapsible/index.js +17 -138
- package/es/components/Search/SearchWithFilter/index.js +4 -143
- package/es/components/Search/SearchWithMore/index.js +11 -142
- package/es/components/Search/_components/FilterDropdown/index.js +5 -6
- package/es/components/Search/_components/SearchBase/index.d.ts +32 -0
- package/es/components/Search/_components/SearchBase/index.js +185 -0
- package/es/components/Search/_hooks/useSearchCommon.js +5 -11
- package/es/components/Search/_hooks/useSearchExpand.js +4 -13
- package/es/components/Search/_utils/calculateButtonGroupAndColumnWidth.js +3 -10
- package/es/components/Search/_utils/calculateVisibleItems.js +4 -5
- package/es/components/Search/_utils/index.d.ts +2 -0
- package/es/components/Search/_utils/index.js +3 -1
- package/es/components/Search/_utils/measureButtonGroupWidth.d.ts +6 -0
- package/es/components/Search/_utils/measureButtonGroupWidth.js +18 -0
- package/es/components/Search/_utils/shouldDisplayExtraItem.d.ts +11 -0
- package/es/components/Search/_utils/shouldDisplayExtraItem.js +13 -0
- package/es/components/Search/index.d.ts +4 -0
- package/es/components/Search/index.js +6 -133
- package/es/components/Table/_hooks/useEllipsisTooltip.js +4 -2
- package/es/components/Table/_hooks/useTableColumns.d.ts +1 -0
- package/es/components/Table/_hooks/useTableColumns.js +35 -2
- package/es/components/Table/index.js +2 -1
- package/es/components/TextEllipsis/index.js +32 -14
- package/lib/components/FormItem/ItemContainer/index.d.ts +2 -0
- package/lib/components/FormItem/ItemContainer/index.js +2 -5
- package/lib/components/Search/{_components → SearchAdvanced/_components}/AdvancedFiltersDrawer/index.d.ts +3 -3
- package/lib/components/Search/{_components → SearchAdvanced/_components}/AdvancedFiltersDrawer/index.js +3 -3
- package/lib/components/Search/SearchAdvanced/index.js +19 -134
- package/lib/components/Search/SearchCard/index.js +1 -1
- package/lib/components/Search/{_components → SearchCollapsible/_components}/CollapseToggle/index.js +2 -2
- package/lib/components/Search/SearchCollapsible/index.js +12 -124
- package/lib/components/Search/SearchWithFilter/index.js +5 -129
- package/lib/components/Search/SearchWithMore/index.js +7 -126
- package/lib/components/Search/_components/FilterDropdown/index.js +5 -6
- package/lib/components/Search/_components/SearchBase/index.d.ts +32 -0
- package/lib/components/Search/_components/SearchBase/index.js +169 -0
- package/lib/components/Search/_hooks/useSearchCommon.js +4 -6
- package/lib/components/Search/_hooks/useSearchExpand.js +2 -13
- package/lib/components/Search/_utils/calculateButtonGroupAndColumnWidth.js +2 -10
- package/lib/components/Search/_utils/calculateVisibleItems.js +3 -5
- package/lib/components/Search/_utils/index.d.ts +2 -0
- package/lib/components/Search/_utils/index.js +15 -1
- package/lib/components/Search/_utils/measureButtonGroupWidth.d.ts +6 -0
- package/lib/components/Search/_utils/measureButtonGroupWidth.js +24 -0
- package/lib/components/Search/_utils/shouldDisplayExtraItem.d.ts +11 -0
- package/lib/components/Search/_utils/shouldDisplayExtraItem.js +19 -0
- package/lib/components/Search/index.d.ts +4 -0
- package/lib/components/Search/index.js +8 -119
- package/lib/components/Table/_hooks/useEllipsisTooltip.js +3 -1
- package/lib/components/Table/_hooks/useTableColumns.d.ts +1 -0
- package/lib/components/Table/_hooks/useTableColumns.js +31 -2
- package/lib/components/Table/index.js +2 -1
- package/lib/components/TextEllipsis/index.js +27 -14
- package/package.json +1 -1
- package/src/components/FormItem/ItemContainer/index.tsx +4 -7
- package/src/components/Search/{_components → SearchAdvanced/_components}/AdvancedFiltersDrawer/index.tsx +6 -6
- package/src/components/Search/SearchAdvanced/index.tsx +25 -164
- package/src/components/Search/SearchCard/index.tsx +1 -1
- package/src/components/Search/{_components → SearchCollapsible/_components}/CollapseToggle/index.tsx +2 -2
- package/src/components/Search/SearchCollapsible/index.tsx +13 -162
- package/src/components/Search/SearchWithFilter/index.tsx +2 -164
- package/src/components/Search/SearchWithMore/index.tsx +9 -161
- package/src/components/Search/_components/FilterDropdown/index.tsx +5 -6
- package/src/components/Search/_components/SearchBase/index.tsx +224 -0
- package/src/components/Search/_hooks/useSearchCommon.ts +10 -13
- package/src/components/Search/_hooks/useSearchExpand.ts +3 -13
- package/src/components/Search/_utils/calculateButtonGroupAndColumnWidth.ts +2 -10
- package/src/components/Search/_utils/calculateVisibleItems.ts +10 -11
- package/src/components/Search/_utils/index.ts +2 -0
- package/src/components/Search/_utils/measureButtonGroupWidth.ts +23 -0
- package/src/components/Search/_utils/shouldDisplayExtraItem.ts +23 -0
- package/src/components/Search/index.tsx +7 -153
- package/src/components/Table/_hooks/useEllipsisTooltip.ts +2 -4
- package/src/components/Table/_hooks/useTableColumns.tsx +41 -1
- package/src/components/Table/index.md +2 -0
- package/src/components/Table/index.tsx +1 -0
- package/src/components/TextEllipsis/index.md +1 -1
- package/src/components/TextEllipsis/index.tsx +33 -18
- /package/es/components/Search/{_components → SearchCollapsible/_components}/CollapseToggle/index.d.ts +0 -0
- /package/lib/components/Search/{_components → SearchCollapsible/_components}/CollapseToggle/index.d.ts +0 -0
|
@@ -4,25 +4,9 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
|
|
|
4
4
|
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
5
5
|
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
6
6
|
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
7
|
-
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
8
|
-
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."); }
|
|
9
|
-
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); }
|
|
10
|
-
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; }
|
|
11
|
-
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
12
|
-
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
13
7
|
import React from "react";
|
|
14
|
-
import
|
|
15
|
-
import FormItem from "../../FormItem";
|
|
16
|
-
import classNames from "classnames";
|
|
17
|
-
import styles from "../index.module.scss";
|
|
18
|
-
import { useSearchCommon } from "../_hooks";
|
|
19
|
-
import { ButtonGroup } from "../_components/ButtonGroup";
|
|
20
|
-
import { SearchButtons } from "../_components/SearchButtons";
|
|
21
|
-
import { FilterDropdown } from "../_components/FilterDropdown";
|
|
22
|
-
import { ExpandButton } from "../_components/ExpandButton";
|
|
23
|
-
import { createElement as _createElement } from "react";
|
|
8
|
+
import SearchBase from "../_components/SearchBase";
|
|
24
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
25
|
-
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
26
10
|
/**
|
|
27
11
|
* 带筛选器设置的 Search 组件
|
|
28
12
|
* - 提供下拉菜单,允许用户动态选择显示哪些搜索项
|
|
@@ -30,131 +14,8 @@ import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
30
14
|
* - 提供更灵活的搜索体验
|
|
31
15
|
*/
|
|
32
16
|
var SearchWithFilter = function SearchWithFilter(props) {
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
moreSearchItems = _props$moreSearchItem === void 0 ? [] : _props$moreSearchItem,
|
|
37
|
-
className = props.className,
|
|
38
|
-
onSearch = props.onSearch,
|
|
39
|
-
onReset = props.onReset,
|
|
40
|
-
externalForm = props.externalForm,
|
|
41
|
-
hasPermi = props.hasPermi,
|
|
42
|
-
_props$columnNum = props.columnNum,
|
|
43
|
-
columnNum = _props$columnNum === void 0 ? 4 : _props$columnNum,
|
|
44
|
-
beforeButtonGroup = props.beforeButtonGroup,
|
|
45
|
-
affterButtonGroup = props.affterButtonGroup,
|
|
46
|
-
searchData = props.searchData,
|
|
47
|
-
minLabelWidth = props.minLabelWidth,
|
|
48
|
-
_props$defaultExpande = props.defaultExpanded,
|
|
49
|
-
defaultExpanded = _props$defaultExpande === void 0 ? false : _props$defaultExpande,
|
|
50
|
-
onExpandChange = props.onExpandChange,
|
|
51
|
-
_props$autoAdaptWidth = props.autoAdaptWidth,
|
|
52
|
-
autoAdaptWidth = _props$autoAdaptWidth === void 0 ? true : _props$autoAdaptWidth,
|
|
53
|
-
baseWidth = props.baseWidth,
|
|
54
|
-
onValuesChange = props.onValuesChange,
|
|
55
|
-
_props$searchDisabled = props.searchDisabled,
|
|
56
|
-
searchDisabled = _props$searchDisabled === void 0 ? false : _props$searchDisabled,
|
|
57
|
-
_props$showAllSearchI = props.showAllSearchItems,
|
|
58
|
-
showAllSearchItems = _props$showAllSearchI === void 0 ? false : _props$showAllSearchI,
|
|
59
|
-
searchText = props.searchText,
|
|
60
|
-
resetText = props.resetText,
|
|
61
|
-
onFilterChange = props.onFilterChange,
|
|
62
|
-
_props$columnOffsetWi = props.columnOffsetWidth,
|
|
63
|
-
columnOffsetWidth = _props$columnOffsetWi === void 0 ? 0 : _props$columnOffsetWi;
|
|
64
|
-
var _AntdForm$useForm = AntdForm.useForm(externalForm),
|
|
65
|
-
_AntdForm$useForm2 = _slicedToArray(_AntdForm$useForm, 1),
|
|
66
|
-
form = _AntdForm$useForm2[0];
|
|
67
|
-
var _useSearchCommon = useSearchCommon({
|
|
68
|
-
form: form,
|
|
69
|
-
searchItems: searchItems,
|
|
70
|
-
moreSearchItems: moreSearchItems,
|
|
71
|
-
searchData: searchData,
|
|
72
|
-
hasPermi: hasPermi,
|
|
73
|
-
beforeButtonGroup: beforeButtonGroup,
|
|
74
|
-
affterButtonGroup: affterButtonGroup,
|
|
75
|
-
columnNum: columnNum,
|
|
76
|
-
autoAdaptWidth: autoAdaptWidth,
|
|
77
|
-
defaultExpanded: defaultExpanded,
|
|
78
|
-
onExpandChange: onExpandChange,
|
|
79
|
-
showAllSearchItems: showAllSearchItems,
|
|
80
|
-
minLabelWidth: minLabelWidth,
|
|
81
|
-
baseWidth: baseWidth,
|
|
82
|
-
onSearch: onSearch,
|
|
83
|
-
onReset: onReset,
|
|
84
|
-
columnOffsetWidth: columnOffsetWidth
|
|
85
|
-
}),
|
|
86
|
-
containerRef = _useSearchCommon.containerRef,
|
|
87
|
-
buttonGroupRef = _useSearchCommon.buttonGroupRef,
|
|
88
|
-
cls = _useSearchCommon.cls,
|
|
89
|
-
getLabelWidth = _useSearchCommon.getLabelWidth,
|
|
90
|
-
processedSearchItems = _useSearchCommon.processedSearchItems,
|
|
91
|
-
setSearchItems = _useSearchCommon.setSearchItems,
|
|
92
|
-
currentSearchItems = _useSearchCommon.currentSearchItems,
|
|
93
|
-
totalColumnNum = _useSearchCommon.totalColumnNum,
|
|
94
|
-
expand = _useSearchCommon.expand,
|
|
95
|
-
toggleExpand = _useSearchCommon.toggleExpand,
|
|
96
|
-
showExpandButton = _useSearchCommon.showExpandButton,
|
|
97
|
-
onSearchClick = _useSearchCommon.onSearchClick,
|
|
98
|
-
onResetClick = _useSearchCommon.onResetClick,
|
|
99
|
-
shouldRender = _useSearchCommon.shouldRender,
|
|
100
|
-
permitted = _useSearchCommon.permitted;
|
|
101
|
-
if (!shouldRender) {
|
|
102
|
-
return null;
|
|
103
|
-
}
|
|
104
|
-
return /*#__PURE__*/_jsx("div", {
|
|
105
|
-
ref: containerRef,
|
|
106
|
-
className: classNames(styles.Search, className),
|
|
107
|
-
style: {
|
|
108
|
-
"--column-number": totalColumnNum,
|
|
109
|
-
"--column-offset-width": "".concat(columnOffsetWidth, "px")
|
|
110
|
-
},
|
|
111
|
-
children: /*#__PURE__*/_jsx("div", {
|
|
112
|
-
className: classNames(styles.searchOption, styles[expand.toString()]),
|
|
113
|
-
children: /*#__PURE__*/_jsxs(AntdForm, {
|
|
114
|
-
form: form,
|
|
115
|
-
className: classNames(styles.option, cls),
|
|
116
|
-
onValuesChange: onValuesChange,
|
|
117
|
-
children: [permitted && (currentSearchItems === null || currentSearchItems === void 0 ? void 0 : currentSearchItems.map(function (item, idx) {
|
|
118
|
-
// 计算同一列的项(用于计算标签宽度)
|
|
119
|
-
var visibleCurrentItems = currentSearchItems.filter(function (i) {
|
|
120
|
-
return i.visible !== false;
|
|
121
|
-
});
|
|
122
|
-
var columnIndex = idx % totalColumnNum;
|
|
123
|
-
var sameColumnItems = visibleCurrentItems.filter(function (_, _idx) {
|
|
124
|
-
return _idx % totalColumnNum === columnIndex;
|
|
125
|
-
});
|
|
126
|
-
return /*#__PURE__*/_createElement(FormItem, _objectSpread(_objectSpread({}, item), {}, {
|
|
127
|
-
key: item.name,
|
|
128
|
-
className: classNames(styles.item, item.className, _defineProperty({}, styles.unFill, item.width !== undefined)),
|
|
129
|
-
labelWidth: item.width !== undefined ? undefined : getLabelWidth(sameColumnItems, undefined, minLabelWidth)
|
|
130
|
-
}));
|
|
131
|
-
})), ((beforeButtonGroup === null || beforeButtonGroup === void 0 ? void 0 : beforeButtonGroup.length) || (affterButtonGroup === null || affterButtonGroup === void 0 ? void 0 : affterButtonGroup.length) || permitted) && /*#__PURE__*/_jsxs(ButtonGroup, {
|
|
132
|
-
beforeButtonGroup: beforeButtonGroup,
|
|
133
|
-
affterButtonGroup: affterButtonGroup,
|
|
134
|
-
expandButton: /*#__PURE__*/_jsx(ExpandButton, {
|
|
135
|
-
expand: expand,
|
|
136
|
-
toggleExpand: toggleExpand,
|
|
137
|
-
advancedFilters: false,
|
|
138
|
-
showExpandButton: showExpandButton,
|
|
139
|
-
showAllSearchItems: showAllSearchItems || !!(moreSearchItems !== null && moreSearchItems !== void 0 && moreSearchItems.length)
|
|
140
|
-
}),
|
|
141
|
-
permitted: permitted,
|
|
142
|
-
ref: buttonGroupRef,
|
|
143
|
-
children: [currentSearchItems.length > 0 && /*#__PURE__*/_jsx(SearchButtons, {
|
|
144
|
-
onSearch: onSearchClick,
|
|
145
|
-
onReset: onResetClick,
|
|
146
|
-
searchDisabled: searchDisabled,
|
|
147
|
-
searchText: searchText,
|
|
148
|
-
resetText: resetText
|
|
149
|
-
}), /*#__PURE__*/_jsx(FilterDropdown, {
|
|
150
|
-
searchItems: processedSearchItems,
|
|
151
|
-
originalSearchItems: searchItems,
|
|
152
|
-
setSearchItems: setSearchItems,
|
|
153
|
-
onFilterChange: onFilterChange
|
|
154
|
-
})]
|
|
155
|
-
})]
|
|
156
|
-
})
|
|
157
|
-
})
|
|
158
|
-
});
|
|
17
|
+
return /*#__PURE__*/_jsx(SearchBase, _objectSpread(_objectSpread({}, props), {}, {
|
|
18
|
+
showFilter: true
|
|
19
|
+
}));
|
|
159
20
|
};
|
|
160
21
|
export default SearchWithFilter;
|
|
@@ -1,28 +1,15 @@
|
|
|
1
1
|
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
2
|
+
var _excluded = ["setFilter"];
|
|
2
3
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
3
4
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
4
5
|
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
5
6
|
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
6
7
|
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
7
|
-
function
|
|
8
|
-
function
|
|
9
|
-
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); }
|
|
10
|
-
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; }
|
|
11
|
-
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
12
|
-
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
8
|
+
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; }
|
|
9
|
+
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; }
|
|
13
10
|
import React from "react";
|
|
14
|
-
import
|
|
15
|
-
import FormItem from "../../FormItem";
|
|
16
|
-
import classNames from "classnames";
|
|
17
|
-
import styles from "../index.module.scss";
|
|
18
|
-
import { useSearchCommon } from "../_hooks";
|
|
19
|
-
import { ButtonGroup } from "../_components/ButtonGroup";
|
|
20
|
-
import { SearchButtons } from "../_components/SearchButtons";
|
|
21
|
-
import { FilterDropdown } from "../_components/FilterDropdown";
|
|
22
|
-
import { ExpandButton } from "../_components/ExpandButton";
|
|
23
|
-
import { createElement as _createElement } from "react";
|
|
11
|
+
import SearchBase from "../_components/SearchBase";
|
|
24
12
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
25
|
-
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
26
13
|
/**
|
|
27
14
|
* 带更多搜索项的 Search 组件
|
|
28
15
|
* - 将搜索项分为基础项和更多项两组
|
|
@@ -30,130 +17,12 @@ import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
30
17
|
* - 适合有大量搜索字段的场景
|
|
31
18
|
*/
|
|
32
19
|
var SearchWithMore = function SearchWithMore(props) {
|
|
33
|
-
var
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
hasPermi = props.hasPermi,
|
|
41
|
-
_props$columnNum = props.columnNum,
|
|
42
|
-
columnNum = _props$columnNum === void 0 ? 4 : _props$columnNum,
|
|
43
|
-
beforeButtonGroup = props.beforeButtonGroup,
|
|
44
|
-
affterButtonGroup = props.affterButtonGroup,
|
|
45
|
-
searchData = props.searchData,
|
|
46
|
-
setFilter = props.setFilter,
|
|
47
|
-
minLabelWidth = props.minLabelWidth,
|
|
48
|
-
_props$defaultExpande = props.defaultExpanded,
|
|
49
|
-
defaultExpanded = _props$defaultExpande === void 0 ? false : _props$defaultExpande,
|
|
50
|
-
onExpandChange = props.onExpandChange,
|
|
51
|
-
_props$autoAdaptWidth = props.autoAdaptWidth,
|
|
52
|
-
autoAdaptWidth = _props$autoAdaptWidth === void 0 ? true : _props$autoAdaptWidth,
|
|
53
|
-
baseWidth = props.baseWidth,
|
|
54
|
-
onValuesChange = props.onValuesChange,
|
|
55
|
-
_props$searchDisabled = props.searchDisabled,
|
|
56
|
-
searchDisabled = _props$searchDisabled === void 0 ? false : _props$searchDisabled,
|
|
57
|
-
searchText = props.searchText,
|
|
58
|
-
resetText = props.resetText,
|
|
59
|
-
onFilterChange = props.onFilterChange,
|
|
60
|
-
_props$columnOffsetWi = props.columnOffsetWidth,
|
|
61
|
-
columnOffsetWidth = _props$columnOffsetWi === void 0 ? 0 : _props$columnOffsetWi;
|
|
62
|
-
var _AntdForm$useForm = AntdForm.useForm(externalForm),
|
|
63
|
-
_AntdForm$useForm2 = _slicedToArray(_AntdForm$useForm, 1),
|
|
64
|
-
form = _AntdForm$useForm2[0];
|
|
65
|
-
var _useSearchCommon = useSearchCommon({
|
|
66
|
-
form: form,
|
|
67
|
-
searchItems: searchItems,
|
|
68
|
-
moreSearchItems: moreSearchItems,
|
|
69
|
-
searchData: searchData,
|
|
70
|
-
hasPermi: hasPermi,
|
|
71
|
-
beforeButtonGroup: beforeButtonGroup,
|
|
72
|
-
affterButtonGroup: affterButtonGroup,
|
|
73
|
-
columnNum: columnNum,
|
|
74
|
-
autoAdaptWidth: autoAdaptWidth,
|
|
75
|
-
defaultExpanded: defaultExpanded,
|
|
76
|
-
onExpandChange: onExpandChange,
|
|
77
|
-
showAllSearchItems: true,
|
|
78
|
-
// SearchWithMore 始终显示所有搜索项
|
|
79
|
-
minLabelWidth: minLabelWidth,
|
|
80
|
-
baseWidth: baseWidth,
|
|
81
|
-
onSearch: onSearch,
|
|
82
|
-
onReset: onReset,
|
|
83
|
-
columnOffsetWidth: columnOffsetWidth
|
|
84
|
-
}),
|
|
85
|
-
containerRef = _useSearchCommon.containerRef,
|
|
86
|
-
buttonGroupRef = _useSearchCommon.buttonGroupRef,
|
|
87
|
-
cls = _useSearchCommon.cls,
|
|
88
|
-
getLabelWidth = _useSearchCommon.getLabelWidth,
|
|
89
|
-
processedSearchItems = _useSearchCommon.processedSearchItems,
|
|
90
|
-
setSearchItems = _useSearchCommon.setSearchItems,
|
|
91
|
-
currentSearchItems = _useSearchCommon.currentSearchItems,
|
|
92
|
-
totalColumnNum = _useSearchCommon.totalColumnNum,
|
|
93
|
-
expand = _useSearchCommon.expand,
|
|
94
|
-
toggleExpand = _useSearchCommon.toggleExpand,
|
|
95
|
-
showExpandButton = _useSearchCommon.showExpandButton,
|
|
96
|
-
onSearchClick = _useSearchCommon.onSearchClick,
|
|
97
|
-
onResetClick = _useSearchCommon.onResetClick,
|
|
98
|
-
shouldRender = _useSearchCommon.shouldRender,
|
|
99
|
-
permitted = _useSearchCommon.permitted;
|
|
100
|
-
if (!shouldRender) {
|
|
101
|
-
return null;
|
|
102
|
-
}
|
|
103
|
-
return /*#__PURE__*/_jsx("div", {
|
|
104
|
-
ref: containerRef,
|
|
105
|
-
className: classNames(styles.Search, className),
|
|
106
|
-
style: {
|
|
107
|
-
"--column-number": totalColumnNum,
|
|
108
|
-
"--column-offset-width": "".concat(columnOffsetWidth, "px")
|
|
109
|
-
},
|
|
110
|
-
children: /*#__PURE__*/_jsx("div", {
|
|
111
|
-
className: classNames(styles.searchOption, styles[expand.toString()]),
|
|
112
|
-
children: /*#__PURE__*/_jsxs(AntdForm, {
|
|
113
|
-
form: form,
|
|
114
|
-
className: classNames(styles.option, cls),
|
|
115
|
-
onValuesChange: onValuesChange,
|
|
116
|
-
children: [permitted && (currentSearchItems === null || currentSearchItems === void 0 ? void 0 : currentSearchItems.map(function (item, idx) {
|
|
117
|
-
// 计算同一列的项(用于计算标签宽度)
|
|
118
|
-
var visibleCurrentItems = currentSearchItems.filter(function (i) {
|
|
119
|
-
return i.visible !== false;
|
|
120
|
-
});
|
|
121
|
-
var columnIndex = idx % totalColumnNum;
|
|
122
|
-
var sameColumnItems = visibleCurrentItems.filter(function (_, _idx) {
|
|
123
|
-
return _idx % totalColumnNum === columnIndex;
|
|
124
|
-
});
|
|
125
|
-
return /*#__PURE__*/_createElement(FormItem, _objectSpread(_objectSpread({}, item), {}, {
|
|
126
|
-
key: item.name,
|
|
127
|
-
className: classNames(styles.item, item.className, _defineProperty({}, styles.unFill, item.width !== undefined)),
|
|
128
|
-
labelWidth: item.width !== undefined ? undefined : getLabelWidth(sameColumnItems, undefined, minLabelWidth)
|
|
129
|
-
}));
|
|
130
|
-
})), ((beforeButtonGroup === null || beforeButtonGroup === void 0 ? void 0 : beforeButtonGroup.length) || (affterButtonGroup === null || affterButtonGroup === void 0 ? void 0 : affterButtonGroup.length) || permitted) && /*#__PURE__*/_jsxs(ButtonGroup, {
|
|
131
|
-
beforeButtonGroup: beforeButtonGroup,
|
|
132
|
-
affterButtonGroup: affterButtonGroup,
|
|
133
|
-
expandButton: /*#__PURE__*/_jsx(ExpandButton, {
|
|
134
|
-
expand: expand,
|
|
135
|
-
toggleExpand: toggleExpand,
|
|
136
|
-
advancedFilters: false,
|
|
137
|
-
showExpandButton: showExpandButton,
|
|
138
|
-
showAllSearchItems: true
|
|
139
|
-
}),
|
|
140
|
-
permitted: permitted,
|
|
141
|
-
ref: buttonGroupRef,
|
|
142
|
-
children: [currentSearchItems.length > 0 && /*#__PURE__*/_jsx(SearchButtons, {
|
|
143
|
-
onSearch: onSearchClick,
|
|
144
|
-
onReset: onResetClick,
|
|
145
|
-
searchDisabled: searchDisabled,
|
|
146
|
-
searchText: searchText,
|
|
147
|
-
resetText: resetText
|
|
148
|
-
}), setFilter && /*#__PURE__*/_jsx(FilterDropdown, {
|
|
149
|
-
searchItems: processedSearchItems,
|
|
150
|
-
originalSearchItems: searchItems,
|
|
151
|
-
setSearchItems: setSearchItems,
|
|
152
|
-
onFilterChange: onFilterChange
|
|
153
|
-
})]
|
|
154
|
-
})]
|
|
155
|
-
})
|
|
156
|
-
})
|
|
157
|
-
});
|
|
20
|
+
var setFilter = props.setFilter,
|
|
21
|
+
rest = _objectWithoutProperties(props, _excluded);
|
|
22
|
+
return /*#__PURE__*/_jsx(SearchBase, _objectSpread(_objectSpread({}, rest), {}, {
|
|
23
|
+
// SearchWithMore 始终显示所有搜索项
|
|
24
|
+
showAllSearchItems: true,
|
|
25
|
+
showFilter: !!setFilter
|
|
26
|
+
}));
|
|
158
27
|
};
|
|
159
28
|
export default SearchWithMore;
|
|
@@ -32,15 +32,14 @@ export var FilterDropdown = function FilterDropdown(_ref) {
|
|
|
32
32
|
open = _useState2[0],
|
|
33
33
|
setOpen = _useState2[1];
|
|
34
34
|
useEffect(function () {
|
|
35
|
-
|
|
35
|
+
var handleDocumentClick = function handleDocumentClick() {
|
|
36
36
|
setOpen(false);
|
|
37
|
-
}
|
|
37
|
+
};
|
|
38
|
+
document.addEventListener("click", handleDocumentClick);
|
|
38
39
|
return function () {
|
|
39
|
-
document.removeEventListener("click",
|
|
40
|
-
setOpen(false);
|
|
41
|
-
});
|
|
40
|
+
document.removeEventListener("click", handleDocumentClick);
|
|
42
41
|
};
|
|
43
|
-
}, [
|
|
42
|
+
}, []);
|
|
44
43
|
return /*#__PURE__*/_jsx(Dropdown, {
|
|
45
44
|
open: open,
|
|
46
45
|
overlayClassName: styles.filterDropdown,
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import React, { ReactNode } from "react";
|
|
2
|
+
import { FormInstance } from "antd";
|
|
3
|
+
import { FormItemProps } from "../../../FormItem";
|
|
4
|
+
import type useLabelWidth from "../../../../hooks/useLabelWidth";
|
|
5
|
+
import { SearchPropsWithFilter } from "../../_types";
|
|
6
|
+
/** 暴露给变体扩展渲染(如高级筛选抽屉)的上下文 */
|
|
7
|
+
export interface SearchBaseContext {
|
|
8
|
+
form: FormInstance;
|
|
9
|
+
expand: boolean;
|
|
10
|
+
setExpand?: (expand: boolean) => void;
|
|
11
|
+
processedSearchItems: FormItemProps[];
|
|
12
|
+
getLabelWidth: ReturnType<typeof useLabelWidth>[1];
|
|
13
|
+
onSearchClick: () => void;
|
|
14
|
+
onResetClick: () => void;
|
|
15
|
+
}
|
|
16
|
+
export interface SearchBaseProps extends SearchPropsWithFilter {
|
|
17
|
+
/** 高级筛选模式:搜索项不显示 label,展开按钮显示为"高级筛选" */
|
|
18
|
+
advancedFilters?: boolean;
|
|
19
|
+
/** 是否渲染 FilterDropdown(筛选器设置下拉) */
|
|
20
|
+
showFilter?: boolean;
|
|
21
|
+
/** 表单区域之后、容器之内的附加内容(如折叠开关),仅在有权限时渲染 */
|
|
22
|
+
afterForm?: ReactNode;
|
|
23
|
+
/** 容器之外的附加内容(如高级筛选抽屉),仅在有权限时渲染 */
|
|
24
|
+
renderOutside?: (ctx: SearchBaseContext) => ReactNode;
|
|
25
|
+
}
|
|
26
|
+
/**
|
|
27
|
+
* Search 各变体共享的基础实现:
|
|
28
|
+
* 表单渲染、列布局、展开/收起、按钮组、权限控制。
|
|
29
|
+
* 变体只负责自身差异(筛选器、折叠开关、高级筛选抽屉等)。
|
|
30
|
+
*/
|
|
31
|
+
declare const SearchBase: React.FC<SearchBaseProps>;
|
|
32
|
+
export default SearchBase;
|
|
@@ -0,0 +1,185 @@
|
|
|
1
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
2
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
3
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
4
|
+
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
5
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
6
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
7
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
8
|
+
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."); }
|
|
9
|
+
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); }
|
|
10
|
+
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; }
|
|
11
|
+
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
12
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
13
|
+
import React, { useMemo } from "react";
|
|
14
|
+
import { Form as AntdForm } from "antd";
|
|
15
|
+
import classNames from "classnames";
|
|
16
|
+
import FormItem from "../../../FormItem";
|
|
17
|
+
import styles from "../../index.module.scss";
|
|
18
|
+
import { useSearchCommon } from "../../_hooks";
|
|
19
|
+
import { ButtonGroup } from "../ButtonGroup";
|
|
20
|
+
import { SearchButtons } from "../SearchButtons";
|
|
21
|
+
import { ExpandButton } from "../ExpandButton";
|
|
22
|
+
import { FilterDropdown } from "../FilterDropdown";
|
|
23
|
+
|
|
24
|
+
/** 暴露给变体扩展渲染(如高级筛选抽屉)的上下文 */
|
|
25
|
+
import { createElement as _createElement } from "react";
|
|
26
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
27
|
+
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
28
|
+
import { Fragment as _Fragment } from "react/jsx-runtime";
|
|
29
|
+
/**
|
|
30
|
+
* Search 各变体共享的基础实现:
|
|
31
|
+
* 表单渲染、列布局、展开/收起、按钮组、权限控制。
|
|
32
|
+
* 变体只负责自身差异(筛选器、折叠开关、高级筛选抽屉等)。
|
|
33
|
+
*/
|
|
34
|
+
var SearchBase = function SearchBase(props) {
|
|
35
|
+
var _props$searchItems = props.searchItems,
|
|
36
|
+
searchItems = _props$searchItems === void 0 ? [] : _props$searchItems,
|
|
37
|
+
_props$moreSearchItem = props.moreSearchItems,
|
|
38
|
+
moreSearchItems = _props$moreSearchItem === void 0 ? [] : _props$moreSearchItem,
|
|
39
|
+
className = props.className,
|
|
40
|
+
onSearch = props.onSearch,
|
|
41
|
+
onReset = props.onReset,
|
|
42
|
+
externalForm = props.externalForm,
|
|
43
|
+
hasPermi = props.hasPermi,
|
|
44
|
+
_props$columnNum = props.columnNum,
|
|
45
|
+
columnNum = _props$columnNum === void 0 ? 4 : _props$columnNum,
|
|
46
|
+
beforeButtonGroup = props.beforeButtonGroup,
|
|
47
|
+
affterButtonGroup = props.affterButtonGroup,
|
|
48
|
+
searchData = props.searchData,
|
|
49
|
+
minLabelWidth = props.minLabelWidth,
|
|
50
|
+
_props$defaultExpande = props.defaultExpanded,
|
|
51
|
+
defaultExpanded = _props$defaultExpande === void 0 ? false : _props$defaultExpande,
|
|
52
|
+
onExpandChange = props.onExpandChange,
|
|
53
|
+
_props$autoAdaptWidth = props.autoAdaptWidth,
|
|
54
|
+
autoAdaptWidth = _props$autoAdaptWidth === void 0 ? true : _props$autoAdaptWidth,
|
|
55
|
+
baseWidth = props.baseWidth,
|
|
56
|
+
onValuesChange = props.onValuesChange,
|
|
57
|
+
_props$searchDisabled = props.searchDisabled,
|
|
58
|
+
searchDisabled = _props$searchDisabled === void 0 ? false : _props$searchDisabled,
|
|
59
|
+
_props$showAllSearchI = props.showAllSearchItems,
|
|
60
|
+
showAllSearchItems = _props$showAllSearchI === void 0 ? false : _props$showAllSearchI,
|
|
61
|
+
searchText = props.searchText,
|
|
62
|
+
resetText = props.resetText,
|
|
63
|
+
onFilterChange = props.onFilterChange,
|
|
64
|
+
_props$columnOffsetWi = props.columnOffsetWidth,
|
|
65
|
+
columnOffsetWidth = _props$columnOffsetWi === void 0 ? 0 : _props$columnOffsetWi,
|
|
66
|
+
_props$advancedFilter = props.advancedFilters,
|
|
67
|
+
advancedFilters = _props$advancedFilter === void 0 ? false : _props$advancedFilter,
|
|
68
|
+
_props$showFilter = props.showFilter,
|
|
69
|
+
showFilter = _props$showFilter === void 0 ? false : _props$showFilter,
|
|
70
|
+
afterForm = props.afterForm,
|
|
71
|
+
renderOutside = props.renderOutside;
|
|
72
|
+
var _AntdForm$useForm = AntdForm.useForm(externalForm),
|
|
73
|
+
_AntdForm$useForm2 = _slicedToArray(_AntdForm$useForm, 1),
|
|
74
|
+
form = _AntdForm$useForm2[0];
|
|
75
|
+
var _useSearchCommon = useSearchCommon({
|
|
76
|
+
form: form,
|
|
77
|
+
searchItems: searchItems,
|
|
78
|
+
moreSearchItems: moreSearchItems,
|
|
79
|
+
searchData: searchData,
|
|
80
|
+
hasPermi: hasPermi,
|
|
81
|
+
beforeButtonGroup: beforeButtonGroup,
|
|
82
|
+
affterButtonGroup: affterButtonGroup,
|
|
83
|
+
columnNum: columnNum,
|
|
84
|
+
autoAdaptWidth: autoAdaptWidth,
|
|
85
|
+
defaultExpanded: defaultExpanded,
|
|
86
|
+
onExpandChange: onExpandChange,
|
|
87
|
+
showAllSearchItems: showAllSearchItems,
|
|
88
|
+
minLabelWidth: minLabelWidth,
|
|
89
|
+
baseWidth: baseWidth,
|
|
90
|
+
onSearch: onSearch,
|
|
91
|
+
onReset: onReset,
|
|
92
|
+
columnOffsetWidth: columnOffsetWidth
|
|
93
|
+
}),
|
|
94
|
+
containerRef = _useSearchCommon.containerRef,
|
|
95
|
+
buttonGroupRef = _useSearchCommon.buttonGroupRef,
|
|
96
|
+
cls = _useSearchCommon.cls,
|
|
97
|
+
getLabelWidth = _useSearchCommon.getLabelWidth,
|
|
98
|
+
processedSearchItems = _useSearchCommon.processedSearchItems,
|
|
99
|
+
setSearchItems = _useSearchCommon.setSearchItems,
|
|
100
|
+
currentSearchItems = _useSearchCommon.currentSearchItems,
|
|
101
|
+
totalColumnNum = _useSearchCommon.totalColumnNum,
|
|
102
|
+
expand = _useSearchCommon.expand,
|
|
103
|
+
setExpand = _useSearchCommon.setExpand,
|
|
104
|
+
toggleExpand = _useSearchCommon.toggleExpand,
|
|
105
|
+
showExpandButton = _useSearchCommon.showExpandButton,
|
|
106
|
+
onSearchClick = _useSearchCommon.onSearchClick,
|
|
107
|
+
onResetClick = _useSearchCommon.onResetClick,
|
|
108
|
+
shouldRender = _useSearchCommon.shouldRender,
|
|
109
|
+
permitted = _useSearchCommon.permitted;
|
|
110
|
+
|
|
111
|
+
// 按列分组预计算(用于对齐同列 label 宽度),避免在 map 中逐项重复 filter
|
|
112
|
+
var columnGroups = useMemo(function () {
|
|
113
|
+
var groups = Array.from({
|
|
114
|
+
length: totalColumnNum
|
|
115
|
+
}, function () {
|
|
116
|
+
return [];
|
|
117
|
+
});
|
|
118
|
+
currentSearchItems.forEach(function (item, idx) {
|
|
119
|
+
groups[idx % totalColumnNum].push(item);
|
|
120
|
+
});
|
|
121
|
+
return groups;
|
|
122
|
+
}, [currentSearchItems, totalColumnNum]);
|
|
123
|
+
if (!shouldRender) {
|
|
124
|
+
return null;
|
|
125
|
+
}
|
|
126
|
+
return /*#__PURE__*/_jsxs(_Fragment, {
|
|
127
|
+
children: [/*#__PURE__*/_jsxs("div", {
|
|
128
|
+
ref: containerRef,
|
|
129
|
+
className: classNames(styles.Search, className),
|
|
130
|
+
style: {
|
|
131
|
+
"--column-number": totalColumnNum,
|
|
132
|
+
"--column-offset-width": "".concat(columnOffsetWidth, "px")
|
|
133
|
+
},
|
|
134
|
+
children: [/*#__PURE__*/_jsx("div", {
|
|
135
|
+
className: classNames(styles.searchOption, styles[expand.toString()]),
|
|
136
|
+
children: /*#__PURE__*/_jsxs(AntdForm, {
|
|
137
|
+
form: form,
|
|
138
|
+
className: classNames(styles.option, cls),
|
|
139
|
+
onValuesChange: onValuesChange,
|
|
140
|
+
children: [permitted && currentSearchItems.map(function (item, idx) {
|
|
141
|
+
return /*#__PURE__*/_createElement(FormItem, _objectSpread(_objectSpread({}, item), {}, {
|
|
142
|
+
key: item.name,
|
|
143
|
+
className: classNames(styles.item, item.className, _defineProperty({}, styles.unFill, item.width !== undefined)),
|
|
144
|
+
label: advancedFilters ? undefined : item.label,
|
|
145
|
+
labelWidth: advancedFilters || item.width !== undefined ? undefined : getLabelWidth(columnGroups[idx % totalColumnNum], undefined, minLabelWidth)
|
|
146
|
+
}));
|
|
147
|
+
}), ((beforeButtonGroup === null || beforeButtonGroup === void 0 ? void 0 : beforeButtonGroup.length) || (affterButtonGroup === null || affterButtonGroup === void 0 ? void 0 : affterButtonGroup.length) || permitted) && /*#__PURE__*/_jsxs(ButtonGroup, {
|
|
148
|
+
beforeButtonGroup: beforeButtonGroup,
|
|
149
|
+
affterButtonGroup: affterButtonGroup,
|
|
150
|
+
expandButton: /*#__PURE__*/_jsx(ExpandButton, {
|
|
151
|
+
expand: expand,
|
|
152
|
+
toggleExpand: toggleExpand,
|
|
153
|
+
advancedFilters: advancedFilters,
|
|
154
|
+
showExpandButton: showExpandButton,
|
|
155
|
+
showAllSearchItems: showAllSearchItems || !!(moreSearchItems !== null && moreSearchItems !== void 0 && moreSearchItems.length)
|
|
156
|
+
}),
|
|
157
|
+
permitted: permitted,
|
|
158
|
+
ref: buttonGroupRef,
|
|
159
|
+
children: [currentSearchItems.length > 0 && /*#__PURE__*/_jsx(SearchButtons, {
|
|
160
|
+
onSearch: onSearchClick,
|
|
161
|
+
onReset: onResetClick,
|
|
162
|
+
searchDisabled: searchDisabled,
|
|
163
|
+
searchText: searchText,
|
|
164
|
+
resetText: resetText
|
|
165
|
+
}), showFilter && /*#__PURE__*/_jsx(FilterDropdown, {
|
|
166
|
+
searchItems: processedSearchItems,
|
|
167
|
+
originalSearchItems: searchItems,
|
|
168
|
+
setSearchItems: setSearchItems,
|
|
169
|
+
onFilterChange: onFilterChange
|
|
170
|
+
})]
|
|
171
|
+
})]
|
|
172
|
+
})
|
|
173
|
+
}), permitted && afterForm]
|
|
174
|
+
}), permitted && (renderOutside === null || renderOutside === void 0 ? void 0 : renderOutside({
|
|
175
|
+
form: form,
|
|
176
|
+
expand: expand,
|
|
177
|
+
setExpand: setExpand,
|
|
178
|
+
processedSearchItems: processedSearchItems,
|
|
179
|
+
getLabelWidth: getLabelWidth,
|
|
180
|
+
onSearchClick: onSearchClick,
|
|
181
|
+
onResetClick: onResetClick
|
|
182
|
+
}))]
|
|
183
|
+
});
|
|
184
|
+
};
|
|
185
|
+
export default SearchBase;
|
|
@@ -16,7 +16,7 @@ import { useSearchItems } from "./useSearchItems";
|
|
|
16
16
|
import { useSearchForm } from "./useSearchForm";
|
|
17
17
|
import { useAdaptiveColumnNum } from "./useAdaptiveColumnNum";
|
|
18
18
|
import { useSearchExpand } from "./useSearchExpand";
|
|
19
|
-
import { cleanSearchData, calculateVisibleItems, calculateButtonGroupAndColumnWidth } from "../_utils";
|
|
19
|
+
import { cleanSearchData, calculateVisibleItems, calculateButtonGroupAndColumnWidth, shouldDisplayExtraItem } from "../_utils";
|
|
20
20
|
import styles from "../index.module.scss";
|
|
21
21
|
/**
|
|
22
22
|
* 提取所有 Search 组件的通用逻辑
|
|
@@ -70,14 +70,10 @@ export var useSearchCommon = function useSearchCommon(params) {
|
|
|
70
70
|
}, [moreSearchItems]);
|
|
71
71
|
|
|
72
72
|
// 计算可见的搜索项数量
|
|
73
|
-
var visibleSearchItemCount =
|
|
74
|
-
return visibleSearchItems.length;
|
|
75
|
-
}, [visibleSearchItems]);
|
|
73
|
+
var visibleSearchItemCount = visibleSearchItems.length;
|
|
76
74
|
|
|
77
75
|
// 计算总列数(包括按钮组)
|
|
78
|
-
var baseTotalColumnNum =
|
|
79
|
-
return columnNum + 1;
|
|
80
|
-
}, [columnNum]);
|
|
76
|
+
var baseTotalColumnNum = columnNum + 1;
|
|
81
77
|
|
|
82
78
|
// 根据容器宽度动态调整列数
|
|
83
79
|
var totalColumnNum = useAdaptiveColumnNum(containerRef, baseTotalColumnNum, autoAdaptWidth, 1,
|
|
@@ -89,9 +85,7 @@ export var useSearchCommon = function useSearchCommon(params) {
|
|
|
89
85
|
baseWidth);
|
|
90
86
|
|
|
91
87
|
// 计算调整后的搜索项列数(不包括按钮组)
|
|
92
|
-
var adaptiveColumnNum =
|
|
93
|
-
return Math.max(1, totalColumnNum - 1);
|
|
94
|
-
}, [totalColumnNum]);
|
|
88
|
+
var adaptiveColumnNum = Math.max(1, totalColumnNum - 1);
|
|
95
89
|
|
|
96
90
|
// 使用基于宽度的展开/收起控制
|
|
97
91
|
var _useSearchExpand = useSearchExpand(containerRef, buttonGroupRef, ".".concat(cls, " .").concat(styles.item), visibleSearchItemCount, adaptiveColumnNum, autoAdaptWidth, defaultExpanded, onExpandChange, processedSearchItems, showAllSearchItems || !!(moreSearchItems !== null && moreSearchItems !== void 0 && moreSearchItems.length), columnOffsetWidth),
|
|
@@ -155,7 +149,7 @@ export var useSearchCommon = function useSearchCommon(params) {
|
|
|
155
149
|
columnWidth = _calculateButtonGroup.columnWidth;
|
|
156
150
|
|
|
157
151
|
// 判断按钮组宽度是否大于列宽,如果是,则显示 实际搜索项数量+1
|
|
158
|
-
if (
|
|
152
|
+
if (shouldDisplayExtraItem(buttonGroupWidth, columnWidth, adaptiveColumnNum, visibleSearchItemCount)) {
|
|
159
153
|
return adaptiveColumnNum + 1;
|
|
160
154
|
}
|
|
161
155
|
return adaptiveColumnNum;
|