diff --git a/app/src/protyle/gutter/index.ts b/app/src/protyle/gutter/index.ts index 9a604f23c..36ee04470 100644 --- a/app/src/protyle/gutter/index.ts +++ b/app/src/protyle/gutter/index.ts @@ -231,6 +231,7 @@ export class Gutter { previousID, srcIDs, isDetached: true, + blockID: id, }], [{ action: "removeAttrViewBlock", srcIDs, @@ -803,6 +804,7 @@ export class Gutter { avID, srcIDs: sourceIds, isDetached: false, + blockID: listItemElement.dataset.blockId }], [{ action: "removeAttrViewBlock", srcIDs: sourceIds, @@ -1245,13 +1247,14 @@ export class Gutter { icon: "iconDatabase", click: () => { openSearchAV("", nodeElement as HTMLElement, (listItemElement) => { - const sourceIds: string[] = [nodeElement.getAttribute("data-node-id")]; + const sourceIds: string[] = [id]; const avID = listItemElement.dataset.avId; transaction(protyle, [{ action: "insertAttrViewBlock", avID, srcIDs: sourceIds, isDetached: false, + blockID: listItemElement.dataset.blockId }], [{ action: "removeAttrViewBlock", srcIDs: sourceIds, @@ -1408,7 +1411,8 @@ export class Gutter { label: window.siyuan.languages.export + " CSV", click() { fetchPost("/api/export/exportAttributeView", { - id: nodeElement.getAttribute("data-av-id") + id: nodeElement.getAttribute("data-av-id"), + blockID: id, }, response => { openByMobile(response.data.zip); }); @@ -1705,7 +1709,7 @@ export class Gutter { label: window.siyuan.languages.addToDeck, icon: "iconRiffCard", click() { - makeCard(protyle.app, [nodeElement.getAttribute("data-node-id")]); + makeCard(protyle.app, [id]); } }).element); } diff --git a/app/src/protyle/header/openTitleMenu.ts b/app/src/protyle/header/openTitleMenu.ts index 0a22e8aa6..9b1953dab 100644 --- a/app/src/protyle/header/openTitleMenu.ts +++ b/app/src/protyle/header/openTitleMenu.ts @@ -62,6 +62,7 @@ export const openTitleMenu = (protyle: IProtyle, position: IPosition) => { avID, srcIDs: sourceIds, isDetached: false, + blockID: listItemElement.dataset.nodeId }], [{ action: "removeAttrViewBlock", srcIDs: sourceIds, diff --git a/app/src/protyle/render/av/action.ts b/app/src/protyle/render/av/action.ts index 806f3e665..629ab4fe5 100644 --- a/app/src/protyle/render/av/action.ts +++ b/app/src/protyle/render/av/action.ts @@ -80,6 +80,7 @@ export const avClick = (protyle: IProtyle, event: MouseEvent & { target: HTMLEle avID, srcIDs, isDetached: true, + blockID: blockElement.dataset.nodeId, }], [{ action: "removeAttrViewBlock", srcIDs, @@ -150,6 +151,7 @@ export const avClick = (protyle: IProtyle, event: MouseEvent & { target: HTMLEle previousID, srcIDs, isDetached: true, + blockID: blockElement.dataset.nodeId, }], [{ action: "removeAttrViewBlock", srcIDs, diff --git a/app/src/protyle/render/av/blockAttr.ts b/app/src/protyle/render/av/blockAttr.ts index ed4b4b40f..9bb0fb55f 100644 --- a/app/src/protyle/render/av/blockAttr.ts +++ b/app/src/protyle/render/av/blockAttr.ts @@ -208,11 +208,13 @@ class="fn__flex-1 fn__flex${["url", "text", "number", "email", "phone", "block"] avID: dragBlockElement.dataset.avId, previousID: isBottom ? targetElement.dataset.colId : targetElement.previousElementSibling?.getAttribute("data-col-id"), id: window.siyuan.dragElement.dataset.colId, + blockID: id }, { action: "sortAttrViewCol", avID: dragBlockElement.dataset.avId, previousID: window.siyuan.dragElement.previousElementSibling?.getAttribute("data-col-id"), - id + id, + blockID: id }]); if (isBottom) { targetElement.after(window.siyuan.dragElement); diff --git a/app/src/protyle/render/av/calc.ts b/app/src/protyle/render/av/calc.ts index 82e92b1b3..de8b640e9 100644 --- a/app/src/protyle/render/av/calc.ts +++ b/app/src/protyle/render/av/calc.ts @@ -10,7 +10,8 @@ const calcItem = (options: { colId: string, data?: IAV, // rollup target: HTMLElement, - avId: string + avId: string, + blockID: string }) => { options.menu.addItem({ iconHTML: "", @@ -23,14 +24,16 @@ const calcItem = (options: { id: options.colId, data: { operator: options.operator - } + }, + blockID: options.blockID }], [{ action: "setAttrViewColCalc", avID: options.avId, id: options.colId, data: { operator: options.oldOperator - } + }, + blockID: options.blockID }]); } else { options.target.querySelector(".b3-menu__accelerator").textContent = getNameByOperator(options.operator, true); @@ -71,17 +74,23 @@ const calcItem = (options: { }); }; -export const openCalcMenu = (protyle: IProtyle, calcElement: HTMLElement, data?: IAV, rollupId?: string) => { +export const openCalcMenu = (protyle: IProtyle, calcElement: HTMLElement, panelData?: { + data: IAV, + colId: string, + blockID: string +}) => { let rowElement: HTMLElement | false; let type; let colId; let avId; let oldOperator; - if (data) { - avId = data.id; + let blockID; + if (panelData) { + avId = panelData.data.id; type = calcElement.dataset.colType as TAVCol; oldOperator = calcElement.dataset.calc; - colId = rollupId; + colId = panelData.colId; + blockID = panelData.blockID; } else { const blockElement = hasClosestBlock(calcElement); if (!blockElement) { @@ -96,6 +105,7 @@ export const openCalcMenu = (protyle: IProtyle, calcElement: HTMLElement, data?: colId = calcElement.dataset.colId; avId = blockElement.dataset.avId; oldOperator = calcElement.dataset.operator; + blockID = blockElement.dataset.nodeId; } const menu = new Menu("av-calc", () => { if (rowElement) { @@ -112,7 +122,8 @@ export const openCalcMenu = (protyle: IProtyle, calcElement: HTMLElement, data?: avId, oldOperator, operator: "", - data, + data: panelData?.data, + blockID, target: calcElement }); calcItem({ @@ -122,7 +133,8 @@ export const openCalcMenu = (protyle: IProtyle, calcElement: HTMLElement, data?: avId, oldOperator, operator: "Count all", - data, + data: panelData?.data, + blockID, target: calcElement }); if (type !== "checkbox") { @@ -133,7 +145,8 @@ export const openCalcMenu = (protyle: IProtyle, calcElement: HTMLElement, data?: avId, oldOperator, operator: "Count values", - data, + data: panelData?.data, + blockID, target: calcElement }); calcItem({ @@ -143,7 +156,8 @@ export const openCalcMenu = (protyle: IProtyle, calcElement: HTMLElement, data?: avId, oldOperator, operator: "Count unique values", - data, + data: panelData?.data, + blockID, target: calcElement }); calcItem({ @@ -153,7 +167,8 @@ export const openCalcMenu = (protyle: IProtyle, calcElement: HTMLElement, data?: avId, oldOperator, operator: "Count empty", - data, + data: panelData?.data, + blockID, target: calcElement }); calcItem({ @@ -163,7 +178,8 @@ export const openCalcMenu = (protyle: IProtyle, calcElement: HTMLElement, data?: avId, oldOperator, operator: "Count not empty", - data, + data: panelData?.data, + blockID, target: calcElement }); calcItem({ @@ -173,7 +189,8 @@ export const openCalcMenu = (protyle: IProtyle, calcElement: HTMLElement, data?: avId, oldOperator, operator: "Percent empty", - data, + data: panelData?.data, + blockID, target: calcElement }); calcItem({ @@ -183,7 +200,8 @@ export const openCalcMenu = (protyle: IProtyle, calcElement: HTMLElement, data?: avId, oldOperator, operator: "Percent not empty", - data, + data: panelData?.data, + blockID, target: calcElement }); } else { @@ -194,7 +212,8 @@ export const openCalcMenu = (protyle: IProtyle, calcElement: HTMLElement, data?: avId, oldOperator, operator: "Checked", - data, + data: panelData?.data, + blockID, target: calcElement }); calcItem({ @@ -204,7 +223,8 @@ export const openCalcMenu = (protyle: IProtyle, calcElement: HTMLElement, data?: avId, oldOperator, operator: "Unchecked", - data, + data: panelData?.data, + blockID, target: calcElement }); calcItem({ @@ -214,7 +234,8 @@ export const openCalcMenu = (protyle: IProtyle, calcElement: HTMLElement, data?: avId, oldOperator, operator: "Percent checked", - data, + data: panelData?.data, + blockID, target: calcElement }); calcItem({ @@ -224,7 +245,8 @@ export const openCalcMenu = (protyle: IProtyle, calcElement: HTMLElement, data?: avId, oldOperator, operator: "Percent unchecked", - data, + data: panelData?.data, + blockID, target: calcElement }); } @@ -236,7 +258,8 @@ export const openCalcMenu = (protyle: IProtyle, calcElement: HTMLElement, data?: avId, oldOperator, operator: "Sum", - data, + data: panelData?.data, + blockID, target: calcElement }); calcItem({ @@ -246,7 +269,8 @@ export const openCalcMenu = (protyle: IProtyle, calcElement: HTMLElement, data?: avId, oldOperator, operator: "Average", - data, + data: panelData?.data, + blockID, target: calcElement }); calcItem({ @@ -256,7 +280,8 @@ export const openCalcMenu = (protyle: IProtyle, calcElement: HTMLElement, data?: avId, oldOperator, operator: "Median", - data, + data: panelData?.data, + blockID, target: calcElement }); calcItem({ @@ -266,7 +291,8 @@ export const openCalcMenu = (protyle: IProtyle, calcElement: HTMLElement, data?: avId, oldOperator, operator: "Min", - data, + data: panelData?.data, + blockID, target: calcElement }); calcItem({ @@ -276,7 +302,8 @@ export const openCalcMenu = (protyle: IProtyle, calcElement: HTMLElement, data?: avId, oldOperator, operator: "Max", - data, + data: panelData?.data, + blockID, target: calcElement }); calcItem({ @@ -286,7 +313,8 @@ export const openCalcMenu = (protyle: IProtyle, calcElement: HTMLElement, data?: avId, oldOperator, operator: "Range", - data, + data: panelData?.data, + blockID, target: calcElement }); } else if (["date", "created", "updated"].includes(type)) { @@ -297,7 +325,8 @@ export const openCalcMenu = (protyle: IProtyle, calcElement: HTMLElement, data?: avId, oldOperator, operator: "Earliest", - data, + data: panelData?.data, + blockID, target: calcElement }); calcItem({ @@ -307,7 +336,8 @@ export const openCalcMenu = (protyle: IProtyle, calcElement: HTMLElement, data?: avId, oldOperator, operator: "Latest", - data, + data: panelData?.data, + blockID, target: calcElement }); calcItem({ @@ -317,7 +347,8 @@ export const openCalcMenu = (protyle: IProtyle, calcElement: HTMLElement, data?: avId, oldOperator, operator: "Range", - data, + data: panelData?.data, + blockID, target: calcElement }); } diff --git a/app/src/protyle/render/av/col.ts b/app/src/protyle/render/av/col.ts index d2a757110..67243f228 100644 --- a/app/src/protyle/render/av/col.ts +++ b/app/src/protyle/render/av/col.ts @@ -496,6 +496,7 @@ export const showColMenu = (protyle: IProtyle, blockElement: Element, cellElemen const type = cellElement.getAttribute("data-dtype") as TAVCol; const colId = cellElement.getAttribute("data-col-id"); const avID = blockElement.getAttribute("data-av-id"); + const blockID = blockElement.getAttribute("data-node-id"); const oldValue = cellElement.querySelector(".av__celltext").textContent.trim(); const menu = new Menu("av-header-cell", () => { const newValue = (menu.element.querySelector(".b3-text-field") as HTMLInputElement).value; @@ -598,11 +599,13 @@ export const showColMenu = (protyle: IProtyle, blockElement: Element, cellElemen data: [{ column: colId, order: "ASC" - }] + }], + blockID }], [{ action: "setAttrViewSorts", avID: response.data.id, - data: response.data.view.sorts + data: response.data.view.sorts, + blockID }]); }); } @@ -620,11 +623,13 @@ export const showColMenu = (protyle: IProtyle, blockElement: Element, cellElemen data: [{ column: colId, order: "DESC" - }] + }], + blockID }], [{ action: "setAttrViewSorts", avID: response.data.id, - data: response.data.view.sorts + data: response.data.view.sorts, + blockID }]); }); } @@ -702,12 +707,14 @@ export const showColMenu = (protyle: IProtyle, blockElement: Element, cellElemen action: "setAttrViewColHidden", id: colId, avID, - data: true + data: true, + blockID }], [{ action: "setAttrViewColHidden", id: colId, avID, - data: false + data: false, + blockID }]); } }); @@ -721,12 +728,14 @@ export const showColMenu = (protyle: IProtyle, blockElement: Element, cellElemen action: "setAttrViewColPin", id: colId, avID, - data: !isPin + data: !isPin, + blockID }], [{ action: "setAttrViewColPin", id: colId, avID, - data: isPin + data: isPin, + blockID }]); updateAttrViewCellAnimation(blockElement.querySelector(`.av__row--header .av__cell[data-col-id="${colId}"]`), undefined, {pin: !isPin}); } @@ -779,12 +788,14 @@ export const showColMenu = (protyle: IProtyle, blockElement: Element, cellElemen action: "setAttrViewColWrap", id: colId, avID, - data: inputElement.checked + data: inputElement.checked, + blockID }], [{ action: "setAttrViewColWrap", id: colId, avID, - data: !inputElement.checked + data: !inputElement.checked, + blockID }]); }); } diff --git a/app/src/protyle/render/av/filter.ts b/app/src/protyle/render/av/filter.ts index 246851912..89e7d6e60 100644 --- a/app/src/protyle/render/av/filter.ts +++ b/app/src/protyle/render/av/filter.ts @@ -65,6 +65,7 @@ export const setFilter = async (options: { if (rectTarget.height === 0) { rectTarget = options.protyle.wysiwyg.element.querySelector(`[data-col-id="${options.target.dataset.colId}"]`).getBoundingClientRect(); } + const blockID = options.blockElement.getAttribute("data-node-id") const menu = new Menu("set-filter-" + options.filter.column, () => { const oldFilters = JSON.parse(JSON.stringify(options.data.view.filters)); const selectElement = menu.element.querySelector(".b3-select") as HTMLSelectElement; @@ -153,11 +154,13 @@ export const setFilter = async (options: { transaction(options.protyle, [{ action: "setAttrViewFilters", avID: options.data.id, - data: options.data.view.filters + data: options.data.view.filters, + blockID }], [{ action: "setAttrViewFilters", avID: options.data.id, - data: oldFilters + data: oldFilters, + blockID }]); const menuElement = hasClosestByClassName(options.target, "b3-menu"); if (menuElement) { @@ -408,11 +411,13 @@ export const setFilter = async (options: { transaction(options.protyle, [{ action: "setAttrViewFilters", avID: options.data.id, - data: options.data.view.filters + data: options.data.view.filters, + blockID }], [{ action: "setAttrViewFilters", avID: options.data.id, - data: oldFilters + data: oldFilters, + blockID }]); const menuElement = hasClosestByClassName(options.target, "b3-menu"); if (menuElement) { diff --git a/app/src/protyle/render/av/openMenuPanel.ts b/app/src/protyle/render/av/openMenuPanel.ts index 0602e3d59..f552326e9 100644 --- a/app/src/protyle/render/av/openMenuPanel.ts +++ b/app/src/protyle/render/av/openMenuPanel.ts @@ -51,6 +51,7 @@ export const openMenuPanel = (options: { } window.siyuan.menus.menu.remove(); const avID = options.blockElement.getAttribute("data-av-id"); + const blockID = options.blockElement.getAttribute("data-node-id"); fetchPost("/api/av/renderAttributeView", { id: avID, pageSize: parseInt(options.blockElement.getAttribute("data-page-size")) || undefined, @@ -154,7 +155,7 @@ export const openMenuPanel = (options: { } else { setPosition(menuElement, tabRect.right - menuElement.clientWidth, tabRect.bottom, tabRect.height); if (options.type === "sorts") { - bindSortsEvent(options.protyle, menuElement, data); + bindSortsEvent(options.protyle, menuElement, data, blockID); } else if (options.type === "edit") { bindEditEvent({protyle: options.protyle, data, menuElement, isCustomAttr}); } else if (options.type === "config") { @@ -214,14 +215,16 @@ export const openMenuPanel = (options: { transaction(options.protyle, [{ action: "setAttrViewSorts", avID, - data: changeData + data: changeData, + blockID }], [{ action: "setAttrViewSorts", avID, - data: oldData + data: oldData, + blockID }]); menuElement.innerHTML = getSortsHTML(data.view.columns, data.view.sorts); - bindSortsEvent(options.protyle, menuElement, data); + bindSortsEvent(options.protyle, menuElement, data, blockID); return; } if (targetElement.querySelector('[data-type="removeFilter"]')) { @@ -248,11 +251,13 @@ export const openMenuPanel = (options: { transaction(options.protyle, [{ action: "setAttrViewFilters", avID, - data: changeData + data: changeData, + blockID }], [{ action: "setAttrViewFilters", avID, - data: oldData + data: oldData, + blockID }]); menuElement.innerHTML = getFiltersHTML(data.view); return; @@ -261,11 +266,13 @@ export const openMenuPanel = (options: { 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") }]); @@ -366,11 +373,13 @@ export const openMenuPanel = (options: { avID, previousID: (targetElement.classList.contains("dragover__top") ? targetElement.previousElementSibling?.getAttribute("data-id") : targetElement.getAttribute("data-id")) || "", id: sourceId, + blockID, }], [{ action: "sortAttrViewCol", avID, previousID: sourceElement.previousElementSibling?.getAttribute("data-id") || "", id: sourceId, + blockID }]); let column: IAVColumn; data.view.columns.find((item, index: number) => { @@ -459,7 +468,7 @@ export const openMenuPanel = (options: { break; } else if (type === "goSorts") { menuElement.innerHTML = getSortsHTML(data.view.columns, data.view.sorts); - bindSortsEvent(options.protyle, menuElement, data); + bindSortsEvent(options.protyle, menuElement, data, blockID); setPosition(menuElement, tabRect.right - menuElement.clientWidth, tabRect.bottom, tabRect.height); event.preventDefault(); event.stopPropagation(); @@ -468,15 +477,17 @@ export const openMenuPanel = (options: { transaction(options.protyle, [{ action: "setAttrViewSorts", avID, - data: [] + data: [], + blockID }], [{ action: "setAttrViewSorts", avID, - data: data.view.sorts + data: data.view.sorts, + blockID }]); data.view.sorts = []; menuElement.innerHTML = getSortsHTML(data.view.columns, data.view.sorts); - bindSortsEvent(options.protyle, menuElement, data); + bindSortsEvent(options.protyle, menuElement, data, blockID); setPosition(menuElement, tabRect.right - menuElement.clientWidth, tabRect.bottom, tabRect.height); event.preventDefault(); event.stopPropagation(); @@ -488,7 +499,8 @@ export const openMenuPanel = (options: { menuElement, tabRect, avId: avID, - protyle: options.protyle + protyle: options.protyle, + blockID, }); event.preventDefault(); event.stopPropagation(); @@ -504,14 +516,16 @@ export const openMenuPanel = (options: { transaction(options.protyle, [{ action: "setAttrViewSorts", avID, - data: data.view.sorts + data: data.view.sorts, + blockID }], [{ action: "setAttrViewSorts", avID, - data: oldSorts + data: oldSorts, + blockID }]); menuElement.innerHTML = getSortsHTML(data.view.columns, data.view.sorts); - bindSortsEvent(options.protyle, menuElement, data); + bindSortsEvent(options.protyle, menuElement, data, blockID); setPosition(menuElement, tabRect.right - menuElement.clientWidth, tabRect.bottom, tabRect.height); event.preventDefault(); event.stopPropagation(); @@ -526,11 +540,13 @@ export const openMenuPanel = (options: { transaction(options.protyle, [{ action: "setAttrViewFilters", avID, - data: [] + data: [], + blockID }], [{ action: "setAttrViewFilters", avID, - data: data.view.filters + data: data.view.filters, + blockID }]); data.view.filters = []; menuElement.innerHTML = getFiltersHTML(data.view); @@ -563,11 +579,13 @@ export const openMenuPanel = (options: { transaction(options.protyle, [{ action: "setAttrViewFilters", avID, - data: data.view.filters + data: data.view.filters, + blockID }], [{ action: "setAttrViewFilters", avID, - data: oldFilters + data: oldFilters, + blockID }]); menuElement.innerHTML = getFiltersHTML(data.view); setPosition(menuElement, tabRect.right - menuElement.clientWidth, tabRect.bottom, tabRect.height); @@ -655,12 +673,12 @@ export const openMenuPanel = (options: { transaction(options.protyle, [{ action: "hideAttrViewName", avID, - id: data.viewID, + blockID, data: true }], [{ action: "hideAttrViewName", avID, - id: data.viewID, + blockID, data: false }]); options.blockElement.querySelector(".av__title").classList.add("av__title--hide"); @@ -668,12 +686,12 @@ export const openMenuPanel = (options: { transaction(options.protyle, [{ action: "hideAttrViewName", avID, - id: data.viewID, + blockID, data: false }], [{ action: "hideAttrViewName", avID, - id: data.viewID, + blockID, data: true }]); options.blockElement.querySelector(".av__title").classList.remove("av__title--hide"); @@ -688,11 +706,13 @@ export const openMenuPanel = (options: { action: "duplicateAttrViewView", avID, previousID: data.viewID, - id + id, + blockID }], [{ action: "removeAttrViewView", avID, - id + id, + blockID }]); options.blockElement.setAttribute("custom-sy-av-view", id) avPanelElement.remove(); @@ -706,7 +726,8 @@ export const openMenuPanel = (options: { transaction(options.protyle, [{ action: "removeAttrViewView", avID, - id: data.viewID + id: data.viewID, + blockID }]); } avPanelElement.remove(); @@ -754,13 +775,15 @@ export const openMenuPanel = (options: { action: "setAttrViewColHidden", id: item.id, avID, - data: false + data: false, + blockID, }); undoOperations.push({ action: "setAttrViewColHidden", id: item.id, avID, - data: true + data: true, + blockID }); item.hidden = false; } @@ -782,13 +805,15 @@ export const openMenuPanel = (options: { action: "setAttrViewColHidden", id: item.id, avID, - data: true + data: true, + blockID }); undoOperations.push({ action: "setAttrViewColHidden", id: item.id, avID, - data: false + data: false, + blockID }); item.hidden = true; } @@ -872,7 +897,7 @@ export const openMenuPanel = (options: { event.stopPropagation(); break; } else if (type === "goSearchRollupCalc") { - openCalcMenu(options.protyle, target, data, options.colId); + openCalcMenu(options.protyle, target, {data, colId: options.colId, blockID}); event.preventDefault(); event.stopPropagation(); break; @@ -904,12 +929,14 @@ export const openMenuPanel = (options: { action: "setAttrViewColHidden", id: colId, avID, - data: true + data: true, + blockID }], [{ action: "setAttrViewColHidden", id: colId, avID, - data: false + data: false, + blockID }]); data.view.columns.find((item: IAVColumn) => item.id === colId).hidden = true; if (isEdit) { @@ -934,12 +961,14 @@ export const openMenuPanel = (options: { action: "setAttrViewColHidden", id: colId, avID, - data: false + data: false, + blockID }], [{ action: "setAttrViewColHidden", id: colId, avID, - data: true + data: true, + blockID }]); data.view.columns.find((item: IAVColumn) => item.id === colId).hidden = false; if (isEdit) { diff --git a/app/src/protyle/render/av/row.ts b/app/src/protyle/render/av/row.ts index 70a55c894..094e0f2ee 100644 --- a/app/src/protyle/render/av/row.ts +++ b/app/src/protyle/render/av/row.ts @@ -169,14 +169,17 @@ const updatePageSize = (options: { return; } options.nodeElement.setAttribute("data-page-size", options.newPageSize); + const blockID = options.nodeElement.getAttribute("data-node-id") transaction(options.protyle, [{ action: "setAttrViewPageSize", avID: options.avID, data: parseInt(options.newPageSize), + blockID }], [{ action: "setAttrViewPageSize", data: parseInt(options.currentPageSize), avID: options.avID, + blockID }]); document.querySelector(".av__panel")?.remove(); }; @@ -270,6 +273,7 @@ export const deleteRow = (blockElement: HTMLElement, protyle: IProtyle) => { previousID: item.previousElementSibling?.getAttribute("data-id") || "", srcIDs: [item.getAttribute("data-id")], isDetached: item.querySelector('.av__cell[data-detached="true"]') ? true : false, + blockID: blockElement.dataset.nodeId }); }); transaction(protyle, [{ diff --git a/app/src/protyle/render/av/sort.ts b/app/src/protyle/render/av/sort.ts index 1da774c13..af727019b 100644 --- a/app/src/protyle/render/av/sort.ts +++ b/app/src/protyle/render/av/sort.ts @@ -10,7 +10,8 @@ export const addSort = (options: { menuElement: HTMLElement, tabRect: DOMRect, avId: string, - protyle: IProtyle + protyle: IProtyle, + blockID: string, }) => { const menu = new Menu("av-add-sort"); options.data.view.columns.forEach((column) => { @@ -34,14 +35,16 @@ export const addSort = (options: { transaction(options.protyle, [{ action: "setAttrViewSorts", avID: options.data.id, - data: options.data.view.sorts + data: options.data.view.sorts, + blockID: options.blockID, }], [{ action: "setAttrViewSorts", avID: options.data.id, - data: oldSorts + data: oldSorts, + blockID: options.blockID, }]); options.menuElement.innerHTML = getSortsHTML(options.data.view.columns, options.data.view.sorts); - bindSortsEvent(options.protyle, options.menuElement, options.data); + bindSortsEvent(options.protyle, options.menuElement, options.data, options.blockID); setPosition(options.menuElement, options.tabRect.right - options.menuElement.clientWidth, options.tabRect.bottom, options.tabRect.height); } }); @@ -54,7 +57,7 @@ export const addSort = (options: { }); }; -export const bindSortsEvent = (protyle: IProtyle, menuElement: HTMLElement, data: IAV) => { +export const bindSortsEvent = (protyle: IProtyle, menuElement: HTMLElement, data: IAV, blockID: string) => { menuElement.querySelectorAll("select").forEach((item: HTMLSelectElement) => { item.addEventListener("change", () => { const colId = item.parentElement.getAttribute("data-id"); @@ -73,11 +76,13 @@ export const bindSortsEvent = (protyle: IProtyle, menuElement: HTMLElement, data transaction(protyle, [{ action: "setAttrViewSorts", avID: data.id, - data: data.view.sorts + data: data.view.sorts, + blockID }], [{ action: "setAttrViewSorts", avID: data.id, - data: oldSort + data: oldSort, + blockID }]); }); }); diff --git a/app/src/protyle/render/av/view.ts b/app/src/protyle/render/av/view.ts index b76f1f32f..5cfc5ea2a 100644 --- a/app/src/protyle/render/av/view.ts +++ b/app/src/protyle/render/av/view.ts @@ -48,11 +48,13 @@ export const openViewMenu = (options: { protyle: IProtyle, blockElement: HTMLEle action: "duplicateAttrViewView", avID: options.blockElement.dataset.avId, previousID: options.element.dataset.id, - id + id, + blockID: options.blockElement.dataset.nodeId }], [{ action: "removeAttrViewView", avID: options.blockElement.dataset.avId, - id + id, + blockID: options.blockElement.dataset.nodeId }]); options.blockElement.setAttribute("custom-sy-av-view", id) } @@ -68,7 +70,8 @@ export const openViewMenu = (options: { protyle: IProtyle, blockElement: HTMLEle transaction(options.protyle, [{ action: "removeAttrViewView", avID: options.blockElement.dataset.avId, - id: options.element.dataset.id + id: options.element.dataset.id, + blockID: options.blockElement.dataset.nodeId }]); } } @@ -199,11 +202,13 @@ export const addView = (protyle: IProtyle, blockElement: Element) => { transaction(protyle, [{ action: "addAttrViewView", avID, - id + id, + blockID: blockElement.getAttribute("data-node-id") }], [{ action: "removeAttrViewView", avID, - id + id, + blockID: blockElement.getAttribute("data-node-id") }]); blockElement.setAttribute("custom-sy-av-view", id); }; diff --git a/app/src/protyle/util/editorCommonEvent.ts b/app/src/protyle/util/editorCommonEvent.ts index 49f3f7da3..d0a1a97da 100644 --- a/app/src/protyle/util/editorCommonEvent.ts +++ b/app/src/protyle/util/editorCommonEvent.ts @@ -847,11 +847,13 @@ export const dropEvent = (protyle: IProtyle, editorElement: HTMLElement) => { avID, previousID, id: gutterTypes[2], + blockID: blockElement.dataset.nodeId, }], [{ action: "sortAttrViewCol", avID, previousID: oldPreviousID, id: gutterTypes[2], + blockID: blockElement.dataset.nodeId, }]); } } else if (targetElement.classList.contains("av__row")) { @@ -876,12 +878,14 @@ export const dropEvent = (protyle: IProtyle, editorElement: HTMLElement) => { avID, previousID, id: item, + blockID: blockElement.dataset.nodeId, }); undoOperations.push({ action: "sortAttrViewRow", avID, previousID: undoPreviousId, id: item, + blockID: blockElement.dataset.nodeId, }); }); transaction(protyle, doOperations, undoOperations); @@ -892,6 +896,7 @@ export const dropEvent = (protyle: IProtyle, editorElement: HTMLElement) => { previousID, srcIDs: sourceIds, isDetached: false, + blockID: blockElement.dataset.nodeId }], [{ action: "removeAttrViewBlock", srcIDs: sourceIds, @@ -952,6 +957,7 @@ export const dropEvent = (protyle: IProtyle, editorElement: HTMLElement) => { previousID, srcIDs: ids, isDetached: false, + blockID: blockElement.dataset.nodeId, }], [{ action: "removeAttrViewBlock", srcIDs: ids, diff --git a/app/src/protyle/wysiwyg/index.ts b/app/src/protyle/wysiwyg/index.ts index 476a1311a..566553ab9 100644 --- a/app/src/protyle/wysiwyg/index.ts +++ b/app/src/protyle/wysiwyg/index.ts @@ -412,6 +412,7 @@ export class WYSIWYG { return; } const avId = nodeElement.getAttribute("data-av-id"); + const blockID = nodeElement.dataset.nodeId; const dragElement = target.parentElement; const oldWidth = dragElement.clientWidth; const dragColId = dragElement.getAttribute("data-col-id"); @@ -439,12 +440,14 @@ export class WYSIWYG { action: "setAttrViewColWidth", id: dragColId, avID: avId, - data: newWidth + data: newWidth, + blockID }], [{ action: "setAttrViewColWidth", id: dragColId, avID: avId, - data: oldWidth + "px" + data: oldWidth + "px", + blockID }]); }; this.preventClick = true; diff --git a/app/src/types/index.d.ts b/app/src/types/index.d.ts index da2714c04..a27977ace 100644 --- a/app/src/types/index.d.ts +++ b/app/src/types/index.d.ts @@ -454,6 +454,7 @@ interface IScrollAttr { interface IOperation { action: TOperation, // move, delete 不需要传 data id?: string, + blockID?: string, isTwoWay?: boolean, // 是否双向关联 backRelationKeyID?: string, // 双向关联的目标关联列 ID avID?: string, // av