Dialog 对话框

在保留当前页面状态的情况下，告知用户并承载相关操作。

基础用法

Dialog 弹出一个对话框，适合需要定制性更大的场景。

Dialog 组件的内容可以是任意的，甚至可以是表格或表单，下面是自定义内容的示例。

标题和底部可水平居中。

将 center 设置为 true 即可使标题和底部居中。 align-center 可以使对话框水平垂直居中。

Fyoimiya UI 的 Dialog 支持类似窗口系统的操作体验。

设置 draggable 属性启用拖拽，minimizable 和 maximizable 启用最小化和最大化。

打造沉浸式的 UI 体验。

设置 glass 开启毛玻璃效果，sound 开启打开/关闭音效。

属性名	说明	类型	默认值
model-value / v-model	是否显示 Dialog	boolean	false
title	Dialog 的标题，也可通过具名 slot （见下表）传入	string	—
width	Dialog 的宽度	string / number	50%
fullscreen	是否为全屏 Dialog	boolean	false
top	Dialog CSS 中的 margin-top 值	string	15vh
modal	是否需要遮罩层	boolean	true
modal-class	遮罩层的自定义类名	string	—
lock-scroll	是否在 Dialog 出现时将 body 滚动锁定	boolean	true
open-delay	Dialog 打开的延时时间，单位毫秒	number	0
close-delay	Dialog 关闭的延时时间，单位毫秒	number	0
close-on-click-modal	是否可以通过点击 modal 关闭 Dialog	boolean	true
close-on-press-escape	是否可以通过按下 ESC 关闭 Dialog	boolean	true
show-close	是否显示关闭按钮	boolean	true
before-close	关闭前的回调，会暂停 Dialog 的关闭	function(done)	—
draggable	为 Dialog 启用可拖拽功能	boolean	false
center	是否对头部和底部采用居中布局	boolean	false
align-center	是否水平垂直对齐对话框	boolean	false
destroy-on-close	关闭时销毁 Dialog 中的元素	boolean	false
glass	✨ 是否开启毛玻璃效果	boolean	false
minimizable	✨ 是否显示最小化按钮	boolean	false
maximizable	✨ 是否显示最大化按钮	boolean	false
sound	✨ 是否开启音效	boolean	false
append-to-body	Dialog 自身是否插入至 body 元素上。嵌套的 Dialog 必须指定该属性并赋值为 true	boolean	false
z-index	Dialog 的 z-index	number	2000