import * as React from 'react';
import { BaseHtmlProps, BaseProps } from '../../wui-core/src/iCore';
import { SelectProps } from '../../wui-select/src/iSelect';
export type Align = {
points?: [string, string];
offset?: [number, number];
targetOffset?: [number, number];
overflow?: {
adjustX?: boolean;
adjustY?: boolean;
};
};
export type PageSizeInputObject = {
max: number;
};
export interface PaginationProps extends BaseProps {
/**
* 当前激活状态页
*/
current?: number;
/**
* 指定分页数量
*/
pageSize?: number | string;
/**
* 默认分页数量
*/
defaultPageSize: number | string;
/**
* 当前激活状态页(旧)
*/
activePage?: number;
/**
* 总页数
*/
items?: number;
/**
* 显示按钮从1到maxButton的按钮数
*/
maxButtons: number;
/**
* 当为true,不管切换到多少页都显示第一页和最后一页的按钮
*/
boundaryLinks: boolean;
/**
* 当为true,显示省略号,否则
*
*/
ellipsis: boolean;
/**
* 当为true,显示点击到第一页的按钮
*/
first: boolean;
/**
* 当为true,显示点击到最后一页的按钮
*/
last: boolean;
/**
* 当为true,显示前一页按钮
*/
prev: boolean;
/**
* 当为true,显示下一页按钮
*/
next: boolean;
/**
* 暴露给用户的切换页的方法
* onChange(新 antd)
* onSelect(旧)
*/
onSelect?: (eventKey: number, pageSize: number, event?: React.MouseEvent) => void;
onChange?: (eventKey: number, pageSize: number, event?: React.MouseEvent) => void;
/**
* You can use a custom element for the buttons
*/
buttonComponentClass?: React.ElementType;
/**
* 每页多少条的选择
* dataNumSelect 旧
* pageSizeOptions(新 antd)
*/
dataNumSelect?: (number | string)[];
pageSizeOptions: (number | string)[];
/**
* 每页多少条选择哪一个
*/
dataNum?: number;
/**
* 页大小切换
* onPageSizeChange(antd)
* onDataNumSelect(旧)
*/
onDataNumSelect?: (activePage: number, pageSize: number) => void;
onPageSizeChange?: (activePage: number, pageSize: number) => void;
onShowSizeChange?: (activePage: number, pageSize: number) => void;
/**
* 显示跳页
* showQuickJumper(antd)
* showJump(旧)
*/
showQuickJumper: boolean;
showJump?: boolean;
/**
* 显示总共条数
*/
total: number;
/**
* pagiantion不可点
*/
disabled: boolean;
/**
* 渲染确认按钮的dom
*/
confirmBtn?: (props: PaginationProps) => React.ReactNode;
/**
* 通过cookie来确定分页的size,需设定唯一的key值
*/
/**
* 默认的当前页数
* 新 defaultActivePage
* 旧 defaultCurrent
*/
defaultActivePage: number;
defaultCurrent?: number;
/**
* 默认的每页条数
*/
defaultDataNum?: number;
/**
* 只有一页时是否隐藏分页器
*/
hideOnSinglePage: boolean;
/**
* 当 size 未指定时,根据屏幕宽度自动调整尺寸
*/
/**
* 通是否展示pageSize切换器
*/
showSizeChanger: boolean;
/**
* 用于自定义页码的结构
*/
itemRender?: (eventKey: number | undefined, type: string, ComponentWrap: React.ReactNode) => React.ReactNode;
/**
* 是否显示原生 tooltip 页码提示
*/
showTitle: boolean;
/**
* 用于自定义页码的结构 -- 不再对外开放
*/
showTotal?: (total: number, arry: number[]) => React.ReactNode;
/**
* 用于自定义页码的结构
*/
simple?: boolean;
/**
* 分页按钮大小
*/
size: string;
locale: string;
noBorder: boolean;
gap: boolean;
/**
* sizeChange 下拉框下拉方向控制
* 设置align 对象,具体参考dropdown placement.js
* */
dropdownAlign?: Align;
id?: string;
pageSizeInput: boolean | PageSizeInputObject;
sizeChangerProps?: SelectProps;
}
export interface PaginationState {
activePage: number;
pageSize: number;
items: number;
jumpPageState: number | null;
selectOpen: boolean;
listHeight: number;
placement: SelectProps['placement'];
selectFocus: boolean;
loading: boolean;
}
export interface PaginationButtonAdapterPublic {
onChange?: (eventKey: number, pageSize: number, event: React.MouseEvent) => void;
pageSize?: number;
itemRender?: PaginationProps['itemRender'];
componentClass: PaginationProps['buttonComponentClass'];
iconBtn: boolean;
showTitle?: PaginationProps['showTitle'];
}
export type PaginationButtonType = 'ellipsis' | 'first' | 'prev' | 'next' | 'last' | 'page' | 'center' | 'loading';
export interface PaginationButtonAdapter extends PaginationButtonAdapterPublic, Omit, 'onChange'> {
children?: React.ReactNode;
type: PaginationButtonType;
display?: boolean;
disabled?: boolean;
simple?: PaginationProps['simple'];
key?: React.Key;
title?: string;
id?: string;
eventKey?: number;
pagenumber?: number;
active?: boolean;
}