Vanessa 2025-12-08 17:10:03 +08:00
parent 269b4072d5
commit a26b7874cf
3 changed files with 43 additions and 22 deletions

View file

@ -7,6 +7,7 @@ import {focusByRange} from "../protyle/util/selection";
import {Constants} from "../constants";
import {Dialog} from "../dialog";
import {showMessage} from "../dialog/message";
import {isMobile} from "../util/functions";
export const initAnno = (element: HTMLElement, pdf: any) => {
getConfig(pdf);
@ -314,7 +315,7 @@ const setRelation = (pdf: any) => {
<div class="fn__hr"></div>
<ul class="b3-list b3-list--background">${getRelationHTML(configItem.ids)}</ul>
</div>`,
width: "520px",
width: isMobile() ? "92vw" : "520px",
});
const addRelation = () => {

View file

@ -13,7 +13,7 @@ import {bindRollupData, getRollupHTML} from "./rollup";
import {Constants} from "../../../constants";
import * as dayjs from "dayjs";
import {setPosition} from "../../../util/setPosition";
import {duplicateNameAddOne} from "../../../util/functions";
import {duplicateNameAddOne, isMobile} from "../../../util/functions";
import {Dialog} from "../../../dialog";
import {escapeAriaLabel, escapeAttr, escapeHtml} from "../../../util/escape";
import {getFieldsByData} from "./view";
@ -1093,7 +1093,7 @@ export const showColMenu = (protyle: IProtyle, blockElement: Element, cellElemen
<div class="fn__hr"></div>
<button class="fn__block b3-button b3-button--cancel">${window.siyuan.languages.cancel}</button>
</div>`,
width: "520px",
width: isMobile() ? "92vw" : "520px",
});
dialog.element.addEventListener("click", (event) => {
let target = event.target as HTMLElement;

View file

@ -4,6 +4,7 @@ import {focusBlock} from "../util/selection";
import {Dialog} from "../../dialog";
import {escapeHtml} from "../../util/escape";
import {Menu} from "../../plugin/Menu";
import {isMobile} from "../../util/functions";
export const updateCalloutType = (titleElement: HTMLElement, protyle: IProtyle) => {
const blockElement = hasClosestBlock(titleElement);
@ -31,41 +32,60 @@ export const updateCalloutType = (titleElement: HTMLElement, protyle: IProtyle)
<span class="fn__space"></span>
<input class="b3-text-field fn__flex-1" value="${titleElement.textContent}" type="text">
</label>
</div>
<div class="b3-dialog__action">
<button class="b3-button b3-button--cancel">${window.siyuan.languages.cancel}</button><div class="fn__space"></div>
<button class="b3-button b3-button--text">${window.siyuan.languages.confirm}</button>
</div>`,
width: "520px",
destroyCallback() {
const oldHTML = blockElement.outerHTML;
blockElement.setAttribute("data-subtype", textElements[0].value.trim());
titleElement.textContent = escapeHtml(textElements[1].value);
if (updateIcon) {
blockElement.querySelector(".callout-icon").textContent = updateIcon;
}
updateTransaction(protyle, blockElement.getAttribute("data-node-id"), blockElement.outerHTML, oldHTML);
focusBlock(blockElement);
width: isMobile() ? "92vw" : "520px",
});
const btnElements = dialog.element.querySelectorAll(".b3-button");
btnElements[0].addEventListener("click", () => {
dialog.destroy();
});
btnElements[1].addEventListener("click", () => {
const oldHTML = blockElement.outerHTML;
blockElement.setAttribute("data-subtype", textElements[0].value.trim());
titleElement.textContent = escapeHtml(textElements[1].value.trim() ||
(textElements[0].value.trim().substring(0, 1).toUpperCase() + textElements[0].value.trim().substring(1).toLowerCase()));
if (updateIcon) {
blockElement.querySelector(".callout-icon").textContent = updateIcon;
}
updateTransaction(protyle, blockElement.getAttribute("data-node-id"), blockElement.outerHTML, oldHTML);
focusBlock(blockElement);
dialog.destroy();
});
const textElements: NodeListOf<HTMLInputElement> = dialog.element.querySelectorAll(".b3-text-field");
dialog.bindInput(textElements[1], () => {
btnElements[1].dispatchEvent(new CustomEvent("click"));
});
textElements[0].focus();
textElements[0].select();
let updateIcon = "";
dialog.element.querySelector(".b3-form__icona-icon").addEventListener("click", (event) => {
const menu = new Menu();
[{
icon: "✏️", type: "NOTE"
icon: "✏️", type: "Note", color: "var(--b3-theme-primary)"
}, {
icon: "💡", type: "TIP"
icon: "💡", type: "Tip", color: "var(--b3-theme-success)"
}, {
icon: "❗", type: "IMPORTANT"
icon: "❗", type: "Important", color: "var(--b3-callout-important)"
}, {
icon: "⚠️", type: "WARNING"
icon: "⚠️", type: "Warning", color: "var(--b3-callout-warning)"
}, {
icon: "🚨", type: "CAUTION"
icon: "🚨", type: "Caution", color: "var(--b3-theme-error)"
}].forEach(item => {
menu.addItem({
iconHTML: `<span class="b3-menu__icon">${item.icon}</span>`,
label: item.type,
iconHTML: `<span class="b3-menu__icon">${item.icon.toUpperCase()}</span>`,
label: `<span style="color: ${item.color}">${item.type}</span>`,
click() {
textElements[0].value = item.type;
textElements[1].value = item.type;
if (textElements[0].value.toLowerCase() === textElements[1].value.toLowerCase()) {
textElements[1].value = item.type;
}
textElements[0].value = item.type.toUpperCase();
updateIcon = item.icon;
textElements[1].focus();
textElements[1].select();
}
});
});