diff --git a/app/src/protyle/render/av/cell.ts b/app/src/protyle/render/av/cell.ts index a1020a8de..447efa128 100644 --- a/app/src/protyle/render/av/cell.ts +++ b/app/src/protyle/render/av/cell.ts @@ -141,7 +141,7 @@ export const popTextCell = (protyle: IProtyle, cellElements: HTMLElement[], type if (!type) { type = getTypeByCellElement(cellElements[0]); } - if (type === "updated" || type === "created") { + if (type === "updated" || type === "created" || document.querySelector(".av__mask")) { return; } if (type === "block" && (cellElements.length > 1 || !cellElements[0].getAttribute("data-detached"))) { @@ -210,7 +210,7 @@ export const popTextCell = (protyle: IProtyle, cellElements: HTMLElement[], type } if (event.key === "Escape" || event.key === "Tab" || (event.key === "Enter" && !event.shiftKey && isNotCtrl(event))) { - updateCellValue(protyle, type, cellElements); + inputElement.blur(); if (event.key === "Tab") { protyle.wysiwyg.element.dispatchEvent(new KeyboardEvent("keydown", { shiftKey: event.shiftKey, @@ -260,7 +260,6 @@ const updateCellValue = (protyle: IProtyle, type: TAVCol, cellElements: HTMLElem if (!blockElement) { return; } - const avMaskElement = document.querySelector(".av__mask"); const doOperations: IOperation[] = []; const undoOperations: IOperation[] = []; @@ -362,7 +361,7 @@ const updateCellValue = (protyle: IProtyle, type: TAVCol, cellElements: HTMLElem if (blockElement) { focusBlock(blockElement); } - setTimeout(() => { - avMaskElement?.remove(); + document.querySelectorAll(".av__mask").forEach((item) => { + item.remove(); }); }; diff --git a/app/src/protyle/render/av/keydown.ts b/app/src/protyle/render/av/keydown.ts index d9387c833..ef32eefaa 100644 --- a/app/src/protyle/render/av/keydown.ts +++ b/app/src/protyle/render/av/keydown.ts @@ -103,7 +103,11 @@ export const avKeydown = (event: KeyboardEvent, nodeElement: HTMLElement, protyl (Constants.KEYCODELIST[event.keyCode].length === 1 && !event.metaKey && !event.ctrlKey && !["⇧", "⌃", "⌥", "⌘"].includes(Constants.KEYCODELIST[event.keyCode]))) { - popTextCell(protyle, [selectCellElement]); + if (!selectCellElement.style.backgroundColor) { + popTextCell(protyle, [selectCellElement]); + } else { + event.preventDefault(); + } return true; } } diff --git a/app/src/protyle/render/av/render.ts b/app/src/protyle/render/av/render.ts index 351a7ce26..321fec171 100644 --- a/app/src/protyle/render/av/render.ts +++ b/app/src/protyle/render/av/render.ts @@ -276,7 +276,6 @@ ${cell.color ? `color:${cell.color};` : ""}">${text}`; } else { stickyRow(e, editRect, "bottom"); } - if (selectCellId) { const newCellElement = e.querySelector(`.av__row[data-id="${selectCellId.split(Constants.ZWSP)[0]}"] .av__cell[data-col-id="${selectCellId.split(Constants.ZWSP)[1]}"]`); if (newCellElement) { @@ -296,8 +295,7 @@ ${cell.color ? `color:${cell.color};` : ""}">${text}`; } }; -let lastParentID: string; -let lastElement: HTMLElement; +let refreshTimeout: number; export const refreshAV = (protyle: IProtyle, operation: IOperation, isUndo: boolean) => { if (operation.action === "setAttrViewName") { Array.from(protyle.wysiwyg.element.querySelectorAll(`[data-av-id="${operation.id}"]`)).forEach((item: HTMLElement) => { @@ -309,37 +307,31 @@ export const refreshAV = (protyle: IProtyle, operation: IOperation, isUndo: bool titleElement.dataset.title = operation.data; }); } - if (lastParentID === operation.parentID && protyle.contentElement.isSameNode(lastElement)) { - return; - } - lastElement = protyle.contentElement; - lastParentID = operation.parentID; - const avId = operation.avID; - if (operation.action === "setAttrViewColWidth") { - Array.from(protyle.wysiwyg.element.querySelectorAll(`[data-av-id="${avId}"]`)).forEach((item: HTMLElement) => { - const cellElement = item.querySelector(`.av__cell[data-col-id="${operation.id}"]`) as HTMLElement; - if (!cellElement || cellElement.style.width === operation.data) { - return; - } - item.querySelectorAll(".av__row").forEach(rowItem => { - (rowItem.querySelector(`[data-col-id="${operation.id}"]`) as HTMLElement).style.width = operation.data; - }); - }); - } else { - Array.from(protyle.wysiwyg.element.querySelectorAll(`[data-av-id="${avId}"]`)).forEach((item: HTMLElement) => { - item.removeAttribute("data-render"); - const isCurrent = item.querySelector(".av__pulse"); // ctrl+D 后点击添加行 - avRender(item, protyle, () => { - // https://github.com/siyuan-note/siyuan/issues/9599 - if (!isUndo && operation.action === "insertAttrViewBlock" && operation.isDetached && isCurrent) { - popTextCell(protyle, [item.querySelector(`.av__row[data-id="${operation.srcIDs[0]}"] .av__cell[data-detached="true"]`)], "block"); + // 只能 setTimeout,以前方案快速输入后最后一次修改会被忽略 + clearTimeout(refreshTimeout); + refreshTimeout = window.setTimeout(() => { + if (operation.action === "setAttrViewColWidth") { + Array.from(protyle.wysiwyg.element.querySelectorAll(`[data-av-id="${operation.avID}"]`)).forEach((item: HTMLElement) => { + const cellElement = item.querySelector(`.av__cell[data-col-id="${operation.id}"]`) as HTMLElement; + if (!cellElement || cellElement.style.width === operation.data) { + return; } - }, ["addAttrViewView", "duplicateAttrViewView"].includes(operation.action) ? operation.id : - (operation.action === "removeAttrViewView" ? null : undefined)); - }); - } - - setTimeout(() => { - lastParentID = null; - }, Constants.TIMEOUT_TRANSITION); + item.querySelectorAll(".av__row").forEach(rowItem => { + (rowItem.querySelector(`[data-col-id="${operation.id}"]`) as HTMLElement).style.width = operation.data; + }); + }); + } else { + Array.from(protyle.wysiwyg.element.querySelectorAll(`[data-av-id="${operation.avID}"]`)).forEach((item: HTMLElement) => { + item.removeAttribute("data-render"); + const isCurrent = item.querySelector(".av__pulse"); // ctrl+D 后点击添加行 + avRender(item, protyle, () => { + // https://github.com/siyuan-note/siyuan/issues/9599 + if (!isUndo && operation.action === "insertAttrViewBlock" && operation.isDetached && isCurrent) { + popTextCell(protyle, [item.querySelector(`.av__row[data-id="${operation.srcIDs[0]}"] .av__cell[data-detached="true"]`)], "block"); + } + }, ["addAttrViewView", "duplicateAttrViewView"].includes(operation.action) ? operation.id : + (operation.action === "removeAttrViewView" ? null : undefined)); + }); + } + }, 100); };