= {
key: 'selection-column',
render: this.renderSelectionBox(rowSelection.type),
className: `${prefixCls}-selection-column`,
};
if (rowSelection.type !== 'radio') {
const checkboxAllDisabled = data.every((item, index) => this.getCheckboxPropsByItem(item, index).disabled);
selectionColumn.title = (
);
}
if (columns.some(column => column.fixed === 'left' || column.fixed === true)) {
selectionColumn.fixed = 'left';
}
if (columns[0] && columns[0].key === 'selection-column') {
columns[0] = selectionColumn;
} else {
columns.unshift(selectionColumn);
}
}
return columns;
}
getColumnKey(column, index?) {
return column.key || column.dataIndex || index;
}
getMaxCurrent(total) {
const { current, pageSize } = this.state.pagination;
if ((current - 1) * pageSize >= total) {
return Math.floor((total - 1) / pageSize) + 1;
}
return current;
}
isSortColumn(column) {
const { sortColumn } = this.state;
if (!column || !sortColumn) {
return false;
}
return this.getColumnKey(sortColumn) === this.getColumnKey(column);
}
renderColumnsDropdown(columns) {
const { prefixCls, dropdownPrefixCls } = this.props;
const { sortOrder } = this.state;
const locale = this.getLocale();
return treeMap(columns, (originColumn, i) => {
let column = assign({}, originColumn);
let key = this.getColumnKey(column, i);
let filterDropdown;
let sortButton;
if ((column.filters && column.filters.length > 0) || column.filterDropdown) {
let colFilters = this.state.filters[key] || [];
filterDropdown = (
);
}
if (column.sorter) {
let isSortColumn = this.isSortColumn(column);
if (isSortColumn) {
column.className = column.className || '';
if (sortOrder) {
column.className += ` ${prefixCls}-column-sort`;
}
}
const isAscend = isSortColumn && sortOrder === 'ascend';
const isDescend = isSortColumn && sortOrder === 'descend';
sortButton = (
this.toggleSortOrder('ascend', column)}
>
this.toggleSortOrder('descend', column)}
>
);
}
column.title = (
{column.title}
{sortButton}
{filterDropdown}
);
return column;
});
}
handleShowSizeChange = (current, pageSize) => {
const pagination = this.state.pagination;
pagination.onShowSizeChange(current, pageSize);
const nextPagination = assign({}, pagination, { pageSize, current });
this.setState({ pagination: nextPagination });
const onChange = this.props.onChange;
if (onChange) {
onChange.apply(null, this.prepareParamsArguments(assign({}, this.state, {
pagination: nextPagination,
})));
}
}
renderPagination() {
// 强制不需要分页
if (!this.hasPagination()) {
return null;
}
let size = 'default';
const { pagination } = this.state;
if (pagination.size) {
size = pagination.size;
} else if (this.props.size as string === 'middle' || this.props.size === 'small') {
size = 'small';
}
let total = pagination.total || this.getLocalData().length;
return (total > 0) ?
: null;
}
// Get pagination, filters, sorter
prepareParamsArguments(state: any): [any, string[], Object] {
const pagination = { ...state.pagination };
// remove useless handle function in Table.onChange
delete pagination.onChange;
delete pagination.onShowSizeChange;
const filters = state.filters;
const sorter: any = {};
if (state.sortColumn && state.sortOrder) {
sorter.column = state.sortColumn;
sorter.order = state.sortOrder;
sorter.field = state.sortColumn.dataIndex;
sorter.columnKey = this.getColumnKey(state.sortColumn);
}
return [pagination, filters, sorter];
}
findColumn(myKey) {
let column;
treeMap(this.columns, c => {
if (this.getColumnKey(c) === myKey) {
column = c;
}
});
return column;
}
getCurrentPageData() {
let data = this.getLocalData();
let current;
let pageSize;
let state = this.state;
// 如果没有分页的话,默认全部展示
if (!this.hasPagination()) {
pageSize = Number.MAX_VALUE;
current = 1;
} else {
pageSize = state.pagination.pageSize;
current = this.getMaxCurrent(state.pagination.total || data.length);
}
// 分页
// ---
// 当数据量少于等于每页数量时,直接设置数据
// 否则进行读取分页数据
if (data.length > pageSize || pageSize === Number.MAX_VALUE) {
data = data.filter((_, i) => {
return i >= (current - 1) * pageSize && i < current * pageSize;
});
}
return data;
}
getFlatData() {
return flatArray(this.getLocalData());
}
getFlatCurrentPageData() {
return flatArray(this.getCurrentPageData());
}
recursiveSort(data, sorterFn) {
const { childrenColumnName = 'children' } = this.props;
return data.sort(sorterFn).map(item => (item[childrenColumnName] ? assign(
{},
item, {
[childrenColumnName]: this.recursiveSort(item[childrenColumnName], sorterFn),
}
) : item));
}
getLocalData() {
const state = this.state;
const { dataSource } = this.props;
let data = dataSource || [];
// 优化本地排序
data = data.slice(0);
const sorterFn = this.getSorterFn();
if (sorterFn) {
data = this.recursiveSort(data, sorterFn);
}
// 筛选
if (state.filters) {
Object.keys(state.filters).forEach((columnKey) => {
let col = this.findColumn(columnKey) as any;
if (!col) {
return;
}
let values = state.filters[columnKey] || [];
if (values.length === 0) {
return;
}
const onFilter = col.onFilter;
data = onFilter ? data.filter(record => {
return values.some(v => onFilter(v, record));
}) : data;
});
}
return data;
}
render() {
const { style, className, prefixCls, showHeader, ...restProps } = this.props;
const data = this.getCurrentPageData();
let columns = this.renderRowSelection();
const expandIconAsCell = this.props.expandedRowRender && this.props.expandIconAsCell !== false;
const locale = this.getLocale();
const classString = classNames({
[`${prefixCls}-${this.props.size}`]: true,
[`${prefixCls}-bordered`]: this.props.bordered,
[`${prefixCls}-empty`]: !data.length,
[`${prefixCls}-without-column-header`]: !showHeader,
});
columns = this.renderColumnsDropdown(columns);
columns = columns.map((column, i) => {
const newColumn = assign({}, column);
newColumn.key = this.getColumnKey(newColumn, i);
return newColumn;
});
let expandIconColumnIndex = (columns[0] && columns[0].key === 'selection-column') ? 1 : 0;
if ('expandIconColumnIndex' in restProps) {
expandIconColumnIndex = restProps.expandIconColumnIndex as number;
}
const table = (
locale.emptyText}
/>
);
// if there is no pagination or no data,
// the height of spin should decrease by half of pagination
const paginationPatchClass = (this.hasPagination() && data && data.length !== 0)
? `${prefixCls}-with-pagination` : `${prefixCls}-without-pagination`;
let loading = this.props.loading;
if (typeof loading === 'boolean') {
loading = {
spinning: loading,
};
}
return (
{table}
{this.renderPagination()}
);
}
}