Andreas/siyuan
1
0
Fork 0
mirror of https://github.com/siyuan-note/siyuan.git synced 2025-12-21 17:10:12 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

✨ https://github.com/siyuan-note/siyuan/issues/8664

Browse source
This commit is contained in:
Vanessa 2023-07-11 00:03:11 +08:00
parent c78cbe067d
commit 42833c6285
3 changed files with 56 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

14
app/src/protyle/render/av/col.ts
View file

@ -170,6 +170,20 @@ export const showColMenu = (protyle: IProtyle, blockElement: HTMLElement, cellEl
} }
} }
}; };
avData.filters.push(filter);
transaction(protyle, [{
action: "setAttrView",
id: avId,
data: {
filters: [filter]
}
}], [{
action: "setAttrView",
id: avId,
data: {
filters: []
}
}]);
} }
setFilter({ setFilter({
filter, filter,

55
app/src/protyle/render/av/filter.ts
View file

@ -64,13 +64,9 @@ export const setFilter = (options: {
return true; return true;
} }
}); });
if (isSame) { if (isSame || !hasMatch) {
return; return;
} }
if (!hasMatch) {
options.data.filters.push(newFilter)
}
transaction(options.protyle, [{ transaction(options.protyle, [{
action: "setAttrView", action: "setAttrView",
id: options.data.id, id: options.data.id,
@ -148,12 +144,42 @@ export const setFilter = (options: {
label: `<input style="margin: 4px 0" value="${options.filter.value[colType].isNotEmpty ? options.filter.value[colType].content : ""}" class="b3-text-field fn__size200">` label: `<input style="margin: 4px 0" value="${options.filter.value[colType].isNotEmpty ? options.filter.value[colType].content : ""}" class="b3-text-field fn__size200">`
}); });
} }
menu.addItem({
icon: "iconTrashcan",
label: window.siyuan.languages.delete,
click() {
const oldFilters = Object.assign([], options.data.filters);
options.data.filters.find((item: IAVFilter, index: number) => {
if (item.column === options.filter.column) {
options.data.filters.splice(index, 1);
return true;
}
});
transaction(options.protyle, [{
action: "setAttrView",
id: options.data.id,
data: {
filters: options.data.filters
}
}], [{
action: "setAttrView",
id: options.data.id,
data: {
filters: oldFilters
}
}]);
const menuElement = hasClosestByClassName(options.target, "b3-menu");
if (menuElement) {
menuElement.innerHTML = getFiltersHTML(options.data);
}
}
});
const selectElement = (window.siyuan.menus.menu.element.querySelector(".b3-select") as HTMLSelectElement); const selectElement = (window.siyuan.menus.menu.element.querySelector(".b3-select") as HTMLSelectElement);
selectElement.addEventListener("change", () => { selectElement.addEventListener("change", () => {
if (selectElement.value === "Is empty" || selectElement.value === "Is not empty") { if (selectElement.value === "Is empty" || selectElement.value === "Is not empty") {
textElement.parentElement.parentElement.classList.add("fn__none"); selectElement.parentElement.parentElement.nextElementSibling.classList.add("fn__none");
} else { } else {
textElement.parentElement.parentElement.classList.remove("fn__none"); selectElement.parentElement.parentElement.nextElementSibling.classList.remove("fn__none");
} }
}); });
const textElement = window.siyuan.menus.menu.element.querySelector(".b3-text-field") as HTMLInputElement; const textElement = window.siyuan.menus.menu.element.querySelector(".b3-text-field") as HTMLInputElement;
@ -169,13 +195,15 @@ export const setFilter = (options: {
} }
}); });
if (selectElement.value === "Is empty" || selectElement.value === "Is not empty") { if (selectElement.value === "Is empty" || selectElement.value === "Is not empty") {
textElement.parentElement.parentElement.classList.add("fn__none"); selectElement.parentElement.parentElement.nextElementSibling.classList.add("fn__none");
} else { } else {
textElement.parentElement.parentElement.classList.remove("fn__none"); selectElement.parentElement.parentElement.nextElementSibling.classList.remove("fn__none");
} }
} }
menu.open({x: rectTarget.left, y: rectTarget.bottom}); menu.open({x: rectTarget.left, y: rectTarget.bottom});
textElement.select(); if (textElement) {
textElement.select();
}
}; };
export const addFilter = (options: { export const addFilter = (options: {
@ -228,13 +256,12 @@ export const addFilter = (options: {
options.menuElement.innerHTML = getFiltersHTML(options.data); options.menuElement.innerHTML = getFiltersHTML(options.data);
setPosition(options.menuElement, options.tabRect.right - options.menuElement.clientWidth, options.tabRect.bottom, options.tabRect.height); setPosition(options.menuElement, options.tabRect.right - options.menuElement.clientWidth, options.tabRect.bottom, options.tabRect.height);
const filterElement = options.menuElement.querySelector(`[data-id="${column.id}"] .b3-chip`) as HTMLElement; const filterElement = options.menuElement.querySelector(`[data-id="${column.id}"] .b3-chip`) as HTMLElement;
const colType = filterElement.getAttribute("data-coltype") as TAVCol;
setFilter({ setFilter({
filter: { filter: {
operator: filterElement.dataset.op as TAVFilterOperator, operator: "Contains",
column: filterElement.parentElement.parentElement.dataset.id, column: column.id,
value: { value: {
[colType]: {content: filterElement.dataset.value} [column.type]: cellValue
} }
}, },
protyle: options.protyle, protyle: options.protyle,

2
app/src/protyle/render/av/render.ts
View file

@ -62,7 +62,7 @@ ${column.wrap ? "" : "white-space: nowrap;"}">
} else if (cell.valueType === "number") { } else if (cell.valueType === "number") {
text = `<span class="av__celltext">${cell.value?.number.content || ""}</span>`; text = `<span class="av__celltext">${cell.value?.number.content || ""}</span>`;
} else if (cell.valueType === "mSelect" || cell.valueType === "select") { } else if (cell.valueType === "mSelect" || cell.valueType === "select") {
cell.value?.mSelect.forEach((item: { content: string, color: string }) => { cell.value?.mSelect?.forEach((item: { content: string, color: string }) => {
text += `<span class="av__celltext"><span class="b3-chip b3-chip--middle" style="background-color:var(--b3-font-background${item.color});color:var(--b3-font-color${item.color})">${item.content}</span></span>`; text += `<span class="av__celltext"><span class="b3-chip b3-chip--middle" style="background-color:var(--b3-font-background${item.color});color:var(--b3-font-color${item.color})">${item.content}</span></span>`;
}); });
if (!text) { if (!text) {