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-04-29 22:08:28 +08:00
|
|
|
export type CompareFn<T> = ((a: T, b: T, sortOrder?: 'ascend' | 'descend') => number);
|
2017-11-21 13:48:37 +08:00
|
|
|
export type ColumnFilterItem = { text: string; value: string, children?: ColumnFilterItem[] };
|
|
|
|
|
|
|
|
export interface ColumnProps<T> {
|
|
|
|
title?: React.ReactNode;
|
|
|
|
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;
|
|
|
|
filterDropdown?: React.ReactNode;
|
|
|
|
filterDropdownVisible?: boolean;
|
|
|
|
onFilterDropdownVisibleChange?: (visible: boolean) => void;
|
|
|
|
sorter?: boolean | CompareFn<T>;
|
|
|
|
defaultSortOrder?: 'ascend' | 'descend';
|
|
|
|
colSpan?: number;
|
|
|
|
width?: string | number;
|
|
|
|
className?: string;
|
|
|
|
fixed?: boolean | ('left' | 'right');
|
|
|
|
filterIcon?: React.ReactNode;
|
|
|
|
filteredValue?: any[];
|
2018-04-29 22:08:28 +08:00
|
|
|
sortOrder?: 'ascend' | 'descend';
|
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 {
|
|
|
|
table?: any;
|
|
|
|
header?: {
|
|
|
|
wrapper?: any;
|
|
|
|
row?: any;
|
|
|
|
cell?: any;
|
|
|
|
};
|
|
|
|
body?: {
|
|
|
|
wrapper?: any;
|
|
|
|
row?: any;
|
|
|
|
cell?: any;
|
|
|
|
};
|
|
|
|
}
|
|
|
|
|
|
|
|
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;
|
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-05-07 12:32:26 +08:00
|
|
|
export type TableSelectWay = 'onSelect' | 'onSelectAll' | 'onSelectInvert';
|
|
|
|
|
2017-11-21 13:48:37 +08:00
|
|
|
export interface TableRowSelection<T> {
|
|
|
|
type?: RowSelectionType;
|
|
|
|
selectedRowKeys?: string[] | number[];
|
|
|
|
onChange?: (selectedRowKeys: string[] | number[], selectedRows: Object[]) => any;
|
|
|
|
getCheckboxProps?: (record: T) => Object;
|
|
|
|
onSelect?: SelectionSelectFn<T>;
|
|
|
|
onSelectAll?: (selected: boolean, selectedRows: Object[], changeRows: Object[]) => any;
|
|
|
|
onSelectInvert?: (selectedRows: Object[]) => any;
|
|
|
|
selections?: SelectionItem[] | boolean;
|
|
|
|
hideDefaultSelections?: boolean;
|
|
|
|
fixed?: boolean;
|
2018-03-05 18:23:01 +08:00
|
|
|
columnWidth?: string | number;
|
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;
|
2017-11-21 13:48:37 +08:00
|
|
|
size?: 'default' | 'middle' | 'small';
|
|
|
|
dataSource?: T[];
|
|
|
|
components?: TableComponents;
|
|
|
|
columns?: ColumnProps<T>[];
|
|
|
|
rowKey?: string | ((record: T, index: number) => string);
|
|
|
|
rowClassName?: (record: T, index: number) => string;
|
|
|
|
expandedRowRender?: any;
|
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-05-21 21:52:18 +08:00
|
|
|
onChange?: (pagination: PaginationConfig | boolean, filters: string[], sorter: Object) => any;
|
2017-11-21 13:48:37 +08:00
|
|
|
loading?: boolean | SpinProps;
|
|
|
|
locale?: Object;
|
|
|
|
indentSize?: number;
|
|
|
|
onRowClick?: (record: T, index: number, event: Event) => any;
|
|
|
|
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-04-29 22:08:28 +08:00
|
|
|
sortOrder: 'ascend' | 'descend' | undefined;
|
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 {
|
|
|
|
checked: boolean;
|
|
|
|
indeterminate: boolean;
|
|
|
|
}
|
|
|
|
|
|
|
|
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;
|
|
|
|
}
|