diff --git a/app/src/index.ts b/app/src/index.ts index 99f20a0aa..4ff051a7e 100644 --- a/app/src/index.ts +++ b/app/src/index.ts @@ -2,7 +2,6 @@ import {Constants} from "./constants"; import {Menus} from "./menus"; import {Model} from "./layout/Model"; import {onGetConfig} from "./boot/onGetConfig"; -import "./assets/scss/base.scss"; import {initBlockPopover} from "./block/popover"; import {account} from "./config/account"; import {addScript, addScriptSync} from "./protyle/util/addScript"; @@ -28,6 +27,7 @@ import {updateEditModeElement} from "./layout/topBar"; import {getSearch} from "./util/functions"; import {hideAllElements} from "./protyle/ui/hideElements"; import {loadPlugins} from "./plugin/loader"; +import "./assets/scss/base.scss"; export class App { public plugins: import("./plugin").Plugin[] = []; diff --git a/app/src/protyle/render/av/action.ts b/app/src/protyle/render/av/action.ts index 7a2988a37..c576fdd5a 100644 --- a/app/src/protyle/render/av/action.ts +++ b/app/src/protyle/render/av/action.ts @@ -6,7 +6,7 @@ import {openEditorTab} from "../../../menus/util"; import {copySubMenu} from "../../../menus/commonMenuItem"; import {popTextCell} from "./cell"; -const showHeaderCellMenu = (protyle: IProtyle, blockElement: HTMLElement, cellElement: HTMLElement) => { +export const showHeaderCellMenu = (protyle: IProtyle, blockElement: HTMLElement, cellElement: HTMLElement) => { const type = cellElement.getAttribute("data-dtype") as TAVCol; const menu = new Menu("av-header-cell"); menu.addItem({ @@ -104,7 +104,7 @@ const showHeaderCellMenu = (protyle: IProtyle, blockElement: HTMLElement, cellEl export const avClick = (protyle: IProtyle, event: MouseEvent & { target: HTMLElement }) => { const blockElement = hasClosestBlock(event.target); if (!blockElement) { - return false + return false; } const addElement = hasClosestByAttribute(event.target, "data-type", "av-header-add"); if (addElement) { @@ -126,7 +126,6 @@ export const avClick = (protyle: IProtyle, event: MouseEvent & { target: HTMLEle id, parentID: blockElement.getAttribute("data-av-id"), }]); - addCol(protyle, blockElement, id, type); } }); const addRect = addElement.getBoundingClientRect(); @@ -180,7 +179,7 @@ export const avContextmenu = (protyle: IProtyle, event: MouseEvent & { detail: a const rowId = rowElement.getAttribute("data-id"); const menu = new Menu("av-row"); if (menu.isOpen) { - return true + return true; } rowElement.classList.add("av__row--select"); menu.addItem({ @@ -246,29 +245,6 @@ export const avContextmenu = (protyle: IProtyle, event: MouseEvent & { detail: a return true; }; -const addCol = (protyle: IProtyle, blockElement: HTMLElement, id: string, type: TAVCol) => { - let index = "0"; - blockElement.querySelectorAll(".av__row--header .av__cell").forEach((item) => { - const dataIndex = item.getAttribute("data-index"); - if (dataIndex > index) { - index = dataIndex; - } - }); - blockElement.querySelectorAll(".av__row").forEach((item, index) => { - let html = ""; - if (index === 0) { - html = `
- - Text -
`; - } else { - html = `
`; - } - item.lastElementChild.insertAdjacentHTML("beforebegin", html); - }); - showHeaderCellMenu(protyle, blockElement, blockElement.querySelector(".av__row--header").lastElementChild.previousElementSibling as HTMLElement); -}; - const removeCol = (cellElement: HTMLElement) => { const index = cellElement.getAttribute("data-index"); const blockElement = hasClosestBlock(cellElement); @@ -276,23 +252,6 @@ const removeCol = (cellElement: HTMLElement) => { return false; } blockElement.querySelectorAll(".av__row").forEach((item) => { - item.querySelector(`[data-index="${index}"]`).remove; + item.querySelector(`[data-index="${index}"]`).remove(); }); }; - - -export const addAVRow = (blockElement: HTMLElement, ids: string[], previousID: string) => { - const rowElement = previousID ? blockElement.querySelector(`[data-id=${previousID}]`) : blockElement.querySelector(".av__row--header"); - let html = ""; - ids.forEach((id) => { - html += "
"; - Array.from(rowElement.children).forEach((item: HTMLElement, index) => { - if (index === 0 || index === rowElement.childElementCount - 1) { - return; - } - html += `
"; - }); - rowElement.insertAdjacentHTML("afterend", html); -}; diff --git a/app/src/protyle/util/editorCommonEvent.ts b/app/src/protyle/util/editorCommonEvent.ts index 3ed964e75..6168cb112 100644 --- a/app/src/protyle/util/editorCommonEvent.ts +++ b/app/src/protyle/util/editorCommonEvent.ts @@ -19,7 +19,6 @@ import {uploadLocalFiles} from "../upload"; import {insertHTML} from "./insertHTML"; import {isBrowser} from "../../util/functions"; import {hideElements} from "../ui/hideElements"; -import {addAVRow} from "../render/av/action"; const moveToNew = (protyle: IProtyle, sourceElements: Element[], targetElement: Element, newSourceElement: Element, isSameDoc: boolean, isBottom: boolean, isCopy: boolean) => { @@ -814,7 +813,6 @@ export const dropEvent = (protyle: IProtyle, editorElement: HTMLElement) => { id: targetElement.getAttribute("data-node-id"), parentID: targetElement.getAttribute("data-av-id"), }]); - addAVRow(blockElement, sourceIds, previousID); } return; } diff --git a/app/src/protyle/util/resize.ts b/app/src/protyle/util/resize.ts index c2cf52738..e30ed85d8 100644 --- a/app/src/protyle/util/resize.ts +++ b/app/src/protyle/util/resize.ts @@ -25,7 +25,7 @@ export const resize = (protyle: IProtyle) => { const avHeaderElement = item.firstElementChild.firstElementChild as HTMLElement; avHeaderElement.style.paddingLeft = paddingLeft; avHeaderElement.style.paddingRight = paddingRight; - const avBodyElement = item.querySelector(".av__scroll").firstElementChild as HTMLElement + const avBodyElement = item.querySelector(".av__scroll").firstElementChild as HTMLElement; avBodyElement.style.paddingLeft = paddingLeft; avBodyElement.style.paddingRight = paddingRight; } diff --git a/app/src/protyle/wysiwyg/transaction.ts b/app/src/protyle/wysiwyg/transaction.ts index 743bbdb1c..288090564 100644 --- a/app/src/protyle/wysiwyg/transaction.ts +++ b/app/src/protyle/wysiwyg/transaction.ts @@ -11,13 +11,13 @@ import {onGet} from "../util/onGet"; /// #if !MOBILE import {getAllModels} from "../../layout/getAll"; /// #endif +import {avRender, refreshAV} from "../render/av/render"; import {removeFoldHeading} from "../util/heading"; import {genEmptyElement, genSBElement} from "../../block/util"; import {hideElements} from "../ui/hideElements"; import {reloadProtyle} from "../util/reload"; import {countBlockWord} from "../../layout/status"; import {needSubscribe} from "../../util/needSubscribe"; -import {avRender} from "../render/av/render"; const removeTopElement = (updateElement: Element, protyle: IProtyle) => { // 移动到其他文档中，该块需移除 @@ -289,6 +289,8 @@ const promiseTransaction = () => { // }); // 更新引用块 updateRef(protyle, operation.id); + } else if (["addAttrViewCol", "insertAttrViewBlock"].includes(operation.action)) { + refreshAV(protyle, operation); } }); }); @@ -649,10 +651,10 @@ export const onTransaction = (protyle: IProtyle, operation: IOperation, focus: b }); // 更新 ws 引用块 updateRef(protyle, operation.id); - return; - } - if (operation.action === "append") { + } else if (operation.action === "append") { reloadProtyle(protyle, false); + } else if (["addAttrViewCol", "insertAttrViewBlock"].includes(operation.action)) { + refreshAV(protyle, operation); } };