1 | import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
2 | import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
|
3 | import _createClass from "@babel/runtime/helpers/createClass";
|
4 | import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
|
5 | import _inherits from "@babel/runtime/helpers/inherits";
|
6 | import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
|
7 | import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
|
8 |
|
9 | function _createSuper(Derived) {
|
10 | function isNativeReflectConstruct() {
|
11 | if (typeof Reflect === "undefined" || !Reflect.construct) return false;
|
12 | if (Reflect.construct.sham) return false;
|
13 | if (typeof Proxy === "function") return true;
|
14 |
|
15 | try {
|
16 | Date.prototype.toString.call(Reflect.construct(Date, [], function () {}));
|
17 | return true;
|
18 | } catch (e) {
|
19 | return false;
|
20 | }
|
21 | }
|
22 |
|
23 | return function () {
|
24 | var Super = _getPrototypeOf(Derived),
|
25 | result;
|
26 |
|
27 | if (isNativeReflectConstruct()) {
|
28 | var NewTarget = _getPrototypeOf(this).constructor;
|
29 |
|
30 | result = Reflect.construct(Super, arguments, NewTarget);
|
31 | } else {
|
32 | result = Super.apply(this, arguments);
|
33 | }
|
34 |
|
35 | return _possibleConstructorReturn(this, result);
|
36 | };
|
37 | }
|
38 |
|
39 | import React, { Component } from 'react';
|
40 | import { findDOMNode } from 'react-dom';
|
41 | import Icon from '../icon';
|
42 | import Select from '../select';
|
43 | import { filterByInputValue, getColumnKey } from './util';
|
44 | import Checkbox from '../checkbox/Checkbox';
|
45 | import { SelectMode } from '../select/enum';
|
46 | import { getPrefixCls } from '../configure';
|
47 | var Option = Select.Option,
|
48 | OptGroup = Select.OptGroup;
|
49 | var PAIR_SPLIT = ':';
|
50 | var VALUE_SPLIT = '、';
|
51 | var OPTION_OR = 'option-or';
|
52 | export var VALUE_OR = 'OR';
|
53 |
|
54 | function pairValue(column) {
|
55 | var value = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
|
56 | var filters = column.filters;
|
57 | var found = filters && filters.find(function (filter) {
|
58 | return String(filter.value) === value;
|
59 | });
|
60 | return {
|
61 | key: "".concat(getColumnKey(column)).concat(PAIR_SPLIT).concat(value),
|
62 | label: [column.filterTitle || column.title, PAIR_SPLIT, ' ', found ? found.text : value]
|
63 | };
|
64 | }
|
65 |
|
66 | function barPair(value, index) {
|
67 | return {
|
68 | key: "".concat(value).concat(PAIR_SPLIT).concat(index),
|
69 | label: [value]
|
70 | };
|
71 | }
|
72 |
|
73 | function removeDoubleOr(filters) {
|
74 | return filters.filter(function (_ref, index) {
|
75 | var label = _ref.label;
|
76 | return label !== VALUE_OR || label !== filters[index + 1];
|
77 | });
|
78 | }
|
79 |
|
80 | var FilterSelect =
|
81 |
|
82 | function (_Component) {
|
83 | _inherits(FilterSelect, _Component);
|
84 |
|
85 | var _super = _createSuper(FilterSelect);
|
86 |
|
87 | function FilterSelect(props) {
|
88 | var _this;
|
89 |
|
90 | _classCallCheck(this, FilterSelect);
|
91 |
|
92 | _this = _super.call(this, props);
|
93 | _this.columnRefs = {};
|
94 |
|
95 | _this.handleDropdownMouseDown = function (e) {
|
96 | e.preventDefault();
|
97 |
|
98 | _this.rcSelect.focus();
|
99 | };
|
100 |
|
101 | _this.saveRef = function (node) {
|
102 | if (node) {
|
103 | _this.rcSelect = node.rcSelect;
|
104 | }
|
105 | };
|
106 |
|
107 | _this.saveColumnRef = function (key, node) {
|
108 | if (node) {
|
109 | _this.columnRefs[key] = node;
|
110 | }
|
111 | };
|
112 |
|
113 | _this.handleInputKeyDown = function (e) {
|
114 | var value = e.target.value;
|
115 |
|
116 | if (e.keyCode === 13 && !e.isDefaultPrevented() && value) {
|
117 | var _this$state = _this.state,
|
118 | filters = _this$state.filters,
|
119 | columnFilters = _this$state.columnFilters,
|
120 | selectColumn = _this$state.selectColumn;
|
121 |
|
122 | if (selectColumn) {
|
123 | var key = getColumnKey(selectColumn);
|
124 |
|
125 | if (key) {
|
126 | var columFilters = selectColumn.filters;
|
127 | var filterText = value.split(_this.getColumnTitle(selectColumn)).slice(1);
|
128 | columnFilters[key] = filterText;
|
129 | var found = columFilters && columFilters.find(function (filter) {
|
130 | return filter.text === filterText[0];
|
131 | });
|
132 | var filterValue = found ? String(found.value) : filterText[0];
|
133 |
|
134 | _this.fireColumnFilterChange(key, [filterValue]);
|
135 | }
|
136 | } else {
|
137 | filters.push(value);
|
138 |
|
139 | _this.fireChange(filters);
|
140 | }
|
141 |
|
142 | _this.setState({
|
143 | inputValue: '',
|
144 | filters: filters,
|
145 | columnFilters: columnFilters,
|
146 | selectColumn: undefined
|
147 | });
|
148 |
|
149 | _this.rcSelect.setState({
|
150 | inputValue: ''
|
151 | });
|
152 | }
|
153 | };
|
154 |
|
155 | _this.handleInput = function (value) {
|
156 | var selectColumn = _this.state.selectColumn;
|
157 |
|
158 | if (selectColumn) {
|
159 | if (value.indexOf(_this.getColumnTitle(selectColumn)) === -1) {
|
160 | selectColumn = undefined;
|
161 | }
|
162 | }
|
163 |
|
164 | _this.setState({
|
165 | selectColumn: selectColumn,
|
166 | inputValue: value
|
167 | });
|
168 | };
|
169 |
|
170 | _this.handleChoiceItemClick = function (_ref2) {
|
171 | var key = _ref2.key;
|
172 | var pair = key.split(PAIR_SPLIT);
|
173 |
|
174 | if (pair.length > 1) {
|
175 | var columnKey = pair.shift();
|
176 |
|
177 | var selectColumn = _this.findColumn(columnKey);
|
178 |
|
179 | if (selectColumn && selectColumn.filterMultiple) {
|
180 | var filters = selectColumn.filters;
|
181 | var checked = pair.join(PAIR_SPLIT).split(VALUE_SPLIT).map(function (text) {
|
182 | var found = filters && filters.find(function (filter) {
|
183 | return filter.text === text;
|
184 | });
|
185 | return found ? found.value : text;
|
186 | });
|
187 |
|
188 | _this.setState({
|
189 | selectColumn: selectColumn,
|
190 | checked: checked
|
191 | });
|
192 | }
|
193 | }
|
194 | };
|
195 |
|
196 | _this.handleSelect = function (_ref3) {
|
197 | var key = _ref3.key;
|
198 | var _this$state2 = _this.state,
|
199 | checked = _this$state2.checked,
|
200 | selectColumn = _this$state2.selectColumn;
|
201 |
|
202 | if (key === '__ok__') {
|
203 | _this.handleMultiCheckConfirm();
|
204 | } else if (key !== "".concat(selectColumn && selectColumn.title, ":")) {
|
205 | var index = checked.indexOf(key);
|
206 |
|
207 | if (index === -1) {
|
208 | checked.push(key);
|
209 | } else {
|
210 | checked.splice(index, 1);
|
211 | }
|
212 |
|
213 | _this.setState({
|
214 | checked: checked
|
215 | }, function () {
|
216 | if (selectColumn) {
|
217 | var columnFilters = _this.state.columnFilters;
|
218 | var columnKey = getColumnKey(selectColumn);
|
219 |
|
220 | if (columnKey) {
|
221 | var filters = columnFilters[columnKey];
|
222 |
|
223 | if (!filters || !filters.length) {
|
224 | _this.rcSelect.setState({
|
225 | inputValue: _this.getColumnTitle(selectColumn)
|
226 | });
|
227 | }
|
228 | }
|
229 | }
|
230 | });
|
231 | }
|
232 |
|
233 | return false;
|
234 | };
|
235 |
|
236 | _this.handleMultiCheckConfirm = function () {
|
237 | var _this$state3 = _this.state,
|
238 | selectColumn = _this$state3.selectColumn,
|
239 | checked = _this$state3.checked;
|
240 |
|
241 | if (selectColumn) {
|
242 | var columnKey = getColumnKey(selectColumn);
|
243 |
|
244 | if (columnKey) {
|
245 | _this.fireColumnFilterChange(columnKey, checked);
|
246 |
|
247 | _this.setState({
|
248 | selectColumn: undefined,
|
249 | checked: []
|
250 | });
|
251 |
|
252 | _this.rcSelect.setState({
|
253 | inputValue: ''
|
254 | });
|
255 | }
|
256 | }
|
257 | };
|
258 |
|
259 | _this.handleClear = function () {
|
260 | _this.setState({
|
261 | selectColumn: undefined
|
262 | });
|
263 | };
|
264 |
|
265 | _this.handleChange = function (changedValue) {
|
266 | var _assertThisInitialize = _assertThisInitialized(_this),
|
267 | state = _assertThisInitialize.state,
|
268 | rcSelect = _assertThisInitialize.rcSelect;
|
269 |
|
270 | var selectColumn = state.selectColumn,
|
271 | inputValue = state.inputValue,
|
272 | columnFilters = state.columnFilters;
|
273 | var filters = state.filters;
|
274 |
|
275 | var all = _this.getValue();
|
276 |
|
277 | var change = false;
|
278 |
|
279 | if (changedValue.length > all.length) {
|
280 | var value = changedValue.pop();
|
281 |
|
282 | if (inputValue) {
|
283 | if (rcSelect.state.inputValue && value) {
|
284 | change = true;
|
285 | filters.push(value.label);
|
286 | }
|
287 |
|
288 | _this.setState({
|
289 | selectColumn: undefined,
|
290 | inputValue: '',
|
291 | filters: filters
|
292 | });
|
293 | } else if (value && value.label === OPTION_OR) {
|
294 | filters.push(VALUE_OR);
|
295 | change = true;
|
296 |
|
297 | _this.setState({
|
298 | filters: filters
|
299 | });
|
300 | } else if (selectColumn) {
|
301 | if (!selectColumn.filterMultiple) {
|
302 | var columnKey = getColumnKey(selectColumn);
|
303 |
|
304 | if (rcSelect.state.inputValue && value && columnKey) {
|
305 | _this.fireColumnFilterChange(columnKey, [value.key]);
|
306 | }
|
307 |
|
308 | _this.setState({
|
309 | selectColumn: undefined
|
310 | });
|
311 | } else {
|
312 | _this.setState({
|
313 | selectColumn: undefined,
|
314 | checked: []
|
315 | });
|
316 |
|
317 | rcSelect.setState({
|
318 | inputValue: ''
|
319 | });
|
320 | }
|
321 | } else if (value) {
|
322 | var column = _this.findColumn(value.key);
|
323 |
|
324 | var columnFilter = columnFilters[value.key];
|
325 |
|
326 | if (column && (!columnFilter || !columnFilter.length)) {
|
327 | rcSelect.setState({
|
328 | inputValue: _this.getColumnTitle(column)
|
329 | });
|
330 | }
|
331 |
|
332 | _this.setState({
|
333 | selectColumn: column
|
334 | });
|
335 | }
|
336 | } else {
|
337 | filters = _this.changeValue(changedValue, rcSelect.state.value);
|
338 |
|
339 | if (state.filters.length !== filters.length) {
|
340 | change = true;
|
341 | }
|
342 |
|
343 | _this.setState({
|
344 | inputValue: '',
|
345 | filters: filters
|
346 | });
|
347 | }
|
348 |
|
349 | if (change) {
|
350 | _this.fireChange(filters);
|
351 | }
|
352 | };
|
353 |
|
354 | _this.toValueString = function (item) {
|
355 | var key = Object.keys(item)[0];
|
356 |
|
357 | var col = _this.findColumn(key);
|
358 |
|
359 | if (col) {
|
360 | return pairValue(col, item[key]);
|
361 | }
|
362 |
|
363 | return '';
|
364 | };
|
365 |
|
366 | _this.getRootDomNode = function () {
|
367 | return findDOMNode(_assertThisInitialized(_this)).querySelector(".".concat(getPrefixCls('select'), "-search__field"));
|
368 | };
|
369 |
|
370 | _this.state = {
|
371 | columns: _this.getColumnsWidthFilters(),
|
372 | filters: props.filters || [],
|
373 | columnFilters: props.columnFilters || {},
|
374 | inputValue: '',
|
375 | selectColumn: undefined,
|
376 | checked: []
|
377 | };
|
378 | return _this;
|
379 | }
|
380 |
|
381 | _createClass(FilterSelect, [{
|
382 | key: "componentWillReceiveProps",
|
383 | value: function componentWillReceiveProps(nextProps) {
|
384 | this.setState({
|
385 | columns: this.getColumnsWidthFilters(nextProps)
|
386 | });
|
387 |
|
388 | if (nextProps.filters) {
|
389 | this.setState({
|
390 | filters: nextProps.filters
|
391 | });
|
392 | }
|
393 |
|
394 | if (nextProps.columnFilters) {
|
395 | this.setState({
|
396 | columnFilters: nextProps.columnFilters
|
397 | });
|
398 | }
|
399 | }
|
400 | }, {
|
401 | key: "getPrefixCls",
|
402 | value: function getPrefixCls() {
|
403 | var prefixCls = this.props.prefixCls;
|
404 | return "".concat(prefixCls, "-filter-select");
|
405 | }
|
406 | }, {
|
407 | key: "render",
|
408 | value: function render() {
|
409 | var _this$props = this.props,
|
410 | placeholder = _this$props.placeholder,
|
411 | getPopupContainer = _this$props.getPopupContainer;
|
412 | var inputValue = this.state.inputValue;
|
413 | var prefixCls = this.getPrefixCls();
|
414 | var multiple = this.isMultiple();
|
415 | return React.createElement("div", {
|
416 | className: prefixCls
|
417 | }, React.createElement("div", {
|
418 | className: "".concat(prefixCls, "-icon")
|
419 | }, React.createElement(Icon, {
|
420 | type: "filter_list"
|
421 | })), React.createElement(Select, {
|
422 | ref: this.saveRef,
|
423 | mode: SelectMode.tags,
|
424 | filterOption: false,
|
425 | onChange: this.handleChange,
|
426 | onSelect: multiple ? this.handleSelect : undefined,
|
427 | onInput: this.handleInput,
|
428 | onInputKeyDown: this.handleInputKeyDown,
|
429 | onClear: this.handleClear,
|
430 | value: this.getValue(),
|
431 | placeholder: placeholder,
|
432 | notFoundContent: false,
|
433 | showNotFindInputItem: false,
|
434 | showNotFindSelectedItem: false,
|
435 | dropdownMatchSelectWidth: false,
|
436 | defaultActiveFirstOption: !inputValue,
|
437 | dropdownStyle: {
|
438 | minWidth: 256
|
439 | },
|
440 | onDropdownMouseDown: this.handleDropdownMouseDown,
|
441 | dropdownClassName: "".concat(prefixCls, "-dropdown"),
|
442 | getRootDomNode: this.getRootDomNode,
|
443 | showCheckAll: false,
|
444 | onChoiceItemClick: this.handleChoiceItemClick,
|
445 | getPopupContainer: getPopupContainer,
|
446 | allowClear: true,
|
447 | labelInValue: true,
|
448 | blurChange: false,
|
449 | border: false
|
450 | }, this.getOptions()), React.createElement("div", {
|
451 | className: "".concat(prefixCls, "-columns")
|
452 | }, this.renderColumnsTitle()));
|
453 | }
|
454 | }, {
|
455 | key: "renderColumnsTitle",
|
456 | value: function renderColumnsTitle() {
|
457 | var _this2 = this;
|
458 |
|
459 | var columns = this.state.columns;
|
460 | this.columnRefs = {};
|
461 | return columns.map(function (col) {
|
462 | var key = getColumnKey(col);
|
463 | return React.createElement("span", {
|
464 | ref: _this2.saveColumnRef.bind(_this2, key),
|
465 | key: key
|
466 | }, col.filterTitle || col.title);
|
467 | });
|
468 | }
|
469 | }, {
|
470 | key: "isMultiple",
|
471 | value: function isMultiple() {
|
472 | var selectColumn = this.state.selectColumn;
|
473 |
|
474 | if (selectColumn) {
|
475 | return selectColumn.filterMultiple;
|
476 | }
|
477 |
|
478 | return false;
|
479 | }
|
480 | }, {
|
481 | key: "fireChange",
|
482 | value: function fireChange(filters) {
|
483 | var onChange = this.props.onChange;
|
484 |
|
485 | if (typeof onChange === 'function') {
|
486 | onChange(filters);
|
487 | }
|
488 | }
|
489 | }, {
|
490 | key: "fireColumnFilterChange",
|
491 | value: function fireColumnFilterChange(columnKey, value) {
|
492 | var col = this.findColumn(columnKey);
|
493 | var onFilter = this.props.onFilter;
|
494 |
|
495 | if (col && onFilter) {
|
496 | onFilter(col, value || null);
|
497 | }
|
498 | }
|
499 | }, {
|
500 | key: "changeValue",
|
501 | value: function changeValue(changedValue, oldValue) {
|
502 | var _this3 = this;
|
503 |
|
504 | var state = this.state;
|
505 | var changedColumnKeys = [];
|
506 | var changedColumnFilters = state.columnFilters;
|
507 | var columnFiltersValues = this.getColumnFiltersValues();
|
508 |
|
509 | if (changedValue.length) {
|
510 | var len = columnFiltersValues.length;
|
511 |
|
512 | if (len > 0) {
|
513 | var index = oldValue.findIndex(function (item, i) {
|
514 | return item !== (changedValue[i] && changedValue[i].key);
|
515 | });
|
516 |
|
517 | if (index < columnFiltersValues.length) {
|
518 | var deleted = changedValue.splice(0, len - 1);
|
519 |
|
520 | if (deleted.length < 2 && changedValue[0] && changedValue[0].label === VALUE_OR) {
|
521 | changedValue.shift();
|
522 | }
|
523 |
|
524 | var value = columnFiltersValues[index];
|
525 |
|
526 | if (value === VALUE_OR) {
|
527 | value = columnFiltersValues[index + 1];
|
528 | }
|
529 |
|
530 | var columnKey = Object.keys(value)[0];
|
531 | var columnFilters = changedColumnFilters[columnKey].slice();
|
532 | var column = this.findColumn(columnKey);
|
533 |
|
534 | if (column) {
|
535 | var filters = column.filters;
|
536 | value[columnKey].split(VALUE_SPLIT).forEach(function (text) {
|
537 | var found = filters && filters.find(function (filter) {
|
538 | return filter.text === text;
|
539 | });
|
540 | var filterIndex = columnFilters.indexOf(found ? found.value : text);
|
541 |
|
542 | if (filterIndex !== -1) {
|
543 | columnFilters.splice(filterIndex, 1);
|
544 | changedColumnFilters[columnKey] = columnFilters;
|
545 |
|
546 | if (changedColumnKeys.indexOf(columnKey) === -1) {
|
547 | changedColumnKeys.push(columnKey);
|
548 | }
|
549 | }
|
550 | });
|
551 | }
|
552 | } else {
|
553 | changedValue.splice(0, len);
|
554 | }
|
555 | }
|
556 |
|
557 | changedColumnKeys.forEach(function (key) {
|
558 | _this3.fireColumnFilterChange(key, changedColumnFilters[key]);
|
559 | });
|
560 | } else {
|
561 | var onClear = this.props.onClear;
|
562 |
|
563 | if (onClear) {
|
564 | onClear();
|
565 | }
|
566 | }
|
567 |
|
568 | return removeDoubleOr(changedValue).map(function (item) {
|
569 | var label = item.label;
|
570 |
|
571 | if (label.constructor === Array) {
|
572 | return label && label[0];
|
573 | }
|
574 |
|
575 | return label;
|
576 | });
|
577 | }
|
578 | }, {
|
579 | key: "getColumnFiltersValues",
|
580 | value: function getColumnFiltersValues() {
|
581 | var _this4 = this;
|
582 |
|
583 | var values = [];
|
584 | var columnFilters = this.state.columnFilters;
|
585 | Object.keys(columnFilters).forEach(function (c) {
|
586 | var filteredValue = columnFilters[c];
|
587 |
|
588 | var column = _this4.findColumn(c);
|
589 |
|
590 | if (filteredValue && filteredValue.length && column) {
|
591 | var filters = column.filters;
|
592 | values.push(_defineProperty({}, c, filteredValue.map(function (value) {
|
593 | var found = filters && filters.find(function (filter) {
|
594 | return String(filter.value) === String(value);
|
595 | });
|
596 | return found ? found.text : value;
|
597 | }).join(VALUE_SPLIT)));
|
598 | }
|
599 | });
|
600 | return values;
|
601 | }
|
602 | }, {
|
603 | key: "getValue",
|
604 | value: function getValue() {
|
605 | var filters = this.state.filters;
|
606 | return this.getColumnFiltersValues().map(this.toValueString).concat(filters.map(barPair));
|
607 | }
|
608 | }, {
|
609 | key: "getInputFilterOptions",
|
610 | value: function getInputFilterOptions(inputValue) {
|
611 | var _this$props2 = this.props,
|
612 | columns = _this$props2.columns,
|
613 | dataSource = _this$props2.dataSource;
|
614 | var options = [];
|
615 |
|
616 | if (dataSource && columns) {
|
617 | var values = {};
|
618 | filterByInputValue(dataSource, columns, inputValue, function (record, column) {
|
619 | var dataIndex = column.dataIndex;
|
620 |
|
621 | if (dataIndex) {
|
622 | var value = record[dataIndex].toString();
|
623 |
|
624 | if (!values[value]) {
|
625 | values[value] = true;
|
626 | options.push(React.createElement(Option, {
|
627 | key: value,
|
628 | value: value
|
629 | }, value));
|
630 | }
|
631 | }
|
632 | });
|
633 | }
|
634 |
|
635 | return options;
|
636 | }
|
637 | }, {
|
638 | key: "getOptions",
|
639 | value: function getOptions() {
|
640 | var state = this.state;
|
641 | var selectColumn = state.selectColumn,
|
642 | inputValue = state.inputValue,
|
643 | columns = state.columns,
|
644 | checked = state.checked,
|
645 | columnFilters = state.columnFilters;
|
646 |
|
647 | if (selectColumn) {
|
648 | if (inputValue && inputValue.split(PAIR_SPLIT)[1]) {
|
649 | return null;
|
650 | }
|
651 |
|
652 | var filters = selectColumn.filters,
|
653 | filterMultiple = selectColumn.filterMultiple;
|
654 | var columnKey = getColumnKey(selectColumn);
|
655 |
|
656 | if (filters) {
|
657 | return filters.filter(function (filter) {
|
658 | return !filter.children;
|
659 | }).map(function (filter, i) {
|
660 | var value = String(filter.value);
|
661 | var text = filter.text;
|
662 |
|
663 | if (filterMultiple && columnKey) {
|
664 | var _checked = columnFilters[columnKey];
|
665 |
|
666 | if (_checked && !checked.length) {
|
667 | state.checked = _checked.slice();
|
668 | } else {
|
669 | _checked = checked;
|
670 | }
|
671 |
|
672 | text = [React.createElement(Checkbox, {
|
673 | key: "ck",
|
674 | className: "multiple",
|
675 | checked: _checked.indexOf(value) !== -1
|
676 | }), text];
|
677 | }
|
678 |
|
679 | return React.createElement(Option, {
|
680 | key: "filter-".concat(String(i)),
|
681 | value: value
|
682 | }, text);
|
683 | }).concat(filterMultiple ? React.createElement(OptGroup, {
|
684 | key: "ok"
|
685 | }, React.createElement(Option, {
|
686 | value: "__ok__",
|
687 | className: "".concat(this.getPrefixCls(), "-ok-btn")
|
688 | }, "\u786E\u8BA4")) : []);
|
689 | }
|
690 | } else if (inputValue) {
|
691 | return this.getInputFilterOptions(inputValue);
|
692 | } else {
|
693 | var _filters = this.state.filters;
|
694 | var multiple = this.props.multiple;
|
695 | var length = _filters.length;
|
696 | var value = this.getColumnFiltersValues();
|
697 | var keys = value.map(function (item) {
|
698 | return Object.keys(item)[0];
|
699 | });
|
700 | var options = columns.reduce(function (opts, column, i) {
|
701 | var key = getColumnKey(column, i);
|
702 |
|
703 | if (keys.indexOf(key) === -1 || column.filterMultiple) {
|
704 | opts.push(React.createElement(Option, {
|
705 | key: "column-".concat(key),
|
706 | value: key
|
707 | }, React.createElement("span", null, column.filterTitle || column.title)));
|
708 | }
|
709 |
|
710 | return opts;
|
711 | }, []);
|
712 |
|
713 | if (multiple && (length ? _filters[length - 1] !== VALUE_OR : value.length)) {
|
714 | return [React.createElement(OptGroup, {
|
715 | key: "or"
|
716 | }, React.createElement(Option, {
|
717 | value: OPTION_OR
|
718 | }, "OR")), React.createElement(OptGroup, {
|
719 | key: "all"
|
720 | }, options)];
|
721 | }
|
722 |
|
723 | return options;
|
724 | }
|
725 | }
|
726 | }, {
|
727 | key: "getColumnsWidthFilters",
|
728 | value: function getColumnsWidthFilters() {
|
729 | var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.props;
|
730 | return (props.columns || []).filter(function (column) {
|
731 | return column.filters instanceof Array;
|
732 | });
|
733 | }
|
734 | }, {
|
735 | key: "findColumn",
|
736 | value: function findColumn(myKey) {
|
737 | var columns = this.state.columns;
|
738 | return columns.find(function (c) {
|
739 | return getColumnKey(c) === myKey;
|
740 | });
|
741 | }
|
742 | }, {
|
743 | key: "getColumnTitle",
|
744 | value: function getColumnTitle(column) {
|
745 | var columnKey = getColumnKey(column);
|
746 |
|
747 | if (columnKey) {
|
748 | return "".concat(this.columnRefs[columnKey].textContent).concat(PAIR_SPLIT);
|
749 | }
|
750 |
|
751 | return '';
|
752 | }
|
753 | }]);
|
754 |
|
755 | return FilterSelect;
|
756 | }(Component);
|
757 |
|
758 | export { FilterSelect as default };
|
759 |
|