diff --git a/app/src/protyle/render/av/action.ts b/app/src/protyle/render/av/action.ts index 6dfb7afd3..a8daeba91 100644 --- a/app/src/protyle/render/av/action.ts +++ b/app/src/protyle/render/av/action.ts @@ -63,15 +63,35 @@ export const avClick = (protyle: IProtyle, event: MouseEvent & { target: HTMLEle return true; } - const gutterElement = hasClosestByClassName(event.target, "av__gutters"); - if (gutterElement) { - const gutterRect = gutterElement.getBoundingClientRect(); - avContextmenu(protyle, gutterElement.parentElement, { - x: gutterRect.left, - y: gutterRect.bottom, - w: gutterRect.width, - h: gutterRect.height - }); + const gutterElement = hasClosestByClassName(event.target, "ariaLabel"); + if (gutterElement && gutterElement.parentElement.classList.contains("av__gutters")) { + const rowElement = gutterElement.parentElement.parentElement; + if (gutterElement.dataset.action === "add") { + const avID = blockElement.getAttribute("data-av-id"); + const srcIDs = [Lute.NewNodeID()]; + const previousID = event.altKey ? (rowElement.previousElementSibling.getAttribute("data-id") || "") : rowElement.getAttribute("data-id"); + transaction(protyle, [{ + action: "insertAttrViewBlock", + avID, + previousID, + srcIDs, + isDetached: true, + }], [{ + action: "removeAttrViewBlock", + srcIDs, + avID, + }]); + insertAttrViewBlockAnimation(blockElement, 1, previousID, avID); + popTextCell(protyle, [rowElement[event.altKey ? "previousElementSibling" : "nextElementSibling"].querySelector('[data-detached="true"]')], "block"); + } else { + const gutterRect = gutterElement.getBoundingClientRect(); + avContextmenu(protyle, rowElement, { + x: gutterRect.left, + y: gutterRect.bottom, + w: gutterRect.width, + h: gutterRect.height + }); + } event.preventDefault(); event.stopPropagation(); return true; @@ -373,7 +393,7 @@ export const updateAVName = (protyle: IProtyle, blockElement: Element) => { // 当前页面不能进行推送,否则光标会乱跳 Array.from(protyle.wysiwyg.element.querySelectorAll(`[data-av-id="${avId}"]`)).forEach((item: HTMLElement) => { - if(blockElement.isSameNode(item)) { + if (blockElement.isSameNode(item)) { return; } const titleElement = item.querySelector(".av__title") as HTMLElement; diff --git a/app/src/protyle/render/av/cell.ts b/app/src/protyle/render/av/cell.ts index eb8253ea9..ba0f08ae7 100644 --- a/app/src/protyle/render/av/cell.ts +++ b/app/src/protyle/render/av/cell.ts @@ -464,7 +464,8 @@ const updateCellValue = (protyle: IProtyle, type: TAVCol, cellElements: HTMLElem const avid = cellElements[0].parentElement.dataset.avid; if (avid) { // 新增行后弹出的输入框 - cellElements[0] = protyle.wysiwyg.element.querySelector(`[data-av-id="${avid}"] .av__row--add`).previousElementSibling.querySelector('[data-detached="true"]'); + const previousId = cellElements[0].parentElement.dataset.previousId; + cellElements[0] = protyle.wysiwyg.element.querySelector(previousId ? `[data-av-id="${avid}"] .av__row[data-id="${previousId}"]` : `[data-av-id="${avid}"] .av__row--header`).nextElementSibling.querySelector('[data-detached="true"]'); } else { // 修改单元格后立即修改其他单元格 cellElements[0] = protyle.wysiwyg.element.querySelector(`.av__cell[data-id="${cellElements[0].dataset.id}"]`); diff --git a/app/src/protyle/render/av/render.ts b/app/src/protyle/render/av/render.ts index 6e7c27af3..b032a44bf 100644 --- a/app/src/protyle/render/av/render.ts +++ b/app/src/protyle/render/av/render.ts @@ -81,7 +81,7 @@ style="width: ${column.width || "200px"}">${getCalcValue(column) || ' { tableHTML += `
- +
`; diff --git a/app/src/protyle/render/av/row.ts b/app/src/protyle/render/av/row.ts index 77aa7eae0..5a2646ba9 100644 --- a/app/src/protyle/render/av/row.ts +++ b/app/src/protyle/render/av/row.ts @@ -67,7 +67,7 @@ export const insertAttrViewBlockAnimation = (blockElement: Element, size: number let html = ""; new Array(size).fill(1).forEach(() => { - html += `
+ html += `
${colHTML}
`; diff --git a/app/src/protyle/util/editorCommonEvent.ts b/app/src/protyle/util/editorCommonEvent.ts index c87871c0f..3e6eac1cb 100644 --- a/app/src/protyle/util/editorCommonEvent.ts +++ b/app/src/protyle/util/editorCommonEvent.ts @@ -726,12 +726,12 @@ export const dropEvent = (protyle: IProtyle, editorElement: HTMLElement) => { event.dataTransfer.setData(`${Constants.SIYUAN_DROP_GUTTER}NodeAttributeView${Constants.ZWSP}Col${Constants.ZWSP}${[target.parentElement.getAttribute("data-col-id")]}`, target.innerHTML); return; - } else if (target.classList.contains("av__gutters")) { + } else if (target.classList.contains("ariaLabel")) { const blockElement = hasClosestBlock(target); if (!blockElement) { return; } - const rowElement = target.parentElement; + const rowElement = target.parentElement.parentElement; const selectIds = []; if (rowElement.classList.contains("av__row--select")) { rowElement.parentElement.querySelectorAll(".av__row--select:not(.av__row--header)").forEach((item) => {