用途:Giime 是基于 Element Plus 扩展和增强的内部组件库,所有 el- 组件都有对应的 gm- 版本。本规范要求编写或修改任何涉及 UI 组件的前端代码前必须先阅读,用于统一组件使用方式、减少重复配置。
主要能力与使用原则:优先使用 Giime,如 el-button 换为 gm-button、el-table 换为 gm-table;未列出的 gm-* 组件与 el-* 行为一致,可直接替换。Giime 在 Element Plus 基础上统一了默认行为(如自动 loading、默认 filterable)。Giime 无法满足时可用 Element Plus 原生组件;旧代码保持原样,新代码按规范编写。
插件用法:危险操作(如删除)用 GmConfirmBox 做二次确认,自动处理确认按钮 loading 和禁用,避免重复提交;复制用 GmCopy,自动处理剪切板兼容性并提示成功/失败;消息提示用 GmMessage,默认合并相同消息(grouping: true)。
增强特性:gm-button 异步 @click 自动 loading、disabled 时自动 type='info'、自动 Clarity 事件追踪;gm-select 默认 filterable: true,推荐用 :options 传选项;gm-cascader 默认 filterable: true;gm-table 新增 tableId 属性、默认 scrollbarAlwaysOn: true;gm-upload 支持 v-model:fileList;gm-image 与 gm-image-viewer 新增下载进度、默认工具栏和 download() 方法;gm-popover 新增 before-enter/before-leave/after-enter/after-leave 事件;GmMessageBox 的 alert 默认禁止 Esc 和遮罩关闭,confirm/prompt 默认显示取消按钮。注意 gm-select-v2 未默认开启 filterable。
限制与注意:gm-button 自动 loading 依赖 @click 返回 Promise,$emit() 同步且不返回 Promise,不会触发自动 loading,子组件需用 props 回调函数代替 emit。
文档获取:使用具体组件、Hook 或工具函数时,通过 giime-docs MCP 获取详细用法,调用 get-giime-docs-sidebar 获取完整目录,调用 get-giime-component-doc({ link }) 获取对应 Markdown 文档;若 MCP 未配置,参考 mcp-setup.md 安装。