🎨 Improve pagination navigation fix #12552 #12563 (#12567)

* Improve pagination navigation

* const pageElement

* remove fn__none
This commit is contained in:
Jeffrey Chen 2024-09-24 00:06:17 +08:00 committed by GitHub
parent 7269433828
commit a8f183a99f
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -20,6 +20,7 @@ let historyEditor: Protyle;
const renderDoc = (element: HTMLElement, currentPage: number) => {
const previousElement = element.querySelector('[data-type="docprevious"]');
const nextElement = element.querySelector('[data-type="docnext"]');
const pageElement = nextElement.nextElementSibling.nextElementSibling;
element.setAttribute("data-page", currentPage.toString());
if (currentPage > 1) {
previousElement.removeAttribute("disabled");
@ -83,10 +84,10 @@ const renderDoc = (element: HTMLElement, currentPage: number) => {
} else {
nextElement.setAttribute("disabled", "disabled");
}
pageBtn.setAttribute("data-totalpage", (response.data.pageCount || 1).toString());
pageBtn.setAttribute("data-totalPage", (response.data.pageCount || 1).toString());
// nextElement.nextElementSibling.nextElementSibling.textContent = `${currentPage}/${response.data.pageCount || 1}`;
const titleElement = nextElement.nextElementSibling.nextElementSibling;
titleElement.textContent = `${window.siyuan.languages.pageCountAndHistoryCount.replace("${x}", response.data.pageCount).replace("${y}", response.data.totalCount || 1)}`;
pageElement.textContent = `${window.siyuan.languages.pageCountAndHistoryCount.replace("${x}", response.data.pageCount).replace("${y}", response.data.totalCount || 1)}`;
pageElement.classList.remove("fn__none");
if (response.data.histories.length === 0) {
listElement.innerHTML = `<li class="b3-list--empty">${window.siyuan.languages.emptyContent}</li>`;
return;
@ -265,7 +266,6 @@ const renderRepo = (element: Element, currentPage: number) => {
} else {
previousElement.classList.remove("fn__none");
nextElement.classList.remove("fn__none");
pageElement.classList.remove("fn__none");
pageBtn.classList.remove("fn__none");
element.setAttribute("data-page", currentPage.toString());
if (currentPage > 1) {
@ -280,8 +280,9 @@ const renderRepo = (element: Element, currentPage: number) => {
} else {
nextElement.setAttribute("disabled", "disabled");
}
element.setAttribute("total-page", response.data.pageCount.toString());
pageBtn.setAttribute("data-totalPage", (response.data.pageCount || 1).toString());
pageElement.textContent = `${window.siyuan.languages.pageCountAndSnapshotCount.replace("${x}", response.data.pageCount).replace("${y}", response.data.totalCount || 1)}`;
pageElement.classList.remove("fn__none");
renderRepoItem(response, element, selectValue);
});
}
@ -354,10 +355,10 @@ export const openHistory = (app: App) => {
<div style="overflow:auto;">
<div class="block__icons">
<span data-type="docprevious" class="block__icon block__icon--show b3-tooltips b3-tooltips__e" disabled="disabled" aria-label="${window.siyuan.languages.previousLabel}"><svg><use xlink:href='#iconLeft'></use></svg></span>
<button class="b3-button b3-button--text" data-type="jumpHistoryPage" data-totalpage="1">1</button>
<button class="b3-button b3-button--text" data-type="jumpHistoryPage" data-totalPage="1">1</button>
<span data-type="docnext" class="block__icon block__icon--show b3-tooltips b3-tooltips__e" disabled="disabled" aria-label="${window.siyuan.languages.nextLabel}"><svg><use xlink:href='#iconRight'></use></svg></span>
<span class="fn__space"></span>
<span class="ft__on-surface fn__flex-shrink ft__selectnone">${window.siyuan.languages.pageCountAndHistoryCount}</span>
<span class="ft__on-surface fn__flex-shrink ft__selectnone fn__none">${window.siyuan.languages.pageCountAndHistoryCount}</span>
<span class="fn__space"></span>
<div class="fn__flex-1"></div>
<div style="position: relative">
@ -405,10 +406,10 @@ export const openHistory = (app: App) => {
<div style="overflow: auto"">
<div class="block__icons">
<span data-type="previous" class="block__icon block__icon--show b3-tooltips b3-tooltips__e" disabled="disabled" aria-label="${window.siyuan.languages.previousLabel}"><svg><use xlink:href='#iconLeft'></use></svg></span>
<button class="b3-button b3-button--text" data-type="jumpRepoPage">1</button>
<button class="b3-button b3-button--text" data-type="jumpRepoPage" data-totalPage="1">1</button>
<span data-type="next" class="block__icon block__icon--show b3-tooltips b3-tooltips__e" disabled="disabled" aria-label="${window.siyuan.languages.nextLabel}"><svg><use xlink:href='#iconRight'></use></svg></span>
<span class="fn__space"></span>
<span class="ft__on-surface fn__flex-shrink ft__selectnone">${window.siyuan.languages.pageCountAndSnapshotCount}</span>
<span class="ft__on-surface fn__flex-shrink ft__selectnone fn__none">${window.siyuan.languages.pageCountAndSnapshotCount}</span>
<span class="fn__space"></span>
<div class="fn__flex-1"></div>
<select class="b3-select ${isMobile() ? "fn__size96" : "fn__size200"}">
@ -811,7 +812,7 @@ const bindEvent = (app: App, element: Element, dialog?: Dialog) => {
break;
} else if (type === "jumpRepoPage") {
const currentPage = parseInt(repoElement.getAttribute("data-page"));
const totalPage = parseInt(repoElement.getAttribute("total-page") || "1");
const totalPage = parseInt(target.getAttribute("data-totalPage") || "1");
if (totalPage > 1) {
confirmDialog(
@ -830,8 +831,8 @@ const bindEvent = (app: App, element: Element, dialog?: Dialog) => {
);
}
} else if (type === "jumpHistoryPage") {
const currentPage = parseInt(target.textContent.trim());
const totalPage = parseInt(target.getAttribute("data-totalpage") || "1");
const currentPage = parseInt(repoElement.getAttribute("data-page"));
const totalPage = parseInt(target.getAttribute("data-totalPage") || "1");
if (totalPage > 1) {
confirmDialog(