Vanessa 2023-12-25 00:20:51 +08:00
parent 5c53e3c9b2
commit ac3145976f
5 changed files with 58 additions and 43 deletions

View file

@ -67,6 +67,11 @@ export const genAVValueHTML = (value: IAVCellValue) => {
<span class="fn__space"></span> <span class="fn__space"></span>
<a href="mailto:${value.email.content}" target="_blank" aria-label="${window.siyuan.languages.openBy}" class="block__icon block__icon--show fn__flex-center b3-tooltips__w b3-tooltips"><svg><use xlink:href="#iconEmail"></use></svg></a>`; <a href="mailto:${value.email.content}" target="_blank" aria-label="${window.siyuan.languages.openBy}" class="block__icon block__icon--show fn__flex-center b3-tooltips__w b3-tooltips"><svg><use xlink:href="#iconEmail"></use></svg></a>`;
break; break;
case "relation":
value.relation?.blockIDs.forEach((item, index) => {
html += `<span class="av__celltext--url" style="margin-right: 8px" data-id="${item}">${value.relation?.contents[index]}</span>`;
});
break;
} }
return html; return html;
}; };
@ -117,34 +122,36 @@ class="fn__flex-1 fn__flex${["url", "text", "number", "email", "phone"].includes
}); });
element.innerHTML = html; element.innerHTML = html;
element.addEventListener("click", (event) => { element.addEventListener("click", (event) => {
const target = event.target as HTMLElement; let target = event.target as HTMLElement;
const dateElement = hasClosestByAttribute(target, "data-type", "date"); while (target && !element.isSameNode(target)) {
if (dateElement) { const type = target.getAttribute("data-type");
popTextCell(protyle, [dateElement], "date"); if (type === "date") {
popTextCell(protyle, [target], "date");
event.stopPropagation(); event.stopPropagation();
event.preventDefault(); event.preventDefault();
return; break
} else if (type === "select" || type === "mSelect") {
popTextCell(protyle, [target], target.getAttribute("data-type") as TAVCol);
event.stopPropagation();
event.preventDefault();
break
} else if (type === "mAsset") {
popTextCell(protyle, [target], "mAsset");
event.stopPropagation();
event.preventDefault();
break
} else if (type === "checkbox") {
popTextCell(protyle, [target], "checkbox");
event.stopPropagation();
event.preventDefault();
break
} else if (type === "relation") {
popTextCell(protyle, [target], "relation");
event.stopPropagation();
event.preventDefault();
break
} }
const mSelectElement = hasClosestByAttribute(target, "data-type", "select") || hasClosestByAttribute(target, "data-type", "mSelect"); target = target.parentElement;
if (mSelectElement) {
popTextCell(protyle, [mSelectElement], mSelectElement.getAttribute("data-type") as TAVCol);
event.stopPropagation();
event.preventDefault();
return;
}
const mAssetElement = hasClosestByAttribute(target, "data-type", "mAsset");
if (mAssetElement) {
popTextCell(protyle, [mAssetElement], "mAsset");
event.stopPropagation();
event.preventDefault();
return;
}
const checkboxElement = hasClosestByAttribute(target, "data-type", "checkbox");
if (checkboxElement) {
popTextCell(protyle, [checkboxElement], "checkbox");
event.stopPropagation();
event.preventDefault();
return;
} }
}); });
element.querySelectorAll(".b3-text-field--text").forEach((item: HTMLInputElement) => { element.querySelectorAll(".b3-text-field--text").forEach((item: HTMLInputElement) => {

View file

@ -9,6 +9,7 @@ import {focusBlock} from "../../util/selection";
import * as dayjs from "dayjs"; import * as dayjs from "dayjs";
import {unicode2Emoji} from "../../../emoji"; import {unicode2Emoji} from "../../../emoji";
import {getColIconByType} from "./col"; import {getColIconByType} from "./col";
import {genAVValueHTML} from "./blockAttr";
export const getCellText = (cellElement: HTMLElement | false) => { export const getCellText = (cellElement: HTMLElement | false) => {
if (!cellElement) { if (!cellElement) {
@ -479,14 +480,18 @@ const updateCellValueByInput = (protyle: IProtyle, type: TAVCol, cellElements: H
}); });
}; };
export const updateCellsValue = (protyle: IProtyle, nodeElement: HTMLElement, value: string | any = "") => { export const updateCellsValue = (protyle: IProtyle, nodeElement: HTMLElement, value: string | any = "", cElements?: HTMLElement[]) => {
const doOperations: IOperation[] = []; const doOperations: IOperation[] = [];
const undoOperations: IOperation[] = []; const undoOperations: IOperation[] = [];
const avID = nodeElement.dataset.avId; const avID = nodeElement.dataset.avId;
const id = nodeElement.dataset.nodeId; const id = nodeElement.dataset.nodeId;
let text = ""; let text = "";
const cellElements: Element[] = Array.from(nodeElement.querySelectorAll(".av__cell--select")) || []; let cellElements: Element[];
if (cElements?.length > 0) {
cellElements = cElements;
} else {
cellElements = Array.from(nodeElement.querySelectorAll(".av__cell--select"));
if (cellElements.length === 0) { if (cellElements.length === 0) {
nodeElement.querySelectorAll(".av__row--select:not(.av__row--header)").forEach(rowElement => { nodeElement.querySelectorAll(".av__row--select:not(.av__row--header)").forEach(rowElement => {
rowElement.querySelectorAll(".av__cell").forEach(cellElement => { rowElement.querySelectorAll(".av__cell").forEach(cellElement => {
@ -494,12 +499,14 @@ export const updateCellsValue = (protyle: IProtyle, nodeElement: HTMLElement, va
}); });
}); });
} }
}
cellElements.forEach((item: HTMLElement) => { cellElements.forEach((item: HTMLElement) => {
const rowElement = hasClosestByClassName(item, "av__row"); const rowElement = hasClosestByClassName(item, "av__row");
if (!rowElement) { if (!rowElement) {
return; return;
} }
const type = getTypeByCellElement(item); const type = getTypeByCellElement(item) || item.dataset.type;
if (["created", "updated", "template"].includes(type)) { if (["created", "updated", "template"].includes(type)) {
return; return;
} }
@ -527,6 +534,8 @@ export const updateCellsValue = (protyle: IProtyle, nodeElement: HTMLElement, va
}); });
if (!hasClosestByClassName(cellElements[0], "custom-attr")) { if (!hasClosestByClassName(cellElements[0], "custom-attr")) {
updateAttrViewCellAnimation(item, cellValue); updateAttrViewCellAnimation(item, cellValue);
} else {
item.innerHTML = genAVValueHTML(cellValue)
} }
}); });
if (doOperations.length > 0) { if (doOperations.length > 0) {

View file

@ -35,7 +35,7 @@ export const avKeydown = (event: KeyboardEvent, nodeElement: HTMLElement, protyl
return true; return true;
} }
if (event.key === "Backspace") { if (event.key === "Backspace") {
updateCellsValue(protyle, nodeElement); updateCellsValue(protyle, nodeElement, undefined, [selectCellElement]);
event.preventDefault(); event.preventDefault();
return true; return true;
} }

View file

@ -313,7 +313,7 @@ export const openMenuPanel = (options: {
targetElement.after(sourceElement); targetElement.after(sourceElement);
} }
targetElement.classList.remove("dragover__bottom", "dragover__top"); targetElement.classList.remove("dragover__bottom", "dragover__top");
setRelationCell(options.protyle, options.blockElement as HTMLElement, sourceElement.parentElement); setRelationCell(options.protyle, options.blockElement as HTMLElement, sourceElement.parentElement, options.cellElements);
return; return;
} }
@ -879,7 +879,7 @@ export const openMenuPanel = (options: {
event.stopPropagation(); event.stopPropagation();
break; break;
} else if (type === "setRelationCell") { } else if (type === "setRelationCell") {
setRelationCell(options.protyle, options.blockElement as HTMLElement, target); setRelationCell(options.protyle, options.blockElement as HTMLElement, target, options.cellElements);
event.preventDefault(); event.preventDefault();
event.stopPropagation(); event.stopPropagation();
break; break;

View file

@ -255,7 +255,7 @@ export const getRelationHTML = (data: IAV, cellElements?: HTMLElement[]) => {
} }
} }
export const setRelationCell = (protyle: IProtyle, nodeElement: HTMLElement, target: 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__items");
if (!menuElement) { if (!menuElement) {
return return
@ -302,6 +302,5 @@ export const setRelationCell = (protyle: IProtyle, nodeElement: HTMLElement, tar
} }
} }
} }
updateCellsValue(protyle, nodeElement, newValue, cellElements);
updateCellsValue(protyle, nodeElement, newValue);
}; };