0ct0pu5/siyuan
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

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

Browse source
This commit is contained in:
Vanessa 2024-11-18 15:21:23 +08:00
parent 4e9ff1cb11
commit cce77eb712
1 changed files with 54 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -15,7 +15,7 @@ import * as dayjs from "dayjs";
import {setPosition} from "../../../util/setPosition";
import {duplicateNameAddOne} from "../../../util/functions";
import {Dialog} from "../../../dialog";
import {escapeAttr} from "../../../util/escape";
import {escapeAriaLabel, escapeAttr} from "../../../util/escape";
export const duplicateCol = (options: {
protyle: IProtyle,
@ -88,8 +88,20 @@ export const getEditHTML = (options: {
</button>
<button class="b3-menu__separator"></button>
<button class="b3-menu__item" data-type="nobg">
<span class="b3-menu__avemoji" data-col-type="${colData.type}" data-icon="${colData.icon}" data-type="update-icon">${colData.icon ? unicode2Emoji(colData.icon) : `<svg style="width: 14px;height: 14px"><use xlink:href="#${getColIconByType(colData.type)}"></use></svg>`}</span>
<input data-type="name" class="b3-text-field fn__block" type="text" value="${colData.name}" style="margin: 4px 0">
<div>
<div class="fn__flex">
<span class="b3-menu__avemoji" data-col-type="${colData.type}" data-icon="${colData.icon}" data-type="update-icon">${colData.icon ? unicode2Emoji(colData.icon) : `<svg style="width: 14px;height: 14px"><use xlink:href="#${getColIconByType(colData.type)}"></use></svg>`}</span>
<div class="b3-form__icona fn__size200">
<input data-type="name" class="b3-text-field b3-form__icona-input" type="text" value="${colData.name}">
<svg data-position="top" class="b3-form__icona-icon ariaLabel" aria-label="${colData.desc ? escapeAriaLabel(colData.desc) : window.siyuan.languages.addDesc}"><use xlink:href="#iconInfo"></use></svg>
</div>
</div>
<div class="fn__none">
<div class="fn__hr--small"></div>
<textarea style="margin-left: 22px" rows="1" data-type="desc" class="b3-text-field fn__size200" type="text" data-value="${escapeAttr(colData.desc)}">${colData.desc}</textarea>
<div class="fn__hr--small"></div>
</div>
</div>
</button>
<button class="b3-menu__item" data-type="goUpdateColType" ${colData.type === "block" ? "disabled" : ""}>
<span class="b3-menu__label">${window.siyuan.languages.type}</span>
@ -264,6 +276,44 @@ export const bindEditEvent = (options: {
}
});
nameElement.select();
const descElement = options.menuElement.querySelector('.b3-text-field[data-type="desc"]') as HTMLTextAreaElement;
nameElement.nextElementSibling.addEventListener("click", () => {
const descPanelElement = descElement.parentElement
descPanelElement.classList.toggle("fn__none");
if (!descPanelElement.classList.contains("fn__none")) {
descElement.focus();
}
})
descElement.addEventListener("blur", () => {
const newValue = descElement.value;
if (newValue === colData.desc) {
return;
}
transaction(options.protyle, [{
action: "setAttrViewColDesc",
id: colId,
avID,
data: newValue,
}], [{
action: "setAttrViewColDesc",
id: colId,
avID,
data: colData.desc,
}]);
colData.desc = newValue;
});
descElement.addEventListener("keydown", (event: KeyboardEvent) => {
if (event.isComposing) {
return;
}
if (event.key === "Escape") {
options.menuElement.parentElement.remove();
} else if (event.key === "Enter") {
descElement.dispatchEvent(new CustomEvent("blur"));
options.menuElement.parentElement.remove();
}
});
const tplElement = options.menuElement.querySelector('[data-type="updateTemplate"]') as HTMLTextAreaElement;
if (tplElement) {
tplElement.addEventListener("blur", () => {
@ -620,7 +670,7 @@ export const showColMenu = (protyle: IProtyle, blockElement: Element, cellElemen
<span class="b3-menu__avemoji">${cellElement.dataset.icon ? unicode2Emoji(cellElement.dataset.icon) : `<svg style="height: 14px;width: 14px;"><use xlink:href="#${getColIconByType(type)}"></use></svg>`}</span>
<div class="b3-form__icona fn__size200">
<input class="b3-text-field b3-form__icona-input" type="text" value="${oldValue}">
<svg data-position="top" class="b3-form__icona-icon ariaLabel" aria-label="${oldDesc ? oldDesc : window.siyuan.languages.addDesc}"><use xlink:href="#iconInfo"></use></svg>
<svg data-position="top" class="b3-form__icona-icon ariaLabel" aria-label="${oldDesc ? escapeAriaLabel(oldDesc) : window.siyuan.languages.addDesc}"><use xlink:href="#iconInfo"></use></svg>
</div>
</div>
<div class="fn__none">