mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2024-12-18 11:18:14 +08:00
Code Issues Actions 15 Packages Projects Releases Wiki Activity

Improve table types

Browse Source 
Fix #10374
This commit is contained in:
Wei Zhu 2018-05-07 12:32:26 +08:00
parent d93cfdef09
commit 8a6d9b92b7
4 changed files with 31 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
components/checkbox/Checkbox.tsx
View File

@ -35,7 +35,7 @@ export interface CheckboxChangeEvent {
target: CheckboxChangeEventTarget;
stopPropagation: () => void;
preventDefault: () => void;
nativeEvent: MouseEvent;
nativeEvent: Event;
}
export default class Checkbox extends React.Component<CheckboxProps, {}> {

2
components/radio/interface.tsx
View File

@ -37,5 +37,5 @@ export interface RadioChangeEvent {
target: RadioChangeEventTarget;
stopPropagation: () => void;
preventDefault: () => void;
nativeEvent: MouseEvent;
nativeEvent: Event;
}

29
components/table/Table.tsx
View File

@ -28,7 +28,10 @@ import {
CompareFn,
TableStateFilters,
SelectionItemSelectFn,
SelectionInfo,
TablePaginationConfig,
TableSelectWay,
TableRowSelection,
} from './interface';
import { RadioChangeEvent } from '../radio';
import { CheckboxChangeEvent } from '../checkbox';
@ -43,6 +46,10 @@ function stopPropagation(e: React.SyntheticEvent<any>) {
}
}
function getRowSelection<T>(props: TableProps<T>): TableRowSelection<T> {
return props.rowSelection || {};
}
const defaultPagination = {
onChange: noop,
onShowSizeChange: noop,
@ -80,7 +87,6 @@ export default class Table<T> extends React.Component<TableProps<T>, TableState<
dataSource: [],
prefixCls: 'ant-table',
useFixedHeader: false,
rowSelection: null,
className: '',
size: 'large',
loading: false,
@ -121,13 +127,13 @@ export default class Table<T> extends React.Component<TableProps<T>, TableState<
this.CheckboxPropsCache = {};
this.store = createStore({
selectedRowKeys: (props.rowSelection || {}).selectedRowKeys || [],
selectedRowKeys: getRowSelection(props).selectedRowKeys || [],
selectionDirty: false,
});
}
getCheckboxPropsByItem = (item: T, index: number) => {
const { rowSelection = {} } = this.props;
const rowSelection = getRowSelection(this.props);
if (!rowSelection.getCheckboxProps) {
return {};
}
@ -140,7 +146,7 @@ export default class Table<T> extends React.Component<TableProps<T>, TableState<
}
getDefaultSelection() {
const { rowSelection = {} } = this.props;
const rowSelection = getRowSelection(this.props);
if (!rowSelection.getCheckboxProps) {
return [];
}
@ -224,8 +230,9 @@ export default class Table<T> extends React.Component<TableProps<T>, TableState<
};
}
setSelectedRowKeys(selectedRowKeys: string[], { selectWay, record, checked, changeRowKeys, nativeEvent }: any) {
const { rowSelection = {} as any } = this.props;
setSelectedRowKeys(selectedRowKeys: string[], selectionInfo: SelectionInfo<T>) {
const { selectWay, record, checked, changeRowKeys, nativeEvent } = selectionInfo;
const rowSelection = getRowSelection(this.props);
if (rowSelection && !('selectedRowKeys' in rowSelection)) {
this.store.setState({ selectedRowKeys });
}
@ -240,12 +247,12 @@ export default class Table<T> extends React.Component<TableProps<T>, TableState<
rowSelection.onChange(selectedRowKeys, selectedRows);
}
if (selectWay === 'onSelect' && rowSelection.onSelect) {
rowSelection.onSelect(record, checked, selectedRows, nativeEvent);
rowSelection.onSelect(record!, checked!, selectedRows, nativeEvent!);
} else if (selectWay === 'onSelectAll' && rowSelection.onSelectAll) {
const changeRows = data.filter(
(row, i) => changeRowKeys.indexOf(this.getRecordKey(row, i)) >= 0,
(row, i) => changeRowKeys!.indexOf(this.getRecordKey(row, i)) >= 0,
);
rowSelection.onSelectAll(checked, selectedRows, changeRows);
rowSelection.onSelectAll(checked!, selectedRows, changeRows);
} else if (selectWay === 'onSelectInvert' && rowSelection.onSelectInvert) {
rowSelection.onSelectInvert(selectedRowKeys);
}
@ -492,7 +499,7 @@ export default class Table<T> extends React.Component<TableProps<T>, TableState<
.map((item, i) => this.getRecordKey(item, i));
let changeRowKeys: string[] = [];
let selectWay = '';
let selectWay: TableSelectWay = 'onSelectAll';
let checked;
// handle default selection
switch (selectionKey) {
@ -544,7 +551,7 @@ export default class Table<T> extends React.Component<TableProps<T>, TableState<
return onSelectFunc(changeableRowKeys);
}
this.setSelectedRowKeys(selectedRowKeys, {
selectWay: selectWay,
selectWay,
checked,
changeRowKeys,
});

12
components/table/interface.tsx
View File

@ -59,12 +59,14 @@ export interface TableLocale {
}
export type RowSelectionType = 'checkbox' | 'radio';
export type SelectionSelectFn<T> = (record: T, selected: boolean, selectedRows: Object[]) => any;
export type SelectionSelectFn<T> = (record: T, selected: boolean, selectedRows: Object[], nativeEvent: Event) => any;
export interface TablePaginationConfig extends PaginationProps {
position?: 'top' | 'bottom' | 'both';
}
export type TableSelectWay = 'onSelect' | 'onSelectAll' | 'onSelectInvert';
export interface TableRowSelection<T> {
type?: RowSelectionType;
selectedRowKeys?: string[] | number[];
@ -171,6 +173,14 @@ export interface SelectionBoxState {
checked?: boolean;
}
export interface SelectionInfo<T> {
selectWay: TableSelectWay;
record?: T;
checked?: boolean;
changeRowKeys?: React.Key[];
nativeEvent?: Event;
}
export interface FilterMenuProps<T> {
locale: TableLocale;
selectedKeys: string[];