nyne/nysoure
1
0
Fork 0
mirror of https://github.com/wgh136/nysoure.git synced 2025-09-27 20:27:23 +00:00
Code Issues Packages Projects Releases Wiki Activity

Improve article

Browse Source
This commit is contained in:
nyne
2025-05-27 18:46:32 +08:00
parent 7bcae71495
commit c4c2d7d9f7
4 changed files with 98 additions and 81 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
frontend/src/components/pagination.tsx
View File

@@ -9,27 +9,27 @@ export default function Pagination({page, setPage, totalPages}: {
const items: ReactNode[] = [];
if (page > 1) {
items.push(<button className="join-item btn" onClick={() => setPage(1)}>1</button>);
items.push(<button key={"btn-1"} className="join-item btn" onClick={() => setPage(1)}>1</button>);
}
if (page - 2 > 1) {
items.push(<button className="join-item btn">...</button>);
items.push(<button key={"btn-2"} className="join-item btn">...</button>);
}
if (page - 1 > 1) {
items.push(<button className="join-item btn" onClick={() => setPage(page - 1)}>{page - 1}</button>);
items.push(<button key={"btn-3"} className="join-item btn" onClick={() => setPage(page - 1)}>{page - 1}</button>);
}
items.push(<button className="join-item btn btn-active">{page}</button>);
items.push(<button key={"btn-4"} className="join-item btn btn-active">{page}</button>);
if (page + 1 < totalPages) {
items.push(<button className="join-item btn" onClick={() => setPage(page + 1)}>{page + 1}</button>);
items.push(<button key={"btn-5"} className="join-item btn" onClick={() => setPage(page + 1)}>{page + 1}</button>);
}
if (page + 2 < totalPages) {
items.push(<button className="join-item btn">...</button>);
items.push(<button key={"btn-6"} className="join-item btn">...</button>);
}
if (page < totalPages) {
items.push(<button className="join-item btn" onClick={() => setPage(totalPages)}>{totalPages}</button>);
items.push(<button key={"btn-7"} className="join-item btn" onClick={() => setPage(totalPages)}>{totalPages}</button>);
}
return <div className="join shadow rounded-field">
<button className={`join-item btn`} onClick={() => {
<button key={"btn-prev"} className={`join-item btn`} onClick={() => {
if (page > 1) {
setPage(page - 1);
}
@@ -37,7 +37,7 @@ export default function Pagination({page, setPage, totalPages}: {
<MdChevronLeft size={20} className="opacity-50"/>
</button>
{items}
<button className={`join-item btn`} onClick={() => {
<button key={"btn-next"} className={`join-item btn`} onClick={() => {
if (page < totalPages) {
setPage(page + 1);
}