Andreas/siyuan
1
0
Fork 0
mirror of https://github.com/siyuan-note/siyuan.git synced 2025-12-22 09:30:14 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

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

Browse source
This commit is contained in:
Vanessa 2024-04-07 11:25:52 +08:00
parent 3c5749f48f
commit 2b65d2af22
3 changed files with 43 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -215,7 +215,15 @@ export const getEditHTML = (options: {
<span class="b3-menu__label">${window.siyuan.languages.delete}</span>
</button>`
}
return `<div class="b3-menu__items">${html}</div>
return `<div class="b3-menu__items">
${html}
<button class="b3-menu__separator"></button>
<label class="b3-menu__item">
<span class="fn__flex-center">${window.siyuan.languages.wrap}</span>
<span class="fn__space fn__flex-1"></span>
<input data-type="wrap" type="checkbox" class="b3-switch b3-switch--menu" ${colData.wrap ? " checked" : ""}>
</label>
</div>
<div class="b3-menu__items fn__none">
<button class="b3-menu__item" data-type="nobg" data-col-id="${colData.id}">
<span class="block__icon" style="padding: 8px;margin-left: -4px;" data-type="goEditCol">
@ -245,6 +253,7 @@ export const getEditHTML = (options: {
export const bindEditEvent = (options: {
protyle: IProtyle,
data: IAV,
blockID: string,
menuElement: HTMLElement,
isCustomAttr: boolean
}) => {
@ -320,6 +329,24 @@ export const bindEditEvent = (options: {
});
}
const wrapElement = options.menuElement.querySelector('.b3-switch[data-type="wrap"]') as HTMLInputElement;
if (wrapElement) {
wrapElement.addEventListener("change", () => {
transaction(options.protyle, [{
action: "setAttrViewColWrap",
id: colId,
avID,
data: wrapElement.checked,
blockID: options.blockID
}], [{
action: "setAttrViewColWrap",
id: colId,
avID,
data: !wrapElement.checked,
blockID: options.blockID
}]);
})
}
const addOptionElement = options.menuElement.querySelector('[data-type="addOption"]') as HTMLInputElement;
if (addOptionElement) {
addOptionElement.addEventListener("keydown", (event: KeyboardEvent) => {
@ -365,12 +392,14 @@ export const bindEditEvent = (options: {
protyle: options.protyle,
menuElement: options.menuElement,
data: options.data,
isCustomAttr: options.isCustomAttr
isCustomAttr: options.isCustomAttr,
blockID: options.blockID
});
(options.menuElement.querySelector('[data-type="addOption"]') as HTMLInputElement).focus();
}
});
}
const fillCreatedElement = options.menuElement.querySelector('[data-type="fillCreated"]') as HTMLInputElement;
if (fillCreatedElement) {
fillCreatedElement.addEventListener("change", () => {
@ -840,8 +869,8 @@ export const showColMenu = (protyle: IProtyle, blockElement: Element, cellElemen
menu.addSeparator();
}
menu.addItem({
label: `<label class="fn__flex" style="margin: 4px 0;padding-right: 6px"><span>${window.siyuan.languages.wrap}</span><span class="fn__space fn__flex-1"></span>
<input type="checkbox" class="b3-switch fn__flex-center"${cellElement.dataset.wrap === "true" ? " checked" : ""}></label>`,
label: `<label class="fn__flex"><span class="fn__flex-center">${window.siyuan.languages.wrap}</span><span class="fn__space fn__flex-1"></span>
<input type="checkbox" class="b3-switch b3-switch--menu"${cellElement.dataset.wrap === "true" ? " checked" : ""}></label>`,
bind(element) {
const inputElement = element.querySelector("input") as HTMLInputElement;
inputElement.addEventListener("change", () => {

10
app/src/protyle/render/av/openMenuPanel.ts
View file

@ -162,7 +162,7 @@ export const openMenuPanel = (options: {
if (options.type === "sorts") {
bindSortsEvent(options.protyle, menuElement, data, blockID);
} else if (options.type === "edit") {
bindEditEvent({protyle: options.protyle, data, menuElement, isCustomAttr});
bindEditEvent({protyle: options.protyle, data, menuElement, isCustomAttr, blockID});
} else if (options.type === "config") {
bindViewEvent({protyle: options.protyle, data, menuElement, blockElement: options.blockElement});
}
@ -358,7 +358,7 @@ export const openMenuPanel = (options: {
colId,
isCustomAttr
});
bindEditEvent({protyle: options.protyle, data, menuElement, isCustomAttr});
bindEditEvent({protyle: options.protyle, data, menuElement, isCustomAttr, blockID});
}
return;
}
@ -823,7 +823,7 @@ export const openMenuPanel = (options: {
colId: target.dataset.id,
isCustomAttr
});
bindEditEvent({protyle: options.protyle, data, menuElement, isCustomAttr});
bindEditEvent({protyle: options.protyle, data, menuElement, isCustomAttr, blockID});
setPosition(menuElement, tabRect.right - menuElement.clientWidth, tabRect.bottom, tabRect.height);
event.preventDefault();
event.stopPropagation();
@ -940,7 +940,7 @@ export const openMenuPanel = (options: {
colId,
isCustomAttr
});
bindEditEvent({protyle: options.protyle, data, menuElement, isCustomAttr});
bindEditEvent({protyle: options.protyle, data, menuElement, isCustomAttr, blockID});
} else {
menuElement.innerHTML = getPropertiesHTML(data.view);
}
@ -972,7 +972,7 @@ export const openMenuPanel = (options: {
colId,
isCustomAttr
});
bindEditEvent({protyle: options.protyle, data, menuElement, isCustomAttr});
bindEditEvent({protyle: options.protyle, data, menuElement, isCustomAttr, blockID});
} else {
menuElement.innerHTML = getPropertiesHTML(data.view);
}

7
app/src/protyle/render/av/select.ts
View file

@ -135,6 +135,7 @@ export const setColOption = (protyle: IProtyle, data: IAV, target: HTMLElement,
if (!menuElement) {
return;
}
const blockID = blockElement.getAttribute("data-node-id");
const colId = cellElements ? cellElements[0].dataset.colId : menuElement.querySelector(".b3-menu__item").getAttribute("data-col-id");
let name = target.parentElement.dataset.name;
let color = target.parentElement.dataset.color;
@ -189,7 +190,7 @@ export const setColOption = (protyle: IProtyle, data: IAV, target: HTMLElement,
});
if (!cellElements) {
menuElement.innerHTML = getEditHTML({protyle, data, colId, isCustomAttr});
bindEditEvent({protyle, data, menuElement, isCustomAttr});
bindEditEvent({protyle, data, menuElement, isCustomAttr, blockID});
} else {
cellElements.forEach((cellElement: HTMLMediaElement) => {
data.view.rows.find(row => {
@ -267,7 +268,7 @@ export const setColOption = (protyle: IProtyle, data: IAV, target: HTMLElement,
});
if (!cellElements) {
menuElement.innerHTML = getEditHTML({protyle, data, colId, isCustomAttr});
bindEditEvent({protyle, data, menuElement, isCustomAttr});
bindEditEvent({protyle, data, menuElement, isCustomAttr, blockID});
} else {
cellElements.forEach((cellElement: HTMLElement) => {
data.view.rows.find(row => {
@ -346,7 +347,7 @@ export const setColOption = (protyle: IProtyle, data: IAV, target: HTMLElement,
});
if (!cellElements) {
menuElement.innerHTML = getEditHTML({protyle, data, colId, isCustomAttr});
bindEditEvent({protyle, data, menuElement, isCustomAttr});
bindEditEvent({protyle, data, menuElement, isCustomAttr, blockID});
} else {
cellElements.forEach((cellElement: HTMLElement) => {
data.view.rows.find(row => {