From 59f3a96e99370154fd90f83eac956bad2d6f18da Mon Sep 17 00:00:00 2001 From: Vanessa Date: Tue, 26 Nov 2024 23:45:32 +0800 Subject: [PATCH] :art: https://github.com/siyuan-note/siyuan/issues/10914 --- app/appearance/langs/zh_CN.json | 1 + app/src/protyle/render/av/relation.ts | 60 +++++++++++++++++++++------ 2 files changed, 49 insertions(+), 12 deletions(-) diff --git a/app/appearance/langs/zh_CN.json b/app/appearance/langs/zh_CN.json index 832e93f6d..fe56f4d06 100644 --- a/app/appearance/langs/zh_CN.json +++ b/app/appearance/langs/zh_CN.json @@ -1,4 +1,5 @@ { + "newRowInRelation": "在 ${x} 中新建行 ${y}", "keyContent": "主键内容", "addDesc": "添加描述", "dataRepoAutoPurgeIndexRetentionDays": "数据快照保留天数", diff --git a/app/src/protyle/render/av/relation.ts b/app/src/protyle/render/av/relation.ts index 727936847..540c104bb 100644 --- a/app/src/protyle/render/av/relation.ts +++ b/app/src/protyle/render/av/relation.ts @@ -8,6 +8,7 @@ import {updateCellsValue} from "./cell"; import {updateAttrViewCellAnimation} from "./action"; import {focusBlock} from "../../util/selection"; import {setPosition} from "../../../util/setPosition"; +import * as dayjs from "dayjs"; const genSearchList = (element: Element, keyword: string, avId?: string, excludes = true, cb?: () => void) => { fetchPost("/api/av/searchAttributeView", { @@ -213,6 +214,11 @@ const genSelectItemHTML = (type: "selected" | "empty" | "unselect", id?: string, `; } if (type === "empty") { + if (id) { + return ``; + } return ``; @@ -234,8 +240,12 @@ const filterItem = (menuElement: Element, cellElement: HTMLElement, keyword: str let html = ""; let selectHTML = ""; const hasIds: string[] = []; + let selectHasShowItem = false; cellElement.querySelectorAll("span").forEach((item) => { hasIds.push(item.dataset.id); + if (item.textContent.indexOf(keyword) > -1) { + selectHasShowItem = true; + } selectHTML += ``; }); 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); } }); - menuElement.querySelector(".b3-menu__items").innerHTML = `${selectHTML || genSelectItemHTML("empty")} + menuElement.querySelector(".b3-menu__items").innerHTML = `${selectHTML} -${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"); }); }; @@ -273,7 +283,7 @@ export const bindRelationEvent = (options: { 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} ${html || genSelectItemHTML("empty")}`; 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[]) => { - const menuElement = hasClosestByClassName(target, "b3-menu__items"); + const menuElement = hasClosestByClassName(target, "b3-menu"); if (!menuElement) { return; } @@ -353,7 +363,7 @@ export const setRelationCell = (protyle: IProtyle, nodeElement: HTMLElement, tar } 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}"]`) || - 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: []}; menuElement.querySelectorAll('[draggable="true"]').forEach(item => { @@ -380,13 +390,7 @@ export const setRelationCell = (protyle: IProtyle, nodeElement: HTMLElement, tar newValue.contents.splice(removeIndex, 1); separatorElement.after(target); 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.contents.push({ type: "block", @@ -401,6 +405,38 @@ export const setRelationCell = (protyle: IProtyle, nodeElement: HTMLElement, tar if (!separatorElement.nextElementSibling) { 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 = ``; + if (!separatorElement.nextElementSibling) { + separatorElement.insertAdjacentHTML("afterend", genSelectItemHTML("empty")); + } } 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");