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

🎨 https://github.com/siyuan-note/siyuan/issues/10414

Browse source
This commit is contained in:
Vanessa 2025-06-13 10:39:27 +08:00
parent d264ca0ac9
commit e3f08bfafd
6 changed files with 56 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -258,6 +258,14 @@ export const avClick = (protyle: IProtyle, event: MouseEvent & { target: HTMLEle
event.preventDefault();
event.stopPropagation();
return true;
} else if (type === "av-gallery-edit") {
event.preventDefault();
event.stopPropagation();
return true;
} else if (type === "av-gallery-more") {
event.preventDefault();
event.stopPropagation();
return true;
}
target = target.parentElement;
}

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

@ -893,7 +893,7 @@ export const renderCellAttr = (cellElement: Element, value: IAVCellValue) => {
}
};
export const renderCell = (cellValue: IAVCellValue, rowIndex = 0) => {
export const renderCell = (cellValue: IAVCellValue, rowIndex = 0, showIcon = true) => {
let text = "";
if ("template" === cellValue.type) {
text = `<span class="av__celltext">${cellValue ? (cellValue.template.content || "") : ""}</span>`;
@ -908,7 +908,7 @@ export const renderCell = (cellValue: IAVCellValue, rowIndex = 0) => {
if (cellValue?.isDetached) {
text = `<span class="av__celltext">${Lute.EscapeHTMLStr(cellValue.block.content || "")}</span><span class="b3-chip b3-chip--info b3-chip--small" data-type="block-more">${window.siyuan.languages.more}</span>`;
} else {
text = `<span class="b3-menu__avemoji" data-unicode="${cellValue.block.icon || ""}">${unicode2Emoji(cellValue.block.icon || window.siyuan.storage[Constants.LOCAL_IMAGES].file)}</span><span data-type="block-ref" data-id="${cellValue.block.id}" data-subtype="s" class="av__celltext av__celltext--ref">${Lute.EscapeHTMLStr(cellValue.block.content)}</span><span class="b3-chip b3-chip--info b3-chip--small" data-type="block-more">${window.siyuan.languages.update}</span>`;
text = `<span class="b3-menu__avemoji${showIcon?"":" fn__none"}" data-unicode="${cellValue.block.icon || ""}">${unicode2Emoji(cellValue.block.icon || window.siyuan.storage[Constants.LOCAL_IMAGES].file)}</span><span data-type="block-ref" data-id="${cellValue.block.id}" data-subtype="s" class="av__celltext av__celltext--ref">${Lute.EscapeHTMLStr(cellValue.block.content)}</span><span class="b3-chip b3-chip--info b3-chip--small" data-type="block-more">${window.siyuan.languages.update}</span>`;
}
} else if (cellValue.type === "number") {
text = `<span class="av__celltext" data-content="${cellValue?.number.isNotEmpty ? cellValue?.number.content : ""}">${cellValue?.number.formattedContent || cellValue?.number.content || ""}</span>`;
@ -966,7 +966,7 @@ export const renderCell = (cellValue: IAVCellValue, rowIndex = 0) => {
text += `<span class="av__cell--relation"><span>➖ </span><span class="av__celltext" data-id="${item.block?.id}">${Lute.EscapeHTMLStr(item.block.content || window.siyuan.languages.untitled)}</span></span>`;
} else {
// data-block-id 用于更新 emoji
text += `<span class="av__cell--relation" data-block-id="${item.block.id}"><span class="b3-menu__avemoji" data-unicode="${item.block.icon || ""}">${unicode2Emoji(item.block.icon || window.siyuan.storage[Constants.LOCAL_IMAGES].file)}</span><span data-type="block-ref" data-id="${item.block.id}" data-subtype="s" class="av__celltext av__celltext--ref">${Lute.EscapeHTMLStr(item.block.content || window.siyuan.languages.untitled)}</span></span>`;
text += `<span class="av__cell--relation" data-block-id="${item.block.id}"><span class="b3-menu__avemoji${showIcon ? "" : " fn__none"}" data-unicode="${item.block.icon || ""}">${unicode2Emoji(item.block.icon || window.siyuan.storage[Constants.LOCAL_IMAGES].file)}</span><span data-type="block-ref" data-id="${item.block.id}" data-subtype="s" class="av__celltext av__celltext--ref">${Lute.EscapeHTMLStr(item.block.content || window.siyuan.languages.untitled)}</span></span>`;
}
}
});

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

@ -86,7 +86,7 @@ export const renderGallery = (options: {
}
}
galleryHTML += '<div class="av__gallery-fields">';
galleryHTML += `<div class="av__gallery-fields${view.wrapField ? " av__gallery-fields--wrap" : ""}">`;
item.values.forEach((cell, fieldsIndex) => {
if (view.fields[fieldsIndex].hidden) {
return;
@ -100,9 +100,14 @@ ${cell.valueType === "block" ? 'data-block-id="' + (cell.value.block.id || "") +
data-dtype="${cell.valueType}"
${cell.value?.isDetached ? ' data-detached="true"' : ""}
style="${cell.bgColor ? `background-color:${cell.bgColor};` : ""}
${cell.color ? `color:${cell.color};` : ""}">${renderCell(cell.value, rowIndex)}</div>`;
${cell.color ? `color:${cell.color};` : ""}">${renderCell(cell.value, rowIndex, view.showIcon)}</div>`;
});
galleryHTML += "</div></div>";
galleryHTML += `</div>
<div class="av__gallery-actions">
<span class="protyle-icon protyle-icon--first" data-type="av-gallery-edit"><svg><use xlink:href="#iconEdit"></use></svg></span>
<span class="protyle-icon protyle-icon--last" data-type="av-gallery-more"><svg><use xlink:href="#iconMore"></use></svg></span>
</div>
</div>`;
});
galleryHTML += `<div class="av__gallery-add" data-type="av-add-bottom"><svg class="svg"><use xlink:href="#iconAdd"></use></svg><span class="fn__space"></span>${window.siyuan.languages.addCard}</div>`;
let tabHTML = "";

14
app/src/protyle/render/av/layout.ts
View file

@ -165,6 +165,13 @@ export const bindLayoutEvent = (options: {
blockID,
data: !checked
}]);
options.blockElement.querySelectorAll('.av__cell[data-dtype="block"] .b3-menu__avemoji').forEach(item => {
if (checked) {
item.classList.remove("fn__none");
} else {
item.classList.add("fn__none");
}
});
});
const toggleWrapElement = options.menuElement.querySelector('.b3-switch[data-type="toggle-gallery-wrap"]') as HTMLInputElement;
toggleWrapElement.addEventListener("change", () => {
@ -182,6 +189,13 @@ export const bindLayoutEvent = (options: {
blockID,
data: !checked
}]);
options.blockElement.querySelectorAll('.av__gallery-fields').forEach(item => {
if (checked) {
item.classList.add("av__gallery-fields--wrap");
} else {
item.classList.remove("av__gallery-fields--wrap");
}
});
});
};