39 lines
1.3 KiB
TypeScript
39 lines
1.3 KiB
TypeScript
import { Pagination } from "antd";
|
|
import { useTranslation } from "react-i18next";
|
|
import { useLocation, useNavigate, useSearchParams } from "react-router-dom";
|
|
|
|
export const PaginationBody = ({ data }: any) => {
|
|
const navigate = useNavigate();
|
|
const location = useLocation();
|
|
const pagination = location?.search || '';
|
|
const currentPage = parseInt(new URLSearchParams(location.search).get("page") || "1", 10);
|
|
const pageSize = parseInt(new URLSearchParams(location.search).get("per_page") || "15", 10);
|
|
|
|
const [searchParams] = useSearchParams()
|
|
const onChange = (page: number, pageSize?: number) => {
|
|
navigate(`?page=${page}&per_page=${pageSize || data?.per_page}`);
|
|
};
|
|
|
|
const onShowSizeChange = (current: number, pageSize: number) => {
|
|
navigate(`?page=${current}&per_page=${pageSize}`);
|
|
};
|
|
const [t] = useTranslation()
|
|
|
|
return (
|
|
<Pagination
|
|
className='text-center mt-3 paginateStyle'
|
|
total={data}
|
|
showTotal={(total: any) => `${t(`Total`)} ${total} ${t(`items`)}`}
|
|
pageSize={pageSize}
|
|
pageSizeOptions={[6, 15, 22, 30]}
|
|
defaultCurrent={currentPage}
|
|
current={currentPage}
|
|
onChange={onChange}
|
|
onShowSizeChange={onShowSizeChange}
|
|
// showQuickJumper
|
|
showSizeChanger
|
|
|
|
/>
|
|
);
|
|
};
|