1 | import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
2 | import _extends from "@babel/runtime/helpers/extends";
|
3 | import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
|
4 | import _typeof from "@babel/runtime/helpers/typeof";
|
5 | import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
6 | import _objectSpread from "@babel/runtime/helpers/objectSpread2";
|
7 | import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
|
8 | import _createClass from "@babel/runtime/helpers/createClass";
|
9 | import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
|
10 | import _inherits from "@babel/runtime/helpers/inherits";
|
11 | import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
|
12 | import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
|
13 |
|
14 | function _createSuper(Derived) {
|
15 | function isNativeReflectConstruct() {
|
16 | if (typeof Reflect === "undefined" || !Reflect.construct) return false;
|
17 | if (Reflect.construct.sham) return false;
|
18 | if (typeof Proxy === "function") return true;
|
19 |
|
20 | try {
|
21 | Date.prototype.toString.call(Reflect.construct(Date, [], function () {}));
|
22 | return true;
|
23 | } catch (e) {
|
24 | return false;
|
25 | }
|
26 | }
|
27 |
|
28 | return function () {
|
29 | var Super = _getPrototypeOf(Derived),
|
30 | result;
|
31 |
|
32 | if (isNativeReflectConstruct()) {
|
33 | var NewTarget = _getPrototypeOf(this).constructor;
|
34 |
|
35 | result = Reflect.construct(Super, arguments, NewTarget);
|
36 | } else {
|
37 | result = Super.apply(this, arguments);
|
38 | }
|
39 |
|
40 | return _possibleConstructorReturn(this, result);
|
41 | };
|
42 | }
|
43 |
|
44 | import React, { Component } from 'react';
|
45 | import { findDOMNode } from 'react-dom';
|
46 | import PropTypes from 'prop-types';
|
47 | import classNames from 'classnames';
|
48 | import noop from 'lodash/noop';
|
49 | import scrollIntoView from 'scroll-into-view-if-needed';
|
50 | import smoothScrollIntoView from 'smooth-scroll-into-view-if-needed';
|
51 | import Pagination from '../pagination';
|
52 | import Icon from '../icon';
|
53 | import Spin from '../spin';
|
54 | import LocaleReceiver from '../locale-provider/LocaleReceiver';
|
55 | import defaultLocale from '../locale-provider/default';
|
56 | import warning from '../_util/warning';
|
57 | import FilterDropdown from './filterDropdown';
|
58 | import createStore from './createStore';
|
59 | import SelectionBox from './SelectionBox';
|
60 | import SelectionCheckboxAll from './SelectionCheckboxAll';
|
61 | import Column from './Column';
|
62 | import ColumnGroup from './ColumnGroup';
|
63 | import { getConfig, getPrefixCls as _getPrefixCls } from '../configure';
|
64 | import createBodyRow from './createBodyRow';
|
65 | import { findColumnByFilterValue, flatArray, flatFilter, getColumnKey as _getColumnKey, getLeafColumns, normalizeColumns, removeHiddenColumns, treeMap } from './util';
|
66 | import FilterBar from './FilterBar';
|
67 | import { VALUE_OR } from './FilterSelect';
|
68 | import RcTable from '../rc-components/table';
|
69 | import { Size } from '../_util/enum';
|
70 |
|
71 | function findBodyDom(dom, reg) {
|
72 | if (dom.childElementCount > 0) {
|
73 | for (var i = 0; i < dom.childElementCount; i += 1) {
|
74 | if (reg.test(dom.children[i].className)) {
|
75 | return dom.children[i];
|
76 | }
|
77 |
|
78 | if (dom.childElementCount > 0) {
|
79 | var childFound = findBodyDom(dom.children[i], reg);
|
80 |
|
81 | if (childFound !== null) {
|
82 | return childFound;
|
83 | }
|
84 | }
|
85 | }
|
86 | }
|
87 |
|
88 | return null;
|
89 | }
|
90 |
|
91 | function stopPropagation(e) {
|
92 | e.stopPropagation();
|
93 |
|
94 | if (e.nativeEvent.stopImmediatePropagation) {
|
95 | e.nativeEvent.stopImmediatePropagation();
|
96 | }
|
97 | }
|
98 |
|
99 | var defaultPagination = {
|
100 | onChange: noop,
|
101 | onShowSizeChange: noop
|
102 | };
|
103 |
|
104 |
|
105 |
|
106 |
|
107 |
|
108 | var emptyObject = {};
|
109 |
|
110 | var Table =
|
111 |
|
112 | function (_Component) {
|
113 | _inherits(Table, _Component);
|
114 |
|
115 | var _super = _createSuper(Table);
|
116 |
|
117 | function Table(props) {
|
118 | var _this;
|
119 |
|
120 | _classCallCheck(this, Table);
|
121 |
|
122 | _this = _super.call(this, props);
|
123 |
|
124 | _this.saveRef = function (ref) {
|
125 | _this.refTable = ref;
|
126 | };
|
127 |
|
128 | _this.getCheckboxPropsByItem = function (item, index) {
|
129 | var _this$props$rowSelect = _this.props.rowSelection,
|
130 | rowSelection = _this$props$rowSelect === void 0 ? {} : _this$props$rowSelect;
|
131 |
|
132 | if (!rowSelection.getCheckboxProps) {
|
133 | return {};
|
134 | }
|
135 |
|
136 | var key = _this.getRecordKey(item, index);
|
137 |
|
138 |
|
139 | if (!_this.CheckboxPropsCache[key]) {
|
140 | _this.CheckboxPropsCache[key] = rowSelection.getCheckboxProps(item);
|
141 | }
|
142 |
|
143 | return _this.CheckboxPropsCache[key];
|
144 | };
|
145 |
|
146 | _this.onRow = function (record, index) {
|
147 | var onRow = _this.props.onRow;
|
148 |
|
149 | var prefixCls = _this.getPrefixCls();
|
150 |
|
151 | var custom = onRow ? onRow(record, index) : {};
|
152 | return _objectSpread({}, custom, {
|
153 | prefixCls: prefixCls,
|
154 | store: _this.store,
|
155 | rowKey: _this.getRecordKey(record, index)
|
156 | });
|
157 | };
|
158 |
|
159 | _this.handleFilterSelectClear = function () {
|
160 | var filters = _this.state.filters;
|
161 | Object.keys(filters).map(function (key) {
|
162 | return filters[key] = [];
|
163 | });
|
164 |
|
165 | _this.setNewFilterState({
|
166 | barFilters: [],
|
167 | filters: filters
|
168 | });
|
169 | };
|
170 |
|
171 | _this.handleFilterSelectChange = function (barFilters) {
|
172 | var onFilterSelectChange = _this.props.onFilterSelectChange;
|
173 |
|
174 | if (onFilterSelectChange) {
|
175 | onFilterSelectChange(barFilters);
|
176 | }
|
177 |
|
178 | _this.setNewFilterState({
|
179 | barFilters: barFilters
|
180 | });
|
181 | };
|
182 |
|
183 | _this.handleColumnFilterChange = function (e) {
|
184 | var onColumnFilterChange = _this.props.onColumnFilterChange;
|
185 |
|
186 | if (onColumnFilterChange) {
|
187 | onColumnFilterChange(e);
|
188 | }
|
189 |
|
190 | _this.forceUpdate();
|
191 | };
|
192 |
|
193 | _this.handleFilter = function (column, nextFilters) {
|
194 | var stateFilters = _this.state.filters;
|
195 |
|
196 | var filters = _objectSpread({}, stateFilters, _defineProperty({}, _this.getColumnKey(column), nextFilters));
|
197 |
|
198 |
|
199 | var currentColumnKeys = [];
|
200 | treeMap(_this.columns, function (c) {
|
201 | if (!c.children) {
|
202 | currentColumnKeys.push(_this.getColumnKey(c));
|
203 | }
|
204 | });
|
205 | Object.keys(filters).forEach(function (columnKey) {
|
206 | if (currentColumnKeys.indexOf(columnKey) < 0) {
|
207 | delete filters[columnKey];
|
208 | }
|
209 | });
|
210 |
|
211 | _this.setNewFilterState({
|
212 | filters: filters
|
213 | });
|
214 | };
|
215 |
|
216 | _this.handleSelect = function (record, rowIndex, e) {
|
217 | var checked = e.target.checked;
|
218 | var nativeEvent = e.nativeEvent;
|
219 | var defaultSelection = _this.store.getState().selectionDirty ? [] : _this.getDefaultSelection();
|
220 |
|
221 | var selectedRowKeys = _this.store.getState().selectedRowKeys.concat(defaultSelection);
|
222 |
|
223 | var key = _this.getRecordKey(record, rowIndex);
|
224 |
|
225 | if (checked) {
|
226 | selectedRowKeys.push(_this.getRecordKey(record, rowIndex));
|
227 | } else {
|
228 | selectedRowKeys = selectedRowKeys.filter(function (i) {
|
229 | return key !== i;
|
230 | });
|
231 | }
|
232 |
|
233 | _this.store.setState({
|
234 | selectionDirty: true
|
235 | });
|
236 |
|
237 | _this.setSelectedRowKeys(selectedRowKeys, {
|
238 | selectWay: 'onSelect',
|
239 | record: record,
|
240 | checked: checked,
|
241 | changeRowKeys: undefined,
|
242 | nativeEvent: nativeEvent
|
243 | });
|
244 | };
|
245 |
|
246 | _this.handleRadioSelect = function (record, rowIndex, e) {
|
247 | var checked = e.target.checked;
|
248 | var nativeEvent = e.nativeEvent;
|
249 | var defaultSelection = _this.store.getState().selectionDirty ? [] : _this.getDefaultSelection();
|
250 |
|
251 | var selectedRowKeys = _this.store.getState().selectedRowKeys.concat(defaultSelection);
|
252 |
|
253 | var key = _this.getRecordKey(record, rowIndex);
|
254 |
|
255 | selectedRowKeys = [key];
|
256 |
|
257 | _this.store.setState({
|
258 | selectionDirty: true
|
259 | });
|
260 |
|
261 | _this.setSelectedRowKeys(selectedRowKeys, {
|
262 | selectWay: 'onSelect',
|
263 | record: record,
|
264 | checked: checked,
|
265 | changeRowKeys: undefined,
|
266 | nativeEvent: nativeEvent
|
267 | });
|
268 | };
|
269 |
|
270 | _this.handleSelectRow = function (selectionKey, index, onSelectFunc) {
|
271 | var data = _this.getFlatCurrentPageData();
|
272 |
|
273 | var defaultSelection = _this.store.getState().selectionDirty ? [] : _this.getDefaultSelection();
|
274 |
|
275 | var selectedRowKeys = _this.store.getState().selectedRowKeys.concat(defaultSelection);
|
276 |
|
277 | var changeableRowKeys = data.filter(function (item, i) {
|
278 | return !_this.getCheckboxPropsByItem(item, i).disabled;
|
279 | }).map(function (item, i) {
|
280 | return _this.getRecordKey(item, i);
|
281 | });
|
282 | var changeRowKeys = [];
|
283 | var selectWay = '';
|
284 | var checked;
|
285 |
|
286 | switch (selectionKey) {
|
287 | case 'all':
|
288 | changeableRowKeys.forEach(function (key) {
|
289 | if (selectedRowKeys.indexOf(key) < 0) {
|
290 | selectedRowKeys.push(key);
|
291 | changeRowKeys.push(key);
|
292 | }
|
293 | });
|
294 | selectWay = 'onSelectAll';
|
295 | checked = true;
|
296 | break;
|
297 |
|
298 | case 'removeAll':
|
299 | changeableRowKeys.forEach(function (key) {
|
300 | if (selectedRowKeys.indexOf(key) >= 0) {
|
301 | selectedRowKeys.splice(selectedRowKeys.indexOf(key), 1);
|
302 | changeRowKeys.push(key);
|
303 | }
|
304 | });
|
305 | selectWay = 'onSelectAll';
|
306 | checked = false;
|
307 | break;
|
308 |
|
309 | case 'invert':
|
310 | changeableRowKeys.forEach(function (key) {
|
311 | if (selectedRowKeys.indexOf(key) < 0) {
|
312 | selectedRowKeys.push(key);
|
313 | } else {
|
314 | selectedRowKeys.splice(selectedRowKeys.indexOf(key), 1);
|
315 | }
|
316 |
|
317 | changeRowKeys.push(key);
|
318 | selectWay = 'onSelectInvert';
|
319 | });
|
320 | break;
|
321 |
|
322 | default:
|
323 | break;
|
324 | }
|
325 |
|
326 | _this.store.setState({
|
327 | selectionDirty: true
|
328 | });
|
329 |
|
330 |
|
331 | var rowSelection = _this.props.rowSelection;
|
332 | var customSelectionStartIndex = 2;
|
333 |
|
334 | if (rowSelection && rowSelection.hideDefaultSelections) {
|
335 | customSelectionStartIndex = 0;
|
336 | }
|
337 |
|
338 | if (index >= customSelectionStartIndex && typeof onSelectFunc === 'function') {
|
339 | return onSelectFunc(changeableRowKeys);
|
340 | }
|
341 |
|
342 | _this.setSelectedRowKeys(selectedRowKeys, {
|
343 | selectWay: selectWay,
|
344 | checked: checked,
|
345 | changeRowKeys: changeRowKeys
|
346 | });
|
347 | };
|
348 |
|
349 | _this.handlePageChange = function (current) {
|
350 | var _this$props = _this.props,
|
351 | onChange = _this$props.onChange,
|
352 | autoScroll = _this$props.autoScroll,
|
353 | propsPagination = _this$props.pagination;
|
354 | var statePagination = _this.state.pagination;
|
355 |
|
356 | var pagination = _objectSpread({}, statePagination);
|
357 |
|
358 | if (autoScroll) {
|
359 | var scrollIntoViewSmoothly = 'scrollBehavior' in document.documentElement.style ? scrollIntoView : smoothScrollIntoView;
|
360 | setTimeout(function () {
|
361 | if (_this.refTable && _this.refTable.clientHeight > document.body.clientHeight) {
|
362 | scrollIntoViewSmoothly(_this.refTable, {
|
363 | block: 'start',
|
364 | behavior: 'smooth',
|
365 | scrollMode: 'if-needed'
|
366 | });
|
367 | } else if (_this.refTable) {
|
368 |
|
369 | if (_this.refTable.scrollIntoViewIfNeeded) {
|
370 |
|
371 | _this.refTable.scrollIntoViewIfNeeded({
|
372 | block: 'start'
|
373 | });
|
374 | } else {
|
375 | scrollIntoViewSmoothly(_this.refTable, {
|
376 | block: 'start',
|
377 | behavior: 'smooth',
|
378 | scrollMode: 'if-needed'
|
379 | });
|
380 | }
|
381 | }
|
382 | }, 10);
|
383 |
|
384 | if (_this.refTable) {
|
385 | var dom = findBodyDom(_this.refTable, new RegExp("".concat(_this.getPrefixCls(), "-body")));
|
386 |
|
387 | if (dom !== null && dom.scroll) {
|
388 | dom.scrollTop = 0;
|
389 | }
|
390 | }
|
391 | }
|
392 |
|
393 | if (current) {
|
394 | pagination.current = current;
|
395 | } else {
|
396 | pagination.current = pagination.current || 1;
|
397 | }
|
398 |
|
399 | for (var _len = arguments.length, otherArguments = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
|
400 | otherArguments[_key - 1] = arguments[_key];
|
401 | }
|
402 |
|
403 | pagination.onChange.apply(pagination, [pagination.current].concat(otherArguments));
|
404 | var newState = {
|
405 | pagination: pagination
|
406 | };
|
407 |
|
408 | if (propsPagination && _typeof(propsPagination) === 'object' && 'current' in propsPagination) {
|
409 | newState.pagination = _objectSpread({}, pagination, {
|
410 | current: statePagination.current
|
411 | });
|
412 | }
|
413 |
|
414 | _this.setState(newState);
|
415 |
|
416 | _this.store.setState({
|
417 | selectionDirty: false
|
418 | });
|
419 |
|
420 | if (onChange) {
|
421 | onChange.apply(void 0, _toConsumableArray(_this.prepareParamsArguments(_objectSpread({}, _this.state, {
|
422 | selectionDirty: false,
|
423 | pagination: pagination
|
424 | }))));
|
425 | }
|
426 | };
|
427 |
|
428 | _this.renderSelectionBox = function (type) {
|
429 | return function (_, record, index) {
|
430 | var rowIndex = _this.getRecordKey(record, index);
|
431 |
|
432 |
|
433 | var props = _this.getCheckboxPropsByItem(record, index);
|
434 |
|
435 | var handleChange = function handleChange(e) {
|
436 | if (type === 'radio') {
|
437 | _this.handleRadioSelect(record, rowIndex, e);
|
438 | } else {
|
439 | _this.handleSelect(record, rowIndex, e);
|
440 | }
|
441 | };
|
442 |
|
443 | return React.createElement("span", {
|
444 | onClick: stopPropagation
|
445 | }, React.createElement(SelectionBox, _extends({
|
446 | type: type,
|
447 | store: _this.store,
|
448 | rowIndex: rowIndex,
|
449 | onChange: handleChange,
|
450 | defaultSelection: _this.getDefaultSelection()
|
451 | }, props)));
|
452 | };
|
453 | };
|
454 |
|
455 | _this.getRecordKey = function (record, index) {
|
456 | var rowKey = _this.props.rowKey;
|
457 | var recordKey = typeof rowKey === 'function' ? rowKey(record, index) : record[rowKey];
|
458 | warning(recordKey !== undefined, 'Each record in dataSource of table should have a unique `key` prop, or set `rowKey` to an unique primary key');
|
459 | return recordKey === undefined ? index : recordKey;
|
460 | };
|
461 |
|
462 | _this.getPopupContainer = function () {
|
463 | return findDOMNode(_assertThisInitialized(_this));
|
464 | };
|
465 |
|
466 | _this.handleShowSizeChange = function (current, pageSize) {
|
467 | var pagination = _this.state.pagination;
|
468 | pagination.onShowSizeChange(current, pageSize);
|
469 |
|
470 | var nextPagination = _objectSpread({}, pagination, {
|
471 | pageSize: pageSize,
|
472 | current: current
|
473 | });
|
474 |
|
475 | _this.setState({
|
476 | pagination: nextPagination
|
477 | });
|
478 |
|
479 | var onChange = _this.props.onChange;
|
480 |
|
481 | if (onChange) {
|
482 | onChange.apply(void 0, _toConsumableArray(_this.prepareParamsArguments(_objectSpread({}, _this.state, {
|
483 | pagination: nextPagination
|
484 | }))));
|
485 | }
|
486 | };
|
487 |
|
488 | _this.renderTable = function (contextLocale, loading) {
|
489 | var _classNames;
|
490 |
|
491 | var _assertThisInitialize = _assertThisInitialized(_this),
|
492 | props = _assertThisInitialize.props;
|
493 |
|
494 | var locale = _objectSpread({}, contextLocale, {}, props.locale);
|
495 |
|
496 | var filterBarMultiple = props.filterBarMultiple,
|
497 | filterBarPlaceholder = props.filterBarPlaceholder,
|
498 | showHeader = props.showHeader,
|
499 | filterBar = props.filterBar,
|
500 | dataSource = props.dataSource,
|
501 | filters = props.filters,
|
502 | empty = props.empty,
|
503 | restProps = _objectWithoutProperties(props, ["filterBarMultiple", "filterBarPlaceholder", "showHeader", "filterBar", "dataSource", "filters", "empty"]);
|
504 |
|
505 | var columnFilters = _this.state.filters;
|
506 |
|
507 | var prefixCls = _this.getPrefixCls();
|
508 |
|
509 | var data = _this.getCurrentPageData();
|
510 |
|
511 | var expandIconAsCell = props.expandedRowRender && props.expandIconAsCell !== false;
|
512 | var classString = classNames((_classNames = {}, _defineProperty(_classNames, "".concat(prefixCls, "-").concat(props.size), true), _defineProperty(_classNames, "".concat(prefixCls, "-bordered"), props.bordered), _defineProperty(_classNames, "".concat(prefixCls, "-empty"), !data.length), _defineProperty(_classNames, "".concat(prefixCls, "-without-column-header"), !showHeader), _classNames));
|
513 |
|
514 | var columns = _this.renderRowSelection(locale);
|
515 |
|
516 | columns = _this.renderColumnsDropdown(columns, locale);
|
517 | columns = columns.map(function (column, i) {
|
518 | var newColumn = _objectSpread({}, column);
|
519 |
|
520 | newColumn.key = _this.getColumnKey(newColumn, i);
|
521 | return newColumn;
|
522 | });
|
523 | columns = removeHiddenColumns(columns);
|
524 | var expandIconColumnIndex = columns[0] && columns[0].key === 'selection-column' ? 1 : 0;
|
525 |
|
526 | if ('expandIconColumnIndex' in restProps) {
|
527 | expandIconColumnIndex = restProps.expandIconColumnIndex;
|
528 | }
|
529 |
|
530 | var table = React.createElement(RcTable, _extends({
|
531 | key: "table"
|
532 | }, restProps, {
|
533 | onRow: _this.onRow,
|
534 | components: _this.components,
|
535 | prefixCls: prefixCls,
|
536 | data: data,
|
537 | columns: columns,
|
538 | showHeader: showHeader,
|
539 | className: classString,
|
540 | expandIconColumnIndex: expandIconColumnIndex,
|
541 | expandIconAsCell: expandIconAsCell,
|
542 | emptyText: !loading.spinning && (empty || locale.emptyText)
|
543 | }));
|
544 |
|
545 | if (filterBar) {
|
546 | var bar = React.createElement(FilterBar, {
|
547 | key: "filter-bar",
|
548 | prefixCls: prefixCls,
|
549 | placeholder: filterBarPlaceholder,
|
550 | columns: getLeafColumns(_this.columns),
|
551 | onFilterSelectChange: _this.handleFilterSelectChange,
|
552 | onFilterSelectClear: _this.handleFilterSelectClear,
|
553 | onColumnFilterChange: _this.handleColumnFilterChange,
|
554 | onFilter: _this.handleFilter,
|
555 | dataSource: dataSource,
|
556 | filters: filters,
|
557 | columnFilters: columnFilters,
|
558 | multiple: filterBarMultiple,
|
559 | getPopupContainer: _this.getPopupContainer
|
560 | });
|
561 | return [bar, table];
|
562 | }
|
563 |
|
564 | return table;
|
565 | };
|
566 |
|
567 | warning(!('columnsPageRange' in props || 'columnsPageSize' in props), '`columnsPageRange` and `columnsPageSize` are removed, please use fixed columns instead');
|
568 | _this.columns = props.columns || normalizeColumns(props.children);
|
569 |
|
570 | _this.createComponents(props.components);
|
571 |
|
572 | _this.state = _objectSpread({}, _this.getDefaultSortOrder(_this.columns), {
|
573 |
|
574 | filters: _this.getFiltersFromColumns(),
|
575 | barFilters: props.filters || [],
|
576 | pagination: _this.getDefaultPagination(props)
|
577 | });
|
578 | _this.CheckboxPropsCache = {};
|
579 | _this.store = createStore({
|
580 | selectedRowKeys: (props.rowSelection || {}).selectedRowKeys || [],
|
581 | selectionDirty: false
|
582 | });
|
583 | return _this;
|
584 | }
|
585 |
|
586 | _createClass(Table, [{
|
587 | key: "getPrefixCls",
|
588 | value: function getPrefixCls() {
|
589 | var prefixCls = this.props.prefixCls;
|
590 | return _getPrefixCls('table', prefixCls);
|
591 | }
|
592 | }, {
|
593 | key: "getDefaultSelection",
|
594 | value: function getDefaultSelection() {
|
595 | var _this2 = this;
|
596 |
|
597 | var _this$props$rowSelect2 = this.props.rowSelection,
|
598 | rowSelection = _this$props$rowSelect2 === void 0 ? {} : _this$props$rowSelect2;
|
599 |
|
600 | if (!rowSelection.getCheckboxProps) {
|
601 | return [];
|
602 | }
|
603 |
|
604 | return this.getFlatData().filter(function (item, rowIndex) {
|
605 | return _this2.getCheckboxPropsByItem(item, rowIndex).defaultChecked;
|
606 | }).map(function (record, rowIndex) {
|
607 | return _this2.getRecordKey(record, rowIndex);
|
608 | });
|
609 | }
|
610 | }, {
|
611 | key: "getDefaultPagination",
|
612 | value: function getDefaultPagination(props) {
|
613 | var pagination = props.pagination || {};
|
614 | return this.hasPagination(props) ? _objectSpread({}, defaultPagination, {
|
615 | size: props.size
|
616 | }, pagination, {
|
617 | current: pagination.defaultCurrent || pagination.current || 1,
|
618 | pageSize: pagination.defaultPageSize || pagination.pageSize || 10
|
619 | }) : {};
|
620 | }
|
621 | }, {
|
622 | key: "componentWillReceiveProps",
|
623 | value: function componentWillReceiveProps(nextProps) {
|
624 | this.columns = nextProps.columns || normalizeColumns(nextProps.children);
|
625 |
|
626 | if ('pagination' in nextProps || 'pagination' in this.props) {
|
627 | this.setState(function (previousState) {
|
628 | var newPagination = _objectSpread({}, defaultPagination, {
|
629 | size: nextProps.size
|
630 | }, previousState.pagination, {}, nextProps.pagination);
|
631 |
|
632 | newPagination.current = newPagination.current || 1;
|
633 | newPagination.pageSize = newPagination.pageSize || 10;
|
634 | return {
|
635 | pagination: nextProps.pagination !== false ? newPagination : emptyObject
|
636 | };
|
637 | });
|
638 | }
|
639 |
|
640 | var _this$props2 = this.props,
|
641 | rowSelection = _this$props2.rowSelection,
|
642 | dataSource = _this$props2.dataSource,
|
643 | components = _this$props2.components;
|
644 | var _this$state = this.state,
|
645 | filters = _this$state.filters,
|
646 | sortColumn = _this$state.sortColumn,
|
647 | sortOrder = _this$state.sortOrder;
|
648 |
|
649 | if (nextProps.rowSelection && 'selectedRowKeys' in nextProps.rowSelection) {
|
650 | this.store.setState({
|
651 | selectedRowKeys: nextProps.rowSelection.selectedRowKeys || []
|
652 | });
|
653 |
|
654 | if (rowSelection && nextProps.rowSelection.getCheckboxProps !== rowSelection.getCheckboxProps) {
|
655 | this.CheckboxPropsCache = {};
|
656 | }
|
657 | }
|
658 |
|
659 | if ('dataSource' in nextProps && nextProps.dataSource !== dataSource) {
|
660 | this.store.setState({
|
661 | selectionDirty: false
|
662 | });
|
663 | this.CheckboxPropsCache = {};
|
664 | }
|
665 |
|
666 | if (this.getSortOrderColumns(this.columns).length > 0) {
|
667 | var sortState = this.getSortStateFromColumns(this.columns);
|
668 |
|
669 | if (sortState.sortColumn !== sortColumn || sortState.sortOrder !== sortOrder) {
|
670 | this.setState(sortState);
|
671 | }
|
672 | }
|
673 |
|
674 | var filteredValueColumns = this.getFilteredValueColumns(this.columns);
|
675 |
|
676 | if (filteredValueColumns.length > 0) {
|
677 | var filtersFromColumns = this.getFiltersFromColumns(this.columns);
|
678 |
|
679 | var newFilters = _objectSpread({}, filters);
|
680 |
|
681 | Object.keys(filtersFromColumns).forEach(function (key) {
|
682 | newFilters[key] = filtersFromColumns[key];
|
683 | });
|
684 |
|
685 | if (this.isFiltersChanged(newFilters)) {
|
686 | this.setState({
|
687 | filters: newFilters
|
688 | });
|
689 | }
|
690 | }
|
691 |
|
692 | if ('filters' in nextProps) {
|
693 | this.setState({
|
694 | barFilters: nextProps.filters || []
|
695 | });
|
696 | }
|
697 |
|
698 | this.createComponents(nextProps.components, components);
|
699 | }
|
700 | }, {
|
701 | key: "setSelectedRowKeys",
|
702 | value: function setSelectedRowKeys(selectedRowKeys, _ref) {
|
703 | var _this3 = this;
|
704 |
|
705 | var selectWay = _ref.selectWay,
|
706 | record = _ref.record,
|
707 | checked = _ref.checked,
|
708 | changeRowKeys = _ref.changeRowKeys,
|
709 | nativeEvent = _ref.nativeEvent;
|
710 | var _this$props$rowSelect3 = this.props.rowSelection,
|
711 | rowSelection = _this$props$rowSelect3 === void 0 ? {} : _this$props$rowSelect3;
|
712 |
|
713 | if (rowSelection && !('selectedRowKeys' in rowSelection)) {
|
714 | this.store.setState({
|
715 | selectedRowKeys: selectedRowKeys
|
716 | });
|
717 | }
|
718 |
|
719 | var data = this.getFlatData();
|
720 |
|
721 | if (!rowSelection.onChange && !rowSelection[selectWay]) {
|
722 | return;
|
723 | }
|
724 |
|
725 | var selectedRows = data.filter(function (row, i) {
|
726 | return selectedRowKeys.indexOf(_this3.getRecordKey(row, i)) >= 0;
|
727 | });
|
728 |
|
729 | if (rowSelection.onChange) {
|
730 | rowSelection.onChange(selectedRowKeys, selectedRows);
|
731 | }
|
732 |
|
733 | if (selectWay === 'onSelect' && rowSelection.onSelect) {
|
734 | rowSelection.onSelect(record, checked, selectedRows, nativeEvent);
|
735 | } else if (selectWay === 'onSelectAll' && rowSelection.onSelectAll) {
|
736 | var changeRows = data.filter(function (row, i) {
|
737 | return changeRowKeys.indexOf(_this3.getRecordKey(row, i)) >= 0;
|
738 | });
|
739 | rowSelection.onSelectAll(checked, selectedRows, changeRows);
|
740 | } else if (selectWay === 'onSelectInvert' && rowSelection.onSelectInvert) {
|
741 | rowSelection.onSelectInvert(selectedRowKeys);
|
742 | }
|
743 | }
|
744 | }, {
|
745 | key: "hasPagination",
|
746 | value: function hasPagination(props) {
|
747 | return (props || this.props).pagination !== false;
|
748 | }
|
749 | }, {
|
750 | key: "isFiltersChanged",
|
751 | value: function isFiltersChanged(filters) {
|
752 | var filtersChanged = false;
|
753 | var stateFilters = this.state.filters;
|
754 |
|
755 | if (Object.keys(filters).length !== Object.keys(stateFilters).length) {
|
756 | filtersChanged = true;
|
757 | } else {
|
758 | Object.keys(filters).forEach(function (columnKey) {
|
759 | if (filters[columnKey] !== stateFilters[columnKey]) {
|
760 | filtersChanged = true;
|
761 | }
|
762 | });
|
763 | }
|
764 |
|
765 | return filtersChanged;
|
766 | }
|
767 | }, {
|
768 | key: "getSortOrderColumns",
|
769 | value: function getSortOrderColumns(columns) {
|
770 | return flatFilter(columns || this.columns || [], function (column) {
|
771 | return 'sortOrder' in column;
|
772 | });
|
773 | }
|
774 | }, {
|
775 | key: "getFilteredValueColumns",
|
776 | value: function getFilteredValueColumns(columns) {
|
777 | return flatFilter(columns || this.columns || [], function (column) {
|
778 | return typeof column.filteredValue !== 'undefined';
|
779 | });
|
780 | }
|
781 | }, {
|
782 | key: "getFiltersFromColumns",
|
783 | value: function getFiltersFromColumns(columns) {
|
784 | var _this4 = this;
|
785 |
|
786 | var filters = {};
|
787 | this.getFilteredValueColumns(columns).forEach(function (col) {
|
788 | var colKey = _this4.getColumnKey(col);
|
789 |
|
790 | filters[colKey] = col.filteredValue;
|
791 | });
|
792 | return filters;
|
793 | }
|
794 | }, {
|
795 | key: "getDefaultSortOrder",
|
796 | value: function getDefaultSortOrder(columns) {
|
797 | var definedSortState = this.getSortStateFromColumns(columns);
|
798 | var defaultSortedColumn = flatFilter(columns || [], function (column) {
|
799 | return column.defaultSortOrder != null;
|
800 | })[0];
|
801 |
|
802 | if (defaultSortedColumn && !definedSortState.sortColumn) {
|
803 | return {
|
804 | sortColumn: defaultSortedColumn,
|
805 | sortOrder: defaultSortedColumn.defaultSortOrder
|
806 | };
|
807 | }
|
808 |
|
809 | return definedSortState;
|
810 | }
|
811 | }, {
|
812 | key: "getSortStateFromColumns",
|
813 | value: function getSortStateFromColumns(columns) {
|
814 |
|
815 | var sortedColumn = this.getSortOrderColumns(columns).filter(function (col) {
|
816 | return col.sortOrder;
|
817 | })[0];
|
818 |
|
819 | if (sortedColumn) {
|
820 | return {
|
821 | sortColumn: sortedColumn,
|
822 | sortOrder: sortedColumn.sortOrder
|
823 | };
|
824 | }
|
825 |
|
826 | return {
|
827 | sortColumn: null,
|
828 | sortOrder: null
|
829 | };
|
830 | }
|
831 | }, {
|
832 | key: "getSorterFn",
|
833 | value: function getSorterFn() {
|
834 | var _this$state2 = this.state,
|
835 | sortOrder = _this$state2.sortOrder,
|
836 | sortColumn = _this$state2.sortColumn;
|
837 |
|
838 | if (!sortOrder || !sortColumn || typeof sortColumn.sorter !== 'function') {
|
839 | return;
|
840 | }
|
841 |
|
842 | return function (a, b) {
|
843 | var result = sortColumn.sorter(a, b);
|
844 |
|
845 | if (result !== 0) {
|
846 | return sortOrder === 'descend' ? -result : result;
|
847 | }
|
848 |
|
849 | return 0;
|
850 | };
|
851 | }
|
852 | }, {
|
853 | key: "setSortOrder",
|
854 | value: function setSortOrder(order, column) {
|
855 | var newState = {
|
856 | sortOrder: order,
|
857 | sortColumn: column
|
858 | };
|
859 |
|
860 | if (this.getSortOrderColumns().length === 0) {
|
861 | this.setState(newState);
|
862 | }
|
863 |
|
864 | var onChange = this.props.onChange;
|
865 |
|
866 | if (onChange) {
|
867 | onChange.apply(void 0, _toConsumableArray(this.prepareParamsArguments(_objectSpread({}, this.state, {}, newState))));
|
868 | }
|
869 | }
|
870 | }, {
|
871 | key: "toggleSortOrder",
|
872 | value: function toggleSortOrder(order, column) {
|
873 | var _this$state3 = this.state,
|
874 | sortColumn = _this$state3.sortColumn,
|
875 | sortOrder = _this$state3.sortOrder;
|
876 |
|
877 | var isSortColumn = this.isSortColumn(column);
|
878 |
|
879 | if (!isSortColumn) {
|
880 |
|
881 | sortOrder = order;
|
882 | sortColumn = column;
|
883 | } else if (sortOrder === order) {
|
884 |
|
885 | sortOrder = '';
|
886 | sortColumn = null;
|
887 | } else {
|
888 |
|
889 | sortOrder = order;
|
890 | }
|
891 |
|
892 | var newState = {
|
893 | sortOrder: sortOrder,
|
894 | sortColumn: sortColumn
|
895 | };
|
896 |
|
897 | if (this.getSortOrderColumns().length === 0) {
|
898 | this.setState(newState);
|
899 | }
|
900 |
|
901 | var onChange = this.props.onChange;
|
902 |
|
903 | if (onChange) {
|
904 | onChange.apply(void 0, _toConsumableArray(this.prepareParamsArguments(_objectSpread({}, this.state, {}, newState))));
|
905 | }
|
906 | }
|
907 | }, {
|
908 | key: "setNewFilterState",
|
909 | value: function setNewFilterState(newState) {
|
910 | var _this5 = this;
|
911 |
|
912 | var _this$props3 = this.props,
|
913 | propsPagination = _this$props3.pagination,
|
914 | onChange = _this$props3.onChange;
|
915 | var statePagination = this.state.pagination;
|
916 |
|
917 | var pagination = _objectSpread({}, statePagination);
|
918 |
|
919 | if (propsPagination) {
|
920 |
|
921 | pagination.current = 1;
|
922 | pagination.onChange(pagination.current);
|
923 | }
|
924 |
|
925 |
|
926 | if (propsPagination && _typeof(propsPagination) === 'object' && 'current' in propsPagination) {
|
927 | newState.pagination = _objectSpread({}, pagination, {
|
928 | current: statePagination.current
|
929 | });
|
930 | }
|
931 |
|
932 | this.setState(newState, function () {
|
933 | _this5.store.setState({
|
934 | selectionDirty: false
|
935 | });
|
936 |
|
937 | if (onChange) {
|
938 | onChange.apply(void 0, _toConsumableArray(_this5.prepareParamsArguments(_objectSpread({}, _this5.state, {
|
939 | selectionDirty: false,
|
940 | pagination: pagination
|
941 | }))));
|
942 | }
|
943 | });
|
944 | }
|
945 | }, {
|
946 | key: "renderRowSelection",
|
947 | value: function renderRowSelection(locale) {
|
948 | var _this6 = this;
|
949 |
|
950 | var rowSelection = this.props.rowSelection;
|
951 | var prefixCls = this.getPrefixCls();
|
952 | var columns = this.columns.concat();
|
953 |
|
954 | if (rowSelection) {
|
955 | var data = this.getFlatCurrentPageData().filter(function (item, index) {
|
956 | if (rowSelection.getCheckboxProps) {
|
957 | return !_this6.getCheckboxPropsByItem(item, index).disabled;
|
958 | }
|
959 |
|
960 | return true;
|
961 | });
|
962 | var selectionColumnClass = classNames("".concat(prefixCls, "-selection-column"), _defineProperty({}, "".concat(prefixCls, "-selection-column-custom"), rowSelection.selections));
|
963 | var selectionColumn = {
|
964 | key: 'selection-column',
|
965 | render: this.renderSelectionBox(rowSelection.type),
|
966 | className: selectionColumnClass,
|
967 | fixed: rowSelection.fixed,
|
968 | width: rowSelection.columnWidth
|
969 | };
|
970 |
|
971 | if (rowSelection.type !== 'radio') {
|
972 | var checkboxAllDisabled = data.every(function (item, index) {
|
973 | return _this6.getCheckboxPropsByItem(item, index).disabled;
|
974 | });
|
975 | selectionColumn.title = React.createElement(SelectionCheckboxAll, {
|
976 | store: this.store,
|
977 | locale: locale,
|
978 | data: data,
|
979 | getCheckboxPropsByItem: this.getCheckboxPropsByItem,
|
980 | getRecordKey: this.getRecordKey,
|
981 | disabled: checkboxAllDisabled,
|
982 | prefixCls: prefixCls,
|
983 | onSelect: this.handleSelectRow,
|
984 | selections: rowSelection.selections,
|
985 | hideDefaultSelections: rowSelection.hideDefaultSelections,
|
986 | getPopupContainer: this.getPopupContainer
|
987 | });
|
988 | }
|
989 |
|
990 | if ('fixed' in rowSelection) {
|
991 | selectionColumn.fixed = rowSelection.fixed;
|
992 | } else if (columns.some(function (column) {
|
993 | return column.fixed === 'left' || column.fixed === true;
|
994 | })) {
|
995 | selectionColumn.fixed = 'left';
|
996 | }
|
997 |
|
998 | if (columns[0] && columns[0].key === 'selection-column') {
|
999 | columns[0] = selectionColumn;
|
1000 | } else {
|
1001 | columns.unshift(selectionColumn);
|
1002 | }
|
1003 | }
|
1004 |
|
1005 | return columns;
|
1006 | }
|
1007 | }, {
|
1008 | key: "getColumnKey",
|
1009 | value: function getColumnKey(column, index) {
|
1010 | return _getColumnKey(column, index);
|
1011 | }
|
1012 | }, {
|
1013 | key: "getMaxCurrent",
|
1014 | value: function getMaxCurrent(total) {
|
1015 | var _this$state$paginatio = this.state.pagination,
|
1016 | current = _this$state$paginatio.current,
|
1017 | pageSize = _this$state$paginatio.pageSize;
|
1018 |
|
1019 | if ((current - 1) * pageSize >= total) {
|
1020 | return Math.floor((total - 1) / pageSize) + 1;
|
1021 | }
|
1022 |
|
1023 | return current;
|
1024 | }
|
1025 | }, {
|
1026 | key: "isSortColumn",
|
1027 | value: function isSortColumn(column) {
|
1028 | var sortColumn = this.state.sortColumn;
|
1029 |
|
1030 | if (!column || !sortColumn) {
|
1031 | return false;
|
1032 | }
|
1033 |
|
1034 | return this.getColumnKey(sortColumn) === this.getColumnKey(column);
|
1035 | }
|
1036 | }, {
|
1037 | key: "renderColumnsDropdown",
|
1038 | value: function renderColumnsDropdown(columns, locale) {
|
1039 | var _this7 = this;
|
1040 |
|
1041 | var _this$props4 = this.props,
|
1042 | customizeDropdownPrefixCls = _this$props4.dropdownPrefixCls,
|
1043 | filterBar = _this$props4.filterBar;
|
1044 | var prefixCls = this.getPrefixCls();
|
1045 |
|
1046 | var dropdownPrefixCls = _getPrefixCls('dropdown', customizeDropdownPrefixCls);
|
1047 |
|
1048 | var _this$state4 = this.state,
|
1049 | sortOrder = _this$state4.sortOrder,
|
1050 | filters = _this$state4.filters;
|
1051 | return treeMap(columns, function (originColumn, i) {
|
1052 | var column = _objectSpread({}, originColumn);
|
1053 |
|
1054 | var key = _this7.getColumnKey(column, i);
|
1055 |
|
1056 | var filterDropdown;
|
1057 | var sortButton;
|
1058 |
|
1059 | if (!filterBar && column.filters && column.filters.length > 0 || column.filterDropdown) {
|
1060 | var colFilters = filters[key] || [];
|
1061 | filterDropdown = React.createElement(FilterDropdown, {
|
1062 | locale: locale,
|
1063 | column: column,
|
1064 | selectedKeys: colFilters,
|
1065 | confirmFilter: _this7.handleFilter,
|
1066 | prefixCls: "".concat(prefixCls, "-filter"),
|
1067 | dropdownPrefixCls: dropdownPrefixCls,
|
1068 | getPopupContainer: _this7.getPopupContainer
|
1069 | });
|
1070 | }
|
1071 |
|
1072 | if (column.sorter) {
|
1073 | var isSortColumn = _this7.isSortColumn(column);
|
1074 |
|
1075 | var isAscend = isSortColumn && sortOrder === 'ascend';
|
1076 |
|
1077 | column.className = classNames(column.className, _defineProperty({}, "".concat(prefixCls, "-sort-").concat(sortOrder), isSortColumn));
|
1078 | var onHeaderCell = column.onHeaderCell;
|
1079 |
|
1080 | column.onHeaderCell = function (col) {
|
1081 | var customProps = onHeaderCell && onHeaderCell(col) || {};
|
1082 | var _onClick = customProps.onClick;
|
1083 | return _objectSpread({}, customProps, {
|
1084 | onClick: function onClick(e) {
|
1085 | if (!e.isDefaultPrevented()) {
|
1086 | if (typeof _onClick === 'function') {
|
1087 | _onClick(e);
|
1088 | }
|
1089 |
|
1090 | if (!e.isDefaultPrevented()) {
|
1091 | _this7.setSortOrder(isAscend ? 'descend' : 'ascend', column);
|
1092 | }
|
1093 | }
|
1094 | }
|
1095 | });
|
1096 | };
|
1097 |
|
1098 | sortButton = React.createElement(Icon, {
|
1099 | type: "arrow_upward",
|
1100 | className: "".concat(prefixCls, "-sort-icon")
|
1101 | });
|
1102 | }
|
1103 |
|
1104 | column.title = React.createElement("span", {
|
1105 | key: key
|
1106 | }, column.title, sortButton, filterDropdown);
|
1107 |
|
1108 | if (sortButton || filterDropdown) {
|
1109 | column.className = classNames("".concat(prefixCls, "-column-has-filters"), column.className);
|
1110 | }
|
1111 |
|
1112 | return column;
|
1113 | });
|
1114 | }
|
1115 | }, {
|
1116 | key: "renderPagination",
|
1117 | value: function renderPagination(paginationPosition) {
|
1118 |
|
1119 | if (!this.hasPagination()) {
|
1120 | return null;
|
1121 | }
|
1122 |
|
1123 | var pagination = this.state.pagination;
|
1124 | var size = this.props.size;
|
1125 | var prefixCls = this.getPrefixCls();
|
1126 | var position = pagination.position || 'bottom';
|
1127 | var total = pagination.total || this.getLocalData().length;
|
1128 | var paginationProps = getConfig('pagination');
|
1129 | return total > 0 && (position === paginationPosition || position === 'both') ? React.createElement(Pagination, _extends({}, paginationProps, {
|
1130 | key: "pagination-".concat(paginationPosition)
|
1131 | }, pagination, {
|
1132 | className: classNames(pagination.className, "".concat(prefixCls, "-pagination")),
|
1133 | onChange: this.handlePageChange,
|
1134 | total: total,
|
1135 | size: pagination.size || size,
|
1136 | current: this.getMaxCurrent(total),
|
1137 | onShowSizeChange: this.handleShowSizeChange
|
1138 | })) : null;
|
1139 | }
|
1140 |
|
1141 | }, {
|
1142 | key: "prepareParamsArguments",
|
1143 | value: function prepareParamsArguments(state) {
|
1144 | var pagination = _objectSpread({}, state.pagination);
|
1145 |
|
1146 |
|
1147 | delete pagination.onChange;
|
1148 | delete pagination.onShowSizeChange;
|
1149 | delete pagination.showTotal;
|
1150 | delete pagination.sizeChangerOptionText;
|
1151 | var filters = state.filters;
|
1152 | var barFilters = state.barFilters;
|
1153 | var sorter = {};
|
1154 |
|
1155 | if (state.sortColumn && state.sortOrder) {
|
1156 | sorter.column = state.sortColumn;
|
1157 | sorter.order = state.sortOrder;
|
1158 | sorter.field = state.sortColumn.dataIndex;
|
1159 | sorter.columnKey = this.getColumnKey(state.sortColumn);
|
1160 | }
|
1161 |
|
1162 | return [pagination, filters, sorter, barFilters];
|
1163 | }
|
1164 | }, {
|
1165 | key: "findColumn",
|
1166 | value: function findColumn(myKey) {
|
1167 | var _this8 = this;
|
1168 |
|
1169 | var column;
|
1170 | treeMap(this.columns, function (c) {
|
1171 | if (_this8.getColumnKey(c) === myKey) {
|
1172 | column = c;
|
1173 | }
|
1174 | });
|
1175 | return column;
|
1176 | }
|
1177 | }, {
|
1178 | key: "getCurrentPageData",
|
1179 | value: function getCurrentPageData() {
|
1180 | var data = this.getLocalData();
|
1181 | var current;
|
1182 | var pageSize;
|
1183 | var state = this.state;
|
1184 |
|
1185 | if (!this.hasPagination()) {
|
1186 | pageSize = Number.MAX_VALUE;
|
1187 | current = 1;
|
1188 | } else {
|
1189 | pageSize = state.pagination.pageSize;
|
1190 | current = this.getMaxCurrent(state.pagination.total || data.length);
|
1191 | }
|
1192 |
|
1193 |
|
1194 |
|
1195 |
|
1196 |
|
1197 | if (data.length > pageSize || pageSize === Number.MAX_VALUE) {
|
1198 | data = data.filter(function (_, i) {
|
1199 | return i >= (current - 1) * pageSize && i < current * pageSize;
|
1200 | });
|
1201 | }
|
1202 |
|
1203 | return data;
|
1204 | }
|
1205 | }, {
|
1206 | key: "getFlatData",
|
1207 | value: function getFlatData() {
|
1208 | var childrenColumnName = this.props.childrenColumnName;
|
1209 | return flatArray(this.getLocalData(), childrenColumnName);
|
1210 | }
|
1211 | }, {
|
1212 | key: "getFlatCurrentPageData",
|
1213 | value: function getFlatCurrentPageData() {
|
1214 | var childrenColumnName = this.props.childrenColumnName;
|
1215 | return flatArray(this.getCurrentPageData(), childrenColumnName);
|
1216 | }
|
1217 | }, {
|
1218 | key: "recursiveSort",
|
1219 | value: function recursiveSort(data, sorterFn) {
|
1220 | var _this9 = this;
|
1221 |
|
1222 | var _this$props$childrenC = this.props.childrenColumnName,
|
1223 | childrenColumnName = _this$props$childrenC === void 0 ? 'children' : _this$props$childrenC;
|
1224 | return data.sort(sorterFn).map(function (item) {
|
1225 | return item[childrenColumnName] ? _objectSpread({}, item, _defineProperty({}, childrenColumnName, _this9.recursiveSort(item[childrenColumnName], sorterFn))) : item;
|
1226 | });
|
1227 | }
|
1228 | }, {
|
1229 | key: "getLocalData",
|
1230 | value: function getLocalData() {
|
1231 | var _this10 = this;
|
1232 |
|
1233 | var _this$props5 = this.props,
|
1234 | dataSource = _this$props5.dataSource,
|
1235 | noFilter = _this$props5.noFilter;
|
1236 |
|
1237 | if (dataSource) {
|
1238 | var state = this.state;
|
1239 | var filters = state.filters,
|
1240 | barFilters = state.barFilters;
|
1241 | var data = dataSource;
|
1242 |
|
1243 | data = data.slice(0);
|
1244 | var sorterFn = this.getSorterFn();
|
1245 |
|
1246 | if (sorterFn) {
|
1247 | data = this.recursiveSort(data, sorterFn);
|
1248 | }
|
1249 |
|
1250 | var filteredData = data;
|
1251 |
|
1252 | if (filters) {
|
1253 | Object.keys(filters).forEach(function (columnKey) {
|
1254 | var col = _this10.findColumn(columnKey);
|
1255 |
|
1256 | if (!col) {
|
1257 | return;
|
1258 | }
|
1259 |
|
1260 | var values = filters[columnKey] || [];
|
1261 |
|
1262 | if (values.length === 0) {
|
1263 | return;
|
1264 | }
|
1265 |
|
1266 | var onFilter = col.onFilter,
|
1267 | columnFilters = col.filters;
|
1268 | filteredData = onFilter ? filteredData.filter(function (record) {
|
1269 | return values.some(function (v) {
|
1270 | return onFilter(v, record, columnFilters);
|
1271 | });
|
1272 | }) : filteredData;
|
1273 | });
|
1274 | }
|
1275 |
|
1276 | if (barFilters.length) {
|
1277 | var isOr = false;
|
1278 | barFilters.forEach(function (filter) {
|
1279 | if (filter === VALUE_OR) {
|
1280 | isOr = true;
|
1281 | } else {
|
1282 | filteredData = data.filter(function (record) {
|
1283 | return isOr ? filteredData.indexOf(record) !== -1 || _this10.doBarFilter(filter, record) : filteredData.indexOf(record) !== -1 && _this10.doBarFilter(filter, record);
|
1284 | });
|
1285 | isOr = false;
|
1286 | }
|
1287 | });
|
1288 | }
|
1289 |
|
1290 | if (noFilter) {
|
1291 | return data;
|
1292 | }
|
1293 |
|
1294 | return filteredData;
|
1295 | }
|
1296 |
|
1297 | return [];
|
1298 | }
|
1299 | }, {
|
1300 | key: "doBarFilter",
|
1301 | value: function doBarFilter(filter, record) {
|
1302 | if (typeof filter === 'string') {
|
1303 | return !!findColumnByFilterValue(record, getLeafColumns(this.columns), filter);
|
1304 | }
|
1305 |
|
1306 | var columnKey = Object.keys(filter)[0];
|
1307 | var col = this.findColumn(columnKey);
|
1308 |
|
1309 | if (!col) {
|
1310 | return true;
|
1311 | }
|
1312 |
|
1313 | var onFilter = col.onFilter,
|
1314 | filters = col.filters;
|
1315 | return !onFilter || onFilter(filter[columnKey], record, filters);
|
1316 | }
|
1317 | }, {
|
1318 | key: "createComponents",
|
1319 | value: function createComponents() {
|
1320 | var components = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
1321 | var prevComponents = arguments.length > 1 ? arguments[1] : undefined;
|
1322 | var bodyRow = components && components.body && components.body.row;
|
1323 | var preBodyRow = prevComponents && prevComponents.body && prevComponents.body.row;
|
1324 |
|
1325 | if (!this.components || bodyRow !== preBodyRow) {
|
1326 | this.components = _objectSpread({}, components);
|
1327 | this.components.body = _objectSpread({}, components.body, {
|
1328 | row: createBodyRow(bodyRow)
|
1329 | });
|
1330 | }
|
1331 | }
|
1332 | }, {
|
1333 | key: "render",
|
1334 | value: function render() {
|
1335 | var _this11 = this;
|
1336 |
|
1337 | var props = this.props;
|
1338 | var style = props.style,
|
1339 | className = props.className;
|
1340 | var prefixCls = this.getPrefixCls();
|
1341 | var data = this.getCurrentPageData();
|
1342 | var loading = props.loading;
|
1343 |
|
1344 | if (typeof loading === 'boolean') {
|
1345 | loading = {
|
1346 | spinning: loading
|
1347 | };
|
1348 | }
|
1349 |
|
1350 | var table = React.createElement(LocaleReceiver, {
|
1351 | componentName: "Table",
|
1352 | defaultLocale: defaultLocale.Table
|
1353 | }, function (locale) {
|
1354 | return _this11.renderTable(locale, loading);
|
1355 | });
|
1356 |
|
1357 |
|
1358 | var paginationPatchClass = this.hasPagination() && data && data.length !== 0 ? "".concat(prefixCls, "-with-pagination") : "".concat(prefixCls, "-without-pagination");
|
1359 | return React.createElement("div", {
|
1360 | className: classNames("".concat(prefixCls, "-wrapper"), className),
|
1361 | style: style,
|
1362 | ref: this.saveRef
|
1363 | }, React.createElement(Spin, _extends({}, loading, {
|
1364 | className: loading.spinning ? "".concat(paginationPatchClass, " ").concat(prefixCls, "-spin-holder") : ''
|
1365 | }), this.renderPagination('top'), table, this.renderPagination('bottom')));
|
1366 | }
|
1367 | }]);
|
1368 |
|
1369 | return Table;
|
1370 | }(Component);
|
1371 |
|
1372 | export { Table as default };
|
1373 | Table.displayName = 'Table';
|
1374 | Table.Column = Column;
|
1375 | Table.ColumnGroup = ColumnGroup;
|
1376 | Table.propTypes = {
|
1377 | dataSource: PropTypes.array,
|
1378 | empty: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
|
1379 | onColumnFilterChange: PropTypes.func,
|
1380 | columns: PropTypes.array,
|
1381 | prefixCls: PropTypes.string,
|
1382 | useFixedHeader: PropTypes.bool,
|
1383 | rowSelection: PropTypes.object,
|
1384 | className: PropTypes.string,
|
1385 | size: PropTypes.oneOf([Size.large, Size["default"], Size.small]),
|
1386 | loading: PropTypes.oneOfType([PropTypes.bool, PropTypes.object]),
|
1387 | bordered: PropTypes.bool,
|
1388 | onChange: PropTypes.func,
|
1389 | locale: PropTypes.object,
|
1390 | dropdownPrefixCls: PropTypes.string,
|
1391 | filterBar: PropTypes.bool,
|
1392 | filters: PropTypes.array,
|
1393 | filterBarPlaceholder: PropTypes.string,
|
1394 | onFilterSelectChange: PropTypes.func,
|
1395 | noFilter: PropTypes.bool,
|
1396 | autoScroll: PropTypes.bool,
|
1397 | indentSize: PropTypes.number,
|
1398 | rowKey: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),
|
1399 | showHeader: PropTypes.bool
|
1400 | };
|
1401 | Table.defaultProps = {
|
1402 | dataSource: [],
|
1403 | empty: null,
|
1404 | useFixedHeader: false,
|
1405 | rowSelection: null,
|
1406 | className: '',
|
1407 | size: Size["default"],
|
1408 | loading: false,
|
1409 | bordered: false,
|
1410 | indentSize: 20,
|
1411 | locale: {},
|
1412 | rowKey: 'key',
|
1413 | showHeader: true,
|
1414 | filterBar: true,
|
1415 | noFilter: false,
|
1416 | autoScroll: true
|
1417 | };
|
1418 |
|