Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add parameter dialog to the "confirm" callback #8851

Closed
frostime opened this issue Jul 29, 2023 · 0 comments
Closed

Add parameter dialog to the "confirm" callback #8851

frostime opened this issue Jul 29, 2023 · 0 comments
Assignees
Milestone

Comments

@frostime
Copy link
Contributor

frostime commented Jul 29, 2023

In what scenarios do you need this feature?

希望可以让 confirm API 可以访问对应 dialog 对象,这样可以为这个功能拓展很多。不仅仅是显示文本,还可以和自己传入的 html element 交互。
@Vanessa219

Describe the optimal solution

import {isMobile} from "../util/functions";
import {Dialog} from "./index";

export const confirmDialog = (title: string, text: string, confirm?: () => void, cancel?: () => void) => {
    const dialog = new Dialog({
        title,
        content: `<div class="b3-dialog__content">
    <div class="ft__breakword">${text}</div>
</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" id="confirmDialogConfirmBtn">${window.siyuan.languages.confirm}</button>
</div>`,
        width: isMobile() ? "92vw" : "520px",
    });
    const btnsElement = dialog.element.querySelectorAll(".b3-button");
    btnsElement[0].addEventListener("click", () => {
        if (cancel) {
            cancel();
        }
        dialog.destroy();
    });
    btnsElement[1].addEventListener("click", () => {
        if (confirm) {
            confirm();
        }
        dialog.destroy();
    });
};

confirm();cancel(); 传入 div.ft__breakword HTMLElement 参数。

export const confirmDialog = (title: string, text: string, confirm?: (ele?: HTMLElement) => void, cancel?: (ele?: HTMLElement) => void) => {
    const dialog = new Dialog({
        title,
        content: `<div class="b3-dialog__content">
    <div class="ft__breakword">${text}</div>
</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" id="confirmDialogConfirmBtn">${window.siyuan.languages.confirm}</button>
</div>`,
        width: isMobile() ? "92vw" : "520px",
    });
    const target: HTMLElement = dialog.element.querySelector(".b3-dialog__content>div.ft__breakword");
    const btnsElement = dialog.element.querySelectorAll(".b3-button");
    btnsElement[0].addEventListener("click", () => {
        if (cancel) {
            cancel(target);
        }
        dialog.destroy();
    });
    btnsElement[1].addEventListener("click", () => {
        if (confirm) {
            confirm(target);
        }
        dialog.destroy();
    });
};

Describe the candidate solution

No response

Other information

No response

@frostime frostime changed the title confirm 对话框的回调函数添加 dialog 参数 confirm 对话框的回调函数添加 element 参数 Jul 29, 2023
@Vanessa219 Vanessa219 changed the title confirm 对话框的回调函数添加 element 参数 Add parameter dialog to the "confirm" callback Jul 30, 2023
@Vanessa219 Vanessa219 added this to the 2.9.8 milestone Jul 30, 2023
Vanessa219 added a commit that referenced this issue Jul 30, 2023
Vanessa219 added a commit that referenced this issue Jul 30, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants