🎨 #9294

siyuan-note · Sep 28, 2023 · 14d88d6 · 14d88d6
1 parent 92467f2
commit 14d88d6
Show file tree

Hide file tree

Showing 6 changed files with 35 additions and 44 deletions.
diff --git a/app/src/assets/scss/business/_av.scss b/app/src/assets/scss/business/_av.scss
@@ -88,7 +88,7 @@
 
     &:hover {
       [data-type="block-ref"],
-      [data-type="createdoc"] {
+      [data-type="block-more"] {
         display: block;
       }
 
@@ -200,7 +200,7 @@
     transition: var(--b3-transition);
 
     [data-type="block-ref"],
-    [data-type="createdoc"] {
+    [data-type="block-more"] {
       display: none;
       position: absolute;
       right: 5px;

diff --git a/app/src/protyle/hint/index.ts b/app/src/protyle/hint/index.ts
@@ -277,10 +277,10 @@ ${unicode2Emoji(emoji.unicode)}</button>`;
         }
         this.element.style.width = Math.max(protyle.element.clientWidth / 2, 320) + "px";
         if (this.source === "av") {
-            const blockElement = hasClosestBlock(protyle.toolbar.range.startContainer);
-            if (blockElement) {
-                const rowAddRect = blockElement.querySelector(".av__row--add").getBoundingClientRect();
-                setPosition(this.element, rowAddRect.left, rowAddRect.bottom, rowAddRect.height);
+            const cellElement = hasClosestByClassName(protyle.toolbar.range.startContainer, "av__cell");
+            if (cellElement) {
+                const cellRect = cellElement.getBoundingClientRect();
+                setPosition(this.element, cellRect.left, cellRect.bottom, cellRect.height);
             }
         } else {
             const textareaPosition = getSelectionPosition(protyle.wysiwyg.element);
@@ -411,9 +411,12 @@ ${genHintItemHTML(item)}
             return;
         }
         if (this.source === "av") {
+            const cellElement = hasClosestByClassName(protyle.toolbar.range.startContainer, "av__cell");
+            if (!cellElement) {
+                return;
+            }
+            const previousID = cellElement.dataset.blockId
             const avID = nodeElement.getAttribute("data-av-id");
-            const rowsElement = nodeElement.querySelectorAll(".av__row");
-            const previousID = rowsElement[rowsElement.length - 1].getAttribute("data-id");
             let tempElement = document.createElement("div");
             tempElement.innerHTML = value.replace(/<mark>/g, "").replace(/<\/mark>/g, "");
             tempElement = tempElement.firstElementChild as HTMLDivElement;
@@ -428,31 +431,36 @@ ${genHintItemHTML(item)}
                         markdown: ""
                     }, response => {
                         transaction(protyle, [{
-                            action: "insertAttrViewBlock",
+                            action: "replaceAttrViewBlock",
                             avID,
                             previousID,
-                            srcIDs: [response.data],
+                            nextID: response.data,
+                            isDetached: false,
                         }], [{
-                            action: "removeAttrViewBlock",
-                            srcIDs: [response.data],
+                            action: "replaceAttrViewBlock",
                             avID,
+                            previousID: response.data,
+                            nextID: previousID,
+                            isDetached: true,
                         }]);
                     });
                 });
             } else {
                 const sourceId = tempElement.getAttribute("data-id");
                 transaction(protyle, [{
-                    action: "insertAttrViewBlock",
+                    action: "replaceAttrViewBlock",
                     avID,
                     previousID,
-                    srcIDs: [sourceId],
+                    nextID: sourceId,
+                    isDetached: false,
                 }], [{
-                    action: "removeAttrViewBlock",
-                    srcIDs: [sourceId],
+                    action: "replaceAttrViewBlock",
                     avID,
+                    previousID: sourceId,
+                    nextID: previousID,
+                    isDetached: true,
                 }]);
             }
-            insertAttrViewBlockAnimation(nodeElement, 1, previousID);
             return;
         }
         this.enableExtend = false;

diff --git a/app/src/protyle/render/av/action.ts b/app/src/protyle/render/av/action.ts
@@ -33,6 +33,7 @@ export const avClick = (protyle: IProtyle, event: MouseEvent & { target: HTMLEle
     if (protyle.disabled) {
         return false;
     }
+
     const addElement = hasClosestByAttribute(event.target, "data-type", "av-header-add");
     if (addElement) {
         const addMenu = addCol(protyle, blockElement);
@@ -151,31 +152,12 @@ export const avClick = (protyle: IProtyle, event: MouseEvent & { target: HTMLEle
         return true;
     }
 
-    const createDocElement = hasClosestByAttribute(event.target, "data-type", "createdoc");
-    if (createDocElement) {
-        fetchPost("/api/filetree/getHPathByPath", {
-            notebook: protyle.notebookId,
-            path: protyle.path,
-        }, (response) => {
-            fetchPost("/api/filetree/createDocWithMd", {
-                notebook: protyle.notebookId,
-                path: pathPosix().join(response.data, createDocElement.previousElementSibling.textContent.trim() || "Untitled"),
-                parentID: protyle.block.rootID,
-                markdown: "",
-                id: createDocElement.parentElement.dataset.blockId,
-            }, response => {
-                transaction(protyle, [{
-                    action: "updateAttrViewCell",
-                    id: createDocElement.parentElement.dataset.id,
-                    avID: blockElement.getAttribute("data-av-id"),
-                    keyID: createDocElement.parentElement.dataset.colId,
-                    rowID: createDocElement.parentElement.parentElement.dataset.id,
-                    data: {
-                        isDetached: false
-                    }
-                }]);
-            });
-        });
+    const blockMoreElement = hasClosestByAttribute(event.target, "data-type", "block-more");
+    if (blockMoreElement) {
+        protyle.toolbar.range = document.createRange();
+        protyle.toolbar.range.selectNodeContents(blockMoreElement);
+        focusByRange(protyle.toolbar.range);
+        hintRef(blockMoreElement.previousElementSibling.textContent.trim(), protyle, "av");
         event.preventDefault();
         event.stopPropagation();
         return true;

diff --git a/app/src/protyle/render/av/render.ts b/app/src/protyle/render/av/render.ts
@@ -72,7 +72,7 @@ style="width: ${column.width || "200px"}">${getCalcValue(column) || '<svg><use x
                         } else if (cell.valueType === "block") {
                             text = `<span class="av__celltext">${cell.value.block.content || ""}</span>`;
                             if (cell.value?.isDetached) {
-                                text += `<span class="b3-chip b3-chip--info b3-chip--small" data-type="createdoc" >${window.siyuan.languages.new}</span>`;
+                                text += `<span class="b3-chip b3-chip--info b3-chip--small" data-type="block-more" >${window.siyuan.languages.more}</span>`;
                             } else {
                                 text += `<span class="b3-chip b3-chip--info b3-chip--small" data-type="block-ref" data-id="${cell.value.block.id}" data-subtype="s">${window.siyuan.languages.openBy}</span>`;
                             }

diff --git a/app/src/protyle/wysiwyg/transaction.ts b/app/src/protyle/wysiwyg/transaction.ts
@@ -708,7 +708,7 @@ export const onTransaction = (protyle: IProtyle, operation: IOperation, isUndo:
     } else if (["addAttrViewCol", "insertAttrViewBlock", "updateAttrViewCol", "updateAttrViewColOptions",
         "updateAttrViewColOption", "updateAttrViewCell", "sortAttrViewRow", "sortAttrViewCol", "setAttrViewColHidden",
         "setAttrViewColWrap", "setAttrViewColWidth", "removeAttrViewColOption", "setAttrViewName", "setAttrViewFilters",
-        "setAttrViewSorts", "setAttrViewColCalc", "removeAttrViewCol", "updateAttrViewColNumberFormat"].includes(operation.action)) {
+        "setAttrViewSorts", "setAttrViewColCalc", "removeAttrViewCol", "updateAttrViewColNumberFormat", "replaceAttrViewBlock"].includes(operation.action)) {
         refreshAV(protyle, operation);
     }
 };

diff --git a/app/src/types/index.d.ts b/app/src/types/index.d.ts
@@ -37,6 +37,7 @@ type TOperation =
     | "setAttrViewSorts"
     | "setAttrViewColCalc"
     | "updateAttrViewColNumberFormat"
+    | "replaceAttrViewBlock"
 type TBazaarType = "templates" | "icons" | "widgets" | "themes" | "plugins"
 type TCardType = "doc" | "notebook" | "all"
 type TEventBus = "ws-main" |