diff --git a/app/src/protyle/render/av/filter.ts b/app/src/protyle/render/av/filter.ts index 48a2eca00..531508f40 100644 --- a/app/src/protyle/render/av/filter.ts +++ b/app/src/protyle/render/av/filter.ts @@ -69,14 +69,14 @@ export const setFilter = async (options: { 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; + if (!selectElement || !selectElement.value) { + return; + } const newFilter: IAVFilter = { column: options.filter.column, value: undefined, operator: selectElement.value as TAVFilterOperator }; - if (!selectElement || !newFilter.operator) { - return; - } let hasMatch = false; if (textElements.length > 0) { if (["date", "updated", "created"].includes(filterType)) { diff --git a/app/src/protyle/render/av/relation.ts b/app/src/protyle/render/av/relation.ts index 3daedebfd..e46faca9b 100644 --- a/app/src/protyle/render/av/relation.ts +++ b/app/src/protyle/render/av/relation.ts @@ -231,27 +231,11 @@ const genSelectItemHTML = (type: "selected" | "empty" | "unselect", id?: string, } }; -const filterItem = (listElement: Element, key: string) => { - Array.from(listElement.children).forEach((item: HTMLElement) => { - if (item.dataset.id) { - if (item.textContent.includes(key)) { - item.classList.remove("fn__none"); - } else { - item.classList.add("fn__none"); - } - } - }); -}; - -export const bindRelationEvent = (options: { - menuElement: HTMLElement, - protyle: IProtyle, - blockElement: Element, - cellElements: HTMLElement[] -}) => { - const hasIds = options.menuElement.firstElementChild.getAttribute("data-cell-ids").split(","); +const filterItem = (menuElement: Element, keyword: string) => { + const hasIds = menuElement.firstElementChild.getAttribute("data-cell-ids").split(","); fetchPost("/api/av/getAttributeViewPrimaryKeyValues", { - id: options.menuElement.firstElementChild.getAttribute("data-av-id"), + id: menuElement.firstElementChild.getAttribute("data-av-id"), + keyword, }, response => { const cells = response.data.rows.values as IAVCellValue[]; let html = ""; @@ -271,17 +255,45 @@ export const bindRelationEvent = (options: { html += genSelectItemHTML("unselect", item.block.id, item.isDetached, item.block.content || "Untitled"); } }); - options.menuElement.innerHTML = `
-
-
${response.data.name}
- -
-
-
- ${selectHTML || genSelectItemHTML("empty")} - - ${html || genSelectItemHTML("empty")} -
`; + menuElement.querySelector(".b3-menu__items").innerHTML = `${selectHTML || genSelectItemHTML("empty")} + +${html || genSelectItemHTML("empty")}`; + }); +}; + +export const bindRelationEvent = (options: { + menuElement: HTMLElement, + protyle: IProtyle, + blockElement: Element, + cellElements: HTMLElement[] +}) => { + const hasIds = options.menuElement.firstElementChild.getAttribute("data-cell-ids").split(","); + fetchPost("/api/av/getAttributeViewPrimaryKeyValues", { + id: options.menuElement.firstElementChild.getAttribute("data-av-id"), + keyword: "", + }, response => { + const cells = response.data.rows.values as IAVCellValue[]; + let html = ""; + let selectHTML = ""; + hasIds.forEach(hasId => { + if (hasId) { + cells.find((item) => { + if (item.block.id === hasId) { + selectHTML += genSelectItemHTML("selected", item.block.id, item.isDetached, item.block.content || "Untitled"); + return true; + } + }); + } + }); + cells.forEach((item) => { + if (!hasIds.includes(item.block.id)) { + html += genSelectItemHTML("unselect", item.block.id, item.isDetached, item.block.content || "Untitled"); + } + }); + options.menuElement.querySelector(".b3-menu__label").innerHTML = response.data.name; + options.menuElement.querySelector(".b3-menu__items").innerHTML = `${selectHTML || genSelectItemHTML("empty")} + +${html || genSelectItemHTML("empty")}`; const cellRect = options.cellElements[options.cellElements.length - 1].getBoundingClientRect(); setPosition(options.menuElement, cellRect.left, cellRect.bottom, cellRect.height); options.menuElement.querySelector(".b3-menu__items .b3-menu__item").classList.add("b3-menu__item--current"); @@ -309,12 +321,12 @@ export const bindRelationEvent = (options: { if (event.isComposing) { return; } - filterItem(listElement, inputElement.value); + filterItem(options.menuElement, inputElement.value); event.stopPropagation(); }); inputElement.addEventListener("compositionend", (event) => { event.stopPropagation(); - filterItem(listElement, inputElement.value); + filterItem(options.menuElement, inputElement.value); }); }); }; @@ -394,5 +406,6 @@ export const setRelationCell = (protyle: IProtyle, nodeElement: HTMLElement, tar } menuElement.firstElementChild.classList.add("b3-menu__item--current"); } + menuElement.parentElement.setAttribute("data-cell-ids", newValue.blockIDs.join(",")); updateCellsValue(protyle, nodeElement, newValue, cellElements); };