@alicloud/console-components-search 0.1.3 → 0.2.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (66) hide show
  1. package/README.md +104 -131
  2. package/demos/demo1.demo.tsx +100 -90
  3. package/doc-dist/0.js +1917 -16
  4. package/doc-dist/1.js +16 -1917
  5. package/doc-dist/10.js +1 -1
  6. package/doc-dist/11.js +1 -1
  7. package/doc-dist/12.js +1 -1
  8. package/doc-dist/13.js +1 -1
  9. package/doc-dist/14.js +1 -1
  10. package/doc-dist/15.js +1 -1
  11. package/doc-dist/3.js +5 -5
  12. package/doc-dist/4.js +1 -1
  13. package/doc-dist/5.js +2 -2
  14. package/doc-dist/6.js +1 -1
  15. package/doc-dist/7.js +1 -1
  16. package/doc-dist/8.js +1 -1
  17. package/doc-dist/9.js +1 -1
  18. package/doc-dist/deps/main.css +1 -1
  19. package/doc-dist/deps/main.js +8 -8
  20. package/doc-dist/deps/main.os.css +1 -1
  21. package/doc-dist/index.js +3 -3
  22. package/doc-dist/log-deps-build.log +3 -3
  23. package/es/constants.js +4 -1
  24. package/es/index.js +1 -1
  25. package/es/modeSingleSingle/InputPrefix.js +29 -0
  26. package/es/modeSingleSingle/index2.js +369 -0
  27. package/es/search.js +2 -3
  28. package/es/searchTagList/PureTag.js +57 -0
  29. package/es/searchTagList/index.js +30 -14
  30. package/es/style.js +2 -2
  31. package/lib/constants.d.ts +2 -0
  32. package/lib/constants.js +6 -2
  33. package/lib/index.d.ts +2 -1
  34. package/lib/index.js +1 -1
  35. package/lib/modeSingleSingle/InputPrefix.d.ts +2 -0
  36. package/lib/modeSingleSingle/InputPrefix.js +43 -0
  37. package/lib/modeSingleSingle/index2.d.ts +4 -0
  38. package/lib/modeSingleSingle/index2.js +400 -0
  39. package/lib/search.js +2 -4
  40. package/lib/searchTagList/PureTag.d.ts +14 -0
  41. package/lib/searchTagList/PureTag.js +71 -0
  42. package/lib/searchTagList/index.d.ts +3 -1
  43. package/lib/searchTagList/index.js +31 -15
  44. package/lib/style.js +2 -2
  45. package/lib/types/IRcSearchProps.type.d.ts +22 -21
  46. package/lib/types/IRcSearchTagItemProps.type.d.ts +2 -2
  47. package/lib/types/IRcSearchTagListProps.type.d.ts +9 -5
  48. package/package.json +2 -1
  49. package/demos/demo2.demo.tsx +0 -81
  50. package/demos/demo3.demo.tsx +0 -90
  51. package/demos/demo4.demo.tsx +0 -137
  52. package/dist/index.css +0 -1
  53. package/dist/index.js +0 -60
  54. package/doc-dist/16.js +0 -6
  55. package/doc-dist/17.js +0 -6
  56. package/doc-dist/18.js +0 -6
  57. package/doc-dist/19.js +0 -6
  58. package/doc-dist/20.js +0 -6
  59. package/docs/markdown-render.doc.md +0 -21
  60. package/docs/test.doc.md +0 -8
  61. package/es/modeSingleMulti/index.js +0 -868
  62. package/es/modeSingleSingle/index.js +0 -201
  63. package/lib/modeSingleMulti/index.d.ts +0 -2
  64. package/lib/modeSingleMulti/index.js +0 -894
  65. package/lib/modeSingleSingle/index.d.ts +0 -2
  66. package/lib/modeSingleSingle/index.js +0 -226
@@ -1,868 +0,0 @@
1
- import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
2
- import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
3
- import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
4
- import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
5
- import _regeneratorRuntime from "@babel/runtime/regenerator";
6
-
7
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
8
-
9
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
10
-
11
- import React, { useState, useEffect } from "react";
12
- import classNames from 'classnames';
13
- import { Button, Icon, Tag, Select, ConfigProvider } from '@alicloud/console-components';
14
- import { getHistoryTag as getHistoryTagUtil, setHistoryTag as setHistoryTagUtil, removeHistoryTagItem as removeHistoryTagItemUtils, getTagByFileds, checkNoIndexListFormat, getSelectOptionAdatp } from "../utils";
15
- import { SearchWarp, MultiBtnWarp, MenuContentWrap } from "../style";
16
- import { useCssVar } from "../useCssVar";
17
- var TagGroup = Tag.Group,
18
- ClosableTag = Tag.Closeable;
19
- var AutoComplete = Select.AutoComplete;
20
-
21
- var ModeSingleSingle = function ModeSingleSingle(props) {
22
- var options = props.options,
23
- defaultDataIndex = props.defaultDataIndex,
24
- defaultPlaceholder = props.defaultPlaceholder,
25
- tags = props.tags,
26
- onSuggest = props.onSuggest,
27
- onSuggestNoDataIndex = props.onSuggestNoDataIndex,
28
- onSearch = props.onSearch,
29
- _props$prefix = props.prefix,
30
- prefix = _props$prefix === void 0 ? "next-" : _props$prefix;
31
-
32
- var _useState = useState({}),
33
- _useState2 = _slicedToArray(_useState, 2),
34
- allFileds = _useState2[0],
35
- setAllFileds = _useState2[1];
36
-
37
- var _useState3 = useState({}),
38
- _useState4 = _slicedToArray(_useState3, 2),
39
- curOptionItem = _useState4[0],
40
- setCurOptionItem = _useState4[1];
41
-
42
- var _useState5 = useState({}),
43
- _useState6 = _slicedToArray(_useState5, 2),
44
- defaultOptionItem = _useState6[0],
45
- setDefaultOptionItem = _useState6[1];
46
-
47
- var _useState7 = useState(''),
48
- _useState8 = _slicedToArray(_useState7, 2),
49
- defaultInputValue = _useState8[0],
50
- setDefaultValue = _useState8[1];
51
-
52
- var _useState9 = useState(''),
53
- _useState10 = _slicedToArray(_useState9, 2),
54
- inputValue = _useState10[0],
55
- setInputValue = _useState10[1];
56
-
57
- var _useState11 = useState([]),
58
- _useState12 = _slicedToArray(_useState11, 2),
59
- inputDataSource = _useState12[0],
60
- setInputDataSource = _useState12[1];
61
-
62
- var _useState13 = useState(false),
63
- _useState14 = _slicedToArray(_useState13, 2),
64
- visible = _useState14[0],
65
- setVisible = _useState14[1];
66
-
67
- var _useState15 = useState(false),
68
- _useState16 = _slicedToArray(_useState15, 2),
69
- defaultVisible = _useState16[0],
70
- setDefaultVisible = _useState16[1];
71
-
72
- var _useState17 = useState(false),
73
- _useState18 = _slicedToArray(_useState17, 2),
74
- clearLevel1Show = _useState18[0],
75
- setClearLevel1Show = _useState18[1];
76
-
77
- var _useState19 = useState([]),
78
- _useState20 = _slicedToArray(_useState19, 2),
79
- multipleValues = _useState20[0],
80
- setMultipleValues = _useState20[1];
81
-
82
- var _useState21 = useState([]),
83
- _useState22 = _slicedToArray(_useState21, 2),
84
- tagList = _useState22[0],
85
- setTagList = _useState22[1];
86
-
87
- var _useState23 = useState([]),
88
- _useState24 = _slicedToArray(_useState23, 2),
89
- historyList = _useState24[0],
90
- setHistoryList = _useState24[1];
91
-
92
- var _useState25 = useState(''),
93
- _useState26 = _slicedToArray(_useState25, 2),
94
- curType = _useState26[0],
95
- setCurType = _useState26[1]; // defalut/nodefault/item
96
-
97
-
98
- var _useState27 = useState(''),
99
- _useState28 = _slicedToArray(_useState27, 2),
100
- focusClass = _useState28[0],
101
- setFocusClass = _useState28[1]; // focus/''
102
-
103
-
104
- useEffect(function () {
105
- var initHisTags = getHistoryTagUtil();
106
-
107
- if (initHisTags) {
108
- setHistoryList(initHisTags);
109
- }
110
-
111
- initCurType();
112
- }, []);
113
-
114
- function initCurType() {
115
- var initCurType = '';
116
-
117
- if (defaultDataIndex && defaultDataIndex !== '') {
118
- initCurType = 'default';
119
- var defaultItem = options.find(function (x) {
120
- return x.dataIndex === defaultDataIndex;
121
- });
122
-
123
- if (defaultItem) {
124
- // console.log(defaultItem)
125
- setDefaultOptionItem(defaultItem);
126
- } else {
127
- initCurType = 'nodefault';
128
- }
129
- } else {
130
- initCurType = 'nodefault';
131
- } // console.log('initCurType', initCurType)
132
-
133
-
134
- setCurType(initCurType);
135
- }
136
-
137
- var level1DataSourceTemp = options.some(function (t) {
138
- return !!t.groupName;
139
- }) ? Object.values(options.reduce(function (acc, t) {
140
- var _acc$t$groupName;
141
-
142
- //@ts-ignore
143
- acc[t.groupName] = {
144
- label: t.groupName,
145
- value: t.groupName,
146
- //@ts-ignore
147
- children: [].concat(_toConsumableArray(((_acc$t$groupName = acc[t.groupName]) === null || _acc$t$groupName === void 0 ? void 0 : _acc$t$groupName.children) || []), [{
148
- label: t.label,
149
- value: t.dataIndex
150
- }])
151
- };
152
- return acc;
153
- }, {})) : [{
154
- label: '选择筛选条件',
155
- children: options.map(function (l1) {
156
- return {
157
- label: l1.label,
158
- value: l1.dataIndex
159
- };
160
- })
161
- }];
162
-
163
- var _useState29 = useState(level1DataSourceTemp),
164
- _useState30 = _slicedToArray(_useState29, 2),
165
- level1DataSource = _useState30[0],
166
- setLevel1DataSource = _useState30[1];
167
-
168
- var menuPropsLevel1 = {
169
- focusable: false,
170
- header: /*#__PURE__*/React.createElement(MenuContentWrap, {
171
- prefix: ""
172
- }, defaultDataIndex && defaultDataIndex !== '' && historyList && historyList.length > 0 && defaultInputValue === '' && /*#__PURE__*/React.createElement("li", {
173
- role: "option",
174
- title: "\u5386\u53F2\u641C\u7D22\u8BB0\u5F55",
175
- className: "".concat(prefix, "menu-group-label")
176
- }, /*#__PURE__*/React.createElement("div", {
177
- className: "".concat(prefix, "menu-item-inner")
178
- }, "\u5386\u53F2\u641C\u7D22\u8BB0\u5F55")), defaultDataIndex && defaultDataIndex !== '' && historyList && historyList.length > 0 && defaultInputValue === '' && /*#__PURE__*/React.createElement(TagGroup, {
179
- style: {
180
- paddingLeft: '20px'
181
- }
182
- }, historyList.map(function (tag, index) {
183
- return tag ? /*#__PURE__*/React.createElement(ClosableTag, {
184
- size: "small",
185
- key: tag.dataIndex + tag.value + index,
186
- onClose: function onClose() {
187
- onRemoveHisTag(tag);
188
- return true;
189
- },
190
- onClick: function onClick() {
191
- onSelectHisTag(tag);
192
- }
193
- }, tag.label, ":", tag.valueShow) : '';
194
- }))),
195
- footer: null
196
- }; // 多选
197
-
198
- var menuProps = {
199
- focusable: false,
200
- header: null,
201
- footer: /*#__PURE__*/React.createElement(MultiBtnWarp, {
202
- prefix: prefix
203
- }, /*#__PURE__*/React.createElement(Button, {
204
- size: "small",
205
- className: classNames("pri-btn"),
206
- disabled: multipleValues.length === 0,
207
- type: "primary",
208
- onClick: function onClick() {
209
- onPrimaryMultiple(curOptionItem.dataIndex);
210
- }
211
- }, "\u786E\u5B9A"), /*#__PURE__*/React.createElement(Button, {
212
- size: "small",
213
- className: classNames("cancel-btn"),
214
- type: "normal",
215
- onClick: function onClick() {
216
- setVisible(false);
217
- setMultipleValues([]);
218
- }
219
- }, "\u53D6\u6D88"))
220
- };
221
-
222
- var itemRender = function itemRender(item, searchKey) {
223
- var label = item.label;
224
-
225
- if (searchKey && searchKey.length) {
226
- var key = searchKey.replace(/[-/\\^$*+?.()|[\]{}]/g, '\\$&');
227
- var reg = new RegExp("(".concat(key, ")"), 'ig');
228
- label = label.replace(reg, function (x) {
229
- return "<span class=\"".concat(prefix, "select-highlight\" style=\"background-color: #EFF3F8;font-weight: 500;\">").concat(x, "</span>");
230
- });
231
- }
232
-
233
- return /*#__PURE__*/React.createElement("span", {
234
- dangerouslySetInnerHTML: {
235
- __html: label
236
- }
237
- });
238
- };
239
-
240
- var itemRenderMulti = function itemRenderMulti(item) {
241
- var isChecked = false;
242
-
243
- if (multipleValues.find(function (v) {
244
- return v === item.value;
245
- })) {
246
- isChecked = true;
247
- }
248
-
249
- return /*#__PURE__*/React.createElement("label", {
250
- className: classNames("".concat(prefix, "checkbox-wrapper"), 'multi-lable', isChecked ? 'checked' : ''),
251
- style: {
252
- paddingLeft: '8px'
253
- }
254
- }, /*#__PURE__*/React.createElement("span", {
255
- className: "".concat(prefix, "checkbox")
256
- }, /*#__PURE__*/React.createElement("span", {
257
- className: "".concat(prefix, "checkbox-inner")
258
- }, /*#__PURE__*/React.createElement("i", {
259
- className: "".concat(prefix, "icon ").concat(prefix, "icon-select ").concat(prefix, "xs ").concat(prefix, "checkbox-select-icon")
260
- })), /*#__PURE__*/React.createElement("input", {
261
- type: "checkbox",
262
- className: "".concat(prefix, "checkbox-input"),
263
- defaultChecked: isChecked
264
- })), /*#__PURE__*/React.createElement("span", {
265
- className: "".concat(prefix, "checkbox-label")
266
- }, item.label));
267
- };
268
-
269
- function onRemoveHisTag(tagItem) {
270
- var newHisTags = removeHistoryTagItemUtils(tagItem);
271
- setHistoryList(newHisTags);
272
- }
273
-
274
- function onSelectHisTag(tagItem) {
275
- var changeFileds = Object.create({});
276
- var tempAllFileds = Object.create({});
277
- changeFileds[tagItem.dataIndex] = tagItem.value;
278
- tempAllFileds = changeFileds;
279
- onChangeItem(changeFileds, tempAllFileds);
280
- }
281
-
282
- function updateHistory() {
283
- var allFiledsTagList = _toConsumableArray(tagList);
284
-
285
- var rtHisTags = setHistoryTagUtil(allFiledsTagList);
286
- setHistoryList(rtHisTags);
287
- }
288
-
289
- function checkAllFromTags(allFileds) {
290
- var allFiledsAdapt = _objectSpread({}, allFileds);
291
-
292
- if (tags && Array.isArray(tags) && tags.length >= 0) {
293
- allFiledsAdapt = {};
294
- tags.forEach(function (tag) {
295
- if (allFileds[tag.dataIndex]) {
296
- allFiledsAdapt[tag.dataIndex] = allFileds[tag.dataIndex];
297
- }
298
- });
299
- }
300
-
301
- return allFiledsAdapt;
302
- } // 某一类别确定时,修改filed
303
-
304
-
305
- function onChangeItem(changeFileds, allFileds) {
306
- setDefaultVisible(false);
307
- setAllFileds(allFileds); // todo
308
-
309
- if (onSearch) {
310
- onSearch(getTagByFileds(allFileds, options));
311
- } // 仅仅清空值, 保留类别
312
-
313
-
314
- setVisible(false);
315
- setInputValue('');
316
- setFocusClass('');
317
- setClearLevel1Show(true);
318
- }
319
-
320
- function clearLevel1() {
321
- // 清空类别
322
- var initCurType = '';
323
-
324
- if (defaultDataIndex && defaultDataIndex !== '' && defaultOptionItem) {
325
- initCurType = 'default';
326
- var defaultItem = options.find(function (x) {
327
- return x.dataIndex === defaultDataIndex;
328
- });
329
-
330
- if (defaultItem) {
331
- // console.log(defaultItem)
332
- setDefaultOptionItem(defaultItem);
333
- } else {
334
- initCurType = 'nodefault';
335
- }
336
- } else {
337
- initCurType = 'nodefault';
338
- }
339
-
340
- setCurType(initCurType);
341
- setCurOptionItem({});
342
- setClearLevel1Show(false);
343
- } // 多选的确定
344
-
345
-
346
- function onPrimaryMultiple(dataIndex) {
347
- // multipleValues
348
- setVisible(false);
349
-
350
- if (onChangeItem) {
351
- var changeFileds = Object.create({});
352
- changeFileds[dataIndex] = multipleValues;
353
- setAllFileds(changeFileds);
354
- onChangeItem(changeFileds, changeFileds);
355
- setMultipleValues([]);
356
- }
357
- } // 多选的change,仅改变state
358
-
359
-
360
- function onMultipleChange(values) {
361
- // console.log('value', values);
362
- if (values) {
363
- setMultipleValues(values);
364
- } else {
365
- setMultipleValues([]);
366
- }
367
- } // 第一级选择某个具体的类别
368
-
369
-
370
- function onLevel1Change(_x, _x2, _x3) {
371
- return _onLevel1Change.apply(this, arguments);
372
- }
373
-
374
- function _onLevel1Change() {
375
- _onLevel1Change = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(value, actionType, item) {
376
- var curOptItem, newDataSource;
377
- return _regeneratorRuntime.wrap(function _callee$(_context) {
378
- while (1) {
379
- switch (_context.prev = _context.next) {
380
- case 0:
381
- setClearLevel1Show(true);
382
-
383
- if (!(actionType === 'itemClick')) {
384
- _context.next = 5;
385
- break;
386
- }
387
-
388
- // 判断是level选择还是直接输入的suggest---- 选了一个类别
389
- if (!defaultInputValue) {
390
- // level1 的选择
391
- curOptItem = options.find(function (x) {
392
- return x.dataIndex === value;
393
- });
394
-
395
- if (curOptItem) {
396
- setCurOptionItem(curOptItem);
397
- setCurType('item');
398
- } // 当第一次选择了筛选类别后,需自动进入激活状态,无需再次点击;(自动获取焦点)自动弹窗
399
-
400
-
401
- setVisible(true);
402
- } else if (curType === 'default' && defaultDataIndex && defaultDataIndex !== '') {
403
- inputChange(value, 'itemClick', defaultDataIndex);
404
- setDefaultValue('');
405
- setLevel1DataSource(level1DataSourceTemp);
406
- } else if (curType === 'nodefault') {
407
- if (item && item.dataIndex) {
408
- inputChange(value, 'itemClick', item.dataIndex);
409
- setDefaultValue('');
410
- setLevel1DataSource(level1DataSourceTemp);
411
- }
412
- }
413
-
414
- _context.next = 30;
415
- break;
416
-
417
- case 5:
418
- if (!(actionType === 'change')) {
419
- _context.next = 30;
420
- break;
421
- }
422
-
423
- if (!(!value || value === '')) {
424
- _context.next = 11;
425
- break;
426
- }
427
-
428
- // 如果是删除为空的情况,需要还原 AutoComplete 中的 dataSource
429
- setLevel1DataSource(level1DataSourceTemp);
430
- setDefaultVisible(true);
431
- _context.next = 29;
432
- break;
433
-
434
- case 11:
435
- if (!(defaultDataIndex && defaultDataIndex !== '')) {
436
- _context.next = 22;
437
- break;
438
- }
439
-
440
- if (!onSuggest) {
441
- _context.next = 17;
442
- break;
443
- }
444
-
445
- _context.next = 15;
446
- return setDefSuggest(value);
447
-
448
- case 15:
449
- _context.next = 20;
450
- break;
451
-
452
- case 17:
453
- newDataSource = [{
454
- label: defaultOptionItem.label,
455
- children: [value]
456
- }];
457
- setLevel1DataSource(newDataSource);
458
- setDefaultVisible(true);
459
-
460
- case 20:
461
- _context.next = 29;
462
- break;
463
-
464
- case 22:
465
- if (!onSuggestNoDataIndex) {
466
- _context.next = 27;
467
- break;
468
- }
469
-
470
- _context.next = 25;
471
- return setNoDefSuggest(value);
472
-
473
- case 25:
474
- _context.next = 29;
475
- break;
476
-
477
- case 27:
478
- setLevel1DataSource([]);
479
- setDefaultVisible(false);
480
-
481
- case 29:
482
- setDefaultValue(value);
483
-
484
- case 30:
485
- case "end":
486
- return _context.stop();
487
- }
488
- }
489
- }, _callee);
490
- }));
491
- return _onLevel1Change.apply(this, arguments);
492
- }
493
-
494
- function onClearLevel1() {
495
- clearLevel1();
496
- }
497
-
498
- function setDefSuggest(_x4) {
499
- return _setDefSuggest.apply(this, arguments);
500
- }
501
-
502
- function _setDefSuggest() {
503
- _setDefSuggest = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(value) {
504
- var list, newDataSource;
505
- return _regeneratorRuntime.wrap(function _callee2$(_context2) {
506
- while (1) {
507
- switch (_context2.prev = _context2.next) {
508
- case 0:
509
- if (!(onSuggest && defaultDataIndex && defaultDataIndex !== '')) {
510
- _context2.next = 7;
511
- break;
512
- }
513
-
514
- _context2.next = 3;
515
- return onSuggest(value, defaultDataIndex);
516
-
517
- case 3:
518
- list = _context2.sent;
519
- newDataSource = [{
520
- label: defaultOptionItem.label,
521
- children: list
522
- }];
523
- setLevel1DataSource(newDataSource);
524
- setDefaultVisible(true);
525
-
526
- case 7:
527
- case "end":
528
- return _context2.stop();
529
- }
530
- }
531
- }, _callee2);
532
- }));
533
- return _setDefSuggest.apply(this, arguments);
534
- }
535
-
536
- function setNoDefSuggest(_x5) {
537
- return _setNoDefSuggest.apply(this, arguments);
538
- }
539
-
540
- function _setNoDefSuggest() {
541
- _setNoDefSuggest = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3(value) {
542
- var list;
543
- return _regeneratorRuntime.wrap(function _callee3$(_context3) {
544
- while (1) {
545
- switch (_context3.prev = _context3.next) {
546
- case 0:
547
- if (!onSuggestNoDataIndex) {
548
- _context3.next = 7;
549
- break;
550
- }
551
-
552
- _context3.next = 3;
553
- return onSuggestNoDataIndex(value);
554
-
555
- case 3:
556
- list = _context3.sent;
557
- // console.log(list)
558
- checkNoIndexListFormat(list);
559
- setLevel1DataSource(_toConsumableArray(list));
560
- setDefaultVisible(true);
561
-
562
- case 7:
563
- case "end":
564
- return _context3.stop();
565
- }
566
- }
567
- }, _callee3);
568
- }));
569
- return _setNoDefSuggest.apply(this, arguments);
570
- }
571
-
572
- function onDeFaultEnter(e) {
573
- var dataIndex = defaultDataIndex;
574
- var value = defaultInputValue;
575
-
576
- if (curType === 'item' && curOptionItem.template === 'input') {
577
- dataIndex = curOptionItem.dataIndex;
578
- value = inputValue;
579
- }
580
-
581
- if (e.keyCode === 13 && value !== '') {
582
- if (curOptionItem.template === 'multiple') {
583
- return;
584
- }
585
-
586
- if (defaultDataIndex && defaultDataIndex !== '' && onSuggest) {
587
- // fuzzyDisable
588
- if (!curOptionItem.templateProps || !curOptionItem.templateProps.fuzzyDisable) {
589
- inputChange(value, 'enter', defaultDataIndex);
590
- setDefaultVisible(false);
591
- setDefaultValue('');
592
- }
593
- }
594
- }
595
- }
596
- /**
597
- * 当某一类别是, 输入类型时触发
598
- * 接收一个promise
599
- */
600
-
601
-
602
- function inputChange(_x6, _x7, _x8, _x9) {
603
- return _inputChange.apply(this, arguments);
604
- } // 单选或多选的change,
605
-
606
-
607
- function _inputChange() {
608
- _inputChange = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4(value, actionType, dataIndex, e) {
609
- var changeFileds, list, newDataSource;
610
- return _regeneratorRuntime.wrap(function _callee4$(_context4) {
611
- while (1) {
612
- switch (_context4.prev = _context4.next) {
613
- case 0:
614
- if (!((actionType === 'itemClick' || actionType === 'enter') && onChangeItem)) {
615
- _context4.next = 10;
616
- break;
617
- }
618
-
619
- changeFileds = Object.create({});
620
- changeFileds[dataIndex] = value;
621
- setAllFileds(changeFileds);
622
- onChangeItem(changeFileds, changeFileds);
623
- setVisible(false);
624
- setDefaultVisible(false);
625
- setInputDataSource([]);
626
- _context4.next = 20;
627
- break;
628
-
629
- case 10:
630
- if (value === '') {
631
- setInputDataSource([]);
632
- setClearLevel1Show(true);
633
- } else {
634
- setClearLevel1Show(false);
635
- }
636
-
637
- setInputValue(value);
638
-
639
- if (!(value !== '' && onSuggest)) {
640
- _context4.next = 20;
641
- break;
642
- }
643
-
644
- _context4.next = 15;
645
- return onSuggest(value, dataIndex);
646
-
647
- case 15:
648
- list = _context4.sent;
649
- newDataSource = [{
650
- label: curOptionItem.label,
651
- children: list
652
- }];
653
- setInputDataSource(newDataSource);
654
- setVisible(true);
655
- setDefaultVisible(true);
656
-
657
- case 20:
658
- case "end":
659
- return _context4.stop();
660
- }
661
- }
662
- }, _callee4);
663
- }));
664
- return _inputChange.apply(this, arguments);
665
- }
666
-
667
- function selectChange(value, dataIndex) {
668
- setVisible(false);
669
- setFocusClass('');
670
-
671
- if (onChangeItem) {
672
- var changeFileds = Object.create({});
673
- changeFileds[dataIndex] = value;
674
- setAllFileds(changeFileds);
675
- onChangeItem(changeFileds, changeFileds);
676
- }
677
- } // 提交按钮
678
-
679
-
680
- function onCommonSearch() {
681
- if (onSearch) {
682
- if (curOptionItem.dataIndex) {
683
- onSearch(getTagByFileds(_defineProperty({}, curOptionItem.dataIndex, inputValue), options));
684
- } else {
685
- // @ts-ignore
686
- onSearch(getTagByFileds(_defineProperty({}, defaultDataIndex, defaultInputValue), options));
687
- } // todo: 只有搜索了才会被记录到,根据页面的路由为key,history
688
-
689
-
690
- updateHistory();
691
- }
692
- }
693
-
694
- var isWind = (useCssVar('--alicloudfe-components-theme') || '').trim() === 'wind';
695
- return /*#__PURE__*/React.createElement(SearchWarp, {
696
- prefix: prefix
697
- }, /*#__PURE__*/React.createElement("div", {
698
- className: classNames('left-wrap', "".concat(prefix, "input"), focusClass)
699
- }, /*#__PURE__*/React.createElement("div", {
700
- className: classNames('condition')
701
- }, curType === 'item' && /*#__PURE__*/React.createElement("div", {
702
- className: classNames('condition-item')
703
- }, /*#__PURE__*/React.createElement("span", {
704
- className: classNames('condition-item-txt')
705
- }, curOptionItem.label), /*#__PURE__*/React.createElement(Icon, {
706
- type: "caret-down",
707
- size: "xxs"
708
- }), /*#__PURE__*/React.createElement(Select, {
709
- className: classNames('condition-select'),
710
- hasBorder: false,
711
- dataSource: level1DataSource,
712
- onChange: onLevel1Change,
713
- autoWidth: false
714
- }))), /*#__PURE__*/React.createElement("div", {
715
- className: classNames('forms'),
716
- onKeyUp: onDeFaultEnter
717
- }, curType === 'default' && defaultOptionItem && /*#__PURE__*/React.createElement(AutoComplete, {
718
- className: classNames('main-input', 'multi'),
719
- placeholder: "\u9ED8\u8BA4\u6309".concat(defaultOptionItem.label, "\u641C\u7D22") // TODO:
720
- ,
721
- hasClear: true,
722
- hasBorder: false,
723
- menuProps: menuPropsLevel1,
724
- dataSource: level1DataSource // @ts-ignore
725
- ,
726
- itemRender: itemRender,
727
- onChange: onLevel1Change,
728
- popupStyle: historyList && historyList.length > 0 ? {} : {
729
- width: 'auto'
730
- },
731
- visible: defaultVisible,
732
- onFocus: function onFocus() {
733
- setDefaultVisible(true);
734
- setFocusClass('focus');
735
- },
736
- popupClassName: isWind ? 'xconsole-rc-search-popup' : '',
737
- onBlur: function onBlur() {
738
- debugger;
739
- setDefaultVisible(false);
740
- setFocusClass('');
741
- },
742
- value: defaultInputValue
743
- }), curType === 'nodefault' && /*#__PURE__*/React.createElement(AutoComplete, {
744
- className: classNames('main-input', 'multi'),
745
- placeholder: defaultPlaceholder || "\u8BF7\u641C\u7D22",
746
- hasClear: true,
747
- hasBorder: false,
748
- menuProps: menuPropsLevel1,
749
- popupStyle: historyList && historyList.length > 0 ? {} : {
750
- width: 'auto'
751
- } // @ts-ignore
752
- ,
753
- itemRender: itemRender,
754
- dataSource: level1DataSource,
755
- onChange: onLevel1Change,
756
- visible: defaultVisible,
757
- onFocus: function onFocus() {
758
- setDefaultVisible(true);
759
- setFocusClass('focus');
760
- },
761
- onBlur: function onBlur() {
762
- setDefaultVisible(false);
763
- setFocusClass('');
764
- },
765
- value: defaultInputValue
766
- }), curType === 'item' && curOptionItem.template === 'input' && /*#__PURE__*/React.createElement(AutoComplete, {
767
- className: classNames('main-input', 'multi'),
768
- placeholder: curOptionItem.templateProps.placeholder || "\u9ED8\u8BA4\u6309".concat(curOptionItem.label, "\u641C\u7D22"),
769
- hasClear: true,
770
- hasBorder: false // @ts-ignore
771
- ,
772
- itemRender: itemRender,
773
- visible: visible && inputDataSource.length > 0,
774
- dataSource: inputDataSource,
775
- autoFocus: true,
776
- value: inputValue,
777
- onFocus: function onFocus() {
778
- setVisible(true);
779
- setFocusClass('focus');
780
- },
781
- onBlur: function onBlur() {
782
- setVisible(false);
783
- setFocusClass('');
784
- },
785
- onChange: function onChange(value, actionType, e) {
786
- inputChange(value, actionType, curOptionItem.dataIndex, e);
787
- }
788
- }), curType === 'item' && curOptionItem.template === 'select' && /*#__PURE__*/React.createElement(Select, {
789
- className: classNames('main-input', 'select'),
790
- placeholder: curOptionItem.templateProps.placeholder || "\u8BF7\u9009\u62E9".concat(curOptionItem.label),
791
- hasClear: true,
792
- hasBorder: false,
793
- dataSource: getSelectOptionAdatp(curOptionItem.label, curOptionItem.templateProps.dataSource),
794
- onChange: function onChange(value) {
795
- selectChange(value, curOptionItem.dataIndex);
796
- },
797
- popupStyle: {
798
- width: 'auto'
799
- },
800
- autoFocus: true,
801
- visible: visible,
802
- value: undefined,
803
- onClick: function onClick() {
804
- setVisible(true);
805
- setFocusClass('focus');
806
- },
807
- onFocus: function onFocus() {
808
- setVisible(true);
809
- setFocusClass('focus');
810
- },
811
- onBlur: function onBlur() {
812
- setVisible(false);
813
- setFocusClass('');
814
- }
815
- }), curType === 'item' && curOptionItem.template === 'multiple' && /*#__PURE__*/React.createElement(Select, {
816
- className: classNames('main-input', 'multi'),
817
- placeholder: curOptionItem.templateProps.placeholder || "\u8BF7\u9009\u62E9".concat(curOptionItem.label),
818
- hasClear: true,
819
- mode: "multiple",
820
- maxTagCount: 0,
821
- hasBorder: false,
822
- autoFocus: true,
823
- menuProps: menuProps,
824
- value: multipleValues,
825
- onFocus: function onFocus() {
826
- setVisible(true);
827
- setFocusClass('focus');
828
- },
829
- onClick: function onClick() {
830
- setVisible(true);
831
- setFocusClass('focus');
832
- },
833
- onBlur: function onBlur() {
834
- setVisible(false);
835
- setFocusClass('');
836
- },
837
- itemRender: itemRenderMulti,
838
- popupClassName: "xconsole-rcsearch-multi-pop",
839
- visible: visible,
840
- dataSource: getSelectOptionAdatp(curOptionItem.label, curOptionItem.templateProps.dataSource),
841
- onChange: function onChange(value) {
842
- onMultipleChange(value);
843
- },
844
- popupStyle: {
845
- width: 'auto'
846
- }
847
- }), clearLevel1Show && /*#__PURE__*/React.createElement("div", {
848
- className: "clear-level1",
849
- onClick: onClearLevel1
850
- }, /*#__PURE__*/React.createElement("span", {
851
- className: "".concat(prefix, "input-control")
852
- }, /*#__PURE__*/React.createElement("span", {
853
- className: "".concat(prefix, "input-hint-wrap")
854
- }, /*#__PURE__*/React.createElement("i", {
855
- role: "button",
856
- "aria-label": "\u6E05\u9664",
857
- className: "".concat(prefix, "icon ").concat(prefix, "icon-delete-filling ").concat(prefix, "medium ").concat(prefix, "input-hint ").concat(prefix, "input-clear-icon")
858
- })))))), /*#__PURE__*/React.createElement("div", {
859
- className: classNames('right-wrap')
860
- }, /*#__PURE__*/React.createElement(Button, {
861
- className: classNames('search-btn'),
862
- onClick: onCommonSearch
863
- }, /*#__PURE__*/React.createElement(Icon, {
864
- type: "search"
865
- }))));
866
- };
867
-
868
- export default ConfigProvider.config(ModeSingleSingle);