2017-11-21 13:48:37 +08:00
|
|
|
import * as React from 'react';
|
|
|
|
import { SpinProps } from '../spin';
|
|
|
|
import { Store } from './createStore';
|
2018-03-08 20:34:40 +08:00
|
|
|
import { RadioChangeEvent } from '../radio';
|
|
|
|
import { CheckboxChangeEvent } from '../checkbox';
|
2018-05-21 21:52:18 +08:00
|
|
|
import { PaginationConfig } from '../pagination';
|
|
|
|
export { PaginationConfig } from '../pagination';
|
2017-11-21 13:48:37 +08:00
|
|
|
|
2018-09-17 19:52:24 +08:00
|
|
|
export type CompareFn<T> = ((a: T, b: T, sortOrder?: SortOrder) => number);
|
2017-11-21 13:48:37 +08:00
|
|
|
export type ColumnFilterItem = { text: string; value: string, children?: ColumnFilterItem[] };
|
|
|
|
|
|
|
|
export interface ColumnProps<T> {
|
2018-09-17 19:52:24 +08:00
|
|
|
title?: React.ReactNode | ((options: {
|
|
|
|
filters: TableStateFilters,
|
|
|
|
sortOrder?: SortOrder,
|
|
|
|
}) => React.ReactNode);
|
2017-11-21 13:48:37 +08:00
|
|
|
key?: React.Key;
|
2018-02-22 15:56:37 +08:00
|
|
|
dataIndex?: string;
|
2017-11-21 13:48:37 +08:00
|
|
|
render?: (text: any, record: T, index: number) => React.ReactNode;
|
2018-03-21 17:42:19 +08:00
|
|
|
align?: 'left' | 'right' | 'center';
|
2017-11-21 13:48:37 +08:00
|
|
|
filters?: ColumnFilterItem[];
|
|
|
|
onFilter?: (value: any, record: T) => boolean;
|
|
|
|
filterMultiple?: boolean;
|
2018-05-04 00:09:05 +08:00
|
|
|
filterDropdown?: React.ReactNode | ((props: Object) => React.ReactNode);
|
2017-11-21 13:48:37 +08:00
|
|
|
filterDropdownVisible?: boolean;
|
|
|
|
onFilterDropdownVisibleChange?: (visible: boolean) => void;
|
|
|
|
sorter?: boolean | CompareFn<T>;
|
2018-09-17 19:52:24 +08:00
|
|
|
defaultSortOrder?: SortOrder;
|
2017-11-21 13:48:37 +08:00
|
|
|
colSpan?: number;
|
|
|
|
width?: string | number;
|
|
|
|
className?: string;
|
|
|
|
fixed?: boolean | ('left' | 'right');
|
2018-09-23 09:11:09 +08:00
|
|
|
filterIcon?: React.ReactNode | ((filtered: boolean) => React.ReactNode);
|
2017-11-21 13:48:37 +08:00
|
|
|
filteredValue?: any[];
|
2018-09-17 19:52:24 +08:00
|
|
|
sortOrder?: SortOrder;
|
2017-11-21 13:48:37 +08:00
|
|
|
children?: ColumnProps<T>[];
|
|
|
|
onCellClick?: (record: T, event: any) => void;
|
|
|
|
onCell?: (record: T) => any;
|
2018-02-01 18:54:50 +08:00
|
|
|
onHeaderCell?: (props: ColumnProps<T>) => any;
|
2017-11-21 13:48:37 +08:00
|
|
|
}
|
|
|
|
|
|
|
|
export interface TableComponents {
|
2018-09-25 19:47:34 +08:00
|
|
|
table?: React.ReactType;
|
2017-11-21 13:48:37 +08:00
|
|
|
header?: {
|
2018-09-25 19:47:34 +08:00
|
|
|
wrapper?: React.ReactType;
|
|
|
|
row?: React.ReactType;
|
|
|
|
cell?: React.ReactType;
|
2017-11-21 13:48:37 +08:00
|
|
|
};
|
|
|
|
body?: {
|
2018-09-25 19:47:34 +08:00
|
|
|
wrapper?: React.ReactType;
|
|
|
|
row?: React.ReactType;
|
|
|
|
cell?: React.ReactType;
|
2017-11-21 13:48:37 +08:00
|
|
|
};
|
|
|
|
}
|
|
|
|
|
|
|
|
export interface TableLocale {
|
|
|
|
filterTitle?: string;
|
2018-01-11 23:13:42 +08:00
|
|
|
filterConfirm?: React.ReactNode;
|
|
|
|
filterReset?: React.ReactNode;
|
|
|
|
emptyText?: React.ReactNode | (() => React.ReactNode);
|
|
|
|
selectAll?: React.ReactNode;
|
|
|
|
selectInvert?: React.ReactNode;
|
2018-09-17 17:57:01 +08:00
|
|
|
sortTitle?: string;
|
2017-11-21 13:48:37 +08:00
|
|
|
}
|
|
|
|
|
|
|
|
export type RowSelectionType = 'checkbox' | 'radio';
|
2018-05-07 12:32:26 +08:00
|
|
|
export type SelectionSelectFn<T> = (record: T, selected: boolean, selectedRows: Object[], nativeEvent: Event) => any;
|
2017-11-21 13:48:37 +08:00
|
|
|
|
2018-08-04 19:20:28 +08:00
|
|
|
export type TableSelectWay = 'onSelect' | 'onSelectMultiple' | 'onSelectAll' | 'onSelectInvert';
|
2018-05-07 12:32:26 +08:00
|
|
|
|
2017-11-21 13:48:37 +08:00
|
|
|
export interface TableRowSelection<T> {
|
|
|
|
type?: RowSelectionType;
|
|
|
|
selectedRowKeys?: string[] | number[];
|
2018-06-02 15:49:11 +08:00
|
|
|
onChange?: (selectedRowKeys: string[] | number[], selectedRows: Object[]) => void;
|
2017-11-21 13:48:37 +08:00
|
|
|
getCheckboxProps?: (record: T) => Object;
|
|
|
|
onSelect?: SelectionSelectFn<T>;
|
2018-08-04 19:20:28 +08:00
|
|
|
onSelectMultiple?: (selected: boolean, selectedRows: Object[], changeRows: Object[]) => void;
|
2018-06-02 15:49:11 +08:00
|
|
|
onSelectAll?: (selected: boolean, selectedRows: Object[], changeRows: Object[]) => void;
|
|
|
|
onSelectInvert?: (selectedRows: Object[]) => void;
|
2017-11-21 13:48:37 +08:00
|
|
|
selections?: SelectionItem[] | boolean;
|
|
|
|
hideDefaultSelections?: boolean;
|
|
|
|
fixed?: boolean;
|
2018-03-05 18:23:01 +08:00
|
|
|
columnWidth?: string | number;
|
2018-07-24 14:49:23 +08:00
|
|
|
selectWay?: TableSelectWay;
|
2018-07-28 14:57:00 +08:00
|
|
|
columnTitle?: string | React.ReactNode;
|
2017-11-21 13:48:37 +08:00
|
|
|
}
|
2018-06-02 15:49:11 +08:00
|
|
|
export type SortOrder = 'descend' | 'ascend';
|
|
|
|
export interface SorterResult<T> {
|
|
|
|
column: ColumnProps<T>;
|
|
|
|
order: SortOrder;
|
|
|
|
field: string;
|
|
|
|
columnKey: string;
|
|
|
|
}
|
2018-06-27 17:39:31 +08:00
|
|
|
export type TableSize = 'default' | 'middle' | 'small';
|
2017-11-21 13:48:37 +08:00
|
|
|
export interface TableProps<T> {
|
|
|
|
prefixCls?: string;
|
|
|
|
dropdownPrefixCls?: string;
|
|
|
|
rowSelection?: TableRowSelection<T>;
|
2018-05-21 21:52:18 +08:00
|
|
|
pagination?: PaginationConfig | false;
|
2018-06-27 17:39:31 +08:00
|
|
|
size?: TableSize;
|
2017-11-21 13:48:37 +08:00
|
|
|
dataSource?: T[];
|
|
|
|
components?: TableComponents;
|
|
|
|
columns?: ColumnProps<T>[];
|
|
|
|
rowKey?: string | ((record: T, index: number) => string);
|
|
|
|
rowClassName?: (record: T, index: number) => string;
|
2018-06-08 16:32:04 +08:00
|
|
|
expandedRowRender?: (record: T, index: number, indent: number, expanded: boolean) => React.ReactNode;
|
2017-12-08 15:36:32 +08:00
|
|
|
defaultExpandAllRows?: boolean;
|
2017-11-21 13:48:37 +08:00
|
|
|
defaultExpandedRowKeys?: string[] | number[];
|
|
|
|
expandedRowKeys?: string[] | number[];
|
|
|
|
expandIconAsCell?: boolean;
|
|
|
|
expandIconColumnIndex?: number;
|
2017-12-08 15:36:32 +08:00
|
|
|
expandRowByClick?: boolean;
|
2017-11-21 13:48:37 +08:00
|
|
|
onExpandedRowsChange?: (expandedRowKeys: string[] | number[]) => void;
|
|
|
|
onExpand?: (expanded: boolean, record: T) => void;
|
2018-06-02 15:49:11 +08:00
|
|
|
onChange?: (
|
2018-07-17 17:56:24 +08:00
|
|
|
pagination: PaginationConfig,
|
2018-06-02 15:49:11 +08:00
|
|
|
filters: Record<keyof T, string[]>,
|
|
|
|
sorter: SorterResult<T>,
|
|
|
|
) => void;
|
2017-11-21 13:48:37 +08:00
|
|
|
loading?: boolean | SpinProps;
|
|
|
|
locale?: Object;
|
|
|
|
indentSize?: number;
|
2018-06-02 15:49:11 +08:00
|
|
|
onRowClick?: (record: T, index: number, event: Event) => void;
|
2017-11-21 13:48:37 +08:00
|
|
|
onRow?: (record: T, index: number) => any;
|
2018-04-02 17:15:17 +08:00
|
|
|
onHeaderRow?: (columns: ColumnProps<T>[], index: number) => any;
|
2017-11-21 13:48:37 +08:00
|
|
|
useFixedHeader?: boolean;
|
|
|
|
bordered?: boolean;
|
|
|
|
showHeader?: boolean;
|
|
|
|
footer?: (currentPageData: Object[]) => React.ReactNode;
|
|
|
|
title?: (currentPageData: Object[]) => React.ReactNode;
|
|
|
|
scroll?: { x?: boolean | number | string, y?: boolean | number | string };
|
|
|
|
childrenColumnName?: string;
|
|
|
|
bodyStyle?: React.CSSProperties;
|
|
|
|
className?: string;
|
|
|
|
style?: React.CSSProperties;
|
2017-11-27 10:53:55 +08:00
|
|
|
children?: React.ReactNode;
|
2017-11-21 13:48:37 +08:00
|
|
|
}
|
|
|
|
|
|
|
|
export interface TableStateFilters {
|
|
|
|
[key: string]: string[];
|
|
|
|
}
|
|
|
|
|
|
|
|
export interface TableState<T> {
|
2018-05-21 21:52:18 +08:00
|
|
|
pagination: PaginationConfig;
|
2017-11-21 13:48:37 +08:00
|
|
|
filters: TableStateFilters;
|
|
|
|
sortColumn: ColumnProps<T> | null;
|
2018-06-02 15:49:11 +08:00
|
|
|
sortOrder?: SortOrder;
|
2018-07-24 14:49:23 +08:00
|
|
|
pivot?: number;
|
2017-11-21 13:48:37 +08:00
|
|
|
}
|
|
|
|
|
|
|
|
export type SelectionItemSelectFn = (key: string[]) => any;
|
|
|
|
|
|
|
|
export interface SelectionItem {
|
|
|
|
key: string;
|
|
|
|
text: React.ReactNode;
|
|
|
|
onSelect: SelectionItemSelectFn;
|
|
|
|
}
|
|
|
|
|
|
|
|
export interface SelectionCheckboxAllProps<T> {
|
|
|
|
store: Store;
|
|
|
|
locale: any;
|
|
|
|
disabled: boolean;
|
|
|
|
getCheckboxPropsByItem: (item: any, index: number) => any;
|
|
|
|
getRecordKey: (record: any, index?: number) => string;
|
|
|
|
data: T[];
|
|
|
|
prefixCls: string | undefined;
|
|
|
|
onSelect: (key: string, index: number, selectFunc: any) => void;
|
|
|
|
hideDefaultSelections?: boolean;
|
|
|
|
selections?: SelectionItem[] | boolean;
|
|
|
|
getPopupContainer: (triggerNode?: Element) => HTMLElement;
|
|
|
|
}
|
|
|
|
|
|
|
|
export interface SelectionCheckboxAllState {
|
2018-06-05 20:45:19 +08:00
|
|
|
checked?: boolean;
|
|
|
|
indeterminate?: boolean;
|
2017-11-21 13:48:37 +08:00
|
|
|
}
|
|
|
|
|
|
|
|
export interface SelectionBoxProps {
|
|
|
|
store: Store;
|
|
|
|
type?: RowSelectionType;
|
|
|
|
defaultSelection: string[];
|
|
|
|
rowIndex: string;
|
2018-01-31 15:07:53 +08:00
|
|
|
name?: string;
|
2017-11-21 13:48:37 +08:00
|
|
|
disabled?: boolean;
|
2018-03-08 20:34:40 +08:00
|
|
|
onChange: (e: RadioChangeEvent | CheckboxChangeEvent) => void;
|
2017-11-21 13:48:37 +08:00
|
|
|
}
|
|
|
|
|
|
|
|
export interface SelectionBoxState {
|
|
|
|
checked?: boolean;
|
|
|
|
}
|
|
|
|
|
2018-05-07 12:32:26 +08:00
|
|
|
export interface SelectionInfo<T> {
|
|
|
|
selectWay: TableSelectWay;
|
|
|
|
record?: T;
|
|
|
|
checked?: boolean;
|
|
|
|
changeRowKeys?: React.Key[];
|
|
|
|
nativeEvent?: Event;
|
|
|
|
}
|
|
|
|
|
2017-11-21 13:48:37 +08:00
|
|
|
export interface FilterMenuProps<T> {
|
|
|
|
locale: TableLocale;
|
|
|
|
selectedKeys: string[];
|
|
|
|
column: ColumnProps<T>;
|
|
|
|
confirmFilter: (column: ColumnProps<T>, selectedKeys: string[]) => any;
|
|
|
|
prefixCls: string;
|
|
|
|
dropdownPrefixCls: string;
|
|
|
|
getPopupContainer: (triggerNode?: Element) => HTMLElement;
|
|
|
|
}
|
|
|
|
|
|
|
|
export interface FilterMenuState {
|
|
|
|
selectedKeys: string[];
|
2017-11-27 10:53:55 +08:00
|
|
|
keyPathOfSelectedItem: { [key: string]: string };
|
2017-11-21 13:48:37 +08:00
|
|
|
visible?: boolean;
|
|
|
|
}
|
2018-09-30 11:17:39 +08:00
|
|
|
|
|
|
|
export type PrepareParamsArgumentsReturn<T> = [
|
|
|
|
any,
|
|
|
|
string[],
|
|
|
|
Object,
|
|
|
|
{
|
|
|
|
currentDataSource: T[],
|
|
|
|
}
|
|
|
|
];
|