Andreas/siyuan
1
0
Fork 0
mirror of https://github.com/siyuan-note/siyuan.git synced 2026-03-07 05:10:16 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

🎨 fix https://github.com/siyuan-note/siyuan/issues/10170

Browse source
This commit is contained in:
Vanessa 2024-01-14 12:09:42 +08:00
parent 2ddc610cf5
commit 88dba92cd0
9 changed files with 82 additions and 76 deletions
Download patch file Download diff file Expand all files Collapse all files

4
app/src/protyle/render/av/action.ts
View file

@ -197,8 +197,8 @@ export const avClick = (protyle: IProtyle, event: MouseEvent & { target: HTMLEle
event.preventDefault();
event.stopPropagation();
return true;
} else if (target.classList.contains("av__cellheader")) {
showColMenu(protyle, blockElement, target.parentElement);
} else if (target.classList.contains("av__cell--header")) {
showColMenu(protyle, blockElement, target);
event.preventDefault();
event.stopPropagation();
return true;

28
app/src/protyle/render/av/cell.ts
View file

@ -18,13 +18,16 @@ export const getCellText = (cellElement: HTMLElement | false) => {
return "";
}
let cellText = "";
const textElement = cellElement.querySelector(".av__celltext");
if (textElement) {
if (textElement.querySelector(".av__cellicon")) {
cellText = `${textElement.firstChild.textContent} → ${textElement.lastChild.textContent}`;
} else {
cellText = textElement.textContent;
}
const textElements = cellElement.querySelectorAll(".b3-chip, .av__celltext--ref, .av__celltext");
if (textElements.length > 0) {
textElements.forEach(item => {
if (item.querySelector(".av__cellicon")) {
cellText += `${item.firstChild.textContent} → ${item.lastChild.textContent}, `;
} else if (item.getAttribute("data-type") !== "block-more") {
cellText += item.textContent + ", ";
}
})
cellText = cellText.substring(0, cellText.length - 2);
} else {
cellText = cellElement.textContent;
}
@ -531,7 +534,7 @@ export const renderCell = (cellValue: IAVCellValue, wrap: boolean) => {
<span class="b3-chip b3-chip--info b3-chip--small popover__block" data-id="${cellValue.block.id}" data-type="block-more">${window.siyuan.languages.update}</span>`;
}
} else if (cellValue.type === "number") {
text = `<span style="float: right;${wrap ? "word-break: break-word;" : ""}" class="av__celltext" data-content="${cellValue?.number.isNotEmpty ? cellValue?.number.content : ""}">${cellValue?.number.formattedContent || cellValue?.number.content || ""}</span>`;
text = `<span class="av__celltext" data-content="${cellValue?.number.isNotEmpty ? cellValue?.number.content : ""}">${cellValue?.number.formattedContent || cellValue?.number.content || ""}</span>`;
} else if (cellValue.type === "mSelect" || cellValue.type === "select") {
cellValue?.mSelect?.forEach((item) => {
text += `<span class="b3-chip" style="background-color:var(--b3-font-background${item.color});color:var(--b3-font-color${item.color})">${item.content}</span>`;
@ -636,14 +639,11 @@ export const updateHeaderCell = (cellElement: HTMLElement, headerValue: {
if (typeof headerValue.pin !== "undefined") {
const textElement = cellElement.querySelector(".av__celltext");
if (headerValue.pin) {
if (!textElement.nextElementSibling) {
textElement.insertAdjacentHTML("afterend", '<div class="fn__flex-1"></div><svg class="av__cellheadericon"><use xlink:href="#iconPin"></use></svg>');
if (!cellElement.querySelector(".av__cellheadericon--pin")) {
textElement.insertAdjacentHTML("afterend", '<svg class="av__cellheadericon av__cellheadericon--pin"><use xlink:href="#iconPin"></use></svg>');
}
} else {
if (textElement.nextElementSibling) {
textElement.nextElementSibling.nextElementSibling.remove();
textElement.nextElementSibling.remove();
}
cellElement.querySelector(".av__cellheadericon--pin")?.remove()
}
}
};

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

@ -439,11 +439,9 @@ const addAttrViewColAnimation = (options: {
}
let html = "";
if (index === 0) {
html = `<div class="av__cell" data-icon="${options.icon || ""}" data-col-id="${options.id}" data-dtype="${options.type}" data-wrap="false" style="width: 200px;">
<div draggable="true" class="av__cellheader">
${options.icon ? unicode2Emoji(options.icon, "av__cellheadericon", true) : `<svg class="av__cellheadericon"><use xlink:href="#${getColIconByType(options.type)}"></use></svg>`}
<span class="av__celltext">${options.name}</span>
</div>
html = `<div class="av__cell av__cell--header" draggable="true" data-icon="${options.icon || ""}" data-col-id="${options.id}" data-dtype="${options.type}" data-wrap="false" style="width: 200px;">
${options.icon ? unicode2Emoji(options.icon, "av__cellheadericon", true) : `<svg class="av__cellheadericon"><use xlink:href="#${getColIconByType(options.type)}"></use></svg>`}
<span class="av__celltext fn__flex-1">${options.name}</span>
<div class="av__widthdrag"></div>
</div>`;
} else {

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

@ -93,14 +93,12 @@ export const avRender = (element: Element, protyle: IProtyle, cb?: () => void, v
if (column.hidden) {
return;
}
tableHTML += `<div class="av__cell" data-col-id="${column.id}"
tableHTML += `<div class="av__cell av__cell--header" data-col-id="${column.id}" draggable="true"
data-icon="${column.icon}" data-dtype="${column.type}" data-wrap="${column.wrap}" data-pin="${column.pin}"
style="width: ${column.width || "200px"};">
<div draggable="true" class="av__cellheader">
${column.icon ? unicode2Emoji(column.icon, "av__cellheadericon", true) : `<svg class="av__cellheadericon"><use xlink:href="#${getColIconByType(column.type)}"></use></svg>`}
<span class="av__celltext fn__flex-shrink">${column.name}</span>
${column.pin ? '<div class="fn__flex-1"></div><svg class="av__cellheadericon"><use xlink:href="#iconPin"></use></svg>' : ""}
</div>
${column.icon ? unicode2Emoji(column.icon, "av__cellheadericon", true) : `<svg class="av__cellheadericon"><use xlink:href="#${getColIconByType(column.type)}"></use></svg>`}
<span class="av__celltext fn__flex-1">${column.name}</span>
${column.pin ? '<svg class="av__cellheadericon av__cellheadericon--pin"><use xlink:href="#iconPin"></use></svg>' : ""}
<div class="av__widthdrag"></div>
</div>`;
if (pinIndex === index) {
@ -135,6 +133,7 @@ style="width: ${column.width || "200px"}">${getCalcValue(column) || '<svg><use x
${cell.valueType === "block" ? 'data-block-id="' + (cell.value.block.id || "") + '"' : ""} data-wrap="${data.columns[index].wrap}"
${cell.value?.isDetached ? ' data-detached="true"' : ""}
style="width: ${data.columns[index].width || "200px"};
${cell.valueType === "number" ? "text-align: right;" : ""}
${cell.bgColor ? `background-color:${cell.bgColor};` : ""}
${cell.color ? `color:${cell.color};` : ""}">${renderCell(cell.value, data.columns[index].wrap)}</div>`;

4
app/src/protyle/render/av/row.ts
View file

@ -87,7 +87,9 @@ export const insertAttrViewBlockAnimation = (protyle: IProtyle, blockElement: El
colHTML = '<div class="av__colsticky"><div class="av__firstcol av__colsticky"><svg><use xlink:href="#iconUncheck"></use></svg></div>';
}
previousElement.querySelectorAll(".av__cell").forEach((item: HTMLElement, index) => {
colHTML += `<div class="av__cell" data-col-id="${item.dataset.colId}" style="width: ${item.style.width}" ${(item.getAttribute("data-block-id") || item.dataset.dtype === "block") ? ' data-detached="true"' : ""}><span class="${avId ? "av__celltext" : "av__pulse"}"></span></div>`;
colHTML += `<div class="av__cell" data-col-id="${item.dataset.colId}"
style="width: ${item.style.width};text-align: ${item.style.textAlign}"
${(item.getAttribute("data-block-id") || item.dataset.dtype === "block") ? ' data-detached="true"' : ""}><span class="${avId ? "av__celltext" : "av__pulse"}"></span></div>`;
if (pinIndex === index) {
colHTML += "</div>";
}