mirror of
https://github.com/siyuan-note/siyuan.git
synced 2025-12-22 09:30:14 +01:00
This commit is contained in:
Vanessa
parent
96a7b4a03e
commit
d71680d518
6 changed files with 111 additions and 68 deletions
|
|
@ -8,7 +8,7 @@ import {fetchPost} from "../../../util/fetch";
|
|||
import {focusBlock, focusByRange} from "../../util/selection";
|
||||
import * as dayjs from "dayjs";
|
||||
import {unicode2Emoji} from "../../../emoji";
|
||||
import {getColIconByType} from "./col";
|
||||
import {getColIconByType, getColId} from "./col";
|
||||
import {genAVValueHTML} from "./blockAttr";
|
||||
import {Constants} from "../../../constants";
|
||||
import {hintRef} from "../../hint/extend";
|
||||
|
|
@ -16,6 +16,8 @@ import {getAssetName, pathPosix} from "../../../util/pathName";
|
|||
import {mergeAddOption} from "./select";
|
||||
import {escapeAttr, escapeHtml} from "../../../util/escape";
|
||||
import {electronUndo} from "../../undo";
|
||||
import {getFieldIdByCellElement} from "./row";
|
||||
import {getFieldsByData} from "./view";
|
||||
|
||||
const renderCellURL = (urlContent: string) => {
|
||||
let host = urlContent;
|
||||
|
|
@ -519,7 +521,7 @@ export const popTextCell = (protyle: IProtyle, cellElements: HTMLElement[], type
|
|||
} else if (type === "relation") {
|
||||
openMenuPanel({protyle, blockElement, type: "relation", cellElements});
|
||||
} else if (type === "rollup") {
|
||||
openMenuPanel({protyle, blockElement, type: "rollup", cellElements, colId: cellElements[0].dataset.colId});
|
||||
openMenuPanel({protyle, blockElement, type: "rollup", cellElements, colId: getColId(cellElements[0], viewType)});
|
||||
}
|
||||
if (viewType === "table" && !hasClosestByClassName(cellElements[0], "custom-attr")) {
|
||||
cellElements[0].classList.add("av__cell--select");
|
||||
|
|
@ -544,8 +546,8 @@ export const popTextCell = (protyle: IProtyle, cellElements: HTMLElement[], type
|
|||
id: blockElement.dataset.avId,
|
||||
viewID: blockElement.getAttribute(Constants.CUSTOM_SY_AV_VIEW)
|
||||
}, (response) => {
|
||||
response.data.view.columns.find((item: IAVColumn) => {
|
||||
if (item.id === cellElements[0].dataset.colId) {
|
||||
getFieldsByData(response.data).find((item: IAVColumn) => {
|
||||
if (item.id === getColId(cellElements[0], viewType)) {
|
||||
inputElement.value = item.template;
|
||||
inputElement.dataset.template = item.template;
|
||||
return true;
|
||||
|
|
@ -557,10 +559,12 @@ export const popTextCell = (protyle: IProtyle, cellElements: HTMLElement[], type
|
|||
inputElement.addEventListener("input", (event: InputEvent) => {
|
||||
if (Constants.BLOCK_HINT_KEYS.includes(inputElement.value.substring(0, 2))) {
|
||||
protyle.toolbar.range = document.createRange();
|
||||
if (!blockElement.contains(cellElements[0])) {
|
||||
const rowElement = hasClosestByClassName(cellElements[0], "av__row") as HTMLElement;
|
||||
if (cellElements[0]) {
|
||||
cellElements[0] = blockElement.querySelector(`.av__row[data-id="${rowElement.dataset.id}"] .av__cell[data-col-id="${cellElements[0].dataset.colId}"]`) as HTMLElement;
|
||||
if (cellElements[0] && !blockElement.contains(cellElements[0])) {
|
||||
const rowID = getFieldIdByCellElement(cellElements[0], viewType);
|
||||
if (viewType === "table") {
|
||||
cellElements[0] = (blockElement.querySelector(`.av__row[data-id="${rowID}"] .av__cell[data-col-id="${cellElements[0].dataset.colId}"]`)) as HTMLElement;
|
||||
} else {
|
||||
cellElements[0] = (blockElement.querySelector(`.av__gallery-item[data-id="${rowID}"] .av__cell[data-field-id="${cellElements[0].dataset.fieldId}"]`)) as HTMLElement;
|
||||
}
|
||||
}
|
||||
protyle.toolbar.range.selectNodeContents(cellElements[0].lastChild);
|
||||
|
|
@ -643,7 +647,7 @@ const updateCellValueByInput = (protyle: IProtyle, type: TAVCol, blockElement: H
|
|||
const avMaskElement = document.querySelector(".av__mask");
|
||||
const avID = blockElement.getAttribute("data-av-id");
|
||||
if (type === "template") {
|
||||
const colId = cellElements[0].getAttribute("data-col-id");
|
||||
const colId = getColId(cellElements[0], viewType);
|
||||
const textElement = avMaskElement.querySelector(".b3-text-field") as HTMLInputElement;
|
||||
if (textElement.value !== textElement.dataset.template && !blockElement.getAttribute("data-loading")) {
|
||||
transaction(protyle, [{
|
||||
|
|
@ -707,14 +711,16 @@ export const updateCellsValue = (protyle: IProtyle, nodeElement: HTMLElement, va
|
|||
const isCustomAttr = hasClosestByClassName(cellElements[0], "custom-attr");
|
||||
const viewType = nodeElement.getAttribute("data-av-type") as TAVView;
|
||||
cellElements.forEach((item: HTMLElement, elementIndex) => {
|
||||
const rowElement = hasClosestByClassName(item, "av__row") as HTMLElement;
|
||||
if (viewType === "table") {
|
||||
if (!rowElement) {
|
||||
const rowID = getFieldIdByCellElement(item, viewType);
|
||||
if (!rowID) {
|
||||
return;
|
||||
}
|
||||
if (!nodeElement.contains(item)) {
|
||||
item = cellElements[elementIndex] = (nodeElement.querySelector(`.av__row[data-id="${rowElement.dataset.id}"] .av__cell[data-col-id="${item.dataset.colId}"]`) ||
|
||||
if (viewType === "table") {
|
||||
item = cellElements[elementIndex] = (nodeElement.querySelector(`.av__row[data-id="${rowID}"] .av__cell[data-col-id="${item.dataset.colId}"]`) ||
|
||||
nodeElement.querySelector(`.fn__flex-1[data-col-id="${item.dataset.colId}"]`)) as HTMLElement;
|
||||
} else {
|
||||
item = cellElements[elementIndex] = (nodeElement.querySelector(`.av__gallery-item[data-id="${rowID}"] .av__cell[data-field-id="${item.dataset.fieldId}"]`)) as HTMLElement;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -726,9 +732,8 @@ export const updateCellsValue = (protyle: IProtyle, nodeElement: HTMLElement, va
|
|||
if (["created", "updated", "template", "rollup"].includes(type)) {
|
||||
return;
|
||||
}
|
||||
const rowID = viewType === "table" ? rowElement.getAttribute("data-id") : item.getAttribute("data-field-id");
|
||||
const cellId = item.dataset.id; // 刚创建时无 id，更新需和 oldValue 保持一致
|
||||
const colId = item.dataset.colId;
|
||||
const colId = getColId(item, viewType)
|
||||
|
||||
text += getCellText(item) + ((cellElements[elementIndex + 1] && item.nextElementSibling && item.nextElementSibling.isSameNode(cellElements[elementIndex + 1])) ? "\t" : "\n\n");
|
||||
const oldValue = genCellValueByElement(type, item);
|
||||
|
|
|
|||
|
|
@ -18,6 +18,14 @@ import {Dialog} from "../../../dialog";
|
|||
import {escapeAriaLabel, escapeAttr, escapeHtml} from "../../../util/escape";
|
||||
import {getFieldsByData} from "./view";
|
||||
|
||||
export const getColId = (element: Element, viewType: TAVView) => {
|
||||
if (viewType === "table") {
|
||||
return element.getAttribute("data-col-id");
|
||||
} else if (viewType === "gallery") {
|
||||
return element.getAttribute("data-field-id");
|
||||
}
|
||||
};
|
||||
|
||||
export const duplicateCol = (options: {
|
||||
protyle: IProtyle,
|
||||
colId: string,
|
||||
|
|
|
|||
|
|
@ -1,6 +1,15 @@
|
|||
import {transaction} from "../../wysiwyg/transaction";
|
||||
import {fetchPost} from "../../../util/fetch";
|
||||
import {addCol, bindEditEvent, duplicateCol, getColIconByType, getColNameByType, getEditHTML, removeCol} from "./col";
|
||||
import {
|
||||
addCol,
|
||||
bindEditEvent,
|
||||
duplicateCol,
|
||||
getColIconByType,
|
||||
getColId,
|
||||
getColNameByType,
|
||||
getEditHTML,
|
||||
removeCol
|
||||
} from "./col";
|
||||
import {setPosition} from "../../../util/setPosition";
|
||||
import {hasClosestByAttribute, hasClosestByClassName} from "../../util/hasClosest";
|
||||
import {addColOptionOrCell, bindSelectEvent, getSelectHTML, removeCellOption, setColOption} from "./select";
|
||||
|
|
@ -88,7 +97,7 @@ export const openMenuPanel = (options: {
|
|||
} else if (options.type === "filters") {
|
||||
html = getFiltersHTML(data);
|
||||
} else if (options.type === "select") {
|
||||
html = getSelectHTML(data.view, options.cellElements, true);
|
||||
html = getSelectHTML(fields, options.cellElements, true, options.blockElement);
|
||||
} else if (options.type === "asset") {
|
||||
html = getAssetHTML(options.cellElements);
|
||||
} else if (options.type === "edit") {
|
||||
|
|
@ -116,7 +125,7 @@ export const openMenuPanel = (options: {
|
|||
protyle: options.protyle,
|
||||
blockElement: options.blockElement,
|
||||
type: "edit",
|
||||
colId: options.cellElements[0].dataset.colId
|
||||
colId: getColId(options.cellElements[0], data.viewType)
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
|
@ -336,7 +345,7 @@ export const openMenuPanel = (options: {
|
|||
return;
|
||||
}
|
||||
if (targetElement.querySelector('[data-type="setColOption"]')) {
|
||||
const colId = options.cellElements ? options.cellElements[0].dataset.colId : menuElement.querySelector(".b3-menu__item").getAttribute("data-col-id");
|
||||
const colId = options.cellElements ? getColId(options.cellElements[0], data.viewType) : menuElement.querySelector(".b3-menu__item").getAttribute("data-col-id");
|
||||
const changeData = fields.find((column) => column.id === colId).options;
|
||||
const oldData = Object.assign([], changeData);
|
||||
let targetOption: { name: string, color: string };
|
||||
|
|
@ -369,7 +378,7 @@ export const openMenuPanel = (options: {
|
|||
}]);
|
||||
const oldScroll = menuElement.querySelector(".b3-menu__items").scrollTop;
|
||||
if (options.cellElements) {
|
||||
menuElement.innerHTML = getSelectHTML(data.view, options.cellElements);
|
||||
menuElement.innerHTML = getSelectHTML(fields, options.cellElements, false, options.blockElement);
|
||||
bindSelectEvent(options.protyle, data, menuElement, options.cellElements, options.blockElement);
|
||||
} else {
|
||||
menuElement.innerHTML = getEditHTML({
|
||||
|
|
|
|||
|
|
@ -479,7 +479,7 @@ export const refreshAV = (protyle: IProtyle, operation: IOperation) => {
|
|||
const avID = operation.action === "setAttrViewName" ? operation.id : operation.avID;
|
||||
Array.from(protyle.wysiwyg.element.querySelectorAll(`[data-av-id="${avID}"]`)).forEach((item: HTMLElement) => {
|
||||
item.removeAttribute("data-render");
|
||||
const updateRow = item.querySelector('.av__row[data-need-update="true"]');
|
||||
const updateRow = item.querySelector('[data-need-update="true"]');
|
||||
if (operation.action === "sortAttrViewCol" || operation.action === "sortAttrViewRow") {
|
||||
item.querySelectorAll(".av__cell--active").forEach((item: HTMLElement) => {
|
||||
item.classList.remove("av__cell--active");
|
||||
|
|
@ -506,7 +506,8 @@ export const refreshAV = (protyle: IProtyle, operation: IOperation) => {
|
|||
// 更新属性面板
|
||||
renderAVAttribute(attrElement.parentElement, attrElement.dataset.nodeId, protyle);
|
||||
} else {
|
||||
if (operation.action === "insertAttrViewBlock" && updateRow && !item.querySelector(`.av__row[data-id="${updateRow.getAttribute("data-id")}"]`)) {
|
||||
if (operation.action === "insertAttrViewBlock" && updateRow &&
|
||||
!item.querySelector(`[data-id="${updateRow.getAttribute("data-id")}"]`)) {
|
||||
showMessage(window.siyuan.languages.insertRowTip);
|
||||
document.querySelector(".av__mask")?.remove();
|
||||
}
|
||||
|
|
|
|||
|
|
@ -16,6 +16,10 @@ import * as dayjs from "dayjs";
|
|||
import {Constants} from "../../../constants";
|
||||
import {insertGalleryItemAnimation} from "./gallery/item";
|
||||
|
||||
export const getFieldIdByCellElement = (cellElement: Element, viewType:TAVView): string => {
|
||||
return (hasClosestByClassName(cellElement, viewType === "table" ? "av__row" : "av__gallery-item") as HTMLElement).dataset.id;
|
||||
}
|
||||
|
||||
export const selectRow = (checkElement: Element, type: "toggle" | "select" | "unselect" | "unselectAll") => {
|
||||
const rowElement = hasClosestByClassName(checkElement, "av__row");
|
||||
if (!rowElement) {
|
||||
|
|
|
|||
|
|
@ -3,12 +3,14 @@ import {transaction} from "../../wysiwyg/transaction";
|
|||
import {hasClosestBlock, hasClosestByClassName} from "../../util/hasClosest";
|
||||
import {confirmDialog} from "../../../dialog/confirmDialog";
|
||||
import {upDownHint} from "../../../util/upDownHint";
|
||||
import {bindEditEvent, getEditHTML} from "./col";
|
||||
import {bindEditEvent, getColId, getEditHTML} from "./col";
|
||||
import {updateAttrViewCellAnimation} from "./action";
|
||||
import {genAVValueHTML} from "./blockAttr";
|
||||
import {escapeAriaLabel, escapeAttr, escapeHtml} from "../../../util/escape";
|
||||
import {genCellValueByElement, getTypeByCellElement} from "./cell";
|
||||
import * as dayjs from "dayjs";
|
||||
import {getFieldsByData} from "./view";
|
||||
import {getFieldIdByCellElement} from "./row";
|
||||
|
||||
let cellValues: IAVCellValue[];
|
||||
|
||||
|
|
@ -69,22 +71,25 @@ export const removeCellOption = (protyle: IProtyle, cellElements: HTMLElement[],
|
|||
if (!target) {
|
||||
return;
|
||||
}
|
||||
const colId = cellElements[0].dataset.colId;
|
||||
const viewType = blockElement.getAttribute("data-av-type") as TAVView;
|
||||
const colId = getColId(cellElements[0], viewType);
|
||||
const doOperations: IOperation[] = [];
|
||||
const undoOperations: IOperation[] = [];
|
||||
let mSelectValue: IAVCellSelectValue[];
|
||||
const avID = blockElement.getAttribute("data-av-id");
|
||||
cellElements.forEach((item, elementIndex) => {
|
||||
const rowID = getFieldIdByCellElement(item, viewType);
|
||||
if (!rowID) {
|
||||
return;
|
||||
}
|
||||
if (!blockElement.contains(item)) {
|
||||
const rowElement = hasClosestByClassName(item, "av__row");
|
||||
if (rowElement) {
|
||||
item = cellElements[elementIndex] =
|
||||
(blockElement.querySelector(`.av__row[data-id="${rowElement.dataset.id}"] .av__cell[data-col-id="${item.dataset.colId}"]`) ||
|
||||
// block attr
|
||||
if (viewType === "table") {
|
||||
item = cellElements[elementIndex] = (blockElement.querySelector(`.av__row[data-id="${rowID}"] .av__cell[data-col-id="${item.dataset.colId}"]`) ||
|
||||
blockElement.querySelector(`.fn__flex-1[data-col-id="${item.dataset.colId}"]`)) as HTMLElement;
|
||||
} else {
|
||||
item = cellElements[elementIndex] = (blockElement.querySelector(`.av__gallery-item[data-id="${rowID}"] .av__cell[data-field-id="${item.dataset.fieldId}"]`)) as HTMLElement;
|
||||
}
|
||||
}
|
||||
const rowID = (hasClosestByClassName(item, "av__row") as HTMLElement).dataset.id;
|
||||
const cellValue: IAVCellValue = cellValues[elementIndex];
|
||||
const oldValue = JSON.parse(JSON.stringify(cellValue));
|
||||
if (elementIndex === 0) {
|
||||
|
|
@ -141,10 +146,12 @@ export const setColOption = (protyle: IProtyle, data: IAV, target: HTMLElement,
|
|||
return;
|
||||
}
|
||||
const blockID = blockElement.getAttribute("data-node-id");
|
||||
const colId = cellElements ? cellElements[0].dataset.colId : menuElement.querySelector(".b3-menu__item").getAttribute("data-col-id");
|
||||
const viewType = blockElement.getAttribute("data-av-type") as TAVView;
|
||||
const colId = (cellElements && cellElements[0]) ? getColId(cellElements[0], viewType) : menuElement.querySelector(".b3-menu__item").getAttribute("data-col-id");
|
||||
let name = target.parentElement.dataset.name;
|
||||
let desc = target.parentElement.dataset.desc;
|
||||
let color = target.parentElement.dataset.color;
|
||||
const fields = getFieldsByData(data);
|
||||
const menu = new Menu("av-col-option", () => {
|
||||
if ((name === inputElement.value && desc === descElement.value) || !inputElement.value) {
|
||||
return;
|
||||
|
|
@ -175,7 +182,7 @@ export const setColOption = (protyle: IProtyle, data: IAV, target: HTMLElement,
|
|||
newDesc: desc
|
||||
},
|
||||
}]);
|
||||
data.view.columns.find(column => {
|
||||
fields.find(column => {
|
||||
if (column.id === colId) {
|
||||
// 重名不进行更新 https://github.com/siyuan-note/siyuan/issues/13554
|
||||
let hasName = false;
|
||||
|
|
@ -205,11 +212,14 @@ export const setColOption = (protyle: IProtyle, data: IAV, target: HTMLElement,
|
|||
bindEditEvent({protyle, data, menuElement, isCustomAttr, blockID});
|
||||
} else {
|
||||
cellElements.forEach((cellElement: HTMLElement, index) => {
|
||||
const rowElement = hasClosestByClassName(cellElement, "av__row");
|
||||
if (rowElement) {
|
||||
cellElement = cellElements[index] = (blockElement.querySelector(`.av__row[data-id="${rowElement.dataset.id}"] .av__cell[data-col-id="${cellElement.dataset.colId}"]`) ||
|
||||
const rowID = getFieldIdByCellElement(cellElement, viewType);
|
||||
if (viewType === "table") {
|
||||
cellElement = cellElements[index] = (blockElement.querySelector(`.av__row[data-id="${rowID}"] .av__cell[data-col-id="${cellElement.dataset.colId}"]`) ||
|
||||
blockElement.querySelector(`.fn__flex-1[data-col-id="${cellElement.dataset.colId}"]`)) as HTMLElement;
|
||||
} else {
|
||||
cellElement = cellElements[index] = (blockElement.querySelector(`.av__gallery-item[data-id="${rowID}"] .av__cell[data-field-id="${cellElement.dataset.fieldId}"]`)) as HTMLElement;
|
||||
}
|
||||
|
||||
cellValues[index].mSelect.find((item) => {
|
||||
if (item.content === name) {
|
||||
item.content = inputElement.value;
|
||||
|
|
@ -222,7 +232,7 @@ export const setColOption = (protyle: IProtyle, data: IAV, target: HTMLElement,
|
|||
updateAttrViewCellAnimation(cellElement, cellValues[index]);
|
||||
}
|
||||
});
|
||||
menuElement.innerHTML = getSelectHTML(data.view, cellElements);
|
||||
menuElement.innerHTML = getSelectHTML(fields, cellElements, false, blockElement);
|
||||
bindSelectEvent(protyle, data, menuElement, cellElements, blockElement);
|
||||
}
|
||||
if (selectedElement) {
|
||||
|
|
@ -284,7 +294,7 @@ export const setColOption = (protyle: IProtyle, data: IAV, target: HTMLElement,
|
|||
click() {
|
||||
confirmDialog(window.siyuan.languages.deleteOpConfirm, window.siyuan.languages.confirmDelete, () => {
|
||||
let colOptions: { name: string, color: string }[] = [];
|
||||
data.view.columns.find(column => {
|
||||
fields.find(column => {
|
||||
if (column.id === colId) {
|
||||
colOptions = column.options;
|
||||
return true;
|
||||
|
|
@ -320,10 +330,12 @@ export const setColOption = (protyle: IProtyle, data: IAV, target: HTMLElement,
|
|||
bindEditEvent({protyle, data, menuElement, isCustomAttr, blockID});
|
||||
} else {
|
||||
cellElements.forEach((cellElement: HTMLElement, index) => {
|
||||
const rowElement = hasClosestByClassName(cellElement, "av__row");
|
||||
if (rowElement) {
|
||||
cellElement = cellElements[index] = (blockElement.querySelector(`.av__row[data-id="${rowElement.dataset.id}"] .av__cell[data-col-id="${cellElement.dataset.colId}"]`) ||
|
||||
const rowID = getFieldIdByCellElement(cellElement, viewType);
|
||||
if (viewType === "table") {
|
||||
cellElement = cellElements[index] = (blockElement.querySelector(`.av__row[data-id="${rowID}"] .av__cell[data-col-id="${cellElement.dataset.colId}"]`) ||
|
||||
blockElement.querySelector(`.fn__flex-1[data-col-id="${cellElement.dataset.colId}"]`)) as HTMLElement;
|
||||
} else {
|
||||
cellElement = cellElements[index] = (blockElement.querySelector(`.av__gallery-item[data-id="${rowID}"] .av__cell[data-field-id="${cellElement.dataset.fieldId}"]`)) as HTMLElement;
|
||||
}
|
||||
cellValues[index].mSelect.find((item, selectIndex) => {
|
||||
if (item.content === newName) {
|
||||
|
|
@ -337,7 +349,7 @@ export const setColOption = (protyle: IProtyle, data: IAV, target: HTMLElement,
|
|||
updateAttrViewCellAnimation(cellElement, cellValues[index]);
|
||||
}
|
||||
});
|
||||
menuElement.innerHTML = getSelectHTML(data.view, cellElements);
|
||||
menuElement.innerHTML = getSelectHTML(fields, cellElements, false, blockElement);
|
||||
bindSelectEvent(protyle, data, menuElement, cellElements, blockElement);
|
||||
}
|
||||
if (selectedElement) {
|
||||
|
|
@ -357,11 +369,11 @@ export const setColOption = (protyle: IProtyle, data: IAV, target: HTMLElement,
|
|||
label: html + "</div>",
|
||||
bind(element) {
|
||||
element.addEventListener("click", (event) => {
|
||||
const target = event.target as HTMLElement;
|
||||
if (target.classList.contains("color__square") && !target.classList.contains("color__square--current")) {
|
||||
const colorTarget = event.target as HTMLElement;
|
||||
if (colorTarget.classList.contains("color__square") && !colorTarget.classList.contains("color__square--current")) {
|
||||
element.querySelector(".color__square--current")?.classList.remove("color__square--current");
|
||||
target.classList.add("color__square--current");
|
||||
const newColor = target.getAttribute("data-color");
|
||||
colorTarget.classList.add("color__square--current");
|
||||
const newColor = colorTarget.getAttribute("data-color");
|
||||
transaction(protyle, [{
|
||||
action: "updateAttrViewColOption",
|
||||
id: colId,
|
||||
|
|
@ -390,7 +402,7 @@ export const setColOption = (protyle: IProtyle, data: IAV, target: HTMLElement,
|
|||
},
|
||||
}]);
|
||||
|
||||
data.view.columns.find(column => {
|
||||
fields.find(column => {
|
||||
if (column.id === colId) {
|
||||
column.options.find((item) => {
|
||||
if (item.name === name) {
|
||||
|
|
@ -408,10 +420,12 @@ export const setColOption = (protyle: IProtyle, data: IAV, target: HTMLElement,
|
|||
bindEditEvent({protyle, data, menuElement, isCustomAttr, blockID});
|
||||
} else {
|
||||
cellElements.forEach((cellElement: HTMLElement, cellIndex) => {
|
||||
const rowElement = hasClosestByClassName(cellElement, "av__row");
|
||||
if (rowElement) {
|
||||
cellElement = cellElements[cellIndex] = (blockElement.querySelector(`.av__row[data-id="${rowElement.dataset.id}"] .av__cell[data-col-id="${cellElement.dataset.colId}"]`) ||
|
||||
const rowID = getFieldIdByCellElement(cellElement, viewType);
|
||||
if (viewType === "table") {
|
||||
cellElement = cellElements[cellIndex] = (blockElement.querySelector(`.av__row[data-id="${rowID}"] .av__cell[data-col-id="${cellElement.dataset.colId}"]`) ||
|
||||
blockElement.querySelector(`.fn__flex-1[data-col-id="${cellElement.dataset.colId}"]`)) as HTMLElement;
|
||||
} else {
|
||||
cellElement = cellElements[cellIndex] = (blockElement.querySelector(`.av__gallery-item[data-id="${rowID}"] .av__cell[data-field-id="${cellElement.dataset.fieldId}"]`)) as HTMLElement;
|
||||
}
|
||||
cellValues[cellIndex].mSelect.find((item) => {
|
||||
if (item.content === name) {
|
||||
|
|
@ -426,7 +440,7 @@ export const setColOption = (protyle: IProtyle, data: IAV, target: HTMLElement,
|
|||
updateAttrViewCellAnimation(cellElement, cellValues[cellIndex]);
|
||||
}
|
||||
});
|
||||
menuElement.innerHTML = getSelectHTML(data.view, cellElements);
|
||||
menuElement.innerHTML = getSelectHTML(fields, cellElements, false, blockElement);
|
||||
bindSelectEvent(protyle, data, menuElement, cellElements, blockElement);
|
||||
}
|
||||
menuElement.querySelector(".b3-menu__items").scrollTop = oldScroll;
|
||||
|
|
@ -451,9 +465,9 @@ export const setColOption = (protyle: IProtyle, data: IAV, target: HTMLElement,
|
|||
|
||||
export const bindSelectEvent = (protyle: IProtyle, data: IAV, menuElement: HTMLElement, cellElements: HTMLElement[], blockElement: Element) => {
|
||||
const inputElement = menuElement.querySelector("input");
|
||||
const colId = cellElements[0].dataset.colId;
|
||||
const colId = getColId(cellElements[0], blockElement.getAttribute("data-av-type") as TAVView);
|
||||
let colData: IAVColumn;
|
||||
data.view.columns.find((item: IAVColumn) => {
|
||||
getFieldsByData(data).find((item: IAVColumn) => {
|
||||
if (item.id === colId) {
|
||||
colData = item;
|
||||
return;
|
||||
|
|
@ -508,16 +522,19 @@ export const addColOptionOrCell = (protyle: IProtyle, data: IAV, cellElements: H
|
|||
const nodeElement = hasClosestBlock(cellElements[0]);
|
||||
if (!nodeElement) {
|
||||
cellElements.forEach((item, index) => {
|
||||
const rowElement = hasClosestByClassName(item, "av__row");
|
||||
if (rowElement) {
|
||||
cellElements[index] = (blockElement.querySelector(`.av__row[data-id="${rowElement.dataset.id}"] .av__cell[data-col-id="${item.dataset.colId}"]`) ||
|
||||
const rowID = getFieldIdByCellElement(item, data.viewType);
|
||||
if (data.viewType === "table") {
|
||||
cellElements[index] = (blockElement.querySelector(`.av__row[data-id="${rowID}"] .av__cell[data-col-id="${item.dataset.colId}"]`) ||
|
||||
blockElement.querySelector(`.fn__flex-1[data-col-id="${item.dataset.colId}"]`)) as HTMLElement;
|
||||
} else {
|
||||
cellElements[index] = (blockElement.querySelector(`.av__gallery-item[data-id="${rowID}"] .av__cell[data-field-id="${item.dataset.fieldId}"]`)) as HTMLElement;
|
||||
}
|
||||
});
|
||||
}
|
||||
const colId = cellElements[0].dataset.colId;
|
||||
const colId = getColId( cellElements[0], blockElement.getAttribute("data-av-type") as TAVView);
|
||||
let colData: IAVColumn;
|
||||
data.view.columns.find((item: IAVColumn) => {
|
||||
const fields = getFieldsByData(data);
|
||||
fields.find((item: IAVColumn) => {
|
||||
if (item.id === colId) {
|
||||
colData = item;
|
||||
if (!colData.options) {
|
||||
|
|
@ -531,11 +548,10 @@ export const addColOptionOrCell = (protyle: IProtyle, data: IAV, cellElements: H
|
|||
const cellUndoOperations: IOperation[] = [];
|
||||
let mSelectValue: IAVCellSelectValue[];
|
||||
cellElements.forEach((item, index) => {
|
||||
const itemRowElement = hasClosestByClassName(item, "av__row");
|
||||
if (!itemRowElement) {
|
||||
const rowID = getFieldIdByCellElement(item, data.viewType);
|
||||
if (!rowID) {
|
||||
return;
|
||||
}
|
||||
const rowID = itemRowElement.dataset.id;
|
||||
const cellValue: IAVCellValue = cellValues[index];
|
||||
const oldValue = JSON.parse(JSON.stringify(cellValue));
|
||||
if (index === 0) {
|
||||
|
|
@ -621,14 +637,14 @@ export const addColOptionOrCell = (protyle: IProtyle, data: IAV, cellElements: H
|
|||
} else {
|
||||
const oldScroll = menuElement.querySelector(".b3-menu__items").scrollTop;
|
||||
const oldChipsHeight = menuElement.querySelector(".b3-chips").clientHeight;
|
||||
menuElement.innerHTML = getSelectHTML(data.view, cellElements);
|
||||
menuElement.innerHTML = getSelectHTML(fields, cellElements, false, blockElement);
|
||||
bindSelectEvent(protyle, data, menuElement, cellElements, blockElement);
|
||||
menuElement.querySelector("input").focus();
|
||||
menuElement.querySelector(".b3-menu__items").scrollTop = oldScroll + (menuElement.querySelector(".b3-chips").clientHeight - oldChipsHeight);
|
||||
}
|
||||
};
|
||||
|
||||
export const getSelectHTML = (data: IAVTable, cellElements: HTMLElement[], init = false) => {
|
||||
export const getSelectHTML = (fields: IAVColumn[], cellElements: HTMLElement[], init = false, blockElement: Element) => {
|
||||
if (init) {
|
||||
// 快速选中后如果 render 了再使用 genCellValueByElement 获取的元素和当前选中的不一致， https://github.com/siyuan-note/siyuan/issues/11268
|
||||
cellValues = [];
|
||||
|
|
@ -637,8 +653,8 @@ export const getSelectHTML = (data: IAVTable, cellElements: HTMLElement[], init
|
|||
cellValues.push(genCellValueByElement(isCustomAttr ? item.dataset.type as TAVCol : getTypeByCellElement(item), item));
|
||||
});
|
||||
}
|
||||
const colId = cellElements[0].dataset["colId"];
|
||||
const colData = data.columns.find(item => {
|
||||
const colId = cellElements[0].dataset[blockElement.getAttribute("data-av-type") === "table" ? "colId" : "fieldId"];
|
||||
const colData = fields.find(item => {
|
||||
if (item.id === colId) {
|
||||
return item;
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue