From 81644059ac7acde4706a74dfc8a9b8352e8dda2f Mon Sep 17 00:00:00 2001 From: Vanessa Date: Mon, 28 Jul 2025 12:42:32 +0800 Subject: [PATCH] :art: https://github.com/siyuan-note/siyuan/issues/10964 --- app/src/protyle/gutter/index.ts | 5 +- app/src/protyle/render/av/action.ts | 2 +- app/src/protyle/render/av/row.ts | 60 ++++++++++++++--------- app/src/protyle/util/editorCommonEvent.ts | 22 +++++++-- 4 files changed, 59 insertions(+), 30 deletions(-) diff --git a/app/src/protyle/gutter/index.ts b/app/src/protyle/gutter/index.ts index 6b7609847..ed3ade681 100644 --- a/app/src/protyle/gutter/index.ts +++ b/app/src/protyle/gutter/index.ts @@ -269,6 +269,7 @@ export class Gutter { const srcIDs = [Lute.NewNodeID()]; const previousID = event.altKey ? (rowElement.previousElementSibling.getAttribute("data-id") || "") : buttonElement.dataset.rowId; const newUpdated = dayjs().format("YYYYMMDDHHmmss"); + const groupID = rowElement.parentElement.getAttribute("data-group-id"); transaction(protyle, [{ action: "insertAttrViewBlock", avID, @@ -279,7 +280,7 @@ export class Gutter { content: "" }], blockID: id, - groupID: rowElement.parentElement.getAttribute("data-group-id"), + groupID, }, { action: "doUpdateUpdated", id, @@ -293,7 +294,7 @@ export class Gutter { id, data: blockElement.getAttribute("updated") }]); - insertAttrViewBlockAnimation(protyle, blockElement, srcIDs, previousID, avID); + insertAttrViewBlockAnimation({protyle, blockElement, srcIDs, previousId: previousID, groupID}); if (event.altKey) { this.element.querySelectorAll("button").forEach(item => { item.dataset.rowId = srcIDs[0]; diff --git a/app/src/protyle/render/av/action.ts b/app/src/protyle/render/av/action.ts index 66ba636c9..63c2405f3 100644 --- a/app/src/protyle/render/av/action.ts +++ b/app/src/protyle/render/av/action.ts @@ -214,7 +214,7 @@ export const avClick = (protyle: IProtyle, event: MouseEvent & { target: HTMLEle insertRows({ blockElement, protyle, count: 1, - previousID: blockElement.querySelector(".av__row--util")?.previousElementSibling?.getAttribute("data-id") || + previousID: (bodyElement && bodyElement.querySelector(".av__row--util")?.previousElementSibling?.getAttribute("data-id")) || target.previousElementSibling?.getAttribute("data-id") || undefined, groupID: bodyElement ? bodyElement.getAttribute("data-group-id") : "" }); diff --git a/app/src/protyle/render/av/row.ts b/app/src/protyle/render/av/row.ts index f81374b2a..80e24e18f 100644 --- a/app/src/protyle/render/av/row.ts +++ b/app/src/protyle/render/av/row.ts @@ -106,21 +106,29 @@ export const setPage = (blockElement: Element) => { /** * 前端插入一假行 - * @param protyle - * @param blockElement - * @param srcIDs - * @param previousId - * @param avId 存在为新增否则为拖拽插入 + * @param options.protyle + * @param options.blockElement + * @param options.srcIDs + * @param options.previousId + * @param options.avId 存在为新增否则为拖拽插入 */ -export const insertAttrViewBlockAnimation = (protyle: IProtyle, blockElement: Element, srcIDs: string[], previousId: string, avId?: string,) => { - if ((blockElement.querySelector('[data-type="av-search"]') as HTMLInputElement).value !== "") { +export const insertAttrViewBlockAnimation = (options: { + protyle: IProtyle, + blockElement: Element, + srcIDs: string[], + previousId: string, + groupID?: string +}) => { + if ((options.blockElement.querySelector('[data-type="av-search"]') as HTMLInputElement).value !== "") { showMessage(window.siyuan.languages.insertRowTip); return; } - let previousElement = blockElement.querySelector(`.av__row[data-id="${previousId}"]`) || blockElement.querySelector(".av__row--header"); + const avId = options.blockElement.getAttribute("data-av-id"); + const groupQuery = options.groupID ? `.av__body[data-group-id="${options.groupID}"] ` : ""; + let previousElement = options.blockElement.querySelector(`.av__row[data-id="${options.previousId}"]`) || options.blockElement.querySelector(groupQuery + ".av__row--header"); // 有排序需要加入最后一行 - if (blockElement.querySelector('.av__views [data-type="av-sort"]').classList.contains("block__icon--active")) { - previousElement = blockElement.querySelector(".av__row--util").previousElementSibling; + if (options.blockElement.querySelector('.av__views [data-type="av-sort"]').classList.contains("block__icon--active")) { + previousElement = options.blockElement.querySelector("groupQuery + .av__row--util").previousElementSibling; } let colHTML = '
'; const pinIndex = previousElement.querySelectorAll(".av__colsticky .av__cell").length - 1; @@ -143,14 +151,14 @@ ${getTypeByCellElement(item) === "block" ? ' data-detached="true"' : ""}> { - const blockCellElement = blockElement.querySelector(`[data-block-id="${id}"]`); + options.srcIDs.forEach((id) => { + const blockCellElement = options.blockElement.querySelector(`[data-block-id="${id}"]`); if (!blockCellElement) { - html += `
+ html += `
${colHTML}
`; } else { - clearSelect(["cell"], blockElement); + clearSelect(["cell"], options.blockElement); addDragFill(blockCellElement); blockCellElement.classList.add("av__cell--select"); } @@ -158,19 +166,19 @@ ${getTypeByCellElement(item) === "block" ? ' data-detached="true"' : ""}> { // https://github.com/siyuan-note/siyuan/issues/10517 let hideTextCell = false; response.data.filters.find((item: IAVFilter) => { - const headerElement = blockElement.querySelector(`.av__cell--header[data-col-id="${item.column}"]`); + const headerElement = options.blockElement.querySelector(`.av__cell--header[data-col-id="${item.column}"]`); if (!headerElement) { return; } @@ -253,13 +261,13 @@ ${getTypeByCellElement(item) === "block" ? ' data-detached="true"' : ""}> { @@ -507,7 +515,13 @@ export const insertRows = (options: { previousId: options.previousID }); } else { - insertAttrViewBlockAnimation(options.protyle, options.blockElement, srcIDs, options.previousID, avID); + insertAttrViewBlockAnimation({ + protyle: options.protyle, + blockElement: options.blockElement, + srcIDs, + previousId: options.previousID, + groupID: options.groupID + }); } options.blockElement.setAttribute("updated", newUpdated); }; diff --git a/app/src/protyle/util/editorCommonEvent.ts b/app/src/protyle/util/editorCommonEvent.ts index 9e031618f..176003a11 100644 --- a/app/src/protyle/util/editorCommonEvent.ts +++ b/app/src/protyle/util/editorCommonEvent.ts @@ -1110,13 +1110,14 @@ export const dropEvent = (protyle: IProtyle, editorElement: HTMLElement) => { transaction(protyle, doOperations, undoOperations); } else { const newUpdated = dayjs().format("YYYYMMDDHHmmss"); + const groupID = targetElement.parentElement.getAttribute("data-group-id"); transaction(protyle, [{ action: "insertAttrViewBlock", avID, previousID, srcs, blockID: blockElement.dataset.nodeId, - groupID: targetElement.parentElement.getAttribute("data-group-id") + groupID }, { action: "doUpdateUpdated", id: blockElement.dataset.nodeId, @@ -1131,7 +1132,13 @@ export const dropEvent = (protyle: IProtyle, editorElement: HTMLElement) => { data: blockElement.getAttribute("updated") }]); blockElement.setAttribute("updated", newUpdated); - insertAttrViewBlockAnimation(protyle, blockElement, sourceIds, previousID); + insertAttrViewBlockAnimation({ + protyle, + blockElement, + srcIDs: sourceIds, + previousId: previousID, + groupID + }); } } } else if (targetElement.classList.contains("av__gallery-item") || targetElement.classList.contains("av__gallery-add")) { @@ -1292,6 +1299,7 @@ export const dropEvent = (protyle: IProtyle, editorElement: HTMLElement) => { const avID = blockElement.getAttribute("data-av-id"); const newUpdated = dayjs().format("YYYYMMDDHHmmss"); const srcs: IOperationSrcs[] = []; + const groupID = targetElement.parentElement.getAttribute("data-group-id"); ids.forEach(id => { srcs.push({ id, @@ -1304,7 +1312,7 @@ export const dropEvent = (protyle: IProtyle, editorElement: HTMLElement) => { previousID, srcs, blockID: blockElement.dataset.nodeId, - groupID: targetElement.parentElement.getAttribute("data-group-id") + groupID }, { action: "doUpdateUpdated", id: blockElement.dataset.nodeId, @@ -1318,7 +1326,13 @@ export const dropEvent = (protyle: IProtyle, editorElement: HTMLElement) => { id: blockElement.dataset.nodeId, data: blockElement.getAttribute("updated") }]); - insertAttrViewBlockAnimation(protyle, blockElement, ids, previousID); + insertAttrViewBlockAnimation({ + protyle, + blockElement, + srcIDs: ids, + previousId: previousID, + groupID + }); blockElement.setAttribute("updated", newUpdated); } } else {