Something went wrong. Try again.
A privacy-first, self-hosted, fully open source personal knowledge management software, written in typescript and golang. (PERSONAL FORK)
Something went wrong. Try again.
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752import {transaction} from "../../wysiwyg/transaction";import {fetchPost} from "../../../util/fetch";import { addCol, bindEditEvent, duplicateCol, getColIconByType, getColId, getColNameByType, getEditHTML, removeCol} from "./col";import {setPosition} from "../../../util/setPosition";import {hasClosestByAttribute, hasClosestByClassName} from "../../util/hasClosest";import {addColOptionOrCell, bindSelectEvent, getSelectHTML, removeCellOption, setColOption} from "./select";import {addFilter, getFiltersHTML, setFilter} from "./filter";import {addSort, bindSortsEvent, getSortsHTML} from "./sort";import {bindDateEvent, getDateHTML} from "./date";import {formatNumber} from "./number";import {updateAttrViewCellAnimation} from "./action";import {addAssetLink, bindAssetEvent, editAssetItem, getAssetHTML, updateAssetCell} from "./asset";import {Constants} from "../../../constants";import {hideElements} from "../../ui/hideElements";import {isLocalPath, pathPosix} from "../../../util/pathName";import {openEmojiPanel, unicode2Emoji} from "../../../emoji";import {getSearch, isMobile} from "../../../util/functions";/// #if !MOBILEimport {openAsset} from "../../../editor/util";/// #endifimport {previewAttrViewImages} from "../../preview/image";import {assetMenu} from "../../../menus/protyle";import { addView, bindSwitcherEvent, bindViewEvent, getFieldsByData, getSwitcherHTML, getViewHTML, openViewMenu} from "./view";import {focusBlock} from "../../util/selection";import {getFieldIdByCellElement, setPageSize} from "./row";import {bindRelationEvent, getRelationHTML, openSearchAV, setRelationCell, updateRelation} from "./relation";import {bindRollupData, getRollupHTML, goSearchRollupCol} from "./rollup";import {updateCellsValue} from "./cell";import {openCalcMenu} from "./calc";import {escapeAttr, escapeHtml} from "../../../util/escape";import {Dialog} from "../../../dialog";import {bindLayoutEvent, getLayoutHTML, updateLayout} from "./layout";import {setGalleryCover, setGalleryRatio, setGallerySize} from "./gallery/util";import { bindGroupsEvent, bindGroupsNumber, getGroupsHTML, getGroupsMethodHTML, getGroupsNumberHTML, getLanguageByIndex, getPageSize, goGroupsDate, goGroupsSort, setGroupMethod} from "./groups";
export const openMenuPanel = (options: { protyle: IProtyle, blockElement: Element, type: "select" | "properties" | "config" | "sorts" | "filters" | "edit" | "date" | "asset" | "switcher" | "relation" | "rollup", colId?: string, // for edit, rollup // 使用前端构造的数据 editData?: { previousID: string, colData: IAVColumn, }, cellElements?: HTMLElement[], // for select & date & relation & asset cb?: (avPanelElement: Element) => void}) => { let avPanelElement = document.querySelector(".av__panel"); if (avPanelElement) { avPanelElement.remove(); return; } const avID = options.blockElement.getAttribute("data-av-id"); const avPageSize = getPageSize(options.blockElement); fetchPost("/api/av/renderAttributeView", { id: avID, query: options.blockElement.querySelector('[data-type="av-search"]')?.textContent.trim() || "", pageSize: avPageSize.unGroupPageSize, groupPaging: avPageSize.groupPageSize, viewID: options.blockElement.getAttribute(Constants.CUSTOM_SY_AV_VIEW) }, (response) => { avPanelElement = document.querySelector(".av__panel"); if (avPanelElement) { avPanelElement.remove(); return; } window.siyuan.menus.menu.remove(); const blockID = options.blockElement.getAttribute("data-node-id");
const isCustomAttr = !options.blockElement.classList.contains("av"); let data = response.data as IAV; let html; let fields = getFieldsByData(data); if (options.type === "config") { html = getViewHTML(data); } else if (options.type === "properties") { html = getPropertiesHTML(fields); } else if (options.type === "sorts") { html = getSortsHTML(fields, data.view.sorts); } else if (options.type === "switcher") { html = getSwitcherHTML(data.views, data.viewID); } else if (options.type === "filters") { html = getFiltersHTML(data); } else if (options.type === "select") { html = getSelectHTML(fields, options.cellElements, true, options.blockElement); } else if (options.type === "asset") { html = getAssetHTML(options.cellElements); } else if (options.type === "edit") { if (options.editData) { if (typeof options.editData.colData.wrap === "undefined") { options.editData.colData.wrap = data.view.wrapField; } if (options.editData.previousID) { fields.find((item, index) => { if (item.id === options.editData.previousID) { fields.splice(index + 1, 0, options.editData.colData); return true; } }); } else { if (data.viewType === "table") { fields.splice(0, 0, options.editData.colData); } else { fields.push(options.editData.colData); } } } html = getEditHTML({protyle: options.protyle, data, colId: options.colId, isCustomAttr}); } else if (options.type === "date") { html = getDateHTML(options.cellElements); } else if (options.type === "rollup") { html = `<div class="b3-menu__items">${getRollupHTML({data, cellElements: options.cellElements})}</div>`; } else if (options.type === "relation") { html = getRelationHTML(data, options.cellElements); if (!html) { openMenuPanel({ protyle: options.protyle, blockElement: options.blockElement, type: "edit", colId: getColId(options.cellElements[0], data.viewType) }); return; } }
document.body.insertAdjacentHTML("beforeend", `<div class="av__panel" style="z-index: ${++window.siyuan.zIndex};"> <div class="b3-dialog__scrim" data-type="close"></div> <div class="b3-menu" ${["select", "date", "asset", "relation", "rollup"].includes(options.type) ? `style="min-width: 200px;${isMobile() ? "max-width: 90vw;" : "max-width: 50vw;"}"` : ""}>${html}</div></div>`); avPanelElement = document.querySelector(".av__panel"); let closeCB: () => void; const menuElement = avPanelElement.lastElementChild as HTMLElement; let tabRect = options.blockElement.querySelector(`.av__views, .av__row[data-col-id="${options.colId}"] > .block__logo`)?.getBoundingClientRect(); if (["select", "date", "asset", "relation", "rollup"].includes(options.type)) { let lastElement = options.cellElements[options.cellElements.length - 1]; if (!options.blockElement.contains(lastElement)) { // https://github.com/siyuan-note/siyuan/issues/15839 const rowID = getFieldIdByCellElement(lastElement, data.viewType); if (data.viewType === "table") { lastElement = options.blockElement.querySelector(`.av__row[data-id="${rowID}"] .av__cell[data-col-id="${lastElement.dataset.colId}"]`); } else { lastElement = options.blockElement.querySelector(`.av__gallery-item[data-id="${rowID}"] .av__cell[data-field-id="${lastElement.dataset.fieldId}"]`); } } const cellRect = (lastElement || options.cellElements[options.cellElements.length - 1]).getBoundingClientRect();
if (options.type === "select") { bindSelectEvent(options.protyle, data, menuElement, options.cellElements, options.blockElement); } else if (options.type === "date") { closeCB = bindDateEvent({ protyle: options.protyle, data, menuElement, cellElements: options.cellElements, blockElement: options.blockElement }); } else if (options.type === "asset") { bindAssetEvent({ protyle: options.protyle, menuElement, cellElements: options.cellElements, blockElement: options.blockElement }); setTimeout(() => { setPosition(menuElement, cellRect.left, cellRect.bottom, cellRect.height); }, Constants.TIMEOUT_LOAD); // 等待加载 } else if (options.type === "relation") { bindRelationEvent({ menuElement, cellElements: options.cellElements, protyle: options.protyle, blockElement: options.blockElement }); } else if (options.type === "rollup") { bindRollupData({protyle: options.protyle, data, menuElement}); } if (["select", "date", "relation", "rollup"].includes(options.type)) { const inputElement = menuElement.querySelector("input"); if (inputElement) { inputElement.select(); inputElement.focus(); } setPosition(menuElement, cellRect.left, cellRect.bottom, cellRect.height); } } else { setPosition(menuElement, tabRect.right - menuElement.clientWidth, tabRect.bottom, tabRect.height); if (options.type === "sorts") { bindSortsEvent(options.protyle, menuElement, data, blockID); } else if (options.type === "edit") { bindEditEvent({protyle: options.protyle, data, menuElement, isCustomAttr, blockID}); } else if (options.type === "config") { bindViewEvent({protyle: options.protyle, data, menuElement, blockElement: options.blockElement}); } else if (options.type === "switcher") { bindSwitcherEvent({protyle: options.protyle, menuElement, blockElement: options.blockElement}); } } if (options.cb) { options.cb(avPanelElement); } avPanelElement.addEventListener("dragstart", (event: DragEvent) => { window.siyuan.dragElement = event.target as HTMLElement; window.siyuan.dragElement.style.opacity = ".38"; return; }); avPanelElement.addEventListener("drop", (event) => { counter = 0; if (!window.siyuan.dragElement) { event.preventDefault(); event.stopPropagation(); return; } window.siyuan.dragElement.style.opacity = ""; const sourceElement = window.siyuan.dragElement; window.siyuan.dragElement = undefined; if (options.protyle && options.protyle.disabled) { event.preventDefault(); event.stopPropagation(); return; } if (!options.protyle && window.siyuan.config.readonly) { event.preventDefault(); event.stopPropagation(); return; } const targetElement = avPanelElement.querySelector(".dragover__bottom, .dragover__top") as HTMLElement; if (!targetElement) { return; } const isTop = targetElement.classList.contains("dragover__top"); const sourceId = sourceElement.dataset.id; const targetId = targetElement.dataset.id; if (targetElement.querySelector('[data-type="removeSort"]')) { const changeData = data.view.sorts; const oldData = Object.assign([], changeData); let sortFilter: IAVSort; changeData.find((sort, index: number) => { if (sort.column === sourceId) { sortFilter = changeData.splice(index, 1)[0]; return true; } }); changeData.find((sort, index: number) => { if (sort.column === targetId) { if (isTop) { changeData.splice(index, 0, sortFilter); } else { changeData.splice(index + 1, 0, sortFilter); } return true; } });
transaction(options.protyle, [{ action: "setAttrViewSorts", avID, data: changeData, blockID }], [{ action: "setAttrViewSorts", avID, data: oldData, blockID }]); menuElement.innerHTML = getSortsHTML(fields, data.view.sorts); bindSortsEvent(options.protyle, menuElement, data, blockID); return; } if (targetElement.querySelector('[data-type="removeFilter"]')) { const changeData = data.view.filters; const oldData = Object.assign([], changeData); let targetFilter: IAVFilter; changeData.find((filter, index: number) => { if (filter.column === sourceId) { targetFilter = changeData.splice(index, 1)[0]; return true; } }); changeData.find((filter, index: number) => { if (filter.column === targetId) { if (isTop) { changeData.splice(index, 0, targetFilter); } else { changeData.splice(index + 1, 0, targetFilter); } return true; } });
transaction(options.protyle, [{ action: "setAttrViewFilters", avID, data: changeData, blockID }], [{ action: "setAttrViewFilters", avID, data: oldData, blockID }]); menuElement.innerHTML = getFiltersHTML(data); return; } if (targetElement.querySelector('[data-type="av-view-edit"]')) { transaction(options.protyle, [{ action: "sortAttrViewView", avID, blockID, id: sourceId, previousID: isTop ? targetElement.previousElementSibling?.getAttribute("data-id") : targetElement.getAttribute("data-id") }], [{ action: "sortAttrViewView", avID, blockID, id: sourceId, previousID: sourceElement.previousElementSibling?.getAttribute("data-id") }]); if (isTop) { targetElement.before(sourceElement); targetElement.classList.remove("dragover__top"); } else { targetElement.after(sourceElement); targetElement.classList.remove("dragover__bottom"); } return; } if (targetElement.querySelector('[data-type="editAssetItem"]')) { if (isTop) { targetElement.before(sourceElement); } else { targetElement.after(sourceElement); } const replaceValue: IAVCellAssetValue[] = []; Array.from(targetElement.parentElement.children).forEach((item: HTMLElement) => { if (["image", "file"].includes(item.dataset.type)) { replaceValue.push({ content: item.dataset.content, name: item.dataset.name, type: item.dataset.type as "image" | "file", }); } }); updateAssetCell({ protyle: options.protyle, cellElements: options.cellElements, replaceValue, blockElement: options.blockElement }); return; } if (targetElement.querySelector('[data-type="setColOption"]')) { const colId = options.cellElements ? getColId(options.cellElements[0], data.viewType) : menuElement.querySelector(".b3-menu__item").getAttribute("data-col-id"); const changeData = fields.find((column) => column.id === colId).options; const oldData = Object.assign([], changeData); let targetOption: { name: string, color: string }; changeData.find((option, index: number) => { if (option.name === sourceElement.dataset.name) { targetOption = changeData.splice(index, 1)[0]; return true; } }); changeData.find((option, index: number) => { if (option.name === targetElement.dataset.name) { if (isTop) { changeData.splice(index, 0, targetOption); } else { changeData.splice(index + 1, 0, targetOption); } return true; } }); transaction(options.protyle, [{ action: "updateAttrViewColOptions", id: colId, avID, data: changeData, }], [{ action: "updateAttrViewColOptions", id: colId, avID, data: oldData, }]); const oldScroll = menuElement.querySelector(".b3-menu__items").scrollTop; if (options.cellElements) { menuElement.innerHTML = getSelectHTML(fields, options.cellElements, false, options.blockElement); bindSelectEvent(options.protyle, data, menuElement, options.cellElements, options.blockElement); } else { menuElement.innerHTML = getEditHTML({ protyle: options.protyle, data, colId, isCustomAttr }); bindEditEvent({protyle: options.protyle, data, menuElement, isCustomAttr, blockID}); } menuElement.querySelector(".b3-menu__items").scrollTop = oldScroll; return; } if (targetElement.getAttribute("data-type") === "setRelationCell") { if (isTop) { targetElement.before(sourceElement); } else { targetElement.after(sourceElement); } targetElement.classList.remove("dragover__bottom", "dragover__top"); const blockIDs: string[] = []; const contents: IAVCellValue[] = []; targetElement.parentElement.querySelectorAll(".fn__grab").forEach(item => { const dateElement = item.nextElementSibling as HTMLElement; blockIDs.push(dateElement.parentElement.dataset.rowId); contents.push({ isDetached: !dateElement.style.color, type: "block", block: { content: dateElement.textContent, id: dateElement.dataset.id } }); }); updateCellsValue(options.protyle, options.blockElement as HTMLElement, { blockIDs, contents, }, options.cellElements); return; } if (targetElement.getAttribute("data-type") === "editCol") { const previousID = (isTop ? targetElement.previousElementSibling?.getAttribute("data-id") : targetElement.getAttribute("data-id")) || ""; const undoPreviousID = sourceElement.previousElementSibling?.getAttribute("data-id") || ""; if (previousID !== undoPreviousID && previousID !== sourceId) { transaction(options.protyle, [{ action: "sortAttrViewCol", avID, previousID, id: sourceId, blockID, }], [{ action: "sortAttrViewCol", avID, previousID: undoPreviousID, id: sourceId, blockID }]); let column: IAVColumn; fields.find((item, index: number) => { if (item.id === sourceId) { column = fields.splice(index, 1)[0]; return true; } }); fields.find((item, index: number) => { if (item.id === targetId) { if (isTop) { fields.splice(index, 0, column); } else { fields.splice(index + 1, 0, column); } return true; } }); } menuElement.innerHTML = getPropertiesHTML(fields); return; } if (targetElement.querySelector('[data-type="hideGroup"]')) { const previousID = (isTop ? targetElement.previousElementSibling?.getAttribute("data-id") : targetElement.getAttribute("data-id")) || ""; const undoPreviousID = sourceElement.previousElementSibling?.getAttribute("data-id") || ""; if (previousID !== undoPreviousID && previousID !== sourceId) { transaction(options.protyle, [{ action: "sortAttrViewGroup", avID, blockID, previousID, id: sourceId, }], [{ action: "sortAttrViewGroup", avID, blockID, previousID: undoPreviousID, id: sourceId, }]); menuElement.querySelector('[data-type="goGroupsSort"] .b3-menu__accelerator').textContent = getLanguageByIndex(2, "sort"); data.view.group.order = 2; data.view.groups.find((group, index) => { if (group.id === sourceId) { const groupData = data.view.groups.splice(index, 1)[0]; data.view.groups.find((item, index: number) => { if (item.id === targetId) { if (isTop) { data.view.groups.splice(index, 0, groupData); } else { data.view.groups.splice(index + 1, 0, groupData); } return true; } }); return true; } }); if (isTop) { targetElement.before(sourceElement); } else { targetElement.after(sourceElement); } } targetElement.classList.remove("dragover__top", "dragover__bottom"); return; } }); let dragoverElement: HTMLElement; avPanelElement.addEventListener("dragover", (event: DragEvent) => { if (event.dataTransfer.types.includes("Files")) { event.preventDefault(); return; } const target = event.target as HTMLElement; let targetElement = hasClosestByAttribute(target, "draggable", "true"); if (!targetElement) { targetElement = hasClosestByAttribute(document.elementFromPoint(event.clientX, event.clientY - 1), "draggable", "true"); } if (!targetElement || targetElement === window.siyuan.dragElement) { return; } event.preventDefault(); if (dragoverElement && targetElement === dragoverElement) { const nodeRect = targetElement.getBoundingClientRect(); avPanelElement.querySelectorAll(".dragover__bottom, .dragover__top").forEach((item: HTMLElement) => { item.classList.remove("dragover__bottom", "dragover__top"); }); if (event.clientY > nodeRect.top + nodeRect.height / 2) { targetElement.classList.add("dragover__bottom"); } else { targetElement.classList.add("dragover__top"); } return; } dragoverElement = targetElement; }); let counter = 0; avPanelElement.addEventListener("dragleave", () => { counter--; if (counter === 0) { avPanelElement.querySelectorAll(".dragover__bottom, .dragover__top").forEach((item: HTMLElement) => { item.classList.remove("dragover__bottom", "dragover__top"); }); } }); avPanelElement.addEventListener("dragenter", (event) => { event.preventDefault(); counter++; }); avPanelElement.addEventListener("dragend", () => { if (window.siyuan.dragElement) { window.siyuan.dragElement.style.opacity = ""; window.siyuan.dragElement = undefined; } }); avPanelElement.addEventListener("mousedown", (event: MouseEvent & { target: HTMLElement }) => { if (event.button === 1 && !hasClosestByClassName(event.target, "b3-menu")) { document.querySelector(".av__panel").dispatchEvent(new CustomEvent("click", {detail: "close"})); } }); avPanelElement.addEventListener("click", async (event: MouseEvent) => { let type: string; let target = event.target as HTMLElement; if (typeof event.detail === "string") { type = event.detail; } else if (typeof event.detail === "object") { type = (event.detail as { type: string }).type; target = (event.detail as { target: HTMLElement }).target; } while (target && target !== avPanelElement || type) { type = target?.dataset.type || type; if (type === "close") { if (!options.protyle.toolbar.subElement.classList.contains("fn__none")) { // 优先关闭资源文件搜索 hideElements(["util"], options.protyle); } else if (!window.siyuan.menus.menu.element.classList.contains("fn__none")) { // 过滤面板先关闭过滤条件 } else { closeCB?.(); avPanelElement.remove(); setTimeout(() => { focusBlock(options.blockElement); }, Constants.TIMEOUT_TRANSITION); // 单选使用 enter 修改选项后会滚动 } window.siyuan.menus.menu.remove(); event.preventDefault(); event.stopPropagation(); break; } else if (type === "go-config") { menuElement.innerHTML = getViewHTML(data); setPosition(menuElement, tabRect.right - menuElement.clientWidth, tabRect.bottom, tabRect.height); bindViewEvent({protyle: options.protyle, data, menuElement, blockElement: options.blockElement}); window.siyuan.menus.menu.remove(); event.preventDefault(); event.stopPropagation(); break; } else if (type === "go-properties") { // 复制列后点击返回到属性面板，宽度不一致，需重新计算 tabRect = options.blockElement.querySelector(".av__views").getBoundingClientRect(); menuElement.innerHTML = getPropertiesHTML(fields); setPosition(menuElement, tabRect.right - menuElement.clientWidth, tabRect.bottom, tabRect.height); window.siyuan.menus.menu.remove(); event.preventDefault(); event.stopPropagation(); break; } else if (type === "go-layout") { menuElement.innerHTML = getLayoutHTML(data); setPosition(menuElement, tabRect.right - menuElement.clientWidth, tabRect.bottom, tabRect.height); bindLayoutEvent({protyle: options.protyle, data, menuElement, blockElement: options.blockElement}); window.siyuan.menus.menu.remove(); event.preventDefault(); event.stopPropagation(); break; } else if (type === "goSorts") { menuElement.innerHTML = getSortsHTML(fields, data.view.sorts); bindSortsEvent(options.protyle, menuElement, data, blockID); setPosition(menuElement, tabRect.right - menuElement.clientWidth, tabRect.bottom, tabRect.height); window.siyuan.menus.menu.remove(); event.preventDefault(); event.stopPropagation(); break; } else if (type === "removeSorts") { transaction(options.protyle, [{ action: "setAttrViewSorts", avID, data: [], blockID }], [{ action: "setAttrViewSorts", avID, data: data.view.sorts, blockID }]); data.view.sorts = []; menuElement.innerHTML = getSortsHTML(fields, data.view.sorts); bindSortsEvent(options.protyle, menuElement, data, blockID); setPosition(menuElement, tabRect.right - menuElement.clientWidth, tabRect.bottom, tabRect.height); event.preventDefault(); event.stopPropagation(); break; } else if (type === "addSort") { addSort({ data, rect: target.getBoundingClientRect(), menuElement, tabRect, avId: avID, protyle: options.protyle, blockID, }); event.preventDefault(); event.stopPropagation(); break; } else if (type === "removeSort") { const oldSorts = Object.assign([], data.view.sorts); data.view.sorts.find((item: IAVSort, index: number) => { if (item.column === target.parentElement.dataset.id) { data.view.sorts.splice(index, 1); return true; } }); transaction(options.protyle, [{ action: "setAttrViewSorts", avID, data: data.view.sorts, blockID }], [{ action: "setAttrViewSorts", avID, data: oldSorts, blockID }]); menuElement.innerHTML = getSortsHTML(fields, data.view.sorts); bindSortsEvent(options.protyle, menuElement, data, blockID); setPosition(menuElement, tabRect.right - menuElement.clientWidth, tabRect.bottom, tabRect.height); event.preventDefault(); event.stopPropagation(); break; } else if (type === "goFilters") { menuElement.innerHTML = getFiltersHTML(data); setPosition(menuElement, tabRect.right - menuElement.clientWidth, tabRect.bottom, tabRect.height); window.siyuan.menus.menu.remove(); event.preventDefault(); event.stopPropagation(); break; } else if (type === "removeFilters") { transaction(options.protyle, [{ action: "setAttrViewFilters", avID, data: [], blockID }], [{ action: "setAttrViewFilters", avID, data: data.view.filters, blockID }]); data.view.filters = []; menuElement.innerHTML = getFiltersHTML(data); setPosition(menuElement, tabRect.right - menuElement.clientWidth, tabRect.bottom, tabRect.height); window.siyuan.menus.menu.remove(); event.preventDefault(); event.stopPropagation(); break; } else if (type === "addFilter") { addFilter({ data, rect: target.getBoundingClientRect(), menuElement, tabRect, avId: avID, protyle: options.protyle, blockElement: options.blockElement }); event.preventDefault(); event.stopPropagation(); break; } else if (type === "removeFilter") { window.siyuan.menus.menu.remove(); const oldFilters = Object.assign([], data.view.filters); data.view.filters.find((item: IAVFilter, index: number) => { if (item.column === target.parentElement.dataset.id && item.value.type === target.parentElement.dataset.filterType) { data.view.filters.splice(index, 1); return true; } }); transaction(options.protyle, [{ action: "setAttrViewFilters", avID, data: data.view.filters, blockID }], [{ action: "setAttrViewFilters", avID, data: oldFilters, blockID }]); menuElement.innerHTML = getFiltersHTML(data); setPosition(menuElement, tabRect.right - menuElement.clientWidth, tabRect.bottom, tabRect.height); event.preventDefault(); event.stopPropagation(); break; } else if (type === "setFilter") { data.view.filters.find((item: IAVFilter) => { if (item.column === target.parentElement.parentElement.dataset.id && item.value.type === target.parentElement.parentElement.dataset.filterType) { setFilter({ empty: false, filter: item, protyle: options.protyle, data, target, blockElement: options.blockElement }); return true; } }); event.preventDefault(); event.stopPropagation(); break; } else if (type === "numberFormat") { formatNumber({ avPanelElement, element: target, protyle: options.protyle, oldFormat: target.dataset.format, colId: menuElement.querySelector(".b3-menu__item").getAttribute("data-col-id"), avID }); event.preventDefault(); event.stopPropagation(); break; } else if (type === "newCol") { avPanelElement.remove(); const addMenu = addCol(options.protyle, options.blockElement); addMenu.open({ x: tabRect.right, y: tabRect.bottom, h: tabRect.height, isLeft: true }); event.preventDefault(); event.stopPropagation(); break; } else if (type === "update-view-icon") { const rect = target.getBoundingClientRect(); openEmojiPanel("", "av", { x: rect.left, y: rect.bottom + 4, h: rect.height, w: rect.width }, (unicode) => { transaction(options.protyle, [{ action: "setAttrViewViewIcon", avID, id: data.viewID, data: unicode, }], [{ action: "setAttrViewViewIcon", id: data.viewID, avID, data: target.dataset.icon, }]); target.innerHTML = unicode ? unicode2Emoji(unicode) : '<svg style="width: 14px;height: 14px;"><use xlink:href="#iconTable"></use></svg>'; target.dataset.icon = unicode; }, target.querySelector("img")); event.preventDefault(); event.stopPropagation(); break; } else if (type === "set-page-size") { setPageSize({ target, protyle: options.protyle, avID, nodeElement: options.blockElement }); event.preventDefault(); event.stopPropagation(); break; } else if (type === "duplicate-view") { const id = Lute.NewNodeID(); transaction(options.protyle, [{ action: "duplicateAttrViewView", avID, previousID: data.viewID, id, blockID }], [{ action: "removeAttrViewView", avID, id, blockID }]); avPanelElement.remove(); event.preventDefault(); event.stopPropagation(); break; } else if (type === "delete-view") { transaction(options.protyle, [{ action: "removeAttrViewView", avID, id: data.viewID, blockID }]); avPanelElement.remove(); event.preventDefault(); event.stopPropagation(); break; } else if (type === "update-icon") { const rect = target.getBoundingClientRect(); openEmojiPanel("", "av", { x: rect.left, y: rect.bottom + 4, h: rect.height, w: rect.width }, (unicode) => { const colId = menuElement.querySelector(".b3-menu__item").getAttribute("data-col-id"); transaction(options.protyle, [{ action: "setAttrViewColIcon", id: colId, avID, data: unicode, }], [{ action: "setAttrViewColIcon", id: colId, avID, data: target.dataset.icon, }]); target.innerHTML = unicode ? unicode2Emoji(unicode) : `<svg style="height: 14px;width: 14px"><use xlink:href="#${getColIconByType(target.dataset.colType as TAVCol)}"></use></svg>`; if (isCustomAttr) { const iconElement = options.blockElement.querySelector(`.av__row[data-col-id="${colId}"] .block__logoicon`); iconElement.outerHTML = unicode ? unicode2Emoji(unicode, "block__logoicon", true) : `<svg class="block__logoicon"><use xlink:href="#${getColIconByType(iconElement.nextElementSibling.getAttribute("data-type") as TAVCol)}"></use></svg>`; } else { updateAttrViewCellAnimation(options.blockElement.querySelector(`.av__row--header .av__cell[data-col-id="${colId}"]`), undefined, {icon: unicode}); } target.dataset.icon = unicode; }, target.querySelector("img")); event.preventDefault(); event.stopPropagation(); break; } else if (type === "showAllCol") { const doOperations: IOperation[] = []; const undoOperations: IOperation[] = []; fields.forEach((item: IAVColumn) => { if (item.hidden) { doOperations.push({ action: "setAttrViewColHidden", id: item.id, avID, data: false, blockID, }); undoOperations.push({ action: "setAttrViewColHidden", id: item.id, avID, data: true, blockID }); item.hidden = false; } }); if (doOperations.length > 0) { transaction(options.protyle, doOperations, undoOperations); menuElement.innerHTML = getPropertiesHTML(fields); setPosition(menuElement, tabRect.right - menuElement.clientWidth, tabRect.bottom, tabRect.height); } event.preventDefault(); event.stopPropagation(); break; } else if (type === "hideAllCol") { const doOperations: IOperation[] = []; const undoOperations: IOperation[] = []; fields.forEach((item: IAVColumn) => { if (!item.hidden && item.type !== "block") { doOperations.push({ action: "setAttrViewColHidden", id: item.id, avID, data: true, blockID }); undoOperations.push({ action: "setAttrViewColHidden", id: item.id, avID, data: false, blockID }); item.hidden = true; } }); if (doOperations.length > 0) { transaction(options.protyle, doOperations, undoOperations); menuElement.innerHTML = getPropertiesHTML(fields); setPosition(menuElement, tabRect.right - menuElement.clientWidth, tabRect.bottom, tabRect.height); } event.preventDefault(); event.stopPropagation(); break; } else if (type === "editCol") { menuElement.innerHTML = getEditHTML({ protyle: options.protyle, data, colId: target.dataset.id, isCustomAttr }); bindEditEvent({protyle: options.protyle, data, menuElement, isCustomAttr, blockID}); setPosition(menuElement, tabRect.right - menuElement.clientWidth, tabRect.bottom, tabRect.height); event.preventDefault(); event.stopPropagation(); break; } else if (type === "updateColType") { const colId = options.colId || menuElement.querySelector(".b3-menu__item").getAttribute("data-col-id"); if (target.dataset.newType !== target.dataset.oldType) { const nameElement = avPanelElement.querySelector('.b3-text-field[data-type="name"]') as HTMLInputElement; const name = nameElement.value; let newName = name; fields.find((item: IAVColumn) => { if (item.id === colId) { item.type = target.dataset.newType as TAVCol; if (getColNameByType(target.dataset.oldType as TAVCol) === name) { newName = getColNameByType(target.dataset.newType as TAVCol); item.name = newName; } return true; } });
transaction(options.protyle, [{ action: "updateAttrViewCol", id: colId, avID, name: newName, type: target.dataset.newType as TAVCol, }], [{ action: "updateAttrViewCol", id: colId, avID, name, type: target.dataset.oldType as TAVCol, }]);
// 需要取消行号列的筛选和排序 if (target.dataset.newType === "lineNumber") { const sortExist = data.view.sorts.find((sort) => sort.column === colId); if (sortExist) { const oldSorts = Object.assign([], data.view.sorts); const newSorts = data.view.sorts.filter((sort) => sort.column !== colId);
transaction(options.protyle, [{ action: "setAttrViewSorts", avID: data.id, data: newSorts, blockID, }], [{ action: "setAttrViewSorts", avID: data.id, data: oldSorts, blockID, }]); }
const filterExist = data.view.filters.find((filter) => filter.column === colId); if (filterExist) { const oldFilters = JSON.parse(JSON.stringify(data.view.filters)); const newFilters = data.view.filters.filter((filter) => filter.column !== colId);
transaction(options.protyle, [{ action: "setAttrViewFilters", avID: data.id, data: newFilters, blockID }], [{ action: "setAttrViewFilters", avID: data.id, data: oldFilters, blockID }]); } } } menuElement.innerHTML = getEditHTML({ protyle: options.protyle, data, colId, isCustomAttr }); bindEditEvent({protyle: options.protyle, data, menuElement, isCustomAttr, blockID}); setPosition(menuElement, tabRect.right - menuElement.clientWidth, tabRect.bottom, tabRect.height); event.preventDefault(); event.stopPropagation(); break; } else if (type === "goUpdateColType") { const editMenuElement = hasClosestByClassName(target, "b3-menu"); if (editMenuElement) { editMenuElement.firstElementChild.classList.add("fn__none"); editMenuElement.lastElementChild.classList.remove("fn__none"); } setPosition(menuElement, tabRect.right - menuElement.clientWidth, tabRect.bottom, tabRect.height); event.preventDefault(); event.stopPropagation(); break; } else if (type === "goSearchAV") { openSearchAV(avID, target, undefined, false); event.preventDefault(); event.stopPropagation(); break; } else if (type === "goSearchRollupCol") { goSearchRollupCol({ target, data, isRelation: true, protyle: options.protyle, colId: options.colId || menuElement.querySelector(".b3-menu__item").getAttribute("data-col-id") }); event.preventDefault(); event.stopPropagation(); break; } else if (type === "goSearchRollupTarget") { goSearchRollupCol({ target, data, isRelation: false, protyle: options.protyle, colId: options.colId || menuElement.querySelector(".b3-menu__item").getAttribute("data-col-id") }); event.preventDefault(); event.stopPropagation(); break; } else if (type === "goSearchRollupCalc") { openCalcMenu(options.protyle, target, { data, colId: options.colId || menuElement.querySelector(".b3-menu__item").getAttribute("data-col-id"), blockID }); event.preventDefault(); event.stopPropagation(); break; } else if (type === "updateRelation") { updateRelation({ protyle: options.protyle, avElement: avPanelElement, avID, colsData: fields, blockElement: options.blockElement, }); event.preventDefault(); event.stopPropagation(); break; } else if (type === "goEditCol") { const editMenuElement = hasClosestByClassName(target, "b3-menu"); if (editMenuElement) { editMenuElement.firstElementChild.classList.remove("fn__none"); editMenuElement.lastElementChild.classList.add("fn__none"); } setPosition(menuElement, tabRect.right - menuElement.clientWidth, tabRect.bottom, tabRect.height); event.preventDefault(); event.stopPropagation(); break; } else if (type === "hideCol") { const isEdit = menuElement.querySelector('[data-type="go-properties"]'); const colId = isEdit ? menuElement.querySelector(".b3-menu__item").getAttribute("data-col-id") : target.parentElement.getAttribute("data-id"); transaction(options.protyle, [{ action: "setAttrViewColHidden", id: colId, avID, data: true, blockID }], [{ action: "setAttrViewColHidden", id: colId, avID, data: false, blockID }]); fields.find((item: IAVColumn) => item.id === colId).hidden = true; if (isEdit) { menuElement.innerHTML = getEditHTML({ protyle: options.protyle, data, colId, isCustomAttr }); bindEditEvent({protyle: options.protyle, data, menuElement, isCustomAttr, blockID}); } else { menuElement.innerHTML = getPropertiesHTML(fields); } setPosition(menuElement, tabRect.right - menuElement.clientWidth, tabRect.bottom, tabRect.height); event.preventDefault(); event.stopPropagation(); break; } else if (type === "showCol") { const isEdit = menuElement.querySelector('[data-type="go-properties"]'); const colId = isEdit ? menuElement.querySelector(".b3-menu__item").getAttribute("data-col-id") : target.parentElement.getAttribute("data-id"); transaction(options.protyle, [{ action: "setAttrViewColHidden", id: colId, avID, data: false, blockID }], [{ action: "setAttrViewColHidden", id: colId, avID, data: true, blockID }]); fields.find((item: IAVColumn) => item.id === colId).hidden = false; if (isEdit) { menuElement.innerHTML = getEditHTML({ protyle: options.protyle, data, colId, isCustomAttr }); bindEditEvent({protyle: options.protyle, data, menuElement, isCustomAttr, blockID}); } else { menuElement.innerHTML = getPropertiesHTML(fields); } setPosition(menuElement, tabRect.right - menuElement.clientWidth, tabRect.bottom, tabRect.height); event.preventDefault(); event.stopPropagation(); break; } else if (type === "duplicateCol") { duplicateCol({ blockElement: options.blockElement, protyle: options.protyle, colId: menuElement.querySelector(".b3-menu__item").getAttribute("data-col-id"), data, viewID: data.viewID, }); event.preventDefault(); event.stopPropagation(); break; } else if (type === "removeCol") { if (!isCustomAttr) { tabRect = options.blockElement.querySelector(".av__views").getBoundingClientRect(); } const colId = menuElement.querySelector(".b3-menu__item").getAttribute("data-col-id"); const colData = fields.find((item: IAVColumn) => { if (item.id === colId) { return true; } }); const isTwoWay = colData.type === "relation" && colData.relation?.isTwoWay; if (isCustomAttr || isTwoWay) { const dialog = new Dialog({ title: isTwoWay ? window.siyuan.languages.removeColConfirm : window.siyuan.languages.deleteOpConfirm, content: `<div class="b3-dialog__content"> ${isTwoWay ? window.siyuan.languages.confirmRemoveRelationField .replace("${x}", menuElement.querySelector("input").value || window.siyuan.languages._kernel[272]) .replace("${y}", menuElement.querySelector('.b3-menu__item[data-type="goSearchAV"] .b3-menu__accelerator').textContent) .replace("${z}", (menuElement.querySelector('input[data-type="colName"]') as HTMLInputElement).value || window.siyuan.languages._kernel[272]) : window.siyuan.languages.removeCol.replace("${x}", menuElement.querySelector("input").value || window.siyuan.languages._kernel[272])} <div class="fn__hr--b"></div> <button class="fn__block b3-button b3-button--remove" data-action="delete">${isTwoWay ? window.siyuan.languages.removeBothRelationField : window.siyuan.languages.delete}</button> <div class="fn__hr"></div> <button class="fn__block b3-button b3-button--remove${isTwoWay ? "" : " fn__none"}" data-action="keep-relation">${window.siyuan.languages.removeButKeepRelationField}</button> <div class="fn__hr"></div> <button class="fn__block b3-button b3-button--cancel">${window.siyuan.languages.cancel}</button></div>`, width: "520px", }); dialog.element.addEventListener("click", (dialogEvent) => { let target = dialogEvent.target as HTMLElement; const isDispatch = typeof dialogEvent.detail === "string"; while (target && target !== dialog.element || isDispatch) { const action = target.getAttribute("data-action"); if (action === "delete" || (isDispatch && dialogEvent.detail === "Enter")) { removeCol({ protyle: options.protyle, fields, avID, blockID, menuElement, isCustomAttr, blockElement: options.blockElement, avPanelElement, tabRect, isTwoWay: true }); dialog.destroy(); break; } else if (action === "keep-relation") { removeCol({ protyle: options.protyle, fields, avID, blockID, menuElement, isCustomAttr, blockElement: options.blockElement, avPanelElement, tabRect, isTwoWay: false }); dialog.destroy(); break; } else if (target.classList.contains("b3-button--cancel") || (isDispatch && dialogEvent.detail === "Escape")) { dialog.destroy(); break; } target = target.parentElement; } }); dialog.element.setAttribute("data-key", Constants.DIALOG_CONFIRM); } else { removeCol({ protyle: options.protyle, fields, avID, blockID, menuElement, isCustomAttr, blockElement: options.blockElement, avPanelElement, tabRect, isTwoWay: false }); } event.preventDefault(); event.stopPropagation(); break; } else if (type === "setColOption") { setColOption(options.protyle, data, target, options.blockElement, isCustomAttr, options.cellElements); event.preventDefault(); event.stopPropagation(); break; } else if (type === "setRelationCell") { menuElement.querySelector(".b3-menu__item--current")?.classList.remove("b3-menu__item--current"); target.classList.add("b3-menu__item--current"); setRelationCell(options.protyle, options.blockElement as HTMLElement, target, options.cellElements); event.preventDefault(); event.stopPropagation(); break; } else if (type === "addColOptionOrCell") { menuElement.querySelector(".b3-menu__item--current")?.classList.remove("b3-menu__item--current"); target.classList.add("b3-menu__item--current"); if (target.querySelector(".b3-menu__checked")) { removeCellOption(options.protyle, options.cellElements, menuElement.querySelector(`.b3-chips .b3-chip[data-content="${escapeAttr(target.dataset.name)}"]`), options.blockElement); } else { addColOptionOrCell(options.protyle, data, options.cellElements, target, menuElement, options.blockElement); } window.siyuan.menus.menu.remove(); event.preventDefault(); event.stopPropagation(); break; } else if (type === "removeCellOption") { removeCellOption(options.protyle, options.cellElements, target.parentElement, options.blockElement); event.preventDefault(); event.stopPropagation(); break; } else if (type === "addAssetLink") { addAssetLink(options.protyle, options.cellElements, target, options.blockElement); event.preventDefault(); event.stopPropagation(); break; } else if (type === "addAssetExist") { const rect = target.getBoundingClientRect(); assetMenu(options.protyle, { x: rect.right, y: rect.bottom, w: target.parentElement.clientWidth + 8, h: rect.height }, (url, name) => { let value: IAVCellAssetValue; if (Constants.SIYUAN_ASSETS_IMAGE.includes(pathPosix().extname(url).toLowerCase())) { value = { type: "image", content: url, name: "" }; } else { value = { type: "file", content: url, name }; } updateAssetCell({ protyle: options.protyle, cellElements: options.cellElements, addValue: [value], blockElement: options.blockElement }); window.siyuan.menus.menu.remove(); }); event.preventDefault(); event.stopPropagation(); break; } else if (type === "openAssetItem") { const assetType = target.parentElement.dataset.type; const assetLink = target.parentElement.dataset.content; /// #if !MOBILE const suffix = pathPosix().extname(assetLink); if (assetType === "image") { previewAttrViewImages(assetLink, avID, options.blockElement.getAttribute(Constants.CUSTOM_SY_AV_VIEW), options.blockElement.querySelector('[data-type="av-search"]')?.textContent.trim() || ""); } else if (isLocalPath(assetLink) && assetType === "file" && ( (suffix === ".pdf" && !assetLink.startsWith("file://")) || Constants.SIYUAN_ASSETS_AUDIO.concat(Constants.SIYUAN_ASSETS_VIDEO, Constants.SIYUAN_ASSETS_IMAGE).includes(suffix) )) { openAsset(options.protyle.app, assetLink.trim(), parseInt(getSearch("page", assetLink)), "right"); } else { window.open(assetLink); } /// #else if (assetType === "image") { previewAttrViewImages(assetLink, avID, options.blockElement.getAttribute(Constants.CUSTOM_SY_AV_VIEW), options.blockElement.querySelector('[data-type="av-search"]')?.textContent.trim() || ""); } else { window.open(assetLink); } /// #endif event.preventDefault(); event.stopPropagation(); break; } else if (type === "editAssetItem") { editAssetItem({ protyle: options.protyle, cellElements: options.cellElements, blockElement: options.blockElement, content: target.parentElement.dataset.content, type: target.parentElement.dataset.type as "image" | "file", name: target.parentElement.dataset.name, index: parseInt(target.parentElement.dataset.index), rect: target.parentElement.getBoundingClientRect() }); event.preventDefault(); event.stopPropagation(); break; } else if (type === "clearDate") { const colData = fields.find((item: IAVColumn) => { if (item.id === getColId(options.cellElements[0], data.viewType)) { return true; } }); updateCellsValue(options.protyle, options.blockElement as HTMLElement, { isNotEmpty2: false, isNotEmpty: false, content: null, content2: null, hasEndDate: false, isNotTime: colData.date ? !colData.date.fillSpecificTime : true, }, options.cellElements); avPanelElement.remove(); event.preventDefault(); event.stopPropagation(); break; } else if (type === "av-add") { window.siyuan.menus.menu.remove(); addView(options.protyle, options.blockElement); avPanelElement.remove(); event.preventDefault(); event.stopPropagation(); break; } else if (type === "av-view-switch") { if (!target.parentElement.classList.contains("b3-menu__item--current")) { avPanelElement.querySelector(".b3-menu__item--current")?.classList.remove("b3-menu__item--current"); target.parentElement.classList.add("b3-menu__item--current"); transaction(options.protyle, [{ action: "setAttrViewBlockView", blockID, id: target.parentElement.dataset.id, avID }], [{ action: "setAttrViewBlockView", blockID, id: options.blockElement.querySelector(".av__views .item--focus").getAttribute("data-id"), avID }]); } event.preventDefault(); event.stopPropagation(); break; } else if (type === "av-view-edit") { if (target.parentElement.classList.contains("b3-menu__item--current")) { openViewMenu({ protyle: options.protyle, blockElement: options.blockElement as HTMLElement, element: target.parentElement }); } else { avPanelElement.querySelector(".b3-menu__item--current")?.classList.remove("b3-menu__item--current"); target.parentElement.classList.add("b3-menu__item--current"); transaction(options.protyle, [{ action: "setAttrViewBlockView", blockID, id: target.parentElement.dataset.id, avID, }], [{ action: "setAttrViewBlockView", blockID, id: options.blockElement.querySelector(".av__views .item--focus").getAttribute("data-id"), avID, }]); window.siyuan.menus.menu.remove(); openViewMenu({ protyle: options.protyle, blockElement: options.blockElement as HTMLElement, element: target.parentElement }); } event.preventDefault(); event.stopPropagation(); break; } else if (type === "set-gallery-cover") { setGalleryCover({ target, protyle: options.protyle, nodeElement: options.blockElement, view: data.view as IAVGallery }); event.preventDefault(); event.stopPropagation(); break; } else if (type === "set-gallery-size") { setGallerySize({ target, protyle: options.protyle, nodeElement: options.blockElement, view: data.view as IAVGallery }); event.preventDefault(); event.stopPropagation(); break; } else if (type === "set-gallery-ratio") { setGalleryRatio({ target, protyle: options.protyle, nodeElement: options.blockElement, view: data.view as IAVGallery }); event.preventDefault(); event.stopPropagation(); break; } else if (type === "set-layout") { data = await updateLayout({ target, protyle: options.protyle, nodeElement: options.blockElement, data }); fields = getFieldsByData(data); event.preventDefault(); event.stopPropagation(); break; } else if (type === "goGroupsDate") { goGroupsDate({ target, menuElement, protyle: options.protyle, blockElement: options.blockElement, data }); fields = getFieldsByData(data); event.stopPropagation(); event.preventDefault(); break; } else if (type === "goGroupsSort") { goGroupsSort({ target, menuElement, protyle: options.protyle, blockElement: options.blockElement, data }); fields = getFieldsByData(data); event.stopPropagation(); event.preventDefault(); break; } else if (type === "setGroupMethod") { setGroupMethod({ protyle: options.protyle, fieldId: target.getAttribute("data-id"), data, menuElement, blockElement: options.blockElement, }); event.preventDefault(); event.stopPropagation(); break; } else if (type === "goGroups") { if (menuElement.querySelector('[data-type="avGroupRange"]') && closeCB) { await closeCB(); } closeCB = undefined; if ((data.view.group && data.view.group.field) || target.classList.contains("block__icon")) { menuElement.innerHTML = getGroupsHTML(fields, data.view); bindGroupsEvent({ protyle: options.protyle, menuElement: menuElement, blockElement: options.blockElement, data }); } else { menuElement.innerHTML = getGroupsMethodHTML(fields, data.view.group, data.viewType); } setPosition(menuElement, tabRect.right - menuElement.clientWidth, tabRect.bottom, tabRect.height); event.preventDefault(); event.stopPropagation(); break; } else if (type === "goGroupsMethod") { window.siyuan.menus.menu.remove(); menuElement.innerHTML = getGroupsMethodHTML(fields, data.view.group, data.viewType); setPosition(menuElement, tabRect.right - menuElement.clientWidth, tabRect.bottom, tabRect.height); event.preventDefault(); event.stopPropagation(); break; } else if (type === "getGroupsNumber") { window.siyuan.menus.menu.remove(); menuElement.innerHTML = getGroupsNumberHTML(data.view.group); setPosition(menuElement, tabRect.right - menuElement.clientWidth, tabRect.bottom, tabRect.height); closeCB = bindGroupsNumber({ protyle: options.protyle, data, menuElement, blockElement: options.blockElement }); event.preventDefault(); event.stopPropagation(); break; } else if (type === "hideGroup") { window.siyuan.menus.menu.remove(); const useElement = target.firstElementChild; const isHide = useElement.getAttribute("xlink:href") !== "#iconEye"; useElement.setAttribute("xlink:href", isHide ? "#iconEye" : "#iconEyeoff"); let oldGroupHidden; let showCount = 0; data.view.groups.forEach((item) => { if (item.id === target.dataset.id) { oldGroupHidden = item.groupHidden; item.groupHidden = isHide ? 0 : 2; } if (item.groupHidden === 0) { showCount++; } }); target.parentElement.classList[isHide ? "remove" : "add"]("b3-menu__item--hidden"); menuElement.querySelector('[data-type="hideGroups"]').innerHTML = `${window.siyuan.languages[showCount === 0 ? "showAll" : "hideAll"]}<span class="fn__space"></span><svg><use xlink:href="#iconEye${showCount === 0 ? "" : "off"}"></use></svg>`; transaction(options.protyle, [{ action: "hideAttrViewGroup", avID: data.id, blockID, id: target.dataset.id, data: isHide ? 0 : 2, }], [{ action: "hideAttrViewGroup", avID: data.id, blockID, id: target.dataset.id, data: oldGroupHidden }]); event.preventDefault(); event.stopPropagation(); break; } else if (type === "hideGroups") { window.siyuan.menus.menu.remove(); const isShow = target.querySelector("use").getAttribute("xlink:href") === "#iconEyeoff"; target.innerHTML = `${window.siyuan.languages[isShow ? "showAll" : "hideAll"]}<span class="fn__space"></span><svg><use xlink:href="#iconEye${isShow ? "" : "off"}"></use></svg>`; data.view.groups.forEach((item) => { item.groupHidden = isShow ? 2 : 0; const itemElement = target.parentElement.parentElement.querySelector(`.b3-menu__item[data-id="${item.id}"]`); itemElement.classList[isShow ? "add" : "remove"]("b3-menu__item--hidden"); itemElement.querySelector(".b3-menu__action use")?.setAttribute("xlink:href", `#iconEye${isShow ? "off" : ""}`); }); transaction(options.protyle, [{ action: "hideAttrViewAllGroups", avID: data.id, blockID, data: isShow, }], [{ action: "hideAttrViewAllGroups", avID: data.id, blockID, data: !isShow }]); event.preventDefault(); event.stopPropagation(); break; } else if (type === "removeGroups") { window.siyuan.menus.menu.remove(); transaction(options.protyle, [{ action: "removeAttrViewGroup", avID: data.id, blockID, }], [{ action: "setAttrViewGroup", avID: data.id, blockID, data: data.view.group }]); data.view.group = null; delete data.view.groups; menuElement.innerHTML = getGroupsHTML(fields, data.view); setPosition(menuElement, tabRect.right - menuElement.clientWidth, tabRect.bottom, tabRect.height); event.preventDefault(); event.stopPropagation(); break; } // 有错误日志，没找到重现步骤，需先判断一下 if (!target || !target.parentElement) { break; } target = target.parentElement; } }); });};
export const getPropertiesHTML = (fields: IAVColumn[]) => { let showHTML = ""; let hideHTML = ""; fields.forEach((item: IAVColumn) => { if (item.hidden) { hideHTML += `<button class="b3-menu__item" data-type="editCol" draggable="true" data-id="${item.id}"> <svg class="b3-menu__icon fn__grab"><use xlink:href="#iconDrag"></use></svg> <div class="b3-menu__label fn__flex"> ${item.icon ? unicode2Emoji(item.icon, "b3-menu__icon", true) : `<svg class="b3-menu__icon"><use xlink:href="#${getColIconByType(item.type)}"></use></svg>`} ${escapeHtml(item.name) || " "} </div> <svg class="b3-menu__action" data-type="showCol"><use xlink:href="#iconEye"></use></svg> <svg class="b3-menu__icon b3-menu__icon--small"><use xlink:href="#iconRight"></use></svg></button>`; } else { showHTML += `<button class="b3-menu__item" data-type="editCol" draggable="true" data-id="${item.id}"> <svg class="b3-menu__icon fn__grab"><use xlink:href="#iconDrag"></use></svg> <div class="b3-menu__label fn__flex"> ${item.icon ? unicode2Emoji(item.icon, "b3-menu__icon", true) : `<svg class="b3-menu__icon"><use xlink:href="#${getColIconByType(item.type)}"></use></svg>`} ${escapeHtml(item.name) || " "} </div> <svg class="b3-menu__action${item.type === "block" ? " fn__none" : ""}" data-type="hideCol"><use xlink:href="#iconEyeoff"></use></svg> <svg class="b3-menu__icon b3-menu__icon--small"><use xlink:href="#iconRight"></use></svg></button>`; } }); if (hideHTML) { hideHTML = `<button class="b3-menu__separator"></button><button class="b3-menu__item" data-type="nobg"> <span class="b3-menu__label"> ${window.siyuan.languages.hideCol} </span> <span class="block__icon" data-type="showAllCol"> ${window.siyuan.languages.showAll} <span class="fn__space"></span> <svg><use xlink:href="#iconEye"></use></svg> </span></button>${hideHTML}`; } return `<div class="b3-menu__items"><button class="b3-menu__item" data-type="nobg"> <span class="block__icon" style="padding: 8px;margin-left: -4px;" data-type="go-config"> <svg><use xlink:href="#iconLeft"></use></svg> </span> <span class="b3-menu__label ft__center">${window.siyuan.languages.fields}</span></button><button class="b3-menu__separator"></button><button class="b3-menu__item" data-type="nobg"> <span class="b3-menu__label"> ${window.siyuan.languages.showCol} </span> <span class="block__icon" data-type="hideAllCol"> ${window.siyuan.languages.hideAll} <span class="fn__space"></span> <svg><use xlink:href="#iconEyeoff"></use></svg> </span></button>${showHTML}${hideHTML}<button class="b3-menu__separator"></button><button class="b3-menu__item" data-type="newCol"> <svg class="b3-menu__icon"><use xlink:href="#iconAdd"></use></svg> <span class="b3-menu__label">${window.siyuan.languages.new}</span></button></div>`;};