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

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

@@ -146,6 +146,24 @@ export const avClick = (protyle: IProtyle, event: MouseEvent & { target: HTMLEle
         return true;
     }
 
+    const addTabElement = hasClosestByAttribute(event.target, "data-type", "av-add");
+    if (addTabElement) {
+        const id = Lute.NewNodeID();
+        const avID = blockElement.getAttribute("data-av-id");
+        transaction(protyle, [{
+            action: "addAttrViewView",
+            avID,
+            id
+        }], [{
+            action: "removeAttrViewView",
+            avID,
+            id
+        }]);
+        event.preventDefault();
+        event.stopPropagation();
+        return true;
+    }
+
     const linkElement = hasClosestByClassName(event.target, "av__celltext--url");
     if (linkElement) {
         let linkAddress = linkElement.textContent.trim();

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

@@ -210,6 +210,10 @@ ${cell.color ? `color:${cell.color};` : ""}">${text}</div>`;
     <div class="av__header">
         <div class="layout-tab-bar fn__flex">
             ${tabHTML}
+            <div class="fn__space"></div>
+            <span data-type="av-add" class="block__icon block__icon--show">
+                <svg><use xlink:href="#iconAdd"></use></svg>
+            </span>
             <div class="fn__flex-1"></div>
             ${response.data.isMirror ? ` <span class="block__icon block__icon--show b3-tooltips b3-tooltips__w" aria-label="${window.siyuan.languages.mirrorTip}">
     <svg><use xlink:href="#iconSplitLR"></use></svg></span><div class="fn__space"></div>` : ""}

app/src/protyle/wysiwyg/transaction.ts

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

app/src/types/index.d.ts

@@ -42,6 +42,8 @@ type TOperation =
     | "setAttrViewColCalc"
     | "updateAttrViewColNumberFormat"
     | "replaceAttrViewBlock"
+    | "addAttrViewView"
+    | "removeAttrViewView"
 type TBazaarType = "templates" | "icons" | "widgets" | "themes" | "plugins"
 type TCardType = "doc" | "notebook" | "all"
 type TEventBus = "ws-main" |