# Modal ## 控件功能,类型(普通控件或容器控件),父类控件 - **控件功能**:`Modal` 是一个模态对话框控件,用于在页面上显示一个居中的浮动面板,通常用于展示内容、表单或提示信息。支持点击背景关闭、自动打开/关闭、定时关闭等功能。 - **类型**:容器控件(可容纳其他子控件) - **父类控件**:`bricks.BaseModal` ### 初始化参数 | 参数名 | 类型 | 说明 | |------------|------------|------| | `target` | string 或 Layout | 指定模态框挂载的目标容器,默认为 `bricks.Body`(即 body) | | `auto_open` | boolean | 是否在创建后自动调用 `open()` 方法显示模态框,默认为 false | | `auto_close` | boolean | 是否允许点击遮罩层关闭模态框(当前未启用此功能) | | `width` | string/number | 模态框内部面板的宽度,如 `'500px'` 或 `'80%'` | | `height` | string/number | 模态框内部面板的高度 | | `bgcolor` | string | 内部面板的背景色,默认为 `#e8e8e8` | | `title` | string | 模态框标题,会显示在顶部标题栏中 | | `archor` | string | 定位锚点,取值包括 `tl`, `tc`, `tr`, `cl`, `cc`, `cr`, `bl`, `bc`, `br`,默认为 `'cc'`(居中) | > 注:`org_index` 和 `timeout` 在 `BaseModal` 中定义但未在 `Modal` 构造函数注释中列出,可能已弃用或由基类处理。 ### 主要事件 | 事件名 | 触发时机 | |-------------|--------| | `opened` | 调用 `open()` 方法后触发,表示模态框已显示 | | `dismissed` | 调用 `dismiss()` 方法并成功移除模态框后触发 | | `click` | 当用户点击模态框遮罩层时触发(仅当启用了 `auto_close` 功能时绑定,目前被注释) | --- # ModalForm ## 控件功能,类型(容器控件或容器控件),父类控件 - **控件功能**:`ModalForm` 是一个基于弹窗的表单模态框控件,用于快速构建并显示一个包含动态表单的模态窗口。常用于数据录入、配置设置等场景。 - **类型**:容器控件(内部包含 Form 子控件) - **父类控件**:`bricks.PopupWindow` ### 初始化参数 | 参数名 | 类型 | 说明 | |--------------|------------|------| | `auto_open` | boolean | 是否在构造完成后自动打开模态框(通过延迟任务实现) | | `width` | string/number | 表单模态框的宽度 | | `height` | string/number | 表单模态框的高度 | | `bgcolor` | string | 背景色(传递给父类使用) | | `archor` | string | 定位方式,同 `Modal`,控制表单位置 | | `title` | string | 表单标题,显示在表单头部 | | `description` | string | 表单描述文本,显示在标题下方 | | `fields` | array | 表单项配置数组,用于定义输入字段结构 | | `binds` | array | 可选的数据绑定配置,用于关联模型或状态 | | `user_data` | any | 用户自定义数据,可用于扩展用途(当前未直接使用) | | `submit_url` | string (非构造参数) | 提交 URL(需外部设置,用于提交逻辑) | > 注意:`ModalForm` 使用异步方法 `build_form` 延迟 0.2 秒创建表单,确保 DOM 环境准备就绪。 ### 主要事件 | 事件名 | 触发时机 | |-------------|--------| | `submit` | 当表单提交时触发,携带表单数据作为参数 | | `submited` | 当表单完成提交流程后触发(由 Form 的 `submited` 事件转发),携带服务器返回数据 | | `cancel` | 当用户点击取消按钮时触发(绑定到 `dismiss` 方法) | | `dismissed` | 模态框关闭后触发(继承自基类) | > 说明:该控件依赖于 `Form` 控件的事件机制,并对其进行封装和转发。