🎨 Improve data snapshots pagination navigation fix #12548 (#12552)

* Improve data snapshots pagination navigation

* pageCount

* jumpToPage
This commit is contained in:
Jeffrey Chen 2024-09-22 22:31:50 +08:00 committed by GitHub
parent 2cf0b09282
commit 5d97e4f2f8
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
7 changed files with 21 additions and 29 deletions

View file

@ -1,6 +1,6 @@
{
"historyRepoJumpPage": "Jump to the specified page: 1 ~ ${x}",
"historyRepoTitle": "Total <span class=\"count-page\">1</span> pages, <span class=\"count-snap\">1</span> snapshots",
"jumpToPage": "Jump to the specified page: 1 ~ ${x}",
"pageCountAndSnapshotCount": "Total ${x} pages, ${y} snapshots",
"visitCommunityShare": "Visit community share",
"clearContextSucc": "The context has been cleared",
"emptyMobilePlaceholder": "Record something",

View file

@ -1,6 +1,6 @@
{
"historyRepoJumpPage": "Saltar a la página especificada: 1 ~ ${x}",
"historyRepoTitle": "Total <span class=\"count-page\">1</span> páginas, <span class=\"count-snap\">1</span> instantáneas",
"jumpToPage": "Saltar a la página especificada: 1 ~ ${x}",
"pageCountAndSnapshotCount": "Total ${x} páginas, ${y} instantáneas",
"visitCommunityShare": "Visitar la comunidad compartida",
"clearContextSucc": "Se ha borrado el contexto",
"emptyMobilePlaceholder": "Grabar algo",

View file

@ -1,6 +1,6 @@
{
"historyRepoJumpPage": "Aller à la page spécifiée : 1 ~ ${x}",
"historyRepoTitle": "Total de <span class=\"count-page\">1</span> pages, <span class=\"count-snap\">1</span> instantanés",
"jumpToPage": "Aller à la page spécifiée : 1 ~ ${x}",
"pageCountAndSnapshotCount": "Total de ${x} pages, ${y} instantanés",
"visitCommunityShare": "Visiter le partage communautaire",
"clearContextSucc": "Le contexte a été effacé",
"emptyMobilePlaceholder": "Enregistrer quelque chose",

View file

@ -1,6 +1,6 @@
{
"historyRepoJumpPage": "指定されたページにジャンプ1 ~ ${x}",
"historyRepoTitle": "合計<span class=\"count-page\">1</span>ページ、<span class=\"count-snap\">1</span>スナップショット",
"jumpToPage": "指定されたページにジャンプ1 ~ ${x}",
"pageCountAndSnapshotCount": "合計 ${x} ページ、${y} スナップショット",
"visitCommunityShare": "コミュニティシェアを訪問",
"clearContextSucc": "コンテキストがクリアされました",
"emptyMobilePlaceholder": "何かを記録する",

View file

@ -1,6 +1,6 @@
{
"historyRepoJumpPage": "跳轉到指定頁1 ~ ${x}",
"historyRepoTitle": "共<span class=\"count-page\">1</span>頁, <span class=\"count-snap\">1</span>個快照",
"jumpToPage": "跳轉到指定頁1 ~ ${x}",
"pageCountAndSnapshotCount": "共 ${x} 頁,${y} 個快照",
"visitCommunityShare": "訪問社區分享",
"clearContextSucc": "上下文已清空",
"emptyMobilePlaceholder": "記錄點什麼",

View file

@ -1,6 +1,6 @@
{
"historyRepoJumpPage": "跳转到指定页1 ~ ${x}",
"historyRepoTitle": "共<span class=\"count-page\">1</span>页, <span class=\"count-snap\">1</span>个快照",
"jumpToPage": "跳转到指定页1 ~ ${x}",
"pageCountAndSnapshotCount": "共 ${x} 页,${y} 个快照",
"visitCommunityShare": "访问社区分享",
"clearContextSucc": "上下文已清空",
"emptyMobilePlaceholder": "记录点什么",

View file

@ -241,14 +241,12 @@ ${actionHTML}
const renderRepo = (element: Element, currentPage: number) => {
const selectValue = (element.querySelector(".b3-select") as HTMLSelectElement).value;
element.lastElementChild.innerHTML = '<li style="position: relative;height: 100%;"><div class="fn__loading"><img width="64px" src="/stage/loading-pure.svg"></div></li>';
const pageCount = element.querySelector(".history-repo__title span.count-page");
const snapCount = element.querySelector(".history-repo__title span.count-snap");
const pageBtn = element.querySelector('button[data-type="jumpPage"]');
pageBtn.textContent = `${currentPage}`;
const previousElement = element.querySelector('[data-type="previous"]');
const nextElement = element.querySelector('[data-type="next"]');
// const pageElement = nextElement.nextElementSibling.nextElementSibling;
const pageElement = nextElement.nextElementSibling.nextElementSibling;
element.setAttribute("data-init", "true");
if (selectValue === "getRepoTagSnapshots" || selectValue === "getCloudRepoTagSnapshots") {
fetchPost(`/api/repo/${selectValue}`, {}, (response) => {
@ -256,15 +254,13 @@ const renderRepo = (element: Element, currentPage: number) => {
});
previousElement.classList.add("fn__none");
nextElement.classList.add("fn__none");
// pageElement.classList.add("fn__none");
pageElement.classList.add("fn__none");
pageBtn.classList.add("fn__none");
pageCount.parentElement?.classList.add("fn__none");
} else {
previousElement.classList.remove("fn__none");
nextElement.classList.remove("fn__none");
// pageElement.classList.remove("fn__none");
pageElement.classList.remove("fn__none");
pageBtn.classList.remove("fn__none");
pageCount.parentElement?.classList.remove("fn__none");
element.setAttribute("data-page", currentPage.toString());
if (currentPage > 1) {
previousElement.removeAttribute("disabled");
@ -278,9 +274,8 @@ const renderRepo = (element: Element, currentPage: number) => {
} else {
nextElement.setAttribute("disabled", "disabled");
}
// pageElement.textContent = `${currentPage}/${response.data.pageCount || 1}`;
pageCount.textContent = `${response.data.pageCount}`;
snapCount.textContent = `${response.data.totalCount}`;
element.setAttribute("total-page", response.data.pageCount.toString());
pageElement.textContent = `${window.siyuan.languages.pageCountAndSnapshotCount.replace("${x}", response.data.pageCount).replace("${y}", response.data.totalCount || 1)}`;
renderRepoItem(response, element, selectValue);
});
}
@ -403,14 +398,12 @@ export const openHistory = (app: App) => {
<div data-type="repo" class="fn__none history__repo">
<div style="overflow: auto"">
<div class="block__icons">
<div style="margin-left: 3px;" class="history-repo__title">
${window.siyuan.languages.historyRepoTitle}
</div>
<span class="fn__space"></span>
<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="jumpPage">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="fn__space"></span>
<div class="fn__flex-1"></div>
<select class="b3-select ${isMobile() ? "fn__size96" : "fn__size200"}">
<option value="getRepoSnapshots">${window.siyuan.languages.localSnapshot}</option>
@ -812,11 +805,10 @@ const bindEvent = (app: App, element: Element, dialog?: Dialog) => {
break;
} else if (type === "jumpPage") {
const currentPage = parseInt(repoElement.getAttribute("data-page"));
const count = repoElement.querySelector("span.count-page");
const totalPage = parseInt(count?.textContent || "1");
const totalPage = parseInt(repoElement.getAttribute("total-page") || "1");
confirmDialog(
window.siyuan.languages.historyRepoJumpPage.replace("${x}", totalPage),
window.siyuan.languages.jumpToPage.replace("${x}", totalPage),
// eslint-disable-next-line quotes
`<input style="width: 100%;" class="b3-text-field fn__flex-center" type="number" min="1" max="${totalPage}" value="${currentPage}">`,
(dialog: Dialog) => {