flame-plus 1.3.6 → 1.3.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CLAUDE.md +112 -0
- package/flameDist/flame-plus.css +1 -1
- package/flameDist/flame-plus.es.js +17418 -4583
- package/flameDist/flame-plus.es.js.map +1 -1
- package/flameDist/flame-plus.umd.js +36 -20
- package/flameDist/flame-plus.umd.js.map +1 -1
- package/package.json +4 -2
package/CLAUDE.md
ADDED
|
@@ -0,0 +1,112 @@
|
|
|
1
|
+
# CLAUDE.md
|
|
2
|
+
|
|
3
|
+
This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
|
|
4
|
+
|
|
5
|
+
**始终使用简体中文与我对话,并在回答时保持专业、简洁。**
|
|
6
|
+
|
|
7
|
+
## 项目概述
|
|
8
|
+
|
|
9
|
+
Flame-Plus 是基于 Vue 3 + Element-Plus 二次开发的组件库(当前版本 1.3.7),用于配合 Sparks 后台快速开发框架,通过 `PageRouter.vue` 等页面动态配置前端界面。核心理念是**配置驱动**——通过 JSON 配置对象控制组件行为,实现动态页面生成。
|
|
10
|
+
|
|
11
|
+
## 常用命令
|
|
12
|
+
|
|
13
|
+
```bash
|
|
14
|
+
npm run dev # 启动 Vite 开发服务器
|
|
15
|
+
npm run build # 打包为 ES + UMD 格式,输出到 flameDist/
|
|
16
|
+
npm run preview # 预览打包结果
|
|
17
|
+
npm run gen <name> # 生成新的基础组件脚手架(scripts/gc.sh)
|
|
18
|
+
```
|
|
19
|
+
|
|
20
|
+
没有配置测试命令(虽然 gc.sh 会生成 vitest 测试文件骨架,但项目未配置测试运行器)。
|
|
21
|
+
|
|
22
|
+
## 架构
|
|
23
|
+
|
|
24
|
+
### 三层组件体系
|
|
25
|
+
|
|
26
|
+
```
|
|
27
|
+
src/packages/
|
|
28
|
+
├── components/
|
|
29
|
+
│ ├── base/ → 基础组件:对 Element-Plus 原生组件的封装
|
|
30
|
+
│ ├── complex/ → 复合组件:组合多个基础组件的业务组件
|
|
31
|
+
│ └── page/ → 页面组件:完整的可配置业务页面
|
|
32
|
+
├── types/ → 本地 TypeScript 类型(ControlTypes 枚举、FormConfig 等)
|
|
33
|
+
├── utils/ → 工具函数(filterConfig、format)
|
|
34
|
+
├── eutils/ → 从 @vueuse/core 引入的工具
|
|
35
|
+
├── plugins/ → 插件配置(TinyMCE)
|
|
36
|
+
└── index.ts → 主入口,定义 install() 和所有组件导出
|
|
37
|
+
```
|
|
38
|
+
|
|
39
|
+
### 基础组件模式(base)
|
|
40
|
+
|
|
41
|
+
每个基础组件是对 Element-Plus 组件的 config 封装。核心模式:
|
|
42
|
+
|
|
43
|
+
1. 接收单一 `config` prop(类型来自 `flame-types` 包,如 `InputConfig`)
|
|
44
|
+
2. 使用 `filterConfig(defaultConfig, props.config)` 合并默认配置与用户配置
|
|
45
|
+
3. 使用 TSX render function 渲染对应的 `el-*` 组件
|
|
46
|
+
4. 通过 emit 向上传递事件
|
|
47
|
+
|
|
48
|
+
```vue
|
|
49
|
+
<!-- 典型基础组件结构(TSX) -->
|
|
50
|
+
<script lang="tsx">
|
|
51
|
+
import { InputConfig, inputDefaultConfig } from 'flame-types'
|
|
52
|
+
import { filterConfig } from '../../../utils'
|
|
53
|
+
|
|
54
|
+
const inputConfig = computed(() => filterConfig(inputDefaultConfig, props.config))
|
|
55
|
+
return () => <el-input {...inputConfig.value} {...events} />
|
|
56
|
+
</script>
|
|
57
|
+
```
|
|
58
|
+
|
|
59
|
+
### 复合组件(complex)
|
|
60
|
+
|
|
61
|
+
- **flmForm**:配置驱动表单,根据 `ControlTypes` 枚举动态渲染不同控件
|
|
62
|
+
- **flmTable**:可编辑表格,支持排序、过滤、自定义列渲染
|
|
63
|
+
- **flmSearch**:搜索表单,支持默认字段 + 抽屉式额外字段
|
|
64
|
+
- **flmSearchSelect**:搜索页选择,集成 flame-request 发起 API 请求
|
|
65
|
+
- **flmModuleForm**:模块化复杂表单,支持表单+表格嵌套、Tab 页签
|
|
66
|
+
- **FlmToolbar**:工具栏
|
|
67
|
+
|
|
68
|
+
### 页面组件(page)
|
|
69
|
+
|
|
70
|
+
- **flmReportPage**:完整报表页面(搜索 + 表格 + 工具栏 + 对话框 + 分页),是最核心的高层组件
|
|
71
|
+
- **flmExportPage**:导出页面
|
|
72
|
+
|
|
73
|
+
### 组件注册机制
|
|
74
|
+
|
|
75
|
+
`install()` 函数支持三个可选参数:
|
|
76
|
+
```typescript
|
|
77
|
+
install(app, plugins?, components?, elementPlusIconsVue?)
|
|
78
|
+
```
|
|
79
|
+
- `plugins`:Vue 插件数组
|
|
80
|
+
- `components`:自定义组件数组,与内置组件合并
|
|
81
|
+
- `elementPlusIconsVue`:Element-Plus 图标组件
|
|
82
|
+
|
|
83
|
+
## 关键依赖
|
|
84
|
+
|
|
85
|
+
| 包 | 用途 |
|
|
86
|
+
|---|---|
|
|
87
|
+
| `flame-types` | 所有组件的配置类型定义和默认配置 |
|
|
88
|
+
| `flame-request` | HTTP 请求库,在部分组件中直接使用(外部化,不打包) |
|
|
89
|
+
| `element-plus` | 基础 UI 库(外部化,不打包) |
|
|
90
|
+
| `tinymce` | 富文本编辑器(外部化,不打包) |
|
|
91
|
+
| `dayjs` / `numeral` | 日期/数字格式化 |
|
|
92
|
+
| `bootstrap 4.6.2` | CSS 基础样式 |
|
|
93
|
+
|
|
94
|
+
## 构建配置要点
|
|
95
|
+
|
|
96
|
+
- 入口:`src/packages/index.ts`
|
|
97
|
+
- 输出:`flameDist/flame-plus.es.js` 和 `flameDist/flame-plus.umd.js`
|
|
98
|
+
- 外部化依赖:vue、element-plus、tinymce、flame-request(不打包进库)
|
|
99
|
+
- CSS 不分割(合并到一个文件)
|
|
100
|
+
- 路径别名:`@/` → `src/`
|
|
101
|
+
- 开发代理:`/spark-auth-service`、`/spark-openapi-service`、`/spark-resource-service` → UAT 环境
|
|
102
|
+
|
|
103
|
+
## 编码规范
|
|
104
|
+
|
|
105
|
+
- Prettier:行宽 100、2 空格缩进、单引号、无分号
|
|
106
|
+
- 基础组件使用 `<script lang="tsx">` + `defineComponent` + render function
|
|
107
|
+
- 复合/页面组件使用 `<script setup lang="ts">`
|
|
108
|
+
- 组件命名:基础组件 `flm` 前缀小驼峰(flmInput),复杂独立组件 `Flm` 前缀大驼峰(FlmEditor)
|
|
109
|
+
|
|
110
|
+
## 与 Sparks 后端的关系
|
|
111
|
+
|
|
112
|
+
Flame-Plus 组件(特别是 flmReportPage)通过 Sparks 后端的 `flame_table_info` / `flame_table_info_item` 元数据表驱动页面配置。PageRouter.vue 选择应用和菜单后,根据配置的表名加载对应的搜索、表格、表单等 UI 定义,实现无代码/低代码页面生成。
|
package/flameDist/flame-plus.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.spark-dialog{min-width:800px}[data-v-2ac40a62] .el-upload-list--picture-card{--el-upload-list-picture-card-size: 32px;display:inline-flex;flex-wrap:wrap;margin:0}[data-v-2ac40a62] .el-upload--picture-card{--el-upload-picture-card-size: 32px;background-color:var(--el-fill-color-lighter);border:1px dashed var(--el-border-color-darker);border-radius:6px;box-sizing:border-box;width:var(--el-upload-picture-card-size);height:var(--el-upload-picture-card-size);cursor:pointer;vertical-align:top;display:inline-flex;justify-content:center;align-items:center}[data-v-2ac40a62] .el-upload-list--picture-card .el-upload-list__item-actions{position:absolute;width:100%;height:100%;left:0;top:0;cursor:default;display:inline-flex;flex-wrap:nowrap;flex-direction:column;justify-content:center;color:#fff;opacity:0;font-size:10px;background-color:var(--el-overlay-color-lighter);transition:opacity var(--el-transition-duration)}.component[data-v-2ac40a62]{display:flex;justify-content:center}.component .preview[data-v-2ac40a62]{margin-left:10px;width:32px;height:32px}.component .remove[data-v-2ac40a62]{color:red;margin-left:10px;width:32px;height:32px}.default-form[data-v-e30bb619] .el-form-item{width:calc((100% - 32px * var(--2e850991)) / var(--2e850991))}.default-form .form-buttons[data-v-e30bb619]{width:100%}.default-form .form-buttons[data-v-e30bb619] .el-form-item__content{flex-direction:row-reverse}.default-form .form-buttons .buttons[data-v-e30bb619]{margin-left:10px}.default-form .form-buttons .buttons[data-v-e30bb619]:first-child{margin-left:10px;margin-right:30px}.default-form .form-buttons .buttons[data-v-e30bb619]:last-child{margin-left:0}.search-form .search-form-item[data-v-e30bb619]{margin-right:10px;min-width:140px;width:20%}.search-form .search-buttons[data-v-e30bb619]{margin-right:10px}.buttons[data-v-e30bb619]{margin-left:10px}.buttons[data-v-e30bb619]:first-child{margin-left:0}.form-item-editor[data-v-e30bb619]{margin-top:1rem;width:calc(100% - 32px)}.preview[data-v-e30bb619]{margin-left:10px;width:32px;height:32px}.full-row[data-v-e30bb619] .el-button,.full-row[data-v-e30bb619] .el-cascader,.full-row[data-v-e30bb619] .el-checkbox,.full-row[data-v-e30bb619] .el-color-picker,.full-row[data-v-e30bb619] .el-input,.full-row[data-v-e30bb619] .el-input-number,.full-row[data-v-e30bb619] .el-radio,.full-row[data-v-e30bb619] .el-rate,.full-row[data-v-e30bb619] .el-read,.full-row[data-v-e30bb619] .el-select,.full-row[data-v-e30bb619] .el-slider,.full-row[data-v-e30bb619] .el-switch,.full-row[data-v-e30bb619] .el-time-picker,.full-row[data-v-e30bb619] .el-time-select{width:100%}.header-add[data-v-2327bbfd]{display:flex}.header-add[data-v-2327bbfd] .el-cascader{width:120px;margin-right:4px}.toolbar[data-v-cdd04d10]{min-width:300px;display:flex;align-items:center}.toolbar .dropdown[data-v-cdd04d10]{margin-left:10px}.search-toobar[data-v-cdd04d10]{text-align:right}.search-toobar .dropdown[data-v-cdd04d10]{margin-left:10px}.report-page[data-v-4bddcaea]{display:grid;grid-template-columns:repeat(24,1fr);grid-template-rows:50px 1fr 50px;padding:10px;border-radius:2px;background:#fff}.report-page .page-header[data-v-4bddcaea]{display:flex;align-items:center;justify-content:space-between}.report-page .page-header .page-toolbar[data-v-4bddcaea]{margin-bottom:18px}.report-page .page-header[data-v-4bddcaea],.report-page .page-table[data-v-4bddcaea],.report-page .page-pagination[data-v-4bddcaea]{grid-column:span 24}.report-page .page-pagination[data-v-4bddcaea]{align-self:end;justify-self:end}.export-page[data-v-034c1907]{display:grid;grid-template-columns:repeat(24,1fr);grid-template-rows:50px 1fr 50px;padding:20px;border-radius:2px;background:#fff}.export-page .page-header[data-v-034c1907]{display:flex;align-items:center;justify-content:space-between}.export-page .page-header .page-toolbar[data-v-034c1907]{margin-bottom:18px}.export-page .page-header[data-v-034c1907],.export-page .page-table[data-v-034c1907],.export-page .page-pagination[data-v-034c1907]{grid-column:span 24}.export-page .page-pagination[data-v-034c1907]{align-self:end;justify-self:end}
|
|
1
|
+
@charset "UTF-8";.spark-dialog{min-width:800px}[data-v-2ac40a62] .el-upload-list--picture-card{--el-upload-list-picture-card-size: 32px;display:inline-flex;flex-wrap:wrap;margin:0}[data-v-2ac40a62] .el-upload--picture-card{--el-upload-picture-card-size: 32px;background-color:var(--el-fill-color-lighter);border:1px dashed var(--el-border-color-darker);border-radius:6px;box-sizing:border-box;width:var(--el-upload-picture-card-size);height:var(--el-upload-picture-card-size);cursor:pointer;vertical-align:top;display:inline-flex;justify-content:center;align-items:center}[data-v-2ac40a62] .el-upload-list--picture-card .el-upload-list__item-actions{position:absolute;width:100%;height:100%;left:0;top:0;cursor:default;display:inline-flex;flex-wrap:nowrap;flex-direction:column;justify-content:center;color:#fff;opacity:0;font-size:10px;background-color:var(--el-overlay-color-lighter);transition:opacity var(--el-transition-duration)}.component[data-v-2ac40a62]{display:flex;justify-content:center}.component .preview[data-v-2ac40a62]{margin-left:10px;width:32px;height:32px}.component .remove[data-v-2ac40a62]{color:red;margin-left:10px;width:32px;height:32px}.default-form[data-v-e30bb619] .el-form-item{width:calc((100% - 32px * var(--2e850991)) / var(--2e850991))}.default-form .form-buttons[data-v-e30bb619]{width:100%}.default-form .form-buttons[data-v-e30bb619] .el-form-item__content{flex-direction:row-reverse}.default-form .form-buttons .buttons[data-v-e30bb619]{margin-left:10px}.default-form .form-buttons .buttons[data-v-e30bb619]:first-child{margin-left:10px;margin-right:30px}.default-form .form-buttons .buttons[data-v-e30bb619]:last-child{margin-left:0}.search-form .search-form-item[data-v-e30bb619]{margin-right:10px;min-width:140px;width:20%}.search-form .search-buttons[data-v-e30bb619]{margin-right:10px}.buttons[data-v-e30bb619]{margin-left:10px}.buttons[data-v-e30bb619]:first-child{margin-left:0}.form-item-editor[data-v-e30bb619]{margin-top:1rem;width:calc(100% - 32px)}.preview[data-v-e30bb619]{margin-left:10px;width:32px;height:32px}.full-row[data-v-e30bb619] .el-button,.full-row[data-v-e30bb619] .el-cascader,.full-row[data-v-e30bb619] .el-checkbox,.full-row[data-v-e30bb619] .el-color-picker,.full-row[data-v-e30bb619] .el-input,.full-row[data-v-e30bb619] .el-input-number,.full-row[data-v-e30bb619] .el-radio,.full-row[data-v-e30bb619] .el-rate,.full-row[data-v-e30bb619] .el-read,.full-row[data-v-e30bb619] .el-select,.full-row[data-v-e30bb619] .el-slider,.full-row[data-v-e30bb619] .el-switch,.full-row[data-v-e30bb619] .el-time-picker,.full-row[data-v-e30bb619] .el-time-select{width:100%}.header-add[data-v-2327bbfd]{display:flex}.header-add[data-v-2327bbfd] .el-cascader{width:120px;margin-right:4px}.toolbar[data-v-cdd04d10]{min-width:300px;display:flex;align-items:center}.toolbar .dropdown[data-v-cdd04d10]{margin-left:10px}.search-toobar[data-v-cdd04d10]{text-align:right}.search-toobar .dropdown[data-v-cdd04d10]{margin-left:10px}.report-page[data-v-4bddcaea]{display:grid;grid-template-columns:repeat(24,1fr);grid-template-rows:50px 1fr 50px;padding:10px;border-radius:2px;background:#fff}.report-page .page-header[data-v-4bddcaea]{display:flex;align-items:center;justify-content:space-between}.report-page .page-header .page-toolbar[data-v-4bddcaea]{margin-bottom:18px}.report-page .page-header[data-v-4bddcaea],.report-page .page-table[data-v-4bddcaea],.report-page .page-pagination[data-v-4bddcaea]{grid-column:span 24}.report-page .page-pagination[data-v-4bddcaea]{align-self:end;justify-self:end}.export-page[data-v-034c1907]{display:grid;grid-template-columns:repeat(24,1fr);grid-template-rows:50px 1fr 50px;padding:20px;border-radius:2px;background:#fff}.export-page .page-header[data-v-034c1907]{display:flex;align-items:center;justify-content:space-between}.export-page .page-header .page-toolbar[data-v-034c1907]{margin-bottom:18px}.export-page .page-header[data-v-034c1907],.export-page .page-table[data-v-034c1907],.export-page .page-pagination[data-v-034c1907]{grid-column:span 24}.export-page .page-pagination[data-v-034c1907]{align-self:end;justify-self:end}.panel-title[data-v-9ed04b6b]{padding:12px 16px;font-weight:600;font-size:14px;border-bottom:1px solid var(--el-border-color-lighter)}.widget-panel[data-v-9ed04b6b]{width:280px;flex-shrink:0;background:var(--el-fill-color-blank);border-right:1px solid var(--el-border-color-lighter);display:flex;flex-direction:column;overflow:hidden}.widget-panel .panel-title[data-v-9ed04b6b]{flex-shrink:0}.widget-group-title[data-v-9ed04b6b]{padding:8px 16px 4px;font-size:12px;color:var(--el-text-color-secondary);font-weight:600}.widget-palette[data-v-9ed04b6b]{list-style:none;padding:12px;margin:0;overflow:auto;display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.widget-palette-item[data-v-9ed04b6b]{display:flex;align-items:center;gap:8px;padding:10px 12px;background:var(--el-fill-color-light);border:1px solid var(--el-border-color-lighter);border-radius:6px;cursor:grab;font-size:13px}.widget-palette-item[data-v-9ed04b6b]:active{cursor:grabbing}.widget-palette-item[data-v-9ed04b6b]:hover{border-color:var(--el-color-primary);background:var(--el-color-primary-light-9)}.widget-icon[data-v-9ed04b6b]{font-size:16px}.vue-grid-item[data-v-99aff433]{transition:all .2s ease;transition-property:left,top,right}.vue-grid-item.no-touch[data-v-99aff433]{touch-action:none}.vue-grid-item.cssTransforms[data-v-99aff433]{transition-property:transform;left:0;right:auto}.vue-grid-item.cssTransforms.render-rtl[data-v-99aff433]{left:auto;right:0}.vue-grid-item.resizing[data-v-99aff433]{opacity:.6;z-index:3}.vue-grid-item.vue-draggable-dragging[data-v-99aff433]{transition:none;z-index:3}.vue-grid-item.vue-grid-placeholder[data-v-99aff433]{background:red;opacity:.2;transition-duration:.1s;z-index:2;-webkit-user-select:none;user-select:none}.vue-grid-item>.vue-resizable-handle[data-v-99aff433]{position:absolute;width:20px;height:20px;bottom:0;right:0;background:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/Pg08IS0tIEdlbmVyYXRvcjogQWRvYmUgRmlyZXdvcmtzIENTNiwgRXhwb3J0IFNWRyBFeHRlbnNpb24gYnkgQWFyb24gQmVhbGwgKGh0dHA6Ly9maXJld29ya3MuYWJlYWxsLmNvbSkgLiBWZXJzaW9uOiAwLjYuMSAgLS0+DTwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DTxzdmcgaWQ9IlVudGl0bGVkLVBhZ2UlMjAxIiB2aWV3Qm94PSIwIDAgNiA2IiBzdHlsZT0iYmFja2dyb3VuZC1jb2xvcjojZmZmZmZmMDAiIHZlcnNpb249IjEuMSINCXhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHhtbDpzcGFjZT0icHJlc2VydmUiDQl4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjZweCIgaGVpZ2h0PSI2cHgiDT4NCTxnIG9wYWNpdHk9IjAuMzAyIj4NCQk8cGF0aCBkPSJNIDYgNiBMIDAgNiBMIDAgNC4yIEwgNCA0LjIgTCA0LjIgNC4yIEwgNC4yIDAgTCA2IDAgTCA2IDYgTCA2IDYgWiIgZmlsbD0iIzAwMDAwMCIvPg0JPC9nPg08L3N2Zz4=);background-position:bottom right;padding:0 3px 3px 0;background-repeat:no-repeat;background-origin:content-box;box-sizing:border-box;cursor:se-resize}.vue-grid-item>.vue-rtl-resizable-handle[data-v-99aff433]{bottom:0;left:0;background:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAuMDAwMDAwMDAwMDAwMDAyIiBoZWlnaHQ9IjEwLjAwMDAwMDAwMDAwMDAwMiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KIDwhLS0gQ3JlYXRlZCB3aXRoIE1ldGhvZCBEcmF3IC0gaHR0cDovL2dpdGh1Yi5jb20vZHVvcGl4ZWwvTWV0aG9kLURyYXcvIC0tPgogPGc+CiAgPHRpdGxlPmJhY2tncm91bmQ8L3RpdGxlPgogIDxyZWN0IGZpbGw9Im5vbmUiIGlkPSJjYW52YXNfYmFja2dyb3VuZCIgaGVpZ2h0PSIxMiIgd2lkdGg9IjEyIiB5PSItMSIgeD0iLTEiLz4KICA8ZyBkaXNwbGF5PSJub25lIiBvdmVyZmxvdz0idmlzaWJsZSIgeT0iMCIgeD0iMCIgaGVpZ2h0PSIxMDAlIiB3aWR0aD0iMTAwJSIgaWQ9ImNhbnZhc0dyaWQiPgogICA8cmVjdCBmaWxsPSJ1cmwoI2dyaWRwYXR0ZXJuKSIgc3Ryb2tlLXdpZHRoPSIwIiB5PSIwIiB4PSIwIiBoZWlnaHQ9IjEwMCUiIHdpZHRoPSIxMDAlIi8+CiAgPC9nPgogPC9nPgogPGc+CiAgPHRpdGxlPkxheWVyIDE8L3RpdGxlPgogIDxsaW5lIGNhbnZhcz0iI2ZmZmZmZiIgY2FudmFzLW9wYWNpdHk9IjEiIHN0cm9rZS1saW5lY2FwPSJ1bmRlZmluZWQiIHN0cm9rZS1saW5lam9pbj0idW5kZWZpbmVkIiBpZD0ic3ZnXzEiIHkyPSItNzAuMTc4NDA3IiB4Mj0iMTI0LjQ2NDE3NSIgeTE9Ii0zOC4zOTI3MzciIHgxPSIxNDQuODIxMjg5IiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlPSIjMDAwIiBmaWxsPSJub25lIi8+CiAgPGxpbmUgc3Ryb2tlPSIjNjY2NjY2IiBzdHJva2UtbGluZWNhcD0idW5kZWZpbmVkIiBzdHJva2UtbGluZWpvaW49InVuZGVmaW5lZCIgaWQ9InN2Z181IiB5Mj0iOS4xMDY5NTciIHgyPSIwLjk0NzI0NyIgeTE9Ii0wLjAxODEyOCIgeDE9IjAuOTQ3MjQ3IiBzdHJva2Utd2lkdGg9IjIiIGZpbGw9Im5vbmUiLz4KICA8bGluZSBzdHJva2UtbGluZWNhcD0idW5kZWZpbmVkIiBzdHJva2UtbGluZWpvaW49InVuZGVmaW5lZCIgaWQ9InN2Z183IiB5Mj0iOSIgeDI9IjEwLjA3MzUyOSIgeTE9IjkiIHgxPSItMC42NTU2NCIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2U9IiM2NjY2NjYiIGZpbGw9Im5vbmUiLz4KIDwvZz4KPC9zdmc+);background-position:bottom left;padding-left:3px;background-repeat:no-repeat;background-origin:content-box;cursor:sw-resize;right:auto}.vue-grid-item.disable-userselect[data-v-99aff433]{-webkit-user-select:none;user-select:none}.vue-grid-layout[data-v-a10aee95]{position:relative;transition:height .2s ease}.form-canvas-area[data-v-63673760]{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column;background:var(--el-fill-color-light);border-right:1px solid var(--el-border-color-lighter)}.canvas-toolbar[data-v-63673760]{flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--el-border-color-lighter);background:#fff}.canvas-title[data-v-63673760]{font-weight:600;font-size:14px}.canvas-toolbar-actions[data-v-63673760]{display:flex;align-items:center;gap:8px}.form-canvas[data-v-63673760]{flex:1;min-height:0;padding:10px;overflow:auto;background:#f1f2f3;display:flex;flex-direction:column}.form-widget-container[data-v-63673760]{flex:1;min-height:0;padding:8px;background:#fff;border-radius:4px;display:flex;flex-direction:column}.drop-zone-bar[data-v-63673760]{flex-shrink:0;padding:10px 12px;border-bottom:1px dashed var(--el-border-color-lighter)}.drop-zone-inline[data-v-63673760]{display:flex;align-items:center;justify-content:center;padding:12px 16px;border:1px dashed var(--el-border-color);border-radius:6px;color:var(--el-text-color-secondary);font-size:13px;min-height:52px;width:100%;box-sizing:border-box}.drop-zone-inline[data-v-63673760]:before{content:"请将新增控件拖入此处";pointer-events:none}.form-grid-layout[data-v-63673760]{flex:1;min-height:280px}.grid-widget-wrap[data-v-63673760]{position:relative;width:100%;height:100%;padding:4px 8px;border:1px dashed transparent;border-radius:4px;cursor:pointer;transition:border-color .15s ease,box-shadow .15s ease}.grid-widget-wrap.grid-widget-wrap--selected[data-v-63673760]{border-color:var(--el-color-primary);box-shadow:0 0 0 2px var(--el-color-primary)}.grid-widget-wrap:hover .widget-actions[data-v-63673760],.grid-widget-wrap.grid-widget-wrap--selected .widget-actions[data-v-63673760]{opacity:1}.canvas-form-item[data-v-63673760]{margin-bottom:0}.canvas-form-item[data-v-63673760] .el-form-item__label{font-size:12px}.canvas-form-item[data-v-63673760] .el-input,.canvas-form-item[data-v-63673760] .el-select{width:100%}.form-inner[data-v-63673760]{width:100%;height:100%;min-height:80px;display:flex;flex-direction:column}.form-inner-drop-bar[data-v-63673760]{flex-shrink:0;margin-bottom:8px}.form-inner-drop-zone[data-v-63673760]{min-height:44px;padding:8px 12px;border:1px dashed var(--el-border-color);border-radius:6px;background:var(--el-fill-color-lighter);width:100%;box-sizing:border-box;display:flex;align-items:center}.form-inner-drop-zone[data-v-63673760]:before{content:"将基础控件拖入此处";display:block;color:var(--el-text-color-placeholder);font-size:12px;line-height:1.5;pointer-events:none}.form-inner-grid-layout[data-v-63673760]{flex:1;min-height:120px}.form-inner-buttons[data-v-63673760]{flex-shrink:0;display:flex;justify-content:flex-end;align-items:center;gap:8px;padding:8px 0 0;margin-top:8px;border-top:1px dashed var(--el-border-color-lighter)}.form-inner-control-wrap[data-v-63673760]{position:relative;flex-shrink:0;border:1px dashed transparent;border-radius:4px;cursor:pointer;transition:border-color .15s ease,box-shadow .15s ease}.form-inner-control-wrap.form-inner-control-wrap--selected[data-v-63673760]{border-color:var(--el-color-primary);box-shadow:0 0 0 2px var(--el-color-primary-light-5)}.form-inner-control-wrap:hover .widget-actions[data-v-63673760],.form-inner-control-wrap.form-inner-control-wrap--selected .widget-actions[data-v-63673760]{opacity:1}.widget-actions[data-v-63673760]{position:absolute;bottom:4px;right:4px;display:flex;gap:2px;opacity:0;transition:opacity .15s ease;z-index:2;background:#ffffffe6;padding:2px 4px;border-radius:4px;box-shadow:0 1px 4px #00000014}.default-form[data-v-dc671f45] .el-form-item{width:calc((100% - 32px * var(--7d7e414b)) / var(--7d7e414b))}.default-form .form-buttons[data-v-dc671f45]{width:100%}.default-form .form-buttons[data-v-dc671f45] .el-form-item__content{flex-direction:row-reverse}.default-form .form-buttons .buttons[data-v-dc671f45]{margin-left:10px}.default-form .form-buttons .buttons[data-v-dc671f45]:first-child{margin-left:10px;margin-right:30px}.default-form .form-buttons .buttons[data-v-dc671f45]:last-child{margin-left:0}.search-form .search-form-item[data-v-dc671f45]{margin-right:10px;min-width:140px;width:20%}.search-form .search-buttons[data-v-dc671f45]{margin-right:10px}.buttons[data-v-dc671f45]{margin-left:10px}.buttons[data-v-dc671f45]:first-child{margin-left:0}.form-item-editor[data-v-dc671f45]{margin-top:1rem;width:calc(100% - 32px)}.preview[data-v-dc671f45]{margin-left:10px;width:32px;height:32px}.full-row[data-v-dc671f45] .el-button,.full-row[data-v-dc671f45] .el-cascader,.full-row[data-v-dc671f45] .el-checkbox,.full-row[data-v-dc671f45] .el-color-picker,.full-row[data-v-dc671f45] .el-input,.full-row[data-v-dc671f45] .el-input-number,.full-row[data-v-dc671f45] .el-radio,.full-row[data-v-dc671f45] .el-rate,.full-row[data-v-dc671f45] .el-read,.full-row[data-v-dc671f45] .el-select,.full-row[data-v-dc671f45] .el-slider,.full-row[data-v-dc671f45] .el-switch,.full-row[data-v-dc671f45] .el-time-picker,.full-row[data-v-dc671f45] .el-time-select,.form-items-grid[data-v-dc671f45]{width:100%}.form-items-grid[data-v-dc671f45] .el-form-item{margin-bottom:0}.preview-canvas[data-v-25320f41]{padding:8px 0;min-height:120px}.preview-canvas[data-v-25320f41] .form-items-grid{min-height:80px}.preview-canvas[data-v-25320f41] .el-form-item__label{font-size:12px}.panel-title[data-v-e27ea4f2]{padding:12px 16px;font-weight:600;font-size:14px;border-bottom:1px solid var(--el-border-color-lighter)}.settings-panel[data-v-e27ea4f2]{width:360px;flex-shrink:0;background:var(--el-fill-color-blank);overflow:auto;display:flex;flex-direction:column}.settings-form-wrap[data-v-e27ea4f2]{flex:1;padding:12px 16px;overflow:auto}.attr-group[data-v-e27ea4f2]{border:1px solid var(--el-border-color);border-radius:6px;margin-bottom:12px;overflow:hidden;background:var(--el-fill-color-blank)}.attr-group__header[data-v-e27ea4f2]{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;font-size:13px;font-weight:600;color:var(--el-text-color-primary);background:var(--el-fill-color-light);cursor:pointer;-webkit-user-select:none;user-select:none;border-bottom:1px solid var(--el-border-color)}.attr-group__header[data-v-e27ea4f2]:hover{background:var(--el-fill-color)}.attr-group__title[data-v-e27ea4f2]{flex:1}.attr-group__arrow[data-v-e27ea4f2]{font-size:14px;color:var(--el-text-color-secondary);transition:transform .2s ease}.attr-group__arrow--open[data-v-e27ea4f2]{transform:rotate(90deg)}.attr-group__body[data-v-e27ea4f2]{padding:12px;background:var(--el-fill-color-blank)}.settings-form[data-v-e27ea4f2] .el-form-item{margin-bottom:14px}.settings-empty[data-v-e27ea4f2]{padding:24px 16px;font-size:13px;color:var(--el-text-color-placeholder);text-align:center}.vue-grid-layout{position:relative;transition:height .2s ease}.vue-grid-item{transition:all .2s ease;transition-property:left,top,right}.vue-grid-item.no-touch{touch-action:none}.vue-grid-item.cssTransforms{transition-property:transform;left:0;right:auto}.vue-grid-item.resizing{opacity:.85;z-index:3}.vue-grid-item.vue-draggable-dragging{transition:none;z-index:10;opacity:.95;box-shadow:0 8px 24px #0000002e}.vue-grid-item.vue-grid-placeholder{background:var(--el-color-primary-light-9);border:2px dashed var(--el-color-primary);opacity:.6;transition-duration:.1s;z-index:2;-webkit-user-select:none;user-select:none;border-radius:6px}.vue-grid-item>.vue-resizable-handle{position:absolute;width:20px;height:20px;bottom:0;right:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 6 6'%3E%3Cpath fill='%23000' opacity='.3' d='M 6 6 L 0 6 L 0 4.2 L 4.2 4.2 L 4.2 0 L 6 0 Z'/%3E%3C/svg%3E");background-position:bottom right;padding:0 3px 3px 0;background-repeat:no-repeat;background-origin:content-box;box-sizing:border-box;cursor:se-resize}.form-builder-framework[data-v-bf9fd07a]{height:100vh;overflow:hidden}.framework-lr[data-v-bf9fd07a]{display:flex;height:100%}.settings-form[data-v-bf9fd07a] .el-form-item{margin-bottom:18px}.settings-form--nested[data-v-bf9fd07a] .el-form-item{margin-bottom:14px}.form-buttons-checkboxes[data-v-bf9fd07a]{display:flex;flex-direction:column;gap:8px}.option-row--buttons[data-v-bf9fd07a]{display:flex;flex-wrap:wrap;align-items:center;gap:6px}.option-row--buttons .opt-event[data-v-bf9fd07a]{width:100px}.option-row--buttons .opt-label[data-v-bf9fd07a]{flex:1;min-width:80px}.option-row--buttons .opt-type[data-v-bf9fd07a]{width:90px}
|