diff --git a/app/src/protyle/render/av/blockAttr.ts b/app/src/protyle/render/av/blockAttr.ts index d5a8b9101..6a95b3d0c 100644 --- a/app/src/protyle/render/av/blockAttr.ts +++ b/app/src/protyle/render/av/blockAttr.ts @@ -136,77 +136,6 @@ const popDateMenu = (dateElement: HTMLElement) => { }); } -const popSelectMenu = (mSelectElement: HTMLElement) => { - const mSelectMenu = new Menu("custom-attr-av-select", () => { - const mSelect: { content: string, color: string }[] = []; - let mSelectHTML = ""; - window.siyuan.menus.menu.element.querySelectorAll(".svg").forEach(item => { - const chipElement = item.parentElement.previousElementSibling.firstElementChild as HTMLElement; - const content = chipElement.textContent.trim(); - const color = chipElement.dataset.color; - mSelect.push({ - content, - color - }); - mSelectHTML += `${content}`; - }); - fetchPost("/api/av/setAttributeViewBlockAttr", { - avID: mSelectElement.dataset.avId, - keyID: mSelectElement.dataset.colId, - rowID: mSelectElement.dataset.blockId, - cellID: mSelectElement.dataset.id, - value: { - mSelect - } - }); - mSelectElement.innerHTML = mSelectHTML; - }); - if (mSelectMenu.isOpen) { - return; - } - const names: string[] = []; - mSelectElement.querySelectorAll(".b3-chip").forEach(item => { - names.push(item.textContent.trim()); - }); - JSON.parse(mSelectElement.dataset.options || "").forEach((item: { name: string, color: string }) => { - mSelectMenu.addItem({ - iconHTML: "", - label: ` - ${item.name} -`, - accelerator: names.includes(item.name) ? '' : Constants.ZWSP, - click(element) { - const acceleratorElement = element.querySelector(".b3-menu__accelerator"); - if (mSelectElement.dataset.type === "select") { - window.siyuan.menus.menu.element.querySelectorAll(".b3-menu__accelerator").forEach(itemElement => { - if (itemElement.isSameNode(acceleratorElement)) { - if (acceleratorElement.querySelector("svg")) { - acceleratorElement.innerHTML = ""; - } else { - acceleratorElement.innerHTML = ''; - } - } else { - itemElement.innerHTML = ""; - } - }); - return false; - } - if (acceleratorElement.querySelector("svg")) { - acceleratorElement.innerHTML = ""; - } else { - acceleratorElement.innerHTML = ''; - } - return true; - } - }); - }); - const mSelecttRect = mSelectElement.getBoundingClientRect(); - mSelectMenu.open({ - x: mSelecttRect.left, - y: mSelecttRect.bottom - }); -} - export const renderAVAttribute = (element: HTMLElement, id: string, protyle?: IProtyle) => { fetchPost("/api/av/getAttributeViewKeys", {id}, (response) => { let html = ""; @@ -252,7 +181,7 @@ class="fn__flex-1 fn__flex${["url", "text", "number", "email", "phone"].includes } const mSelectElement = hasClosestByAttribute(target, "data-type", "select") || hasClosestByAttribute(target, "data-type", "mSelect"); if (mSelectElement) { - popSelectMenu(mSelectElement); + popTextCell(protyle, [mSelectElement], mSelectElement.getAttribute("data-type") as TAVCol); event.stopPropagation(); event.preventDefault(); return; diff --git a/app/src/protyle/render/av/select.ts b/app/src/protyle/render/av/select.ts index ed27558df..6fe8dd1de 100644 --- a/app/src/protyle/render/av/select.ts +++ b/app/src/protyle/render/av/select.ts @@ -5,6 +5,7 @@ import {confirmDialog} from "../../../dialog/confirmDialog"; import {upDownHint} from "../../../util/upDownHint"; import {bindEditEvent, getEditHTML} from "./col"; import {updateAttrViewCellAnimation} from "./action"; +import {genAVValueHTML} from "./blockAttr"; const filterSelectHTML = (key: string, options: { name: string, color: string }[]) => { let html = ""; @@ -98,7 +99,11 @@ export const removeCellOption = (protyle: IProtyle, data: IAV, cellElements: HTM mSelect: oldValue } }); - updateAttrViewCellAnimation(item); + if (item.classList.contains("custom-attr__avvalue")) { + item.innerHTML = genAVValueHTML(cellData.value); + } else { + updateAttrViewCellAnimation(item); + } }); transaction(protyle, doOperations, undoOperations); target.remove(); @@ -161,6 +166,11 @@ export const setColOption = (protyle: IProtyle, data: IAV, target: HTMLElement, return true; } }); + if (cellElement.classList.contains("custom-attr__avvalue")) { + cellElement.innerHTML = genAVValueHTML(cell.value); + } else { + updateAttrViewCellAnimation(cellElement); + } return true; } }); @@ -234,6 +244,11 @@ export const setColOption = (protyle: IProtyle, data: IAV, target: HTMLElement, return true; } }); + if (cellElement.classList.contains("custom-attr__avvalue")) { + cellElement.innerHTML = genAVValueHTML(cell.value); + } else { + updateAttrViewCellAnimation(cellElement); + } return true; } }); @@ -309,6 +324,11 @@ export const setColOption = (protyle: IProtyle, data: IAV, target: HTMLElement, return true; } }); + if (cellElement.classList.contains("custom-attr__avvalue")) { + cellElement.innerHTML = genAVValueHTML(cell.value); + } else { + updateAttrViewCellAnimation(cellElement); + } return true; } }); @@ -394,7 +414,7 @@ export const addColOptionOrCell = (protyle: IProtyle, data: IAV, cellElements: H } const colId = cellElements[0].dataset.colId; - let cellIndex = 0; + let cellIndex: number; Array.from(cellElements[0].parentElement.querySelectorAll(".av__cell")).find((item: HTMLElement, index) => { if (item.dataset.id === cellElements[0].dataset.id) { cellIndex = index; @@ -420,11 +440,19 @@ export const addColOptionOrCell = (protyle: IProtyle, data: IAV, cellElements: H const rowID = item.parentElement.dataset.id; data.view.rows.find(row => { if (row.id === rowID) { - cellData = row.cells[cellIndex]; - // 为空时 cellId 每次请求都不一致 - cellData.id = item.dataset.id; - if (!cellData.value || !cellData.value.mSelect) { - cellData.value = {mSelect: []} as IAVCellValue; + if (typeof cellIndex === "number") { + cellData = row.cells[cellIndex]; + // 为空时 cellId 每次请求都不一致 + cellData.id = item.dataset.id; + if (!cellData.value || !cellData.value.mSelect) { + cellData.value = {mSelect: []} as IAVCellValue; + } + } else { + cellData = row.cells.find(cellItem => { + if (cellItem.id === item.dataset.id) { + return true; + } + }); } return true; } @@ -479,7 +507,11 @@ export const addColOptionOrCell = (protyle: IProtyle, data: IAV, cellElements: H [colData.type]: oldValue } }); - updateAttrViewCellAnimation(item); + if (item.classList.contains("custom-attr__avvalue")) { + item.innerHTML = genAVValueHTML(cellData.value); + } else { + updateAttrViewCellAnimation(item); + } }); if (currentElement.querySelector(".b3-menu__accelerator")) {