@para-ui/core 3.0.28 → 3.0.30
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/AutoBox/index.js +48 -88
- package/AutoTips/index.js +25 -32
- package/Breadcrumbs/index.js +43 -63
- package/Button/SplitButton.d.ts +1 -1
- package/Button/index.d.ts +1 -1
- package/Button/index.js +88 -118
- package/ButtonGroup/index.js +27 -36
- package/Carousel/index.d.ts +2 -2
- package/Carousel/index.js +27 -28
- package/Cascader/index.js +52 -64
- package/Checkbox/index.js +23 -39
- package/CheckboxGroup/index.js +31 -48
- package/Collapse/collapsePanel.d.ts +1 -1
- package/Collapse/index.d.ts +1 -1
- package/Collapse/index.js +9 -29
- package/Collapse/util.d.ts +2 -2
- package/CollapseBox/index.js +45 -56
- package/CollapseLayout/index.js +35 -54
- package/ComboSelect/index.js +222 -349
- package/ComboSelect/interface.d.ts +3 -3
- package/Container/index.js +17 -20
- package/DatePicker/generatePicker/index.d.ts +17 -17
- package/DatePicker/index.d.ts +4 -4
- package/DatePicker/index.js +111 -167
- package/Desktop/index.js +62 -173
- package/Drawer/index.js +65 -58
- package/Drawer/interface.d.ts +7 -3
- package/Dropdown/index.d.ts +1 -1
- package/Dropdown/index.js +3 -3
- package/Empty/index.js +17 -22
- package/Form/index.d.ts +1 -1
- package/Form/index.js +38 -80
- package/FormItem/index.d.ts +1 -1
- package/FormItem/index.js +11 -11
- package/FormItem/validateFunction.d.ts +1 -1
- package/FunctionModal/index.js +11 -11
- package/GlobalContext/index.js +3 -3
- package/GlobalContext/usePopupContainer.d.ts +1 -1
- package/Help/index.js +11 -11
- package/HelperText/index.js +11 -12
- package/InputLang/index.js +47 -80
- package/InputNumber/index.js +65 -100
- package/Label/index.js +15 -16
- package/Loading/index.js +6 -7
- package/Menu/index.js +148 -328
- package/Menu/interface.d.ts +2 -2
- package/Menu/verticalMenuList.d.ts +1 -1
- package/Message/index.d.ts +1 -1
- package/Message/index.js +45 -64
- package/Modal/Confirm/index.d.ts +2 -2
- package/Modal/index.d.ts +1 -1
- package/Modal/index.js +119 -152
- package/MultiBox/index.js +44 -76
- package/Notification/index.d.ts +2 -2
- package/Notification/index.js +51 -72
- package/OperateBtn/index.js +42 -70
- package/PageHeader/index.js +120 -286
- package/PageHeader/interface.d.ts +1 -1
- package/Pagination/index.d.ts +2 -2
- package/Pagination/index.js +79 -131
- package/ParauiProvider/index.js +2 -3
- package/PasswordRules/index.js +12 -30
- package/PopConfirm/index.d.ts +1 -1
- package/PopConfirm/index.js +52 -59
- package/Popover/index.js +8 -9
- package/Progress/index.d.ts +6 -6
- package/Progress/index.js +50 -89
- package/Querying/index.js +14 -17
- package/README.md +813 -800
- package/Radio/index.js +21 -33
- package/RadioGroup/index.js +32 -47
- package/Search/index.js +44 -66
- package/Select/index.js +176 -343
- package/SelectInput/index.js +8 -9
- package/Selector/index.js +285 -681
- package/SelectorPicker/index.js +62 -97
- package/SingleBox/index.js +30 -55
- package/Slider/index.d.ts +1 -1
- package/Slider/index.js +29 -41
- package/Slider/interface.d.ts +2 -2
- package/Split/index.js +10 -23
- package/Status/index.js +8 -7
- package/Stepper/index.d.ts +1 -1
- package/Stepper/index.js +20 -25
- package/Styles/form.scss +5 -5
- package/Styles/index.scss +37 -37
- package/Styles/normalize.scss +348 -348
- package/Styles/scrollbar.scss +223 -223
- package/Styles/theme.scss +74 -74
- package/Switch/index.d.ts +2 -2
- package/Switch/index.js +19 -20
- package/Table/index.js +568 -1019
- package/Table/interface.d.ts +5 -5
- package/Tabs/index.d.ts +3 -3
- package/Tabs/index.js +47 -65
- package/Tag/TagGroup.d.ts +1 -1
- package/Tag/index.d.ts +2 -2
- package/Tag/index.js +72 -107
- package/TextEditor/index.d.ts +2 -2
- package/TextEditor/index.js +81 -105
- package/TextField/index.js +141 -220
- package/TimePicker/index.d.ts +1 -1
- package/TimePicker/index.js +12 -15
- package/Timeline/index.js +42 -52
- package/Title/index.js +10 -9
- package/ToggleButton/ToggleButtonGroup.d.ts +1 -1
- package/ToggleButton/index.js +50 -70
- package/Tooltip/index.js +64 -98
- package/Tooltip/interface.d.ts +1 -1
- package/Transfer/index.d.ts +1 -1
- package/Transfer/index.js +114 -137
- package/Transfer/useClick.d.ts +1 -1
- package/Tree/index.js +10 -10
- package/Tree/interface.d.ts +6 -6
- package/Upload/Dragger/index.d.ts +1 -1
- package/Upload/ImageUpload/index.d.ts +1 -1
- package/Upload/ImgCrop/EasyCrop.d.ts +1 -1
- package/Upload/index.d.ts +1 -1
- package/Upload/index.js +283 -475
- package/Upload/interface.d.ts +2 -2
- package/_verture/{constant-bf34e6fa.js → constant-66aa48a1.js} +0 -1
- package/_verture/defineProperty-62acccfc.js +34 -0
- package/_verture/{index-342379c6.js → index-06fea29b.js} +79 -124
- package/_verture/{index-48875ffd.js → index-131f8fe5.js} +80 -181
- package/_verture/{index-31ce5a11.js → index-92144ad3.js} +238 -445
- package/_verture/{index-bbed73a3.js → index-be4faaee.js} +19 -61
- package/_verture/{intl-336570e4.js → intl-5cbb940c.js} +4 -12
- package/_verture/{modalContext-d646d9db.js → modalContext-c749e1c6.js} +18 -43
- package/_verture/{slicedToArray-d7722f4b.js → slicedToArray-77980792.js} +23 -25
- package/_verture/{toConsumableArray-f8047a75.js → toConsumableArray-87c7d895.js} +1 -1
- package/_verture/{useFormatMessage-f4452258.js → useFormatMessage-703f8b20.js} +1 -3
- package/_verture/{useGlobalProps-af9a2af6.js → useGlobalProps-1b846a65.js} +1 -2
- package/_verture/{usePopupContainer-b8ab7cab.js → usePopupContainer-87febeb9.js} +10 -25
- package/_verture/{util-a77b261e.js → util-7e1fb1e2.js} +2 -3
- package/index.d.ts +2 -4
- package/index.js +15 -16
- package/package.json +167 -168
- package/Test/index.d.ts +0 -3
- package/Test/index.js +0 -9
- package/_verture/defineProperty-0590dc61.js +0 -16
package/Select/index.js
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import { _ as _defineProperty } from '../_verture/defineProperty-
|
|
2
|
-
import { _ as _toConsumableArray } from '../_verture/toConsumableArray-
|
|
1
|
+
import { _ as _defineProperty } from '../_verture/defineProperty-62acccfc.js';
|
|
2
|
+
import { _ as _toConsumableArray } from '../_verture/toConsumableArray-87c7d895.js';
|
|
3
3
|
import { _ as _typeof } from '../_verture/typeof-498dd2b1.js';
|
|
4
|
-
import { _ as _slicedToArray } from '../_verture/slicedToArray-
|
|
4
|
+
import { _ as _slicedToArray } from '../_verture/slicedToArray-77980792.js';
|
|
5
5
|
import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
|
|
6
6
|
import React__default, { useRef, useState, useEffect, useMemo } from 'react';
|
|
7
7
|
import Empty from '../Empty/index.js';
|
|
8
8
|
import Label from '../Label/index.js';
|
|
9
|
-
import { D as Dropdown } from '../_verture/index-
|
|
9
|
+
import { D as Dropdown } from '../_verture/index-be4faaee.js';
|
|
10
10
|
import { UUID, DeepClone } from '@paraview/lib';
|
|
11
11
|
import GlobalContext from '@para-ui/core/GlobalContext';
|
|
12
12
|
import CloseIcon from '@para-ui/icons/Close';
|
|
@@ -14,13 +14,13 @@ import CloseCircle from '@para-ui/icons/CloseCircle';
|
|
|
14
14
|
import Down from '@para-ui/icons/Down';
|
|
15
15
|
import Check from '@para-ui/icons/Check';
|
|
16
16
|
import SearchIcon from '@para-ui/icons/Search';
|
|
17
|
-
import { u as useFormatMessage } from '../_verture/useFormatMessage-
|
|
17
|
+
import { u as useFormatMessage } from '../_verture/useFormatMessage-703f8b20.js';
|
|
18
18
|
import AutoTips from '../AutoTips/index.js';
|
|
19
19
|
import { Loading } from '../Loading/index.js';
|
|
20
20
|
import { Popover } from '../Popover/index.js';
|
|
21
21
|
import HelperText from '../HelperText/index.js';
|
|
22
|
-
import { u as useGlobalProps } from '../_verture/useGlobalProps-
|
|
23
|
-
import { $ as $prefixCls } from '../_verture/constant-
|
|
22
|
+
import { u as useGlobalProps } from '../_verture/useGlobalProps-1b846a65.js';
|
|
23
|
+
import { $ as $prefixCls } from '../_verture/constant-66aa48a1.js';
|
|
24
24
|
import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';
|
|
25
25
|
import 'clsx';
|
|
26
26
|
import '../Help/index.js';
|
|
@@ -30,7 +30,7 @@ import 'rc-tooltip';
|
|
|
30
30
|
import 'rc-tooltip/lib/placements';
|
|
31
31
|
import '@para-ui/icons/Help';
|
|
32
32
|
import 'rc-dropdown';
|
|
33
|
-
import '../_verture/usePopupContainer-
|
|
33
|
+
import '../_verture/usePopupContainer-87febeb9.js';
|
|
34
34
|
import 'dayjs';
|
|
35
35
|
import '@para-ui/icons/LoadingF';
|
|
36
36
|
|
|
@@ -58,7 +58,6 @@ styleInject(css_248z);
|
|
|
58
58
|
* @param fontFamily 字体类型
|
|
59
59
|
* @param text 文本
|
|
60
60
|
*/
|
|
61
|
-
|
|
62
61
|
var textSize = function textSize(fontSize, fontFamily, text) {
|
|
63
62
|
var span = document.createElement("span");
|
|
64
63
|
span.id = 'referenceSpan';
|
|
@@ -70,174 +69,137 @@ var textSize = function textSize(fontSize, fontFamily, text) {
|
|
|
70
69
|
span.style.fontFamily = fontFamily;
|
|
71
70
|
span.style.display = "inline-block";
|
|
72
71
|
var isExists = document.getElementById("referenceSpan");
|
|
73
|
-
|
|
74
72
|
if (isExists) {
|
|
75
73
|
document.body.removeChild(isExists);
|
|
76
74
|
}
|
|
77
|
-
|
|
78
75
|
document.body.appendChild(span);
|
|
79
|
-
|
|
80
76
|
if (typeof span.textContent != "undefined") {
|
|
81
77
|
span.textContent = text;
|
|
82
78
|
} else {
|
|
83
79
|
span.innerText = text;
|
|
84
80
|
}
|
|
85
|
-
|
|
86
81
|
result.width = parseFloat(window.getComputedStyle(span).width) - result.width;
|
|
87
82
|
result.height = parseFloat(window.getComputedStyle(span).height) - result.height;
|
|
88
83
|
document.body.removeChild(span);
|
|
89
84
|
return result;
|
|
90
85
|
};
|
|
91
|
-
|
|
92
86
|
var Select = function Select(props) {
|
|
93
87
|
var _useGlobalProps = useGlobalProps(props, 'Select'),
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
88
|
+
className = _useGlobalProps.className,
|
|
89
|
+
style = _useGlobalProps.style,
|
|
90
|
+
_useGlobalProps$showS = _useGlobalProps.showSelect,
|
|
91
|
+
showSelect = _useGlobalProps$showS === void 0 ? true : _useGlobalProps$showS,
|
|
92
|
+
_useGlobalProps$allow = _useGlobalProps.allowClear,
|
|
93
|
+
allowClear = _useGlobalProps$allow === void 0 ? false : _useGlobalProps$allow,
|
|
94
|
+
emptyProps = _useGlobalProps.emptyProps,
|
|
95
|
+
_useGlobalProps$size = _useGlobalProps.size,
|
|
96
|
+
size = _useGlobalProps$size === void 0 ? 'large' : _useGlobalProps$size,
|
|
97
|
+
_useGlobalProps$label = _useGlobalProps.labelMode,
|
|
98
|
+
labelMode = _useGlobalProps$label === void 0 ? 'outside' : _useGlobalProps$label,
|
|
99
|
+
labelTooltip = _useGlobalProps.labelTooltip,
|
|
100
|
+
_useGlobalProps$place = _useGlobalProps.placeholder,
|
|
101
|
+
placeholder = _useGlobalProps$place === void 0 ? '' : _useGlobalProps$place,
|
|
102
|
+
searchPlaceholder = _useGlobalProps.searchPlaceholder,
|
|
103
|
+
_useGlobalProps$label2 = _useGlobalProps.label,
|
|
104
|
+
label = _useGlobalProps$label2 === void 0 ? '' : _useGlobalProps$label2,
|
|
105
|
+
_useGlobalProps$input = _useGlobalProps.input,
|
|
106
|
+
input = _useGlobalProps$input === void 0 ? false : _useGlobalProps$input,
|
|
107
|
+
_useGlobalProps$disab = _useGlobalProps.disabled,
|
|
108
|
+
disabled = _useGlobalProps$disab === void 0 ? false : _useGlobalProps$disab,
|
|
109
|
+
_useGlobalProps$multi = _useGlobalProps.multiple,
|
|
110
|
+
multiple = _useGlobalProps$multi === void 0 ? false : _useGlobalProps$multi,
|
|
111
|
+
_useGlobalProps$requi = _useGlobalProps.required,
|
|
112
|
+
required = _useGlobalProps$requi === void 0 ? false : _useGlobalProps$requi,
|
|
113
|
+
labelSign = _useGlobalProps.labelSign,
|
|
114
|
+
_useGlobalProps$error = _useGlobalProps.error,
|
|
115
|
+
error = _useGlobalProps$error === void 0 ? false : _useGlobalProps$error,
|
|
116
|
+
hideErrorDom = _useGlobalProps.hideErrorDom,
|
|
117
|
+
_useGlobalProps$helpe = _useGlobalProps.helperText,
|
|
118
|
+
helperText = _useGlobalProps$helpe === void 0 ? '' : _useGlobalProps$helpe,
|
|
119
|
+
list = _useGlobalProps.list,
|
|
120
|
+
_useGlobalProps$showN = _useGlobalProps.showName,
|
|
121
|
+
showName = _useGlobalProps$showN === void 0 ? 'label' : _useGlobalProps$showN,
|
|
122
|
+
_useGlobalProps$showV = _useGlobalProps.showValue,
|
|
123
|
+
showValue = _useGlobalProps$showV === void 0 ? 'value' : _useGlobalProps$showV,
|
|
124
|
+
_useGlobalProps$child = _useGlobalProps.childrenName,
|
|
125
|
+
childrenName = _useGlobalProps$child === void 0 ? 'children' : _useGlobalProps$child,
|
|
126
|
+
value = _useGlobalProps.value,
|
|
127
|
+
onChange = _useGlobalProps.onChange,
|
|
128
|
+
_useGlobalProps$overL = _useGlobalProps.overLine,
|
|
129
|
+
overLine = _useGlobalProps$overL === void 0 ? false : _useGlobalProps$overL,
|
|
130
|
+
_useGlobalProps$searc = _useGlobalProps.search,
|
|
131
|
+
search = _useGlobalProps$searc === void 0 ? false : _useGlobalProps$searc,
|
|
132
|
+
_useGlobalProps$searc2 = _useGlobalProps.searchModel,
|
|
133
|
+
searchModel = _useGlobalProps$searc2 === void 0 ? 'inside' : _useGlobalProps$searc2,
|
|
134
|
+
selectPopoverClassName = _useGlobalProps.selectPopoverClassName,
|
|
135
|
+
morePopoverClassName = _useGlobalProps.morePopoverClassName;
|
|
136
|
+
_useGlobalProps.fetchSuggestions;
|
|
137
|
+
var searchInputProps = _useGlobalProps.searchInputProps,
|
|
138
|
+
onEnter = _useGlobalProps.onEnter,
|
|
139
|
+
onEnterInput = _useGlobalProps.onEnterInput,
|
|
140
|
+
onClear = _useGlobalProps.onClear,
|
|
141
|
+
getPopupContainer = _useGlobalProps.getPopupContainer,
|
|
142
|
+
renderContent = _useGlobalProps.renderContent,
|
|
143
|
+
_useGlobalProps$selec = _useGlobalProps.selectCheckIcon,
|
|
144
|
+
selectCheckIcon = _useGlobalProps$selec === void 0 ? true : _useGlobalProps$selec;
|
|
152
145
|
var posDom = useRef(null);
|
|
153
|
-
|
|
154
146
|
var _useState = useState($prefixCls + '-select-' + UUID()),
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
147
|
+
_useState2 = _slicedToArray(_useState, 1),
|
|
148
|
+
classOne = _useState2[0]; // 唯一class
|
|
159
149
|
var _useState3 = useState('select-popover-' + UUID()),
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
150
|
+
_useState4 = _slicedToArray(_useState3, 1),
|
|
151
|
+
classOneSelect = _useState4[0]; // 唯一class
|
|
164
152
|
var _useState5 = useState(false),
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
153
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
154
|
+
open = _useState6[0],
|
|
155
|
+
setOpen = _useState6[1]; // 是否打开下拉框
|
|
170
156
|
var _useState7 = useState(false),
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
157
|
+
_useState8 = _slicedToArray(_useState7, 2),
|
|
158
|
+
showText = _useState8[0],
|
|
159
|
+
setShowText = _useState8[1]; // 是否显示lable,placeholder, true不显示
|
|
176
160
|
var _useState9 = useState([]),
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
161
|
+
_useState10 = _slicedToArray(_useState9, 2),
|
|
162
|
+
valueCom = _useState10[0],
|
|
163
|
+
setValueCom = _useState10[1]; // 值
|
|
182
164
|
var _useState11 = useState([]),
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
165
|
+
_useState12 = _slicedToArray(_useState11, 2),
|
|
166
|
+
listCom = _useState12[0],
|
|
167
|
+
setListCom = _useState12[1]; // 下拉框渲染
|
|
188
168
|
var _useState13 = useState({}),
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
169
|
+
_useState14 = _slicedToArray(_useState13, 2),
|
|
170
|
+
listJson = _useState14[0],
|
|
171
|
+
setListJson = _useState14[1]; // 下拉选项对象
|
|
194
172
|
var _useState15 = useState(null),
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
173
|
+
_useState16 = _slicedToArray(_useState15, 2),
|
|
174
|
+
morePos = _useState16[0],
|
|
175
|
+
setMorePos = _useState16[1]; // 超出在原始位置
|
|
200
176
|
var _useState17 = useState(false),
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
177
|
+
_useState18 = _slicedToArray(_useState17, 2),
|
|
178
|
+
openMore = _useState18[0],
|
|
179
|
+
setOpenMore = _useState18[1]; // 显示更多
|
|
206
180
|
var _useState19 = useState(''),
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
181
|
+
_useState20 = _slicedToArray(_useState19, 2),
|
|
182
|
+
searchValue = _useState20[0],
|
|
183
|
+
setSearchValue = _useState20[1]; // 搜索值
|
|
212
184
|
var _useState21 = useState(false),
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
185
|
+
_useState22 = _slicedToArray(_useState21, 2),
|
|
186
|
+
overLineCom = _useState22[0],
|
|
187
|
+
setOverLineCom = _useState22[1]; // 超出是否换行
|
|
218
188
|
var _useState23 = useState(false),
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
189
|
+
_useState24 = _slicedToArray(_useState23, 2),
|
|
190
|
+
loading = _useState24[0],
|
|
191
|
+
setLoading = _useState24[1]; // 下拉加载loading
|
|
224
192
|
var _useState25 = useState(false),
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
193
|
+
_useState26 = _slicedToArray(_useState25, 2),
|
|
194
|
+
emptyBol = _useState26[0],
|
|
195
|
+
setEmptyBol = _useState26[1]; // 延迟显示空状态
|
|
230
196
|
var textDom = useRef(null);
|
|
231
|
-
|
|
232
197
|
var _useState27 = useState({}),
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
198
|
+
_useState28 = _slicedToArray(_useState27, 1),
|
|
199
|
+
constData = _useState28[0]; // 不变的常量 多行 不换行定时器 搜索定时器
|
|
237
200
|
var _React$useContext = React__default.useContext(GlobalContext),
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
201
|
+
language = _React$useContext.language,
|
|
202
|
+
locale = _React$useContext.locale;
|
|
241
203
|
var intl = useFormatMessage('Select', localeJson);
|
|
242
204
|
useEffect(function () {
|
|
243
205
|
if (props.defaultValue !== undefined) {
|
|
@@ -249,15 +211,14 @@ var Select = function Select(props) {
|
|
|
249
211
|
setValueCom(props.defaultValue === '' ? [] : [props.defaultValue]);
|
|
250
212
|
}
|
|
251
213
|
}
|
|
252
|
-
|
|
253
214
|
return function () {
|
|
254
215
|
clearTimeout(constData.searchTimer);
|
|
255
216
|
clearTimeout(constData.timer);
|
|
256
217
|
clearTimeout(constData.scrollTimer);
|
|
257
218
|
clearTimeout(constData.timerEmpty);
|
|
258
219
|
};
|
|
259
|
-
}, []);
|
|
260
|
-
|
|
220
|
+
}, []);
|
|
221
|
+
// 赋值value
|
|
261
222
|
useEffect(function () {
|
|
262
223
|
if (value !== undefined) {
|
|
263
224
|
if (multiple) {
|
|
@@ -268,8 +229,8 @@ var Select = function Select(props) {
|
|
|
268
229
|
setValueCom(value === '' ? [] : [value]);
|
|
269
230
|
}
|
|
270
231
|
}
|
|
271
|
-
}, [value, multiple]);
|
|
272
|
-
|
|
232
|
+
}, [value, multiple]);
|
|
233
|
+
// 判断组件超出是换行,还是不换行
|
|
273
234
|
useEffect(function () {
|
|
274
235
|
if (searchModel === 'outside' && input) {
|
|
275
236
|
if (multiple) return setOverLineCom(true); // 多选,输入框在框里面,超出必须换行
|
|
@@ -277,18 +238,15 @@ var Select = function Select(props) {
|
|
|
277
238
|
}
|
|
278
239
|
|
|
279
240
|
setOverLineCom(overLine);
|
|
280
|
-
}, [overLine, searchModel, multiple, input]);
|
|
281
|
-
|
|
241
|
+
}, [overLine, searchModel, multiple, input]);
|
|
242
|
+
// 计算下拉选项,处理下拉选项json
|
|
282
243
|
useEffect(function () {
|
|
283
244
|
var listHand = handList(list);
|
|
284
245
|
var json = {};
|
|
285
|
-
|
|
286
246
|
for (var i = 0, l = listHand.length; i < l; i++) {
|
|
287
247
|
var item = listHand[i];
|
|
288
|
-
|
|
289
248
|
if (item[childrenName] && item[childrenName].length > 0) {
|
|
290
249
|
var childArr = item[childrenName];
|
|
291
|
-
|
|
292
250
|
for (var j = 0, k = childArr.length; j < k; j++) {
|
|
293
251
|
var childItem = childArr[j];
|
|
294
252
|
var key = childItem[showValue];
|
|
@@ -299,7 +257,6 @@ var Select = function Select(props) {
|
|
|
299
257
|
json[_key] = item;
|
|
300
258
|
}
|
|
301
259
|
}
|
|
302
|
-
|
|
303
260
|
setListJson(json);
|
|
304
261
|
}, [list]);
|
|
305
262
|
useEffect(function () {
|
|
@@ -309,8 +266,8 @@ var Select = function Select(props) {
|
|
|
309
266
|
setMorePos(valueCom.length);
|
|
310
267
|
}
|
|
311
268
|
}
|
|
312
|
-
}, [overLineCom, multiple, valueCom]);
|
|
313
|
-
|
|
269
|
+
}, [overLineCom, multiple, valueCom]);
|
|
270
|
+
// 多行,不换行计算
|
|
314
271
|
useEffect(function () {
|
|
315
272
|
// 多行不换行计算
|
|
316
273
|
if (!overLineCom) {
|
|
@@ -321,30 +278,27 @@ var Select = function Select(props) {
|
|
|
321
278
|
} else {
|
|
322
279
|
setMorePos(valueCom.length);
|
|
323
280
|
}
|
|
324
|
-
|
|
325
281
|
return function () {
|
|
326
282
|
window.removeEventListener("resize", changeSize);
|
|
327
283
|
};
|
|
328
|
-
}, [valueCom, overLineCom]);
|
|
329
|
-
|
|
284
|
+
}, [valueCom, overLineCom]);
|
|
285
|
+
// 计算是否显示label,placehold
|
|
330
286
|
useEffect(function () {
|
|
331
287
|
if (valueCom && valueCom.length > 0) {
|
|
332
288
|
setShowText(true); // 有值不显示label,placehold
|
|
333
289
|
} else {
|
|
334
290
|
setShowText(false);
|
|
335
|
-
|
|
336
291
|
if (searchModel === 'outside') {
|
|
337
292
|
setShowText(searchValue !== '');
|
|
338
293
|
}
|
|
339
294
|
}
|
|
340
|
-
}, [search, searchValue, searchModel, valueCom, input]);
|
|
341
|
-
|
|
295
|
+
}, [search, searchValue, searchModel, valueCom, input]);
|
|
296
|
+
// 筛选下拉框数据
|
|
342
297
|
useEffect(function () {
|
|
343
298
|
if (!open) return;
|
|
344
299
|
clearTimeout(constData.searchTimer);
|
|
345
300
|
constData.searchTimer = setTimeout(function () {
|
|
346
301
|
setLoading(true);
|
|
347
|
-
|
|
348
302
|
if (props.fetchSuggestions) {
|
|
349
303
|
props.fetchSuggestions && props.fetchSuggestions(searchValue, function (data) {
|
|
350
304
|
var listHand = handList(data);
|
|
@@ -354,8 +308,8 @@ var Select = function Select(props) {
|
|
|
354
308
|
var listHand = handList(list);
|
|
355
309
|
handSelectList(listHand);
|
|
356
310
|
}
|
|
357
|
-
}, 100);
|
|
358
|
-
|
|
311
|
+
}, 100);
|
|
312
|
+
// 延迟显示下拉框空状态
|
|
359
313
|
clearTimeout(constData.timerEmpty);
|
|
360
314
|
setEmptyBol(false);
|
|
361
315
|
constData.timerEmpty = setTimeout(function () {
|
|
@@ -375,17 +329,16 @@ var Select = function Select(props) {
|
|
|
375
329
|
window.removeEventListener("click", clickCom);
|
|
376
330
|
window.removeEventListener("keydown", keydownCom);
|
|
377
331
|
}
|
|
378
|
-
|
|
379
332
|
return function () {
|
|
380
333
|
window.removeEventListener("click", clickCom);
|
|
381
334
|
window.removeEventListener("keydown", keydownCom);
|
|
382
335
|
};
|
|
383
|
-
}, [open]);
|
|
384
|
-
|
|
336
|
+
}, [open]);
|
|
337
|
+
// 搜索框有值,显示下拉框
|
|
385
338
|
useEffect(function () {
|
|
386
339
|
if (searchValue) setOpen(true);
|
|
387
|
-
}, [searchValue]);
|
|
388
|
-
|
|
340
|
+
}, [searchValue]);
|
|
341
|
+
// 是否计算搜索框长度
|
|
389
342
|
useEffect(function () {
|
|
390
343
|
if (disabled === true) return;
|
|
391
344
|
if (multiple && searchModel === 'outside') handInputLength(searchValue);
|
|
@@ -394,13 +347,10 @@ var Select = function Select(props) {
|
|
|
394
347
|
* 处理初始化数据,让list支持传入字符串
|
|
395
348
|
* 把数组转换成,组件能接收的格式
|
|
396
349
|
* */
|
|
397
|
-
|
|
398
350
|
var handList = function handList(arr) {
|
|
399
351
|
var handArr = [];
|
|
400
|
-
|
|
401
352
|
for (var i = 0, l = arr.length; i < l; i++) {
|
|
402
353
|
var item = arr[i];
|
|
403
|
-
|
|
404
354
|
if (_typeof(item) === 'object' && item !== null) {
|
|
405
355
|
handArr.push(item);
|
|
406
356
|
} else {
|
|
@@ -410,49 +360,38 @@ var Select = function Select(props) {
|
|
|
410
360
|
handArr.push(obj);
|
|
411
361
|
}
|
|
412
362
|
}
|
|
413
|
-
|
|
414
363
|
return handArr;
|
|
415
364
|
};
|
|
416
365
|
/**
|
|
417
366
|
* 处理下拉内容
|
|
418
367
|
* */
|
|
419
|
-
|
|
420
|
-
|
|
421
368
|
var handSelectList = function handSelectList(listData) {
|
|
422
369
|
var arr = [];
|
|
423
|
-
|
|
424
370
|
var listDeep = _toConsumableArray(listData);
|
|
425
|
-
|
|
426
371
|
for (var i = 0, l = listDeep.length; i < l; i++) {
|
|
427
372
|
var item = listDeep[i];
|
|
428
|
-
|
|
429
373
|
if (item[childrenName] && item[childrenName].length > 0) {
|
|
430
374
|
var childArr = item[childrenName];
|
|
431
375
|
var handChildArr = [];
|
|
432
|
-
|
|
433
376
|
for (var j = 0, k = childArr.length; j < k; j++) {
|
|
434
377
|
var childItem = childArr[j];
|
|
435
378
|
var bol = handShowItem(childItem);
|
|
436
379
|
if (bol) handChildArr.push(childItem);
|
|
437
|
-
}
|
|
438
|
-
|
|
439
|
-
|
|
380
|
+
}
|
|
381
|
+
// 存在二级
|
|
440
382
|
if (handChildArr.length > 0) {
|
|
441
383
|
item[childrenName] = handChildArr;
|
|
442
384
|
arr.push(item);
|
|
443
385
|
}
|
|
444
386
|
} else {
|
|
445
387
|
var _bol = handShowItem(item);
|
|
446
|
-
|
|
447
388
|
if (_bol) arr.push(item);
|
|
448
389
|
}
|
|
449
390
|
}
|
|
450
|
-
|
|
451
391
|
setListCom(arr);
|
|
452
392
|
setLoading(false);
|
|
453
|
-
};
|
|
454
|
-
|
|
455
|
-
|
|
393
|
+
};
|
|
394
|
+
// 输入框的到焦点
|
|
456
395
|
var inputFocus = function inputFocus() {
|
|
457
396
|
var inputDom = textDom && textDom.current;
|
|
458
397
|
inputDom && inputDom.focus({
|
|
@@ -464,30 +403,22 @@ var Select = function Select(props) {
|
|
|
464
403
|
* @param el 当前元素
|
|
465
404
|
* @param selector 查找元素class
|
|
466
405
|
*/
|
|
467
|
-
|
|
468
|
-
|
|
469
406
|
var closest = function closest(el, selector) {
|
|
470
407
|
var matchesSelector = el.matches || el.webkitMatchesSelector || el.mozMatchesSelector || el.msMatchesSelector;
|
|
471
|
-
|
|
472
408
|
while (el) {
|
|
473
409
|
if (matchesSelector.call(el, selector)) {
|
|
474
410
|
break;
|
|
475
411
|
}
|
|
476
|
-
|
|
477
412
|
el = el.parentElement;
|
|
478
413
|
}
|
|
479
|
-
|
|
480
414
|
return el;
|
|
481
415
|
};
|
|
482
416
|
/**
|
|
483
417
|
* 全局点击判断是否需要关闭
|
|
484
418
|
* @param e 当前点击元素
|
|
485
419
|
*/
|
|
486
|
-
|
|
487
|
-
|
|
488
420
|
var clickCom = function clickCom(e) {
|
|
489
421
|
var bol = closest(e.target, '.' + classOneSelect); // 是否存在下拉当中
|
|
490
|
-
|
|
491
422
|
if (!bol) setOpen(false);
|
|
492
423
|
};
|
|
493
424
|
/**
|
|
@@ -495,11 +426,9 @@ var Select = function Select(props) {
|
|
|
495
426
|
* @param item 详细信息
|
|
496
427
|
* @return boolean
|
|
497
428
|
*/
|
|
498
|
-
|
|
499
|
-
|
|
500
429
|
var handShowItem = function handShowItem(item) {
|
|
501
|
-
var bol = true;
|
|
502
|
-
|
|
430
|
+
var bol = true;
|
|
431
|
+
// 按显示名来
|
|
503
432
|
var name = item[showName];
|
|
504
433
|
if (name && typeof name === 'string' && name.toLowerCase().indexOf(searchValue.trim().toLowerCase()) === -1) bol = false;
|
|
505
434
|
return bol;
|
|
@@ -508,41 +437,35 @@ var Select = function Select(props) {
|
|
|
508
437
|
* 多选 不换行 计算
|
|
509
438
|
* @param index 数组下标
|
|
510
439
|
*/
|
|
511
|
-
|
|
512
|
-
|
|
513
440
|
var handMultiline = function handMultiline(index) {
|
|
514
441
|
if (index === null || index === 0) return;
|
|
515
442
|
if (index === undefined) index = valueCom.length;
|
|
516
443
|
var boxDom = document.querySelector('.' + classOne + ' > .select-content > .check-select-content');
|
|
517
444
|
if (!boxDom) return;
|
|
518
|
-
|
|
519
445
|
if (boxDom.scrollHeight > boxDom.clientHeight) {
|
|
520
|
-
var num = Number(index) - 1;
|
|
521
|
-
|
|
446
|
+
var num = Number(index) - 1;
|
|
447
|
+
// 超出
|
|
522
448
|
setMorePos(num);
|
|
523
449
|
handMultiline(num);
|
|
524
450
|
} else {
|
|
525
451
|
// 一行
|
|
526
452
|
if (valueCom.length <= index) handleCloseMore();
|
|
527
453
|
}
|
|
528
|
-
};
|
|
529
|
-
|
|
530
|
-
|
|
454
|
+
};
|
|
455
|
+
// 多选 不换行
|
|
531
456
|
var changeSize = function changeSize() {
|
|
532
457
|
clearTimeout(constData.timer);
|
|
533
458
|
constData.timer = setTimeout(function () {
|
|
534
459
|
setMorePos(valueCom.length);
|
|
535
460
|
handMultiline();
|
|
536
461
|
}, 100);
|
|
537
|
-
};
|
|
538
|
-
|
|
539
|
-
|
|
462
|
+
};
|
|
463
|
+
// 显示下拉框
|
|
540
464
|
var clickSelect = function clickSelect() {
|
|
541
465
|
if (disabled === true) return;
|
|
542
466
|
setOpen(true);
|
|
543
|
-
};
|
|
544
|
-
|
|
545
|
-
|
|
467
|
+
};
|
|
468
|
+
// 关闭下拉框
|
|
546
469
|
var handleClose = function handleClose() {
|
|
547
470
|
setOpen(false);
|
|
548
471
|
};
|
|
@@ -550,15 +473,12 @@ var Select = function Select(props) {
|
|
|
550
473
|
* 点击显示更多
|
|
551
474
|
* @param e 点击元素
|
|
552
475
|
*/
|
|
553
|
-
|
|
554
|
-
|
|
555
476
|
var clickMore = function clickMore(e) {
|
|
556
477
|
setOpenMore(true);
|
|
557
478
|
setOpen(false);
|
|
558
479
|
e.stopPropagation();
|
|
559
|
-
};
|
|
560
|
-
|
|
561
|
-
|
|
480
|
+
};
|
|
481
|
+
// 关闭显示更多
|
|
562
482
|
var handleCloseMore = function handleCloseMore() {
|
|
563
483
|
setOpenMore(false);
|
|
564
484
|
};
|
|
@@ -568,24 +488,19 @@ var Select = function Select(props) {
|
|
|
568
488
|
* @param enter 是否回车
|
|
569
489
|
* @param e 元素
|
|
570
490
|
*/
|
|
571
|
-
|
|
572
|
-
|
|
573
491
|
var clickItem = function clickItem(item, enter) {
|
|
574
492
|
return function (e) {
|
|
575
493
|
var val = item[showValue];
|
|
576
494
|
if (_typeof(disabled) === 'object' && disabled.indexOf(val) !== -1) return;
|
|
577
|
-
|
|
578
495
|
if (multiple) {
|
|
579
496
|
// 多选
|
|
580
497
|
var index = valueCom.indexOf(val);
|
|
581
|
-
|
|
582
498
|
if (index !== -1) {
|
|
583
499
|
// 存在 去除
|
|
584
500
|
valueCom.splice(index, 1);
|
|
585
501
|
} else {
|
|
586
502
|
valueCom.push(val);
|
|
587
503
|
}
|
|
588
|
-
|
|
589
504
|
if (props.value === undefined) setValueCom(_toConsumableArray(valueCom));
|
|
590
505
|
onChange && onChange(_toConsumableArray(valueCom), e);
|
|
591
506
|
if (enter) onEnter && onEnter(_toConsumableArray(valueCom));
|
|
@@ -606,21 +521,17 @@ var Select = function Select(props) {
|
|
|
606
521
|
* @param val 值
|
|
607
522
|
* @param e 元素
|
|
608
523
|
*/
|
|
609
|
-
|
|
610
|
-
|
|
611
524
|
var delItem = function delItem(item, val) {
|
|
612
525
|
return function (e) {
|
|
613
526
|
if (!item) item = _defineProperty({}, showValue, val);
|
|
614
527
|
clickItem(item)(e);
|
|
615
528
|
e.stopPropagation();
|
|
616
529
|
};
|
|
617
|
-
};
|
|
618
|
-
|
|
619
|
-
|
|
530
|
+
};
|
|
531
|
+
// 处理下拉框class
|
|
620
532
|
var handClass = function handClass() {
|
|
621
533
|
var str = "".concat($prefixCls, "-select");
|
|
622
534
|
if (multiple && !overLineCom) str += ' ' + classOne; // 多选 超出不换行
|
|
623
|
-
|
|
624
535
|
if (className) str += ' ' + className;
|
|
625
536
|
if (size) str += " ".concat($prefixCls, "-select-").concat(size);
|
|
626
537
|
if (error) str += " ".concat($prefixCls, "-select-error");
|
|
@@ -628,29 +539,24 @@ var Select = function Select(props) {
|
|
|
628
539
|
if (open) str += " ".concat($prefixCls, "-select-open");
|
|
629
540
|
if (multiple) str += " ".concat($prefixCls, "-select-multiple");
|
|
630
541
|
if (overLineCom) str += " ".concat($prefixCls, "-select-over-line"); // 可输入,换行
|
|
631
|
-
|
|
632
542
|
if (showSelect) str += " ".concat($prefixCls, "-select-show-select");
|
|
633
543
|
if (valueCom.length > 0) str += " ".concat($prefixCls, "-select-value");
|
|
634
544
|
if (allowClear) str += " ".concat($prefixCls, "-select-allow-clear");
|
|
635
545
|
return str;
|
|
636
|
-
};
|
|
637
|
-
|
|
638
|
-
|
|
546
|
+
};
|
|
547
|
+
// 处理下拉弹框class
|
|
639
548
|
var handleClassPopover = function handleClassPopover() {
|
|
640
549
|
var str = "".concat($prefixCls, "-select-popover ").concat($prefixCls, "-scrollbar-small");
|
|
641
550
|
if (size) str += " ".concat($prefixCls, "-select-popover-").concat(size);
|
|
642
|
-
|
|
643
551
|
if (multiple) {
|
|
644
552
|
str += " ".concat($prefixCls, "-select-popover-multiple");
|
|
645
553
|
} else {
|
|
646
554
|
str += " ".concat($prefixCls, "-select-popover-radio");
|
|
647
555
|
}
|
|
648
|
-
|
|
649
556
|
if (selectPopoverClassName) str += ' ' + selectPopoverClassName;
|
|
650
557
|
return str;
|
|
651
|
-
};
|
|
652
|
-
|
|
653
|
-
|
|
558
|
+
};
|
|
559
|
+
// 处理下拉框更多class
|
|
654
560
|
var handleClassMorePopover = function handleClassMorePopover() {
|
|
655
561
|
var str = "".concat($prefixCls, "-select-more-popover ").concat($prefixCls, "-scrollbar-small");
|
|
656
562
|
if (size) str += " ".concat($prefixCls, "-select-more-popover-").concat(size);
|
|
@@ -661,8 +567,6 @@ var Select = function Select(props) {
|
|
|
661
567
|
* 改变搜索输入框
|
|
662
568
|
* @param e 搜索框元素
|
|
663
569
|
*/
|
|
664
|
-
|
|
665
|
-
|
|
666
570
|
var changeSearch = function changeSearch(e) {
|
|
667
571
|
setSearchValue(e.target.value);
|
|
668
572
|
searchInputProps && searchInputProps.onChange && searchInputProps.onChange(e);
|
|
@@ -671,43 +575,34 @@ var Select = function Select(props) {
|
|
|
671
575
|
* 回车搜索输入框
|
|
672
576
|
* @param e 搜索框元素
|
|
673
577
|
*/
|
|
674
|
-
|
|
675
|
-
|
|
676
578
|
var onKeyDownSearch = function onKeyDownSearch(e) {
|
|
677
579
|
if (e.keyCode === 13) {
|
|
678
580
|
onEnterInput && onEnterInput(searchValue);
|
|
679
581
|
var selectDom = document.querySelector('.' + classOneSelect + ' .select-popover-list');
|
|
680
|
-
|
|
681
582
|
if (selectDom) {
|
|
682
583
|
var hoverDom = selectDom.querySelector('.select-popover-list-item-hover');
|
|
683
584
|
var keydownDom = selectDom.querySelector('.select-popover-list-item-keydown');
|
|
684
585
|
var operateDom = keydownDom || hoverDom;
|
|
685
586
|
if (operateDom) return;
|
|
686
587
|
}
|
|
687
|
-
|
|
688
588
|
if (props.input && searchValue.trim() !== '') {
|
|
689
589
|
var arr = '';
|
|
690
|
-
|
|
691
590
|
if (multiple) {
|
|
692
591
|
arr = [].concat(_toConsumableArray(valueCom), [searchValue]);
|
|
693
592
|
} else {
|
|
694
593
|
arr = searchValue;
|
|
695
594
|
}
|
|
696
|
-
|
|
697
595
|
if (props.value === undefined) setValueCom(arr);
|
|
698
596
|
onChange && onChange(arr, e);
|
|
699
597
|
setSearchValue('');
|
|
700
598
|
}
|
|
701
599
|
}
|
|
702
|
-
|
|
703
600
|
searchInputProps && searchInputProps.onKeyDown && searchInputProps.onKeyDown(e);
|
|
704
601
|
};
|
|
705
602
|
/**
|
|
706
603
|
* 多选框设置input框长度
|
|
707
604
|
* @param text 文本
|
|
708
605
|
*/
|
|
709
|
-
|
|
710
|
-
|
|
711
606
|
var handInputLength = function handInputLength(text) {
|
|
712
607
|
var inputDom = textDom && textDom.current;
|
|
713
608
|
if (!inputDom) return null;
|
|
@@ -729,47 +624,37 @@ var Select = function Select(props) {
|
|
|
729
624
|
* currentDom: 当前元素
|
|
730
625
|
* }
|
|
731
626
|
*/
|
|
732
|
-
|
|
733
|
-
|
|
734
627
|
var handKeydown = function handKeydown(config) {
|
|
735
628
|
var selectDom = config.selectDom,
|
|
736
|
-
|
|
737
|
-
|
|
629
|
+
keyCode = config.keyCode,
|
|
630
|
+
currentKeydownDom = config.currentKeydownDom;
|
|
738
631
|
var brotherDom = null;
|
|
739
632
|
var type = 'nextSibling';
|
|
740
633
|
var classSelectStr = '.select-popover-list > div';
|
|
741
634
|
var classGroupStr = '.select-popover-list-item';
|
|
742
|
-
|
|
743
635
|
if (keyCode === 38) {
|
|
744
636
|
// 上
|
|
745
637
|
type = 'previousSibling';
|
|
746
638
|
classSelectStr = '.select-popover-list > div:last-child';
|
|
747
639
|
classGroupStr = '.select-popover-list-item:last-child';
|
|
748
640
|
}
|
|
749
|
-
|
|
750
641
|
if (!currentKeydownDom) {
|
|
751
642
|
brotherDom = selectDom.querySelector(classSelectStr); // 初始节点
|
|
752
643
|
} else {
|
|
753
644
|
brotherDom = currentKeydownDom[type];
|
|
754
|
-
|
|
755
645
|
if (brotherDom) {
|
|
756
646
|
if (brotherDom.className.indexOf('select-popover-list-group-label') !== -1) {
|
|
757
647
|
// 存在标题元素
|
|
758
648
|
brotherDom = currentKeydownDom.parentNode; // 组元素
|
|
759
|
-
|
|
760
649
|
brotherDom = brotherDom[type]; // 组元素兄弟节点
|
|
761
|
-
|
|
762
650
|
if (!brotherDom) brotherDom = selectDom.querySelector(classSelectStr);
|
|
763
651
|
}
|
|
764
652
|
} else {
|
|
765
653
|
var parentNode = currentKeydownDom.parentNode;
|
|
766
|
-
|
|
767
654
|
if (parentNode && parentNode.className && parentNode.className.indexOf('select-popover-list-group') !== -1) {
|
|
768
655
|
// 组元素最后元素, 设置父级兄弟节点, 没有父级,设置最后或者第一节点
|
|
769
656
|
brotherDom = currentKeydownDom.parentNode; // 组元素
|
|
770
|
-
|
|
771
657
|
brotherDom = brotherDom[type]; // 组元素兄弟节点
|
|
772
|
-
|
|
773
658
|
if (!brotherDom) brotherDom = selectDom.querySelector(classSelectStr);
|
|
774
659
|
} else {
|
|
775
660
|
// 不存在兄弟节点,设置最后一个或第一个
|
|
@@ -777,12 +662,10 @@ var Select = function Select(props) {
|
|
|
777
662
|
}
|
|
778
663
|
}
|
|
779
664
|
}
|
|
780
|
-
|
|
781
665
|
if (brotherDom) {
|
|
782
666
|
// 兄弟是组列表
|
|
783
667
|
if (brotherDom.className.indexOf('select-popover-list-group') !== -1) {
|
|
784
668
|
var currentDom = brotherDom.querySelector(classGroupStr);
|
|
785
|
-
|
|
786
669
|
if (currentDom) {
|
|
787
670
|
currentDom.classList.add("select-popover-list-item-keydown");
|
|
788
671
|
domClientTop(currentDom, selectDom);
|
|
@@ -798,23 +681,18 @@ var Select = function Select(props) {
|
|
|
798
681
|
* @param currentDom 当前元素
|
|
799
682
|
* @param selectDom 可见页面
|
|
800
683
|
*/
|
|
801
|
-
|
|
802
|
-
|
|
803
684
|
var domClientTop = function domClientTop(currentDom, selectDom) {
|
|
804
685
|
clearTimeout(constData.scrollTimer);
|
|
805
686
|
var clientHeight = selectDom.clientHeight; // 可见区域的高度
|
|
806
|
-
|
|
807
687
|
var top = currentDom.offsetTop + currentDom.clientHeight;
|
|
808
688
|
var difference = top - clientHeight;
|
|
809
689
|
constData.scroll = true;
|
|
810
|
-
|
|
811
690
|
if (difference > 0) {
|
|
812
691
|
selectDom.scrollTop = difference;
|
|
813
692
|
} else {
|
|
814
693
|
selectDom.scrollTop = 0;
|
|
815
|
-
}
|
|
816
|
-
|
|
817
|
-
|
|
694
|
+
}
|
|
695
|
+
// 防止滚动触发hover效果
|
|
818
696
|
constData.scrollTimer = setTimeout(function () {
|
|
819
697
|
constData.scroll = false;
|
|
820
698
|
}, 100);
|
|
@@ -823,8 +701,6 @@ var Select = function Select(props) {
|
|
|
823
701
|
* 键盘事件
|
|
824
702
|
* @param e 键盘信息
|
|
825
703
|
*/
|
|
826
|
-
|
|
827
|
-
|
|
828
704
|
var keydownCom = function keydownCom(e) {
|
|
829
705
|
var selectDom = document.querySelector('.' + classOneSelect + ' .select-popover-list');
|
|
830
706
|
if (!selectDom) return;
|
|
@@ -832,12 +708,10 @@ var Select = function Select(props) {
|
|
|
832
708
|
var hoverDom = selectDom.querySelector('.select-popover-list-item-hover');
|
|
833
709
|
var keydownDom = selectDom.querySelector('.select-popover-list-item-keydown');
|
|
834
710
|
var currentKeydownDom = selectItemDom; // 选中,hover,keydown元素
|
|
835
|
-
|
|
836
|
-
|
|
837
|
-
|
|
711
|
+
if (hoverDom) currentKeydownDom = hoverDom;
|
|
712
|
+
// 回车
|
|
838
713
|
if (e.keyCode === 13) {
|
|
839
714
|
var operateDom = keydownDom || hoverDom;
|
|
840
|
-
|
|
841
715
|
if (operateDom) {
|
|
842
716
|
var val = operateDom.dataset.val;
|
|
843
717
|
clickItem(listJson[val], true)({
|
|
@@ -847,22 +721,19 @@ var Select = function Select(props) {
|
|
|
847
721
|
onEnter && onEnter(value);
|
|
848
722
|
}
|
|
849
723
|
}
|
|
850
|
-
|
|
851
724
|
if (keydownDom) {
|
|
852
725
|
currentKeydownDom = keydownDom;
|
|
853
726
|
keydownDom.classList.remove("select-popover-list-item-keydown");
|
|
854
|
-
}
|
|
855
|
-
|
|
856
|
-
|
|
727
|
+
}
|
|
728
|
+
// 下
|
|
857
729
|
if (e.keyCode === 40) {
|
|
858
730
|
handKeydown({
|
|
859
731
|
selectDom: selectDom,
|
|
860
732
|
keyCode: e.keyCode,
|
|
861
733
|
currentKeydownDom: currentKeydownDom
|
|
862
734
|
});
|
|
863
|
-
}
|
|
864
|
-
|
|
865
|
-
|
|
735
|
+
}
|
|
736
|
+
// 上
|
|
866
737
|
if (e.keyCode === 38) {
|
|
867
738
|
handKeydown({
|
|
868
739
|
selectDom: selectDom,
|
|
@@ -875,14 +746,12 @@ var Select = function Select(props) {
|
|
|
875
746
|
* 鼠标移入
|
|
876
747
|
* @param e 移入元素
|
|
877
748
|
*/
|
|
878
|
-
|
|
879
|
-
|
|
880
749
|
var mouseEnter = function mouseEnter(e) {
|
|
881
750
|
if (constData.scroll) return;
|
|
882
751
|
var target = closest(e.target, '.select-popover-list-item');
|
|
883
752
|
if (!target) return;
|
|
884
|
-
target.classList.add("select-popover-list-item-hover");
|
|
885
|
-
|
|
753
|
+
target.classList.add("select-popover-list-item-hover");
|
|
754
|
+
// 鼠标移入清除所有keydown
|
|
886
755
|
var selectDom = document.querySelector('.' + classOneSelect);
|
|
887
756
|
var keydownDom = selectDom.querySelector('.select-popover-list-item-keydown');
|
|
888
757
|
if (keydownDom) keydownDom.classList.remove("select-popover-list-item-keydown");
|
|
@@ -891,28 +760,21 @@ var Select = function Select(props) {
|
|
|
891
760
|
* 鼠标移出
|
|
892
761
|
* @param e 移出元素
|
|
893
762
|
*/
|
|
894
|
-
|
|
895
|
-
|
|
896
763
|
var mouseLeave = function mouseLeave(e) {
|
|
897
764
|
var target = closest(e.target, '.select-popover-list-item');
|
|
898
765
|
if (!target) return;
|
|
899
766
|
target.classList.remove("select-popover-list-item-hover");
|
|
900
|
-
};
|
|
901
|
-
|
|
902
|
-
|
|
767
|
+
};
|
|
768
|
+
// 外标题memo
|
|
903
769
|
var OutLabelMemo = useMemo(function () {
|
|
904
770
|
var bol = Boolean(label || required || labelSign);
|
|
905
|
-
|
|
906
771
|
var handLabelClass = function handLabelClass() {
|
|
907
772
|
var str = 'select-label';
|
|
908
|
-
|
|
909
773
|
if (labelTooltip && labelTooltip.className) {
|
|
910
774
|
str += ' ' + labelTooltip.className;
|
|
911
775
|
}
|
|
912
|
-
|
|
913
776
|
return str;
|
|
914
777
|
};
|
|
915
|
-
|
|
916
778
|
return jsx(Fragment, {
|
|
917
779
|
children: labelMode === 'outside' && bol && jsx(Label, Object.assign({
|
|
918
780
|
label: label,
|
|
@@ -922,8 +784,8 @@ var Select = function Select(props) {
|
|
|
922
784
|
className: handLabelClass()
|
|
923
785
|
}))
|
|
924
786
|
});
|
|
925
|
-
}, [labelMode, label, labelSign, required, labelTooltip]);
|
|
926
|
-
|
|
787
|
+
}, [labelMode, label, labelSign, required, labelTooltip]);
|
|
788
|
+
// 内标题memo
|
|
927
789
|
var InsideMemo = useMemo(function () {
|
|
928
790
|
var handInsideContent = function handInsideContent() {
|
|
929
791
|
if (labelMode === 'outside') return placeholder;
|
|
@@ -937,7 +799,6 @@ var Select = function Select(props) {
|
|
|
937
799
|
})]
|
|
938
800
|
});
|
|
939
801
|
};
|
|
940
|
-
|
|
941
802
|
return jsx(Fragment, {
|
|
942
803
|
children: !showText && jsx("span", Object.assign({
|
|
943
804
|
className: "select-label-placeholder"
|
|
@@ -949,11 +810,9 @@ var Select = function Select(props) {
|
|
|
949
810
|
/**
|
|
950
811
|
* 处理搜索框
|
|
951
812
|
* */
|
|
952
|
-
|
|
953
813
|
var handInput = function handInput(type) {
|
|
954
814
|
if (disabled === true) return null;
|
|
955
815
|
var str = "".concat(type, "-search-outside");
|
|
956
|
-
|
|
957
816
|
if (searchModel === 'outside') {
|
|
958
817
|
return jsx("input", Object.assign({}, searchInputProps, {
|
|
959
818
|
className: str,
|
|
@@ -963,11 +822,9 @@ var Select = function Select(props) {
|
|
|
963
822
|
ref: textDom
|
|
964
823
|
}));
|
|
965
824
|
}
|
|
966
|
-
|
|
967
825
|
return null;
|
|
968
|
-
};
|
|
969
|
-
|
|
970
|
-
|
|
826
|
+
};
|
|
827
|
+
// 单选内容
|
|
971
828
|
var RadioMemo = useMemo(function () {
|
|
972
829
|
var handContent = function handContent() {
|
|
973
830
|
// 有搜索值且(输入框在内容里面或者有输入赋值)
|
|
@@ -979,7 +836,6 @@ var Select = function Select(props) {
|
|
|
979
836
|
children: renderContentVal || val
|
|
980
837
|
});
|
|
981
838
|
};
|
|
982
|
-
|
|
983
839
|
return jsx(Fragment, {
|
|
984
840
|
children: !multiple && jsxs(Fragment, {
|
|
985
841
|
children: [jsx("div", Object.assign({
|
|
@@ -989,15 +845,14 @@ var Select = function Select(props) {
|
|
|
989
845
|
})), handInput('radio')]
|
|
990
846
|
})
|
|
991
847
|
});
|
|
992
|
-
}, [multiple, showText, overLineCom, listJson, valueCom, showName, search, searchModel, searchValue, disabled, input, searchInputProps, renderContent]);
|
|
993
|
-
|
|
848
|
+
}, [multiple, showText, overLineCom, listJson, valueCom, showName, search, searchModel, searchValue, disabled, input, searchInputProps, renderContent]);
|
|
849
|
+
// 多选内容
|
|
994
850
|
var CheckMemo = useMemo(function () {
|
|
995
851
|
var handContent = function handContent(index) {
|
|
996
852
|
var val = listJson[valueCom[index]] && listJson[valueCom[index]][showName] || valueCom[index];
|
|
997
853
|
var renderContentVal = renderContent && renderContent(listJson[valueCom[index]], false);
|
|
998
854
|
return renderContentVal || val;
|
|
999
855
|
};
|
|
1000
|
-
|
|
1001
856
|
return jsx(Fragment, {
|
|
1002
857
|
children: multiple && jsxs("div", Object.assign({
|
|
1003
858
|
className: "check-select-content"
|
|
@@ -1005,7 +860,6 @@ var Select = function Select(props) {
|
|
|
1005
860
|
children: [valueCom && valueCom.map(function (item, index) {
|
|
1006
861
|
if (morePos !== null && morePos <= index) return null;
|
|
1007
862
|
var isClose = true;
|
|
1008
|
-
|
|
1009
863
|
if (disabled === true || _typeof(disabled) === 'object' && disabled.indexOf(valueCom[index]) !== -1) {
|
|
1010
864
|
isClose = false; // 禁用不显示×
|
|
1011
865
|
}
|
|
@@ -1036,19 +890,16 @@ var Select = function Select(props) {
|
|
|
1036
890
|
}))
|
|
1037
891
|
});
|
|
1038
892
|
}, [multiple, showText, valueCom, morePos, listJson, disabled, onChange, searchValue, search, searchModel, input, searchInputProps, renderContent]);
|
|
1039
|
-
|
|
1040
893
|
var clickClean = function clickClean(e) {
|
|
1041
894
|
e.stopPropagation();
|
|
1042
895
|
var val = '';
|
|
1043
896
|
var valCom = [];
|
|
1044
|
-
|
|
1045
897
|
if (multiple) {
|
|
1046
|
-
val = [];
|
|
1047
|
-
|
|
898
|
+
val = [];
|
|
899
|
+
// 判断多选的时候,有部分数据被禁用,禁用的数据不可删除
|
|
1048
900
|
if (disabled instanceof Array) {
|
|
1049
901
|
for (var i = 0, l = valueCom.length; i < l; i++) {
|
|
1050
902
|
var valueComItem = valueCom[i];
|
|
1051
|
-
|
|
1052
903
|
if (disabled.indexOf(valueComItem) !== -1) {
|
|
1053
904
|
val.push(valueComItem);
|
|
1054
905
|
valCom.push(valueComItem);
|
|
@@ -1056,17 +907,14 @@ var Select = function Select(props) {
|
|
|
1056
907
|
}
|
|
1057
908
|
}
|
|
1058
909
|
}
|
|
1059
|
-
|
|
1060
910
|
if (props.value === undefined) {
|
|
1061
911
|
setValueCom(valCom);
|
|
1062
912
|
}
|
|
1063
|
-
|
|
1064
913
|
onChange && onChange(val, e);
|
|
1065
914
|
setOpen(false);
|
|
1066
915
|
onClear && onClear();
|
|
1067
|
-
};
|
|
1068
|
-
|
|
1069
|
-
|
|
916
|
+
};
|
|
917
|
+
// 清空内容
|
|
1070
918
|
var clearRender = function clearRender() {
|
|
1071
919
|
if (valueCom.length > 0 && disabled !== true && allowClear) {
|
|
1072
920
|
return jsx("span", Object.assign({
|
|
@@ -1077,14 +925,12 @@ var Select = function Select(props) {
|
|
|
1077
925
|
}));
|
|
1078
926
|
}
|
|
1079
927
|
};
|
|
1080
|
-
|
|
1081
928
|
var morePopoverContent = function morePopoverContent() {
|
|
1082
929
|
var handContent = function handContent(index) {
|
|
1083
930
|
var val = listJson[valueCom[index]] && listJson[valueCom[index]][showName] || valueCom[index];
|
|
1084
931
|
var renderContentVal = renderContent && renderContent(listJson[valueCom[index]], false);
|
|
1085
932
|
return renderContentVal || val;
|
|
1086
933
|
};
|
|
1087
|
-
|
|
1088
934
|
return jsxs("div", Object.assign({
|
|
1089
935
|
className: "select-more"
|
|
1090
936
|
}, {
|
|
@@ -1104,7 +950,6 @@ var Select = function Select(props) {
|
|
|
1104
950
|
children: valueCom && valueCom.map(function (item, index) {
|
|
1105
951
|
if (morePos !== null && morePos > index) return null;
|
|
1106
952
|
var isClose = true;
|
|
1107
|
-
|
|
1108
953
|
if (disabled === true || _typeof(disabled) === 'object' && disabled.indexOf(valueCom[index]) !== -1) {
|
|
1109
954
|
isClose = false; // 禁用不显示×
|
|
1110
955
|
}
|
|
@@ -1123,9 +968,8 @@ var Select = function Select(props) {
|
|
|
1123
968
|
})
|
|
1124
969
|
}))]
|
|
1125
970
|
}));
|
|
1126
|
-
};
|
|
1127
|
-
|
|
1128
|
-
|
|
971
|
+
};
|
|
972
|
+
// 主体内容
|
|
1129
973
|
var ContentMemo = useMemo(function () {
|
|
1130
974
|
return jsx(Popover, Object.assign({
|
|
1131
975
|
placement: "rightTop",
|
|
@@ -1146,15 +990,14 @@ var Select = function Select(props) {
|
|
|
1146
990
|
})), RadioMemo, CheckMemo]
|
|
1147
991
|
}))
|
|
1148
992
|
}));
|
|
1149
|
-
}, [posDom, showText, labelMode, placeholder, label, labelSign, required, overLineCom, listJson, valueCom, showName, multiple, morePos, disabled, onChange, searchValue, searchModel, input, showSelect, searchInputProps, allowClear, onClear, openMore, renderContent]);
|
|
1150
|
-
|
|
993
|
+
}, [posDom, showText, labelMode, placeholder, label, labelSign, required, overLineCom, listJson, valueCom, showName, multiple, morePos, disabled, onChange, searchValue, searchModel, input, showSelect, searchInputProps, allowClear, onClear, openMore, renderContent]);
|
|
994
|
+
// 下拉框popover 列表
|
|
1151
995
|
var SelectPopoverListMemo = useMemo(function () {
|
|
1152
996
|
var handClass = function handClass() {
|
|
1153
997
|
var str = 'select-popover-list';
|
|
1154
998
|
if (loading) str += ' select-popover-list-loading';
|
|
1155
999
|
return str;
|
|
1156
1000
|
};
|
|
1157
|
-
|
|
1158
1001
|
var handContent = function handContent(item) {
|
|
1159
1002
|
var val = item[showName] || item[showValue];
|
|
1160
1003
|
var renderContentVal = renderContent && renderContent(item, true);
|
|
@@ -1172,7 +1015,6 @@ var Select = function Select(props) {
|
|
|
1172
1015
|
}))]
|
|
1173
1016
|
});
|
|
1174
1017
|
};
|
|
1175
|
-
|
|
1176
1018
|
return jsxs("div", Object.assign({
|
|
1177
1019
|
className: handClass()
|
|
1178
1020
|
}, {
|
|
@@ -1191,12 +1033,10 @@ var Select = function Select(props) {
|
|
|
1191
1033
|
var val = childItem[showValue];
|
|
1192
1034
|
var classStrItem = 'select-popover-list-item';
|
|
1193
1035
|
if (valueCom.indexOf(val) !== -1) classStrItem += ' select-popover-list-item-select'; // 选中的样式
|
|
1194
|
-
|
|
1195
1036
|
if (_typeof(disabled) === 'object' && disabled.indexOf(val) !== -1) {
|
|
1196
1037
|
// 禁用
|
|
1197
1038
|
classStrItem += ' select-popover-list-item-disabled';
|
|
1198
1039
|
}
|
|
1199
|
-
|
|
1200
1040
|
return jsx("div", Object.assign({
|
|
1201
1041
|
onClick: clickItem(childItem),
|
|
1202
1042
|
className: classStrItem,
|
|
@@ -1209,16 +1049,13 @@ var Select = function Select(props) {
|
|
|
1209
1049
|
})]
|
|
1210
1050
|
}), index);
|
|
1211
1051
|
}
|
|
1212
|
-
|
|
1213
1052
|
var val = item[showValue];
|
|
1214
1053
|
var classStrItem = 'select-popover-list-item';
|
|
1215
1054
|
if (valueCom.indexOf(val) !== -1) classStrItem += ' select-popover-list-item-select'; // 选中的样式
|
|
1216
|
-
|
|
1217
1055
|
if (_typeof(disabled) === 'object' && disabled.indexOf(val) !== -1) {
|
|
1218
1056
|
// 禁用
|
|
1219
1057
|
classStrItem += ' select-popover-list-item-disabled';
|
|
1220
1058
|
}
|
|
1221
|
-
|
|
1222
1059
|
return jsx("div", Object.assign({
|
|
1223
1060
|
onClick: clickItem(item),
|
|
1224
1061
|
className: classStrItem,
|
|
@@ -1237,17 +1074,15 @@ var Select = function Select(props) {
|
|
|
1237
1074
|
}))
|
|
1238
1075
|
})), loading && jsx(Loading, {})]
|
|
1239
1076
|
}));
|
|
1240
|
-
}, [listCom, showName, showValue, valueCom, onChange, multiple, loading, language, locale, emptyProps, emptyBol, renderContent, selectCheckIcon]);
|
|
1241
|
-
|
|
1077
|
+
}, [listCom, showName, showValue, valueCom, onChange, multiple, loading, language, locale, emptyProps, emptyBol, renderContent, selectCheckIcon]);
|
|
1078
|
+
// 下拉框popover memo
|
|
1242
1079
|
var SelectPopoverMemo = useMemo(function () {
|
|
1243
1080
|
if (!showSelect) return '';
|
|
1244
|
-
|
|
1245
1081
|
var handSelectPopoverMemoClass = function handSelectPopoverMemoClass() {
|
|
1246
1082
|
var classStr = 'select-popover-content ' + classOneSelect;
|
|
1247
1083
|
if (search && searchModel === 'inside') classStr += ' select-popover-content-search';
|
|
1248
1084
|
return classStr;
|
|
1249
1085
|
};
|
|
1250
|
-
|
|
1251
1086
|
return jsxs("div", Object.assign({
|
|
1252
1087
|
style: {
|
|
1253
1088
|
width: (posDom && posDom.current ? posDom.current.offsetWidth : 0) + 'px'
|
|
@@ -1270,7 +1105,6 @@ var Select = function Select(props) {
|
|
|
1270
1105
|
}));
|
|
1271
1106
|
}, [open, posDom, listCom, childrenName, showValue, showName, valueCom, searchValue, search, classOneSelect, searchModel, multiple, searchPlaceholder, showSelect, loading, searchInputProps, language, locale, emptyProps, emptyBol, renderContent, selectCheckIcon]);
|
|
1272
1107
|
/** 处理下拉内容 */
|
|
1273
|
-
|
|
1274
1108
|
var handDropdown = function handDropdown() {
|
|
1275
1109
|
return jsx(Dropdown, Object.assign({
|
|
1276
1110
|
visible: open,
|
|
@@ -1285,7 +1119,6 @@ var Select = function Select(props) {
|
|
|
1285
1119
|
children: ContentMemo
|
|
1286
1120
|
}));
|
|
1287
1121
|
};
|
|
1288
|
-
|
|
1289
1122
|
return jsxs("div", Object.assign({
|
|
1290
1123
|
className: handClass(),
|
|
1291
1124
|
style: style
|