|
@@ -8,6 +8,7 @@ import {updateCellsValue} from "./cell";
|
|
import {updateAttrViewCellAnimation} from "./action";
|
|
import {updateAttrViewCellAnimation} from "./action";
|
|
import {focusBlock} from "../../util/selection";
|
|
import {focusBlock} from "../../util/selection";
|
|
import {setPosition} from "../../../util/setPosition";
|
|
import {setPosition} from "../../../util/setPosition";
|
|
|
|
+import * as dayjs from "dayjs";
|
|
|
|
|
|
const genSearchList = (element: Element, keyword: string, avId?: string, excludes = true, cb?: () => void) => {
|
|
const genSearchList = (element: Element, keyword: string, avId?: string, excludes = true, cb?: () => void) => {
|
|
fetchPost("/api/av/searchAttributeView", {
|
|
fetchPost("/api/av/searchAttributeView", {
|
|
@@ -213,6 +214,11 @@ const genSelectItemHTML = (type: "selected" | "empty" | "unselect", id?: string,
|
|
<svg class="b3-menu__action"><use xlink:href="#iconMin"></use></svg>`;
|
|
<svg class="b3-menu__action"><use xlink:href="#iconMin"></use></svg>`;
|
|
}
|
|
}
|
|
if (type === "empty") {
|
|
if (type === "empty") {
|
|
|
|
+ if (id) {
|
|
|
|
+ return `<button class="b3-menu__item" data-type="setRelationCell">
|
|
|
|
+ <span class="b3-menu__label">${window.siyuan.languages.newRowInRelation.replace('${x}', text).replace('${y}', id)}</span>
|
|
|
|
+</button>`;
|
|
|
|
+ }
|
|
return `<button class="b3-menu__item">
|
|
return `<button class="b3-menu__item">
|
|
<span class="b3-menu__label">${window.siyuan.languages.emptyContent}</span>
|
|
<span class="b3-menu__label">${window.siyuan.languages.emptyContent}</span>
|
|
</button>`;
|
|
</button>`;
|
|
@@ -234,8 +240,12 @@ const filterItem = (menuElement: Element, cellElement: HTMLElement, keyword: str
|
|
let html = "";
|
|
let html = "";
|
|
let selectHTML = "";
|
|
let selectHTML = "";
|
|
const hasIds: string[] = [];
|
|
const hasIds: string[] = [];
|
|
|
|
+ let selectHasShowItem = false;
|
|
cellElement.querySelectorAll("span").forEach((item) => {
|
|
cellElement.querySelectorAll("span").forEach((item) => {
|
|
hasIds.push(item.dataset.id);
|
|
hasIds.push(item.dataset.id);
|
|
|
|
+ if (item.textContent.indexOf(keyword) > -1) {
|
|
|
|
+ selectHasShowItem = true;
|
|
|
|
+ }
|
|
selectHTML += `<button data-id="${item.dataset.id}" data-type="setRelationCell" class="b3-menu__item${item.textContent.indexOf(keyword) > -1 ? "" : " fn__none"}" draggable="true">${genSelectItemHTML("selected", item.dataset.id, !item.classList.contains("av__celltext--ref"), item.textContent || window.siyuan.languages.untitled)}</button>`;
|
|
selectHTML += `<button data-id="${item.dataset.id}" data-type="setRelationCell" class="b3-menu__item${item.textContent.indexOf(keyword) > -1 ? "" : " fn__none"}" draggable="true">${genSelectItemHTML("selected", item.dataset.id, !item.classList.contains("av__celltext--ref"), item.textContent || window.siyuan.languages.untitled)}</button>`;
|
|
});
|
|
});
|
|
cells.forEach((item) => {
|
|
cells.forEach((item) => {
|
|
@@ -243,9 +253,9 @@ const filterItem = (menuElement: Element, cellElement: HTMLElement, keyword: str
|
|
html += genSelectItemHTML("unselect", item.block.id, item.isDetached, item.block.content || window.siyuan.languages.untitled);
|
|
html += genSelectItemHTML("unselect", item.block.id, item.isDetached, item.block.content || window.siyuan.languages.untitled);
|
|
}
|
|
}
|
|
});
|
|
});
|
|
- menuElement.querySelector(".b3-menu__items").innerHTML = `${selectHTML || genSelectItemHTML("empty")}
|
|
|
|
|
|
+ menuElement.querySelector(".b3-menu__items").innerHTML = `${selectHTML}
|
|
<button class="b3-menu__separator"></button>
|
|
<button class="b3-menu__separator"></button>
|
|
-${html || genSelectItemHTML("empty")}`;
|
|
|
|
|
|
+${html || genSelectItemHTML("empty", selectHasShowItem ? "" : keyword, undefined, menuElement.querySelector(".popover__block").outerHTML)}`;
|
|
menuElement.querySelector(".b3-menu__items .b3-menu__item:not(.fn__none)").classList.add("b3-menu__item--current");
|
|
menuElement.querySelector(".b3-menu__items .b3-menu__item:not(.fn__none)").classList.add("b3-menu__item--current");
|
|
});
|
|
});
|
|
};
|
|
};
|
|
@@ -273,7 +283,7 @@ export const bindRelationEvent = (options: {
|
|
html += genSelectItemHTML("unselect", item.block.id, item.isDetached, item.block.content || window.siyuan.languages.untitled);
|
|
html += genSelectItemHTML("unselect", item.block.id, item.isDetached, item.block.content || window.siyuan.languages.untitled);
|
|
}
|
|
}
|
|
});
|
|
});
|
|
- options.menuElement.querySelector(".b3-menu__items").innerHTML = `${selectHTML || genSelectItemHTML("empty")}
|
|
|
|
|
|
+ options.menuElement.querySelector(".b3-menu__items").innerHTML = `${selectHTML}
|
|
<button class="b3-menu__separator"></button>
|
|
<button class="b3-menu__separator"></button>
|
|
${html || genSelectItemHTML("empty")}`;
|
|
${html || genSelectItemHTML("empty")}`;
|
|
const cellRect = options.cellElements[options.cellElements.length - 1].getBoundingClientRect();
|
|
const cellRect = options.cellElements[options.cellElements.length - 1].getBoundingClientRect();
|
|
@@ -340,7 +350,7 @@ export const getRelationHTML = (data: IAV, cellElements?: HTMLElement[]) => {
|
|
};
|
|
};
|
|
|
|
|
|
export const setRelationCell = (protyle: IProtyle, nodeElement: HTMLElement, target: HTMLElement, cellElements: HTMLElement[]) => {
|
|
export const setRelationCell = (protyle: IProtyle, nodeElement: HTMLElement, target: HTMLElement, cellElements: HTMLElement[]) => {
|
|
- const menuElement = hasClosestByClassName(target, "b3-menu__items");
|
|
|
|
|
|
+ const menuElement = hasClosestByClassName(target, "b3-menu");
|
|
if (!menuElement) {
|
|
if (!menuElement) {
|
|
return;
|
|
return;
|
|
}
|
|
}
|
|
@@ -353,7 +363,7 @@ export const setRelationCell = (protyle: IProtyle, nodeElement: HTMLElement, tar
|
|
}
|
|
}
|
|
if (!nodeElement.contains(cellElements[0])) {
|
|
if (!nodeElement.contains(cellElements[0])) {
|
|
cellElements[0] = (nodeElement.querySelector(`.av__row[data-id="${rowElement.dataset.id}"] .av__cell[data-col-id="${cellElements[0].dataset.colId}"]`) ||
|
|
cellElements[0] = (nodeElement.querySelector(`.av__row[data-id="${rowElement.dataset.id}"] .av__cell[data-col-id="${cellElements[0].dataset.colId}"]`) ||
|
|
- nodeElement.querySelector(`.fn__flex-1[data-col-id="${cellElements[0].dataset.colId}"]`) ) as HTMLElement;
|
|
|
|
|
|
+ nodeElement.querySelector(`.fn__flex-1[data-col-id="${cellElements[0].dataset.colId}"]`)) as HTMLElement;
|
|
}
|
|
}
|
|
const newValue: IAVCellRelationValue = {blockIDs: [], contents: []};
|
|
const newValue: IAVCellRelationValue = {blockIDs: [], contents: []};
|
|
menuElement.querySelectorAll('[draggable="true"]').forEach(item => {
|
|
menuElement.querySelectorAll('[draggable="true"]').forEach(item => {
|
|
@@ -380,13 +390,7 @@ export const setRelationCell = (protyle: IProtyle, nodeElement: HTMLElement, tar
|
|
newValue.contents.splice(removeIndex, 1);
|
|
newValue.contents.splice(removeIndex, 1);
|
|
separatorElement.after(target);
|
|
separatorElement.after(target);
|
|
target.outerHTML = genSelectItemHTML("unselect", targetId, !target.querySelector(".popover__block"), target.querySelector(".b3-menu__label").textContent);
|
|
target.outerHTML = genSelectItemHTML("unselect", targetId, !target.querySelector(".popover__block"), target.querySelector(".b3-menu__label").textContent);
|
|
- if (!separatorElement.previousElementSibling) {
|
|
|
|
- separatorElement.insertAdjacentHTML("beforebegin", genSelectItemHTML("empty"));
|
|
|
|
- }
|
|
|
|
- } else {
|
|
|
|
- if (!separatorElement.previousElementSibling.getAttribute("data-id")) {
|
|
|
|
- separatorElement.previousElementSibling.remove();
|
|
|
|
- }
|
|
|
|
|
|
+ } else if (targetId) {
|
|
newValue.blockIDs.push(targetId);
|
|
newValue.blockIDs.push(targetId);
|
|
newValue.contents.push({
|
|
newValue.contents.push({
|
|
type: "block",
|
|
type: "block",
|
|
@@ -401,6 +405,38 @@ export const setRelationCell = (protyle: IProtyle, nodeElement: HTMLElement, tar
|
|
if (!separatorElement.nextElementSibling) {
|
|
if (!separatorElement.nextElementSibling) {
|
|
separatorElement.insertAdjacentHTML("afterend", genSelectItemHTML("empty"));
|
|
separatorElement.insertAdjacentHTML("afterend", genSelectItemHTML("empty"));
|
|
}
|
|
}
|
|
|
|
+ } else {
|
|
|
|
+ const blockID = target.querySelector(".popover__block").getAttribute("data-id");
|
|
|
|
+ const content = target.querySelector("b").textContent
|
|
|
|
+ const rowId = Lute.NewNodeID();
|
|
|
|
+ transaction(protyle, [{
|
|
|
|
+ action: "insertAttrViewBlock",
|
|
|
|
+ avID: menuElement.firstElementChild.getAttribute("data-av-id"),
|
|
|
|
+ srcs: [{
|
|
|
|
+ id: rowId,
|
|
|
|
+ isDetached: true,
|
|
|
|
+ content
|
|
|
|
+ }],
|
|
|
|
+ blockID,
|
|
|
|
+ }, {
|
|
|
|
+ action: "doUpdateUpdated",
|
|
|
|
+ id: blockID,
|
|
|
|
+ data: dayjs().format("YYYYMMDDHHmmss"),
|
|
|
|
+ }]);
|
|
|
|
+ newValue.blockIDs.push(rowId);
|
|
|
|
+ newValue.contents.push({
|
|
|
|
+ type: "block",
|
|
|
|
+ block: {
|
|
|
|
+ id: rowId,
|
|
|
|
+ content
|
|
|
|
+ },
|
|
|
|
+ isDetached: true
|
|
|
|
+ });
|
|
|
|
+ separatorElement.before(target);
|
|
|
|
+ target.outerHTML = `<button data-id="${rowId}" data-type="setRelationCell" class="b3-menu__item" draggable="true">${genSelectItemHTML("selected", rowId, true, content)}</button>`;
|
|
|
|
+ if (!separatorElement.nextElementSibling) {
|
|
|
|
+ separatorElement.insertAdjacentHTML("afterend", genSelectItemHTML("empty"));
|
|
|
|
+ }
|
|
}
|
|
}
|
|
menuElement.querySelector(".b3-menu__item--current")?.classList.remove("b3-menu__item--current");
|
|
menuElement.querySelector(".b3-menu__item--current")?.classList.remove("b3-menu__item--current");
|
|
menuElement.querySelector(".b3-menu__items .b3-menu__item:not(.fn__none)").classList.add("b3-menu__item--current");
|
|
menuElement.querySelector(".b3-menu__items .b3-menu__item:not(.fn__none)").classList.add("b3-menu__item--current");
|