From cb806642e37bd6f32fab2240a3bd32cbb9e743f9 Mon Sep 17 00:00:00 2001 From: BTMuli Date: Fri, 2 Jan 2026 23:19:25 +0800 Subject: [PATCH] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20=E9=87=8D=E6=9E=84?= =?UTF-8?q?=E5=BC=B9=E7=AA=97=E5=8F=82=E6=95=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit #201 --- src/components/func/dialog.ts | 55 +++++++++++++++++++++++++++++----- src/components/func/dialog.vue | 21 +++++++++++-- 2 files changed, 65 insertions(+), 11 deletions(-) diff --git a/src/components/func/dialog.ts b/src/components/func/dialog.ts index a345e6e4..35a82315 100644 --- a/src/components/func/dialog.ts +++ b/src/components/func/dialog.ts @@ -1,27 +1,39 @@ /** * dialog 组件封装,函数式调用 - * @since Beta v0.6.3 + * @since Beta v0.9.1 */ -import { h, render } from "vue"; import type { ComponentInternalInstance, VNode } from "vue"; +import { h, render } from "vue"; import dialog from "./dialog.vue"; const dialogId = "tg-func-dialog"; export type DialogParams = DialogCheckParams | DialogInputParams; -export type DialogCheckParams = { - mode: "check"; +/** 基础弹窗参数 */ +type DialogBaseParams = { + /** 标题 */ title: string; + /** 文本 */ text?: string; + /** 点击外部取消 */ otcancel?: boolean; + /** 确认label */ + confirmLabel?: string; + /** 取消label */ + cancelLabel?: string; }; -export type DialogInputParams = { +/** 确认弹窗 */ +export type DialogCheckParams = DialogBaseParams & { + /** 模式:确认 */ + mode: "check"; +}; +/** 输入弹窗 */ +export type DialogInputParams = DialogBaseParams & { + /** 模式:输入 */ mode: "input"; - title: string; - text?: string; - otcancel?: boolean; + /** 默认值 */ input?: string; }; @@ -78,6 +90,17 @@ async function showDialogCheck( } } +async function showDialogCheckFull(opts: DialogBaseParams): Promise { + const params: DialogCheckParams = { mode: "check", ...opts }; + if (dialogInstance !== undefined) { + const boxVue = dialogInstance.component; + return await boxVue.exposeProxy.displayCheckBox(params); + } else { + dialogInstance = renderBox(params); + return await showDialogCheckFull(opts); + } +} + async function showDialogInput( title: string, text?: string, @@ -100,10 +123,26 @@ async function showDialogInput( } } +async function showDialogInputFull( + opts: DialogBaseParams, + input?: string, +): Promise { + const params: DialogInputParams = { mode: "input", input, ...opts }; + if (dialogInstance !== undefined) { + const boxVue = dialogInstance.component; + return await boxVue.exposeProxy.displayInputBox(params); + } else { + dialogInstance = renderBox(params); + return await showDialogInputFull(opts); + } +} + const showDialog = { _: showDialogFull, check: showDialogCheck, input: showDialogInput, + inputF: showDialogInputFull, + checkF: showDialogCheckFull, }; export default showDialog; diff --git a/src/components/func/dialog.vue b/src/components/func/dialog.vue index fee80032..53987ca0 100644 --- a/src/components/func/dialog.vue +++ b/src/components/func/dialog.vue @@ -22,8 +22,12 @@ />
- - + +
@@ -35,7 +39,14 @@ import { computed, onMounted, ref, shallowRef, useTemplateRef, watch } from "vue import type { DialogCheckParams, DialogInputParams, DialogParams } from "./dialog.js"; -const defaultProp: DialogParams = { title: "", text: "", mode: "check", otcancel: false }; +const defaultProp: DialogParams = { + title: "", + text: "", + mode: "check", + otcancel: false, + cancelLabel: "取消", + confirmLabel: "确认", +}; const props = defineProps(); // 组件参数 @@ -101,6 +112,8 @@ async function displayCheckBox(params: DialogCheckParams): Promise((resolve) => { @@ -120,6 +133,8 @@ async function displayInputBox(params: DialogInputParams): Promise