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

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

Browse source
This commit is contained in:
Vanessa 2023-12-08 22:54:18 +08:00
parent d5c029962e
commit 8051f03ccc
3 changed files with 66 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -135,7 +135,12 @@ export const avClick = (protyle: IProtyle, event: MouseEvent & { target: HTMLEle
event.stopPropagation();
return true;
} else if (type === "set-page-size") {
setPageSize(target, protyle, blockElement.getAttribute("data-av-id"));
setPageSize({
target,
protyle,
avID: blockElement.getAttribute("data-av-id"),
nodeElement: blockElement
});
event.preventDefault();
event.stopPropagation();
return true;

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

@ -574,7 +574,12 @@ export const openMenuPanel = (options: {
event.stopPropagation();
break;
} else if (type === "set-page-size") {
setPageSize(target, options.protyle, avID);
setPageSize({
target,
protyle: options.protyle,
avID,
nodeElement: options.blockElement
});
event.preventDefault();
event.stopPropagation();
break;

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

@ -122,61 +122,97 @@ export const stickyRow = (blockElement: HTMLElement, elementRect: DOMRect, statu
}
};
const updatePageSize = (currentPageSIze: string, newPageSize: string, protyle: IProtyle, avID: string) => {
if (currentPageSIze === newPageSize) {
const updatePageSize = (options: {
currentPageSize: string,
newPageSize: string,
protyle: IProtyle,
avID: string,
nodeElement: Element
}) => {
if (options.currentPageSize === options.newPageSize) {
return;
}
transaction(protyle, [{
options.nodeElement.setAttribute("data-page-size", options.newPageSize);
transaction(options.protyle, [{
action: "setAttrViewPageSize",
avID,
data: parseInt(newPageSize),
avID: options.avID,
data: parseInt(options.newPageSize),
}], [{
action: "setAttrViewPageSize",
data: parseInt(currentPageSIze),
avID,
data: parseInt(options.currentPageSize),
avID: options.avID,
}]);
document.querySelector(".av__panel")?.remove();
};
export const setPageSize = (target: HTMLElement, protyle: IProtyle, avID: string) => {
export const setPageSize = (options: {
target: HTMLElement,
protyle: IProtyle,
avID: string,
nodeElement: Element
}) => {
const menu = new Menu("av-page-size");
if (menu.isOpen) {
return;
}
const currentPageSIze = target.dataset.size;
const currentPageSize = options.target.dataset.size;
menu.addItem({
iconHTML: "",
label: "10",
accelerator: currentPageSIze === "10" ? '<svg class="svg" style="height: 30px; float: left;"><use xlink:href="#iconSelect"></use></svg>' : undefined,
accelerator: currentPageSize === "10" ? '<svg class="svg" style="height: 30px; float: left;"><use xlink:href="#iconSelect"></use></svg>' : undefined,
click() {
updatePageSize(currentPageSIze, "10", protyle, avID);
updatePageSize({
currentPageSize,
newPageSize: "10",
protyle: options.protyle,
avID: options.avID,
nodeElement: options.nodeElement
});
}
});
menu.addItem({
iconHTML: "",
accelerator: currentPageSIze === "25" ? '<svg class="svg" style="height: 30px; float: left;"><use xlink:href="#iconSelect"></use></svg>' : undefined,
accelerator: currentPageSize === "25" ? '<svg class="svg" style="height: 30px; float: left;"><use xlink:href="#iconSelect"></use></svg>' : undefined,
label: "25",
click() {
updatePageSize(currentPageSIze, "25", protyle, avID);
updatePageSize({
currentPageSize,
newPageSize: "25",
protyle: options.protyle,
avID: options.avID,
nodeElement: options.nodeElement
});
}
});
menu.addItem({
iconHTML: "",
accelerator: currentPageSIze === "50" ? '<svg class="svg" style="height: 30px; float: left;"><use xlink:href="#iconSelect"></use></svg>' : undefined,
accelerator: currentPageSize === "50" ? '<svg class="svg" style="height: 30px; float: left;"><use xlink:href="#iconSelect"></use></svg>' : undefined,
label: "50",
click() {
updatePageSize(currentPageSIze, "50", protyle, avID);
updatePageSize({
currentPageSize,
newPageSize: "50",
protyle: options.protyle,
avID: options.avID,
nodeElement: options.nodeElement
});
}
});
menu.addItem({
iconHTML: "",
accelerator: currentPageSIze === "100" ? '<svg class="svg" style="height: 30px; float: left;"><use xlink:href="#iconSelect"></use></svg>' : undefined,
accelerator: currentPageSize === "100" ? '<svg class="svg" style="height: 30px; float: left;"><use xlink:href="#iconSelect"></use></svg>' : undefined,
label: "100",
click() {
updatePageSize(currentPageSIze, "100", protyle, avID);
updatePageSize({
currentPageSize,
newPageSize: "100",
protyle: options.protyle,
avID: options.avID,
nodeElement: options.nodeElement
});
}
});
const rect = target.getBoundingClientRect();
const rect = options.target.getBoundingClientRect();
menu.open({
x: rect.left,
y: rect.bottom