🎨 https://github.com/siyuan-note/siyuan/issues/9424

app/src/protyle/render/av/action.ts

@@ -128,7 +128,7 @@ export const avClick = (protyle: IProtyle, event: MouseEvent & { target: HTMLEle
             event.stopPropagation();
             return true;
         } else if (type === "set-page-size") {
-            setPageSize(target);
+            setPageSize(target, protyle, blockElement.getAttribute("data-av-id"));
             event.preventDefault();
             event.stopPropagation();
             return true;

app/src/protyle/render/av/openMenuPanel.ts

@@ -574,7 +574,7 @@ export const openMenuPanel = (options: {
                     event.stopPropagation();
                     break;
                 } else if (type === "set-page-size") {
-                    setPageSize(target);
+                    setPageSize(target, options.protyle, avID);
                     event.preventDefault();
                     event.stopPropagation();
                     break;

app/src/protyle/render/av/render.ts

@@ -259,12 +259,12 @@ ${cell.color ? `color:${cell.color};` : ""}">${text}</div>`;
                         ${window.siyuan.languages.addAttr}
                     </button>
                     <span class="fn__space"></span>
-                    <button class="b3-button">
+                    <button class="b3-button${data.rowCount > data.rows.length ? "" : " fn__none"}">
                         <svg data-type="av-load-more"><use xlink:href="#iconArrowDown"></use></svg>
                         <span data-type="av-load-more">
                             ${window.siyuan.languages.loadMore}
                         </span>
-                        <svg data-type="set-page-size" data-size="50"><use xlink:href="#iconMore"></use></svg>
+                        <svg data-type="set-page-size" data-size="${data.pageSize}"><use xlink:href="#iconMore"></use></svg>
                     </button>
                 </div>
             </div>

app/src/protyle/render/av/row.ts

@@ -1,6 +1,7 @@
 import {hasClosestBlock, hasClosestByClassName} from "../../util/hasClosest";
 import {focusBlock} from "../../util/selection";
 import {Menu} from "../../../plugin/Menu";
+import {transaction} from "../../wysiwyg/transaction";
 
 export const selectRow = (checkElement: Element, type: "toggle" | "select" | "unselect" | "unselectAll") => {
     const rowElement = hasClosestByClassName(checkElement, "av__row");
@@ -121,13 +122,22 @@ export const stickyRow = (blockElement: HTMLElement, elementRect: DOMRect, statu
     }
 };
 
-const updatePageSize = (currentPageSIze: string, newPageSize: string) => {
+const updatePageSize = (currentPageSIze: string, newPageSize: string, protyle: IProtyle, avID:string) => {
     if (currentPageSIze === newPageSize) {
         return;
     }
+    transaction(protyle, [{
+        action: "setAttrViewPageSize",
+        avID,
+        data: newPageSize,
+    }], [{
+        action: "setAttrViewPageSize",
+        data: currentPageSIze,
+        avID,
+    }]);
 };
 
-export const setPageSize = (target: HTMLElement) => {
+export const setPageSize = (target: HTMLElement, protyle: IProtyle, avID:string) => {
     const menu = new Menu("av-page-size");
     if (menu.isOpen) {
         return;
@@ -138,7 +148,7 @@ export const setPageSize = (target: HTMLElement) => {
         label: "10",
         accelerator: currentPageSIze === "10" ? '<svg class="svg" style="height: 30px; float: left;"><use xlink:href="#iconSelect"></use></svg>' : undefined,
         click() {
-            updatePageSize(currentPageSIze, "10");
+            updatePageSize(currentPageSIze, "10", protyle, avID);
         }
     });
     menu.addItem({
@@ -146,7 +156,7 @@ export const setPageSize = (target: HTMLElement) => {
         accelerator: currentPageSIze === "25" ? '<svg class="svg" style="height: 30px; float: left;"><use xlink:href="#iconSelect"></use></svg>' : undefined,
         label: "25",
         click() {
-            updatePageSize(currentPageSIze, "25");
+            updatePageSize(currentPageSIze, "25", protyle, avID);
         }
     });
     menu.addItem({
@@ -154,7 +164,7 @@ export const setPageSize = (target: HTMLElement) => {
         accelerator: currentPageSIze === "50" ? '<svg class="svg" style="height: 30px; float: left;"><use xlink:href="#iconSelect"></use></svg>' : undefined,
         label: "50",
         click() {
-            updatePageSize(currentPageSIze, "50");
+            updatePageSize(currentPageSIze, "50", protyle, avID);
         }
     });
     menu.addItem({
@@ -162,7 +172,7 @@ export const setPageSize = (target: HTMLElement) => {
         accelerator: currentPageSIze === "100" ? '<svg class="svg" style="height: 30px; float: left;"><use xlink:href="#iconSelect"></use></svg>' : undefined,
         label: "100",
         click() {
-            updatePageSize(currentPageSIze, "100");
+            updatePageSize(currentPageSIze, "100", protyle, avID);
         }
     });
     const rect = target.getBoundingClientRect();

app/src/protyle/render/av/view.ts

@@ -132,10 +132,10 @@ export const getViewHTML = (data: IAVTable) => {
     <span class="b3-menu__accelerator">${data.sorts.length}</span>
     <svg class="b3-menu__icon b3-menu__icon--arrow"><use xlink:href="#iconRight"></use></svg>
 </button>
-<button class="b3-menu__item" data-type="set-page-size" data-size="50">
+<button class="b3-menu__item" data-type="set-page-size" data-size="${data.pageSize}">
     <svg class="b3-menu__icon"></svg>
     <span class="b3-menu__label">${window.siyuan.languages.pageCount}</span>
-    <span class="b3-menu__accelerator">50</span>
+    <span class="b3-menu__accelerator">${data.pageSize}</span>
     <svg class="b3-menu__icon b3-menu__icon--arrow"><use xlink:href="#iconRight"></use></svg>
 </button>
 <button class="b3-menu__separator"></button>

app/src/protyle/util/onGet.ts

@@ -376,7 +376,9 @@ export const enableProtyle = (protyle: IProtyle) => {
     });
     const contentRect = protyle.contentElement.getBoundingClientRect();
     protyle.wysiwyg.element.querySelectorAll(".av").forEach((item: HTMLElement) => {
+        if (item.querySelector(".av__title")) {
             stickyRow(item, contentRect, "all");
+        }
     });
     if (protyle.breadcrumb) {
         protyle.breadcrumb.element.parentElement.querySelector('[data-type="readonly"] use').setAttribute("xlink:href", "#iconUnlock");

app/src/protyle/wysiwyg/transaction.ts

@@ -717,7 +717,8 @@ export const onTransaction = (protyle: IProtyle, operation: IOperation, isUndo:
         "setAttrViewColWrap", "setAttrViewColWidth", "removeAttrViewColOption", "setAttrViewName", "setAttrViewFilters",
         "setAttrViewSorts", "setAttrViewColCalc", "removeAttrViewCol", "updateAttrViewColNumberFormat", "removeAttrViewBlock",
         "replaceAttrViewBlock", "updateAttrViewColTemplate", "setAttrViewColIcon", "setAttrViewColPin", "addAttrViewView",
-        "removeAttrViewView", "setAttrViewViewName", "setAttrViewViewIcon", "duplicateAttrViewView", "sortAttrViewView"].includes(operation.action)) {
+        "removeAttrViewView", "setAttrViewViewName", "setAttrViewViewIcon", "duplicateAttrViewView", "sortAttrViewView",
+        "setAttrViewPageSize"].includes(operation.action)) {
         refreshAV(protyle, operation, isUndo);
     } else if (operation.action === "doUpdateUpdated") {
         updateElements.forEach(item => {

app/src/types/index.d.ts

@@ -48,6 +48,7 @@ type TOperation =
     | "setAttrViewViewIcon"
     | "duplicateAttrViewView"
     | "sortAttrViewView"
+    | "setAttrViewPageSize"
 type TBazaarType = "templates" | "icons" | "widgets" | "themes" | "plugins"
 type TCardType = "doc" | "notebook" | "all"
 type TEventBus = "ws-main" | "sync-start" | "sync-end" | "sync-fail" |
@@ -1038,6 +1039,8 @@ interface IAVTable extends IAVView {
     filters: IAVFilter[],
     sorts: IAVSort[],
     rows: IAVRow[],
+    rowCount: number,
+    pageSize: number,
 }
 
 interface IAVFilter {