From 239b32fb9542bd114c370e260ea021f4b9cf9321 Mon Sep 17 00:00:00 2001
From: WangLeo <690854599@qq.com>
Date: Wed, 3 Jun 2026 19:00:49 +0800
Subject: [PATCH] =?UTF-8?q?=E9=87=8D=E6=9E=84=20Painting=20=E6=A8=A1?=
 =?UTF-8?q?=E5=9E=8B=E5=8F=82=E6=95=B0=E6=9E=B6=E6=9E=84=EF=BC=9A=E6=AF=8F?=
 =?UTF-8?q?=E6=A8=A1=E5=9E=8B=E7=8B=AC=E7=AB=8B=E9=85=8D=E7=BD=AE=E3=80=81?=
 =?UTF-8?q?=E5=8A=A8=E6=80=81=E5=8F=82=E6=95=B0=E8=A1=A8=E5=8D=95=E3=80=81?=
 =?UTF-8?q?=E7=A7=BB=E9=99=A4=20workflow=20=E9=80=82=E9=85=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 新增 src/config/models/ 每模型独立参数 schema（8 个模型）
- 新增 src/components/dialogBox/params/ 动态参数控件
- 模型选择器改为从 API 获取并按 tag 分组
- dialogBox 参数区改为根据模型 config 动态渲染控件
- createTask.js Painting 直接返回扁平 modelParams，Video 保留旧 workflow
- 删除旧的 proportion/painting.vue 和 quantity 组件
- 更新 CLAUDE.md 架构文档
---
 CLAUDE.md                                     |  78 ++-
 components.d.ts                               |   9 +
 src/components/dialogBox/index.vue            | 160 +++++--
 src/components/dialogBox/model/painting.vue   | 151 +++---
 .../dialogBox/params/NumberInput.vue          |  35 ++
 .../dialogBox/params/ProportionSelect.vue     |  79 +++
 .../dialogBox/params/ResolutionSelect.vue     |  51 ++
 .../dialogBox/params/SelectInput.vue          |  35 ++
 .../dialogBox/params/SwitchInput.vue          |  32 ++
 .../dialogBox/proportion/painting.vue         | 451 ------------------
 src/components/dialogBox/quantity/index.vue   |  66 ---
 src/config/models/flux.js                     |  51 ++
 src/config/models/gpt-image-i2i.js            |  48 ++
 src/config/models/gpt-image.js                |  39 ++
 src/config/models/index.js                    |  30 ++
 src/config/models/jimeng.js                   |  67 +++
 src/config/models/nano-pro.js                 |  40 ++
 src/config/models/qwen-edit.js                |  52 ++
 src/config/models/qwen.js                     |  51 ++
 src/config/models/z-image.js                  |  31 ++
 src/utils/createTask.js                       |  12 +-
 21 files changed, 891 insertions(+), 677 deletions(-)
 create mode 100644 src/components/dialogBox/params/NumberInput.vue
 create mode 100644 src/components/dialogBox/params/ProportionSelect.vue
 create mode 100644 src/components/dialogBox/params/ResolutionSelect.vue
 create mode 100644 src/components/dialogBox/params/SelectInput.vue
 create mode 100644 src/components/dialogBox/params/SwitchInput.vue
 delete mode 100644 src/components/dialogBox/proportion/painting.vue
 delete mode 100644 src/components/dialogBox/quantity/index.vue
 create mode 100644 src/config/models/flux.js
 create mode 100644 src/config/models/gpt-image-i2i.js
 create mode 100644 src/config/models/gpt-image.js
 create mode 100644 src/config/models/index.js
 create mode 100644 src/config/models/jimeng.js
 create mode 100644 src/config/models/nano-pro.js
 create mode 100644 src/config/models/qwen-edit.js
 create mode 100644 src/config/models/qwen.js
 create mode 100644 src/config/models/z-image.js

diff --git a/CLAUDE.md b/CLAUDE.md
index 257feca..e5f0ff5 100644
--- a/CLAUDE.md
+++ b/CLAUDE.md
@@ -18,6 +18,11 @@ Vue 3 (Composition API) + Vite 7 + Pinia + Vue Router + Element Plus + Less + pn
 
 AI 绘画/视频生成前端操作平台，通过 HTTP 接口对接算力调度后端（suanli）和第三方 AI 平台（RunningHub），提交生成任务并轮询结果。
 
+**Painting 和 Video 走两套不同的任务构造路径：**
+
+- **Painting（新架构）**：本地模型参数 schema → 动态表单 → 扁平 API body 提交
+- **Video（旧架构）**：远程 workflow JSON → RunningHub Playload 适配器 → `{ workflowId, nodeInfoList }` body 提交
+
 ### 关键目录
 
 ```
@@ -30,23 +35,58 @@ src/
 ├── apis/                # HTTP API 层：纯请求封装，不含业务逻辑
 │   ├── auth/            # 认证相关（登录、token 校验、用户信息）
 │   └── display/         # 任务创建/轮询/历史、平台模型、收藏/删除
-├── components/          # 通用组件
-│   ├── dialogBox/       # 生成参数输入面板（核心交互入口），含模型选择、比例、上传等子组件
+├── components/
+│   ├── dialogBox/       # 生成参数输入面板（核心交互入口）
+│   │   ├── model/       # 模型选择器（painting 按 tag 分组，video 按 pattern 分组）
+│   │   ├── params/      # 动态参数控件（Painting 新架构）：ProportionSelect、ResolutionSelect、SelectInput 等
+│   │   ├── proportion/  # 比例选择器（仅 video.vue，Video 旧架构）
+│   │   ├── imageUploader/ # 图片上传（Painting）
+│   │   └── videoImageUploader/ # 视频图片上传（Video）
 │   ├── virtual-scroller/# 虚拟滚动列表组件（自定义实现，reverse 模式）
 │   └── canvas/          # 图片画布编辑（圆/矩形选区，局部重绘）
 ├── views/               # 页面（home、login）
 ├── utils/
 │   ├── request.js       # Axios 实例 + 拦截器：统一 Auth（不带 Bearer）+ 按前缀路由 baseURL
 │   ├── websocket.js     # 任务生成入口：组装参数 → 调用 API → 20s 轮询直至完成/失败
-│   ├── modelApi.js      # 模型业务层：localStorage 每日缓存 + 模型名称→UUID 查找
-│   ├── createTask.js    # 调用平台适配器 Playload() 构造任务 body
-│   ├── modelConfig.js   # 从远程 JSON 加载 workflow 配置，localStorage 每日缓存
+│   ├── modelApi.js      # 模型业务层：localStorage 每日缓存 + 模型名称→UUID 查找 + 平台编码映射
+│   ├── createTask.js    # 任务 body 构造：Painting 返回 modelParams，Video 走 Playload 适配器
+│   ├── modelConfig.js   # Video 旧架构：从远程 JSON 加载 workflow 配置（Video 专用）
 │   └── auth.ts          # token 存取工具（localStorage）
 ├── config/
-│   ├── index.js         # 平台配置入口，导出 runninghub 适配器
-│   └── runninghub/      # RunningHub 平台适配器：Playload() 构造和 result() 解析
+│   ├── index.js         # 平台配置入口（目前仅导出 runninghub 供 Video 使用）
+│   ├── runninghub/      # RunningHub 平台适配器：Playload() 构造和 result() 解析（Video 专用）
+│   └── models/          # Painting 模型参数配置：每模型一个 JS 文件，定义 params schema
 ```
 
+### 模型参数配置（Painting 新架构）
+
+`src/config/models/` 下每个模型一个 JS 文件，定义该模型的 API 参数 schema：
+
+```js
+export default {
+  name: 'Flux 2',
+  tag: '文生图',          // 与 API 返回的 tag 对应，用于模型选择器分组
+  inputType: 'text',      // 'text' | 'image' | 'both' — 控制是否显示图片上传
+  maxImages: 4,           // 最大上传图片数（inputType 为 image/both 时有效）
+  params: [
+    {
+      name: 'prompt',     // API 字段名
+      label: '提示词',
+      type: 'string',     // 'string' | 'number' | 'boolean' | 'select' | 'image'
+      required: true,
+      ui: 'textarea',     // 渲染控件：'textarea' | 'proportion' | 'resolution' | 'select' | 'number' | 'switch' | 'imageUpload'
+      default: '',
+      options: [...],     // select 类型的枚举值
+      showWhen: { aspectRatio: 'custom' },  // 条件显示（可选）
+    },
+  ],
+}
+```
+
+- `src/config/models/index.js` 提供 `getModelConfig(modelName)` 查找函数
+- `ui: 'textarea'` 的参数由 Sender 组件承载（prompt），`ui: 'imageUpload'` 由独立上传组件处理，其余渲染为 params/ 下的动态控件
+- 模型选择器从 API（`fetchPlatformModels`）获取模型列表，按 `tag` 字段分组
+
 ### API 层设计原则
 
 - `src/apis/` 中的函数只做**纯 HTTP 调用**（`service.get/post/delete` 等），不包含缓存、localStorage、业务判断等逻辑
@@ -56,14 +96,22 @@ src/
 
 ### 核心数据流
 
-1. 用户在 `dialogBox` 中设置参数（模型、提示词、比例、上传图片等）
-2. 点击生成 → `dialogBox:handleStart()` 组装 data（含 modelId、params、imgs、request）
+**Painting（新架构）：**
+
+1. 用户在 `dialogBox` 中设置参数——模型选择器从 API 获取模型列表按 tag 分组，参数控件根据模型 config 动态渲染
+2. 点击生成 → `dialogBox:handleStart()` 收集 `paramValues`（含 prompt）→ 组装 data（含 `modelParams` 扁平对象）
 3. 调用 `websocket.js:generate(data, generateData)`
-4. `generate()` 内部先通过 `createTask(data)` → `runninghub.Playload()` 构造 RunningHub workflow payload 作为 body
-5. 调用 `modelApi.getModelId(type, modelName)` 查找模型 UUID（带 localStorage 每日缓存）
-6. 调用 `requestCreateTask(body, sessionId)` → POST `/suanli/v1/tasks`（`{ model_id, body, request }`，携带 `X-Session-Id` 用于预扣费）
-7. 返回 task_id → `displayStore.addGeneratingItem()` 在前端列表插入"生成中"条目
-8. 每 20 秒轮询 `requestTaskStatus(taskId)` → GET `/suanli/v1/tasks/{task_id}`，completed 时调用 `updateItemToSuccess()` 更新列表
+4. `generate()` 内部通过 `createTask(data)` → 因 `type === 'Painting'` 直接返回 `data.modelParams` 作为 body
+5. 调用 `modelApi.getModelId(type, modelName)` 查找模型 UUID
+6. 调用 `requestCreateTask(body, sessionId)` → POST `/suanli/v1/tasks`（`{ model_id, body: modelParams, request }`）
+7. 返回 task_id → 轮询直至完成
+
+**Video（旧架构，保留）：**
+
+1. 用户在 `dialogBox` 中设置参数（Pattern、videoModel、比例、时长）
+2. 点击生成 → `dialogBox:handleStart()` 组装 data（含旧 params 数组）
+3. `createTask(data)` → `runninghub.Playload(data)` → `fetchModelConfig()` 获取 workflow JSON → 返回 `{ workflowId, nodeInfoList }`
+4. 后续同 Painting 的步骤 5-7
 
 ### 接口速查
 
@@ -72,7 +120,7 @@ src/
 | `requestCreateTask` | POST `/suanli/v1/tasks` | 创建生成任务 |
 | `requestTaskStatus` | GET `/suanli/v1/tasks/:id` | 查询单个任务状态 |
 | `requestTaskHistory` | GET `/suanli/v1/tasks/history` | 历史任务列表（支持 `user_id`/`platform_code`/`page`/`pageSize`） |
-| `fetchPlatformModels` | GET `/suanli/v1/platforms/:code/models` | 获取平台模型列表 |
+| `fetchPlatformModels` | GET `/suanli/v1/platforms/:code/models` | 获取平台模型列表（返回 `{id, name, tag, disabled?}`） |
 | `cancelOrCollect` | POST `/collect/toggle` | 收藏/取消收藏 |
 | `deleteGenerateHistory` | DELETE `/taskRecordHistory/delete` | 删除历史记录 |
 
diff --git a/components.d.ts b/components.d.ts
index 5fdb244..283a166 100644
--- a/components.d.ts
+++ b/components.d.ts
@@ -18,6 +18,10 @@ declare module 'vue' {
     DialogBox: typeof import('./src/components/dialogBox/index.vue')['default']
     ElButton: typeof import('element-plus/es')['ElButton']
     ElDatePicker: typeof import('element-plus/es')['ElDatePicker']
+    ElInputNumber: typeof import('element-plus/es')['ElInputNumber']
+    ElOption: typeof import('element-plus/es')['ElOption']
+    ElSelect: typeof import('element-plus/es')['ElSelect']
+    ElSwitch: typeof import('element-plus/es')['ElSwitch']
     ElTooltip: typeof import('element-plus/es')['ElTooltip']
     ElUpload: typeof import('element-plus/es')['ElUpload']
     IEpCalendar: typeof import('~icons/ep/calendar')['default']
@@ -28,13 +32,18 @@ declare module 'vue' {
     IEpStar: typeof import('~icons/ep/star')['default']
     ImageUploader: typeof import('./src/components/dialogBox/imageUploader/index.vue')['default']
     Img: typeof import('./src/components/Img/index.vue')['default']
+    NumberInput: typeof import('./src/components/dialogBox/params/NumberInput.vue')['default']
     Painting: typeof import('./src/components/dialogBox/model/painting.vue')['default']
     Pattern: typeof import('./src/components/dialogBox/pattern/index.vue')['default']
     Popover: typeof import('./src/components/Popover/index.vue')['default']
+    ProportionSelect: typeof import('./src/components/dialogBox/params/ProportionSelect.vue')['default']
     Quantity: typeof import('./src/components/dialogBox/quantity/index.vue')['default']
+    ResolutionSelect: typeof import('./src/components/dialogBox/params/ResolutionSelect.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']
     Select: typeof import('./src/components/Select/index.vue')['default']
+    SelectInput: typeof import('./src/components/dialogBox/params/SelectInput.vue')['default']
+    SwitchInput: typeof import('./src/components/dialogBox/params/SwitchInput.vue')['default']
     Time: typeof import('./src/components/dialogBox/Time/index.vue')['default']
     Video: typeof import('./src/components/dialogBox/model/video.vue')['default']
     VideoImageUploader: typeof import('./src/components/dialogBox/videoImageUploader/index.vue')['default']
diff --git a/src/components/dialogBox/index.vue b/src/components/dialogBox/index.vue
index d30662f..ed096da 100644
--- a/src/components/dialogBox/index.vue
+++ b/src/components/dialogBox/index.vue
@@ -7,14 +7,14 @@
       <div class="sender-top">
         <div v-if="useDisplay.Sender_variant === 'default'" class="scroll-to-bottom-text" @click.stop="handleScrollToBottom">回到底部<img src="@/assets/dialog/ArrowDown.svg"></div>
 
-        <div v-show="modelType !== 'text'" class="upload-img-container">
+        <div v-show="showImageUploader" class="upload-img-container">
           <div class="reference-diagram">
-            <ImageUploader 
-              v-if="props.type === 'Painting'" 
-              ref="referenceDiagramRef" 
-              v-model="referenceImages" 
-              :limit="4" 
-              @open-canvas="handleOpenCanvas" 
+            <ImageUploader
+              v-if="props.type === 'Painting'"
+              ref="referenceDiagramRef"
+              v-model="referenceImages"
+              :limit="imageUploadLimit"
+              @open-canvas="handleOpenCanvas"
             />
             <VideoImageUploader 
               v-else-if="props.type === 'Video'" 
@@ -31,13 +31,13 @@
         <template #prefix>
           <div v-if="useDisplay.Sender_variant !== 'default' && props.type === 'Painting'" class="prefix-self-wrap">
             <paintingModel v-model="model" v-model:typeValue="modelType" />
-            <paintingProportion 
-              v-model="proportion" 
-              v-model:resolution="resolution" 
-              :proportion-options="proportionOptions"
-              :resolution-options="resolutionOptions"
-            />
-            <Quantity v-model="quantity" />
+            <template v-for="param in visibleParams" :key="param.name">
+              <ProportionSelect v-if="param.ui === 'proportion'" v-model="paramValues[param.name]" :param="param" />
+              <ResolutionSelect v-if="param.ui === 'resolution'" v-model="paramValues[param.name]" :param="param" />
+              <SelectInput v-if="param.ui === 'select'" v-model="paramValues[param.name]" :param="param" />
+              <NumberInput v-if="param.ui === 'number'" v-model="paramValues[param.name]" :param="param" />
+              <SwitchInput v-if="param.ui === 'switch'" v-model="paramValues[param.name]" :param="param" />
+            </template>
           </div>
 
           <div v-if="useDisplay.Sender_variant !== 'default' && props.type === 'Video'" class="prefix-self-wrap">
@@ -73,21 +73,25 @@
 </template>
 
 <script setup>
-import paintingProportion from './proportion/painting.vue'
 import videoProportion from './proportion/video.vue'
 import paintingModel from './model/painting.vue'
 import videoModel from './model/video.vue'
-import Quantity from './quantity/index.vue'
 import Pattern from './pattern/index.vue'
 import ImageUploader from './imageUploader/index.vue'
 import VideoImageUploader from './videoImageUploader/index.vue'
 import Time from './Time/index.vue'
+import ProportionSelect from './params/ProportionSelect.vue'
+import ResolutionSelect from './params/ResolutionSelect.vue'
+import SelectInput from './params/SelectInput.vue'
+import NumberInput from './params/NumberInput.vue'
+import SwitchInput from './params/SwitchInput.vue'
 import { Sender } from 'vue-element-plus-x'
 import { useDisplayStore } from '@/stores'
 import { generate } from '@/utils/websocket'
 import { useRouter } from 'vue-router'
-import { fetchModelConfig } from '@/utils/modelConfig'
 import { getModelId, fetchPlatformModels, getPlatformCode } from '@/utils/modelApi'
+import { fetchModelConfig } from '@/utils/modelConfig'
+import { getModelConfig } from '@/config/models/index.js'
 
 const props = defineProps({
   isGenerate: {
@@ -111,12 +115,55 @@ const isgerenate = ref(false)
 const model = ref() // 模型
 const modelType = ref('text')
 
-const modelDisplayConfig = ref(null)
+// 当前模型配置
+const modelConfig = computed(() => {
+  return props.type === 'Painting' ? getModelConfig(model.value) : null
+})
+
+// 模型参数值
+const paramValues = reactive({})
+
+// 同步模型默认值到 paramValues
+watch(modelConfig, (config) => {
+  if (!config) return
+  config.params.forEach(p => {
+    if (!(p.name in paramValues)) {
+      paramValues[p.name] = p.default ?? ''
+    }
+  })
+}, { immediate: true })
+
+// 需要显示的参数控件（排除 textarea 和 imageUpload 类型，由 Sender 和独立上传组件处理）
+const visibleParams = computed(() => {
+  if (!modelConfig.value) return []
+  return modelConfig.value.params.filter(p => {
+    // 条件显示
+    if (p.showWhen) {
+      for (const [key, val] of Object.entries(p.showWhen)) {
+        if (paramValues[key] !== val) return false
+      }
+    }
+    // textarea 由 Sender 承载，imageUpload 由独立上传组件处理
+    return p.ui !== 'textarea' && p.ui !== 'imageUpload'
+  })
+})
+
+const showImageUploader = computed(() => {
+  if (props.type === 'Video') return modelType.value !== 'text'
+  return modelConfig.value?.inputType === 'image' || modelConfig.value?.inputType === 'both'
+})
+
+const imageUploadLimit = computed(() => {
+  if (!modelConfig.value) return 4
+  const imageParam = modelConfig.value.params.find(p => p.ui === 'imageUpload')
+  return imageParam?.maxCount || modelConfig.value.maxImages || 4
+})
+
 const promptPlaceholder = ref('描述你想生成的画面和动作。') // 提示词占位符
 
 const prompt = ref('') // 提示词
-const proportion = ref('16:9') // 比例
-const resolution = ref('1k') // 分辨率
+const proportion = ref('16:9') // 比例（Video 用）
+const resolution = ref('1k') // 分辨率（Video 用）
 const referenceImages = ref([])
 
 // 绘画
@@ -140,44 +187,50 @@ const autoSizeConfig = computed(() => {
   }
 })
 
-const loadModelConfig = async (modelName, currentModelType) => {
+const modelDisplayConfig = ref(null)
+
+// Painting: 从本地配置加载模型参数 schema
+const loadPaintingModelConfig = (modelName) => {
+  const config = getModelConfig(modelName)
+  if (config?.params) {
+    config.params.forEach(p => {
+      if (!(p.name in paramValues)) {
+        paramValues[p.name] = p.default ?? ''
+      }
+    })
+  }
+}
+
+// Video: 从远程加载 workflow 配置（保留旧逻辑）
+const loadVideoModelConfig = async (modelName, currentModelType) => {
   try {
     const config = await fetchModelConfig(props.type, modelName, currentModelType)
     modelDisplayConfig.value = config
-    
+
     if (config.display) {
       const display = config.display
-      
       if (display.promptPlaceholder) {
         promptPlaceholder.value = display.promptPlaceholder.default || '描述你想生成的画面和动作。'
       }
-      
       if (display.prompt && !isInitialized.value) {
         prompt.value = display.prompt.default || ''
       }
-      
       if (display.resolution) {
         resolution.value = display.resolution.default || '1k'
         resolutionOptions.value = display.resolution.options || []
       }
-      
       if (display.proportion) {
         proportion.value = display.proportion.default || '16:9'
         proportionOptions.value = display.proportion.options || []
       }
-      
       if (display.duration) {
         duration.value = display.duration.default || 5
         durationOptions.value = display.duration.options || []
       }
     }
-    
     isInitialized.value = true
-    
-    return config
   } catch (error) {
-    console.error('加载模型配置失败:', error)
-    return null
+    console.error('加载视频模型配置失败:', error)
   }
 }
 
@@ -189,7 +242,7 @@ const handleStart = async () => {
     ElMessage.primary('敬请期待 Seedance 2.0')
     return
   }
-  
+
   if (!props.isGenerate) {
     router.push({ name: 'home', query: { loading: false, Generate: true, type: currentType } })
   }
@@ -198,18 +251,22 @@ const handleStart = async () => {
     ElMessage.error('请输入提示词')
     return
   }
-  if (modelType.value === 'image' && !referenceImages.value.length){
+  if (showImageUploader.value && !referenceImages.value.length){
     ElMessage.warning('请上传图片')
     return
   }
-  
+
   isgerenate.value = true
   console.log('生成开始', isgerenate.value)
   const imgs = []
   referenceImages.value.forEach((img, index) => {
     imgs.push({ name: `image_${index + 1}`, url: img.url })
   })
-  
+
+  // 构建模型参数（Painting 用）
+  const modelParams = { ...paramValues }
+  if (prompt.value) modelParams.prompt = prompt.value
+
   const generateData = {
     model: model.value,
     modelType: currentModelType,
@@ -219,25 +276,28 @@ const handleStart = async () => {
     quantity: quantity.value,
     resolution: resolution.value,
     duration: duration.value,
-    videoPattern: videoPattern.value
+    videoPattern: videoPattern.value,
+    modelParams,
   }
-  
+
   const modelId = await getModelId(currentType, model.value)
 
+  // Painting 用新架构扁平参数，Video 保留旧 params 数组
+  const isPainting = currentType === 'Painting'
   const data = {
     type: currentType,
     modelType: currentModelType,
     AIGC: currentType,
     platform: 'runninghub',
     modelName: model.value,
-    modelId: modelId || modelDisplayConfig.value?.modelId || '',
-    quantity: quantity.value,
-    params: [
-      { name: 'prompt', data: prompt.value}, 
-      { name: 'quantity', data: quantity.value},
-      { name: 'proportion', data: proportion.value},
-      { name: 'resolution', data: resolution.value},
-      { name: 'duration', data: duration.value}
+    modelId: modelId || '',
+    modelParams: isPainting ? modelParams : {},
+    params: isPainting ? [] : [
+      { name: 'prompt', data: prompt.value },
+      { name: 'quantity', data: quantity.value },
+      { name: 'proportion', data: proportion.value },
+      { name: 'resolution', data: resolution.value },
+      { name: 'duration', data: duration.value },
     ],
     imgs,
     request: JSON.stringify(generateData)
@@ -258,6 +318,7 @@ const fillParamsFromResult = (resultData) => {
   if (resultData.resolution !== undefined) resolution.value = resultData.resolution
   if (resultData.duration !== undefined) duration.value = resultData.duration
   if (resultData.videoPattern !== undefined) videoPattern.value = resultData.videoPattern
+  if (resultData.modelParams !== undefined) Object.assign(paramValues, resultData.modelParams)
 }
 
 defineExpose({
@@ -287,8 +348,11 @@ watch(() => useDisplay.isSubGerenate, (newValue) => {
 
 watch([() => model.value, () => modelType.value], async ([newModel, newModelType]) => {
   console.log('模型或类型改变:', newModel, newModelType)
-  if (newModel && newModelType) {
-    await loadModelConfig(newModel, newModelType)
+  if (!newModel) return
+  if (props.type === 'Painting') {
+    loadPaintingModelConfig(newModel)
+  } else {
+    await loadVideoModelConfig(newModel, newModelType)
   }
 })
 
diff --git a/src/components/dialogBox/model/painting.vue b/src/components/dialogBox/model/painting.vue
index ac0696b..21da5be 100644
--- a/src/components/dialogBox/model/painting.vue
+++ b/src/components/dialogBox/model/painting.vue
@@ -13,122 +13,87 @@
 
 <script setup>
 import Select from '@/components/Select/index.vue'
+import { fetchPlatformModels, getPlatformCode } from '@/utils/modelApi'
+import { getModelConfig } from '@/config/models/index.js'
 
 const props = defineProps({
-  modelValue: {
-    type: String,
-    default: 'flux'
-  },
-  typeValue: {
-    type: String,
-    default: 'text'
-  }
+  modelValue: { type: String, default: 'Flux 2' },
+  typeValue: { type: String, default: 'text' },
 })
 
 const emit = defineEmits(['update:modelValue', 'update:typeValue'])
 
-const paintingConfig = ref({
-  generate: [],
-  edit: [],
-  vision: []
-})
+const platformModels = ref([])
 
-const fetchConfig = async () => {
+// 从 API 加载模型列表并按 tag 分组
+const loadModels = async () => {
   try {
-    const url = `${import.meta.env.VITE_API_MODEL_RESOURCE}/static/public/Platform/AIGC_modelConfig/painting.json`
-    const response = await fetch(url)
-    const data = await response.json()
-    paintingConfig.value = data
+    const code = getPlatformCode('Painting')
+    const models = await fetchPlatformModels(code)
+    platformModels.value = models || []
   } catch (error) {
-    console.error('Failed to fetch painting config:', error)
+    console.error('加载平台模型列表失败:', error)
   }
 }
 
+loadModels()
 
-fetchConfig()
-
-watch(() => paintingConfig.value, (newConfig) => {
-  const allModels = [
-    ...(newConfig.generate || []),
-    ...(newConfig.edit || []),
-    ...(newConfig.vision || [])
-  ]
-  if (allModels.length > 0) {
-    const enabledModels = allModels.filter(m => !m.disabled)
-    if (enabledModels.length > 0) {
-      const currentModelExists = enabledModels.find(m => m.value === props.modelValue)
-      if (!currentModelExists) {
-        const firstEnabled = enabledModels[0].value
-        emit('update:modelValue', firstEnabled)
-        const newType = getModelType(firstEnabled)
-        emit('update:typeValue', newType)
-      }
+// 模型列表加载后自动纠正不可用模型
+watch(platformModels, (models) => {
+  if (models.length === 0) return
+  const currentModel = models.find(m => m.name === props.modelValue || m.id === props.modelValue)
+  if (!currentModel || currentModel.disabled) {
+    const firstEnabled = models.find(m => !m.disabled)
+    if (firstEnabled) {
+      emit('update:modelValue', firstEnabled.name)
+      const config = getModelConfig(firstEnabled.name)
+      emit('update:typeValue', config?.inputType || 'text')
     }
   }
-}, { deep: true })
+}, { immediate: true })
 
+// 按 tag 分组
+const modelGroups = computed(() => {
+  const models = platformModels.value
+  if (models.length === 0) return []
+
+  const groups = {}
+  models.forEach(m => {
+    const tag = m.tag || '其他'
+    if (!groups[tag]) groups[tag] = []
+    groups[tag].push({
+      value: m.name,
+      label: m.name,
+      disabled: m.disabled || false,
+    })
+  })
+
+  return Object.entries(groups).map(([label, options]) => ({ label, options }))
+})
 
 const model = computed({
   get: () => props.modelValue,
   set: (value) => {
     emit('update:modelValue', value)
-    const newType = getModelType(value)
-    emit('update:typeValue', newType)
-  }
+    const config = getModelConfig(value)
+    emit('update:typeValue', config?.inputType || 'text')
+  },
 })
 
-const generateModels = computed(() => paintingConfig.value.generate || [])
-const editModels = computed(() => paintingConfig.value.edit || [])
-const visionModels = computed(() => paintingConfig.value.vision || [])
-
-const modelGroups = computed(() => {
-  return [
-    {
-      label: '生成模型',
-      options: generateModels.value
-    },
-    {
-      label: '编辑模型',
-      options: editModels.value
-    },
-    {
-      label: '视觉理解模型',
-      options: visionModels.value
-    }
-  ]
-})
-
-const getModelType = (value) => {
-  if (generateModels.value.find(m => m.value === value)) {
-    return 'text'
-  }
-  if (editModels.value.find(m => m.value === value)) {
-    return 'image'
-  }
-  if (visionModels.value.find(m => m.value === value)) {
-    return 'vision'
-  }
-  return 'text'
-}
-
-const getFirstEnabledModel = () => {
-  const allModels = [...generateModels.value, ...editModels.value, ...visionModels.value]
-  const firstEnabled = allModels.find(m => !m.disabled)
-  return firstEnabled ? firstEnabled.value : ''
-}
-
+// 外部改变 modelValue 时校验是否可用
 watch(() => props.modelValue, (newValue) => {
-  const allModels = [...generateModels.value, ...editModels.value, ...visionModels.value]
-  const currentModel = allModels.find(m => m.value === newValue)
+  const models = platformModels.value
+  if (models.length === 0) return
+  const currentModel = models.find(m => m.name === newValue)
   if (currentModel && currentModel.disabled) {
-    const firstEnabled = getFirstEnabledModel()
+    const firstEnabled = models.find(m => !m.disabled)
     if (firstEnabled) {
-      emit('update:modelValue', firstEnabled)
-      const newType = getModelType(firstEnabled)
-      emit('update:typeValue', newType)
+      emit('update:modelValue', firstEnabled.name)
+      const config = getModelConfig(firstEnabled.name)
+      emit('update:typeValue', config?.inputType || 'text')
     }
   }
-}, { immediate: true })
+})
 </script>
 
 <style lang="less" scoped>
@@ -139,24 +104,24 @@ watch(() => props.modelValue, (newValue) => {
         border-radius: 10px;
         border: 1px solid #E8E9EB;
         background: #f5f6f7;
-        
+
         &:hover {
             background: #e9eaeb;
         }
     }
-    
+
     :deep(.select-text) {
       font-size: 14px;
     }
-    
+
     :deep(.dropdown-menu) {
         max-height: 510px;
         overflow-y: auto;
     }
-    
+
     :deep(.dropdown-item) {
         min-width: 120px;
-        
+
         &.active {
             background: rgba(0, 15, 51, 0.10);
             color: #000F33;
diff --git a/src/components/dialogBox/params/NumberInput.vue b/src/components/dialogBox/params/NumberInput.vue
new file mode 100644
index 0000000..01ca484
--- /dev/null
+++ b/src/components/dialogBox/params/NumberInput.vue
@@ -0,0 +1,35 @@
+<template>
+  <div class="param-number">
+    <span class="param-label">{{ param.label }}</span>
+    <el-input-number
+      :model-value="modelValue"
+      :min="param.min"
+      :max="param.max"
+      size="small"
+      style="width: 140px"
+      @update:model-value="$emit('update:modelValue', $event)"
+    />
+  </div>
+</template>
+
+<script setup>
+defineProps({
+  modelValue: { type: Number, default: 0 },
+  param: { type: Object, required: true },
+})
+
+defineEmits(['update:modelValue'])
+</script>
+
+<style lang="less" scoped>
+.param-number {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+.param-label {
+  font-size: 13px;
+  color: #666;
+  white-space: nowrap;
+}
+</style>
diff --git a/src/components/dialogBox/params/ProportionSelect.vue b/src/components/dialogBox/params/ProportionSelect.vue
new file mode 100644
index 0000000..a094591
--- /dev/null
+++ b/src/components/dialogBox/params/ProportionSelect.vue
@@ -0,0 +1,79 @@
+<template>
+  <div class="param-proportion">
+    <span class="param-label">{{ param.label }}</span>
+    <div class="proportion-grid">
+      <div
+        v-for="opt in param.options"
+        :key="opt"
+        class="proportion-item"
+        :class="{ active: modelValue === opt }"
+        @click="$emit('update:modelValue', opt)"
+      >
+        <div class="proportion-preview" :style="getPreviewStyle(opt)"></div>
+        <span class="proportion-text">{{ opt === 'custom' ? '自定义' : opt }}</span>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+defineProps({
+  modelValue: { type: String, default: '' },
+  param: { type: Object, required: true },
+})
+
+defineEmits(['update:modelValue'])
+
+const getPreviewStyle = (ratio) => {
+  if (ratio === 'custom') return {}
+  const [w, h] = ratio.split(':').map(Number)
+  const max = 28
+  let pw, ph
+  if (w >= h) { pw = max; ph = (h / w) * max }
+  else { ph = max; pw = (w / h) * max }
+  return { width: `${pw}px`, height: `${ph}px` }
+}
+</script>
+
+<style lang="less" scoped>
+.param-proportion {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+.param-label {
+  font-size: 13px;
+  color: #666;
+  white-space: nowrap;
+}
+.proportion-grid {
+  display: flex;
+  gap: 6px;
+  flex-wrap: wrap;
+}
+.proportion-item {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 2px;
+  padding: 4px 6px;
+  border-radius: 6px;
+  border: 1px solid rgba(0, 0, 0, 0.1);
+  cursor: pointer;
+  transition: all 0.2s;
+  min-width: 42px;
+
+  &:hover { background: #f0f1f2; }
+  &.active { background: #626aef; color: #fff; border-color: #626aef; }
+}
+.proportion-preview {
+  background: rgba(0, 0, 0, 0.15);
+  border-radius: 2px;
+}
+.proportion-item.active .proportion-preview {
+  background: rgba(255, 255, 255, 0.4);
+}
+.proportion-text {
+  font-size: 11px;
+}
+</style>
diff --git a/src/components/dialogBox/params/ResolutionSelect.vue b/src/components/dialogBox/params/ResolutionSelect.vue
new file mode 100644
index 0000000..1717fd9
--- /dev/null
+++ b/src/components/dialogBox/params/ResolutionSelect.vue
@@ -0,0 +1,51 @@
+<template>
+  <div class="param-resolution">
+    <span class="param-label">{{ param.label }}</span>
+    <div class="resolution-options">
+      <span
+        v-for="opt in param.options"
+        :key="opt"
+        class="resolution-item"
+        :class="{ active: modelValue === opt }"
+        @click="$emit('update:modelValue', opt)"
+      >{{ opt.toUpperCase() }}</span>
+    </div>
+  </div>
+</template>
+
+<script setup>
+defineProps({
+  modelValue: { type: String, default: '' },
+  param: { type: Object, required: true },
+})
+
+defineEmits(['update:modelValue'])
+</script>
+
+<style lang="less" scoped>
+.param-resolution {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+.param-label {
+  font-size: 13px;
+  color: #666;
+  white-space: nowrap;
+}
+.resolution-options {
+  display: flex;
+  gap: 4px;
+}
+.resolution-item {
+  padding: 2px 10px;
+  border-radius: 4px;
+  font-size: 12px;
+  cursor: pointer;
+  border: 1px solid rgba(0, 0, 0, 0.1);
+  transition: all 0.2s;
+
+  &:hover { background: #f0f1f2; }
+  &.active { background: #626aef; color: #fff; border-color: #626aef; }
+}
+</style>
diff --git a/src/components/dialogBox/params/SelectInput.vue b/src/components/dialogBox/params/SelectInput.vue
new file mode 100644
index 0000000..501467c
--- /dev/null
+++ b/src/components/dialogBox/params/SelectInput.vue
@@ -0,0 +1,35 @@
+<template>
+  <div class="param-select">
+    <span class="param-label">{{ param.label }}</span>
+    <el-select
+      :model-value="modelValue"
+      size="small"
+      style="width: 140px"
+      @update:model-value="$emit('update:modelValue', $event)"
+    >
+      <el-option v-for="opt in param.options" :key="opt" :label="opt" :value="opt" />
+    </el-select>
+  </div>
+</template>
+
+<script setup>
+defineProps({
+  modelValue: { default: '' },
+  param: { type: Object, required: true },
+})
+
+defineEmits(['update:modelValue'])
+</script>
+
+<style lang="less" scoped>
+.param-select {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+.param-label {
+  font-size: 13px;
+  color: #666;
+  white-space: nowrap;
+}
+</style>
diff --git a/src/components/dialogBox/params/SwitchInput.vue b/src/components/dialogBox/params/SwitchInput.vue
new file mode 100644
index 0000000..6ee1e0b
--- /dev/null
+++ b/src/components/dialogBox/params/SwitchInput.vue
@@ -0,0 +1,32 @@
+<template>
+  <div class="param-switch">
+    <span class="param-label">{{ param.label }}</span>
+    <el-switch
+      :model-value="modelValue"
+      size="small"
+      @update:model-value="$emit('update:modelValue', $event)"
+    />
+  </div>
+</template>
+
+<script setup>
+defineProps({
+  modelValue: { type: Boolean, default: false },
+  param: { type: Object, required: true },
+})
+
+defineEmits(['update:modelValue'])
+</script>
+
+<style lang="less" scoped>
+.param-switch {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+.param-label {
+  font-size: 13px;
+  color: #666;
+  white-space: nowrap;
+}
+</style>
diff --git a/src/components/dialogBox/proportion/painting.vue b/src/components/dialogBox/proportion/painting.vue
deleted file mode 100644
index df7f881..0000000
--- a/src/components/dialogBox/proportion/painting.vue
+++ /dev/null
@@ -1,451 +0,0 @@
-<template>
-    <Popover placement="top" :width="400">
-        <div class="proportion-container">
-            <div class="section">
-              <h3>选择比例</h3>
-              <div class="proportion-options">
-                <div 
-                  v-for="item in proportionOptions" 
-                  :key="item.value"
-                  class="proportion-item"
-                  :class="{ active: proportion === item.value }"
-                  :style="getProportionStyle(item.value)"
-                  @click="selectProportion(item.value)"
-                >
-                  {{ item.label }}
-                </div>
-              </div>
-            </div>
-
-            <div v-if="resolutionOptions.length > 0" class="section">
-                <h3>选择分辨率</h3>
-                <div class="resolution-options">
-                  <div 
-                    v-for="item in resolutionOptions" 
-                    :key="item.value"
-                    class="resolution-item"
-                    :class="{ active: resolution === item.value }"
-                    @click="selectResolution(item.value)"
-                  >
-                    {{ item.label }}
-                  </div>
-                </div>
-            </div>
-
-            <div class="section">
-                <h3>尺寸(px)</h3>
-                <div class="size-inputs">
-                    <div class="input-group">
-                        <label>W</label>
-                        <input type="number" v-model.number="width" @input="updateWidth" :disabled="isLocked">
-                    </div>
-                    <div class="lock-icon" :class="{ locked: isLocked }" @click="toggleLock">
-                        <img :src="isLocked ? lockIcon : lockNoIcon" alt="约束比例">
-                        <span class="tooltip">{{ isLocked ? '解绑比例' : '约束比例' }}</span>
-                    </div>
-                    <div class="input-group">
-                        <label>H</label>
-                        <input type="number" v-model.number="height" @input="updateHeight" :disabled="isLocked">
-                    </div>
-                </div>
-            </div>
-        </div>
-        <template #reference>
-            <div class="choice-btn">
-                <img src="@/assets/dialog/proportion.svg" alt="" style="width: 16px;">
-                <span>{{ proportion }}</span>
-            </div>
-        </template>
-    </Popover>
-</template>
-
-<script setup>
-import Popover from '@/components/Popover/index.vue'
-import lockIcon from '@/assets/dialog/lock.svg'
-import lockNoIcon from '@/assets/dialog/lockNo.svg'
-
-const props = defineProps({
-  modelValue: {
-    type: String,
-    default: '1:1'
-  },
-  resolution: {
-    type: String,
-    default: '2k'
-  },
-  proportionOptions: {
-    type: Array,
-    default: () => [
-      { value: '智能', label: '智能' },
-      { value: '21:9', label: '21:9' },
-      { value: '16:9', label: '16:9' },
-      { value: '4:3', label: '4:3' },
-      { value: '1:1', label: '1:1' },
-      { value: '3:4', label: '3:4' },
-      { value: '9:16', label: '9:16' }
-    ]
-  },
-  resolutionOptions: {
-    type: Array,
-    default: () => [
-      { value: '1k', label: '标清 1K' },
-      { value: '2k', label: '高清 2K' },
-      { value: '4k', label: '超清 4K' }
-    ]
-  }
-})
-
-const emit = defineEmits(['update:modelValue', 'update:resolution', 'update:width', 'update:height'])
-
-const proportion = computed({
-  get: () => props.modelValue,
-  set: (value) => emit('update:modelValue', value)
-})
-
-const resolution = computed({
-  get: () => props.resolution,
-  set: (value) => emit('update:resolution', value)
-})
-
-const width = ref(2048)
-const height = ref(2048)
-const isLocked = ref(true)
-
-const toggleLock = () => {
-  isLocked.value = !isLocked.value
-}
-
-const selectProportion = (value) => {
-  proportion.value = value
-  updateDimensionsByProportion(value)
-}
-
-const selectResolution = (value) => {
-  resolution.value = value
-  updateDimensionsByResolution(value)
-}
-
-const updateDimensionsByProportion = (proportionValue) => {
-  if (proportionValue === '智能') {
-    return
-  }
-  const [w, h] = proportionValue.split(':').map(Number)
-  const aspectRatio = w / h
-  if (width.value > height.value) {
-    height.value = Math.round(width.value / aspectRatio)
-  } else {
-    width.value = Math.round(height.value * aspectRatio)
-  }
-  emitUpdateDimensions()
-}
-
-const updateDimensionsByResolution = (resolutionValue) => {
-  let baseSize
-  switch (resolutionValue) {
-    case '1k':
-      baseSize = 1024
-      break
-    case '2k':
-      baseSize = 2048
-      break
-    case '4k':
-      baseSize = 4096
-      break
-    default:
-      baseSize = 2048
-  }
-  
-  if (proportion.value === '智能') {
-    width.value = baseSize
-    height.value = baseSize
-  } else {
-    const [w, h] = proportion.value.split(':').map(Number)
-    const aspectRatio = w / h
-    if (aspectRatio > 1) {
-      width.value = baseSize
-      height.value = Math.round(baseSize / aspectRatio)
-    } else {
-      height.value = baseSize
-      width.value = Math.round(baseSize * aspectRatio)
-    }
-  }
-  emitUpdateDimensions()
-}
-
-const updateWidth = () => {
-  if (isLocked.value && proportion.value !== '智能') {
-    const [w, h] = proportion.value.split(':').map(Number)
-    const aspectRatio = w / h
-    height.value = Math.round(width.value / aspectRatio)
-  }
-  emitUpdateDimensions()
-}
-
-const updateHeight = () => {
-  if (isLocked.value && proportion.value !== '智能') {
-    const [w, h] = proportion.value.split(':').map(Number)
-    const aspectRatio = w / h
-    width.value = Math.round(height.value * aspectRatio)
-  }
-  emitUpdateDimensions()
-}
-
-const emitUpdateDimensions = () => {
-  emit('update:width', width.value)
-  emit('update:height', height.value)
-}
-
-const getProportionStyle = (value) => {
-  if (value === '智能') {
-    return {
-      '--width': '20px',
-      '--height': '20px'
-    }
-  }
-  const [w, h] = value.split(':').map(Number)
-  const aspectRatio = w / h
-  const baseSize = 20
-  
-  if (aspectRatio > 1) {
-    return {
-      '--width': `${baseSize}px`,
-      '--height': `${Math.round(baseSize / aspectRatio)}px`
-    }
-  } else {
-    return {
-      '--width': `${Math.round(baseSize * aspectRatio)}px`,
-      '--height': `${baseSize}px`
-    }
-  }
-}
-
-watch(() => [props.modelValue, props.resolution], () => {
-  updateDimensionsByResolution(resolution.value)
-}, { immediate: true })
-</script>
-
-<style lang="less" scoped>
-.choice-btn{
-  display: flex;
-  height: 40px;
-  padding: 0 15px;
-  justify-content: center;
-  align-items: center;
-  gap: 5px;
-  border-radius: 10px;
-  border: 1px solid #E8E9EB;
-  background: #f5f6f7;
-  cursor: pointer;
-  position: relative;
-}
-.choice-btn:hover{
-  background: #e9eaeb;
-}
-
-.proportion-container{
-  padding: 20px;
-}
-
-.section{
-  margin-bottom: 20px;
-  border-radius: 20px;
-  
-  &:last-child{
-    margin-bottom: 0;
-  }
-  
-  h3{
-    font-family: "Microsoft YaHei";
-    font-size: 12px;
-    font-weight: 400;
-    margin-bottom: 12px;
-    color: #999;
-  }
-}
-.proportion-options{
-  display: flex;
-  flex-wrap: nowrap;
-  justify-content: space-between;
-  margin-bottom: 16px;
-  background-color: #F8F9FA;
-  padding: 5px;
-  border-radius: 10px;
-}
-
-.proportion-item{
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: flex-end;
-  gap: 4px;
-  padding: 5px;
-  width: auto;
-  cursor: pointer;
-  font-size: 12px;
-  transition: all 0.2s ease;
-  border-radius: 5px;
-  text-align: bottom;
-  color: #999;
-  
-  &::before{
-    content: '';
-    width: var(--width, 20px);
-    height: var(--height, 20px);
-    background: #F5F6F7;
-    border-radius: 4px;
-    transition: all 0.2s ease;
-    border: 2px solid #999;
-  }
-  
-  &:hover{
-    background: #e0e0e0;
-  }
-  
-  &.active{
-    color: #000F33;
-    background: #ffffff;
-  }
-  &.active::before{
-    border-color: #000F33;
-  }
-}
-
-.resolution-options{
-  display: flex;
-  padding: 5px;
-  align-items: center;
-  align-self: stretch;
-  border-radius: 10px;
-  background: #F8F9FA;
-  gap: 10px;
-}
-
-.resolution-item{
-  flex: 1;
-  padding: 10px;
-  border-radius: 8px;
-  cursor: pointer;
-  font-size: 14px;
-  text-align: center;
-  transition: all 0.2s ease;
-  // background: #f5f5f5;
-  color: #666;
-  
-  &:hover{
-    background: #e0e0e0;
-  }
-  
-  &.active{
-    background: #ffffff;
-    color: #000000;
-    font-weight: 500;
-  }
-}
-
-.size-inputs{
-  display: flex;
-  align-items: center;
-  gap: 10px;
-}
-
-.input-group{
-  flex: 1;
-  position: relative;
-  
-  label{
-    position: absolute;
-    top: 50%;
-    left: 12px;
-    transform: translateY(-50%);
-    font-size: 14px;
-    color: #666;
-    pointer-events: none;
-  }
-  
-  input{
-    width: 100%;
-    height: 36px;
-    padding: 12px 12px 12px 30px;
-    border: none;
-    border-radius: 8px;
-    font-size: 14px;
-    background: #f5f6f7;
-    text-align: right;
-    -moz-appearance: textfield;
-    
-    &::-webkit-inner-spin-button,
-    &::-webkit-outer-spin-button {
-      -webkit-appearance: none;
-      margin: 0;
-    }
-    
-    &:focus{
-      outline: none;
-    }
-    
-    &:disabled{
-      color: #999;
-      cursor: not-allowed;
-    }
-  }
-}
-
-.lock-icon{
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 36px;
-  height: 36px;
-  cursor: pointer;
-  border-radius: 10px;
-  position: relative;
-  transition: background 0.2s ease;
-  
-  img{
-    width: 36px;
-    height: 36px;
-  }
-  
-  .tooltip{
-    position: absolute;
-    bottom: 100%;
-    left: 50%;
-    transform: translateX(-50%);
-    background: #333;
-    color: #fff;
-    padding: 4px 8px;
-    border-radius: 4px;
-    font-size: 12px;
-    white-space: nowrap;
-    opacity: 0;
-    visibility: hidden;
-    transition: all 0.2s ease;
-    margin-bottom: 5px;
-    pointer-events: none;
-  }
-  
-  .tooltip::after{
-    content: '';
-    position: absolute;
-    top: 100%;
-    left: 50%;
-    transform: translateX(-50%);
-    border: 5px solid transparent;
-    border-top-color: #333;
-  }
-  
-  &:hover{
-    opacity: 0.8;
-    
-    .tooltip{
-      opacity: 1;
-      visibility: visible;
-    }
-  }
-  
-  &.locked{
-    background: #f5f6f7;
-  }
-}
- 
-</style>
diff --git a/src/components/dialogBox/quantity/index.vue b/src/components/dialogBox/quantity/index.vue
deleted file mode 100644
index 7dc30fe..0000000
--- a/src/components/dialogBox/quantity/index.vue
+++ /dev/null
@@ -1,66 +0,0 @@
-<template>
-    <Select
-        v-model="quantity"
-        :options="quantityOptions"
-        class="quantity-select"
-        position="top"
-    >
-        <template #prefix>
-            <img src="@/assets/dialog/quantity.svg" alt="" style="width: 16px;">
-        </template>
-    </Select>
-</template>
-
-<script setup>
-import Select from '@/components/Select/index.vue'
-
-const props = defineProps({
-  modelValue: {
-    type: Number,
-    default: 1
-  }
-})
-
-const emit = defineEmits(['update:modelValue'])
-
-const quantity = computed({
-  get: () => props.modelValue,
-  set: (value) => emit('update:modelValue', value)
-})
-
-const quantityOptions = [
-  { value: 1, label: '1 张' },
-  { value: 2, label: '2 张' },
-  { value: 3, label: '3 张' },
-  { value: 4, label: '4 张' }
-]
-</script>
-
-<style lang="less" scoped>
-.quantity-select {
-    :deep(.select-header) {
-        height: 40px;
-        padding: 0 15px;
-        border-radius: 10px;
-        border: 1px solid #E8E9EB;
-        background: #f5f6f7;
-        
-        &:hover {
-            background: #e9eaeb;
-        }
-    }
-    
-    :deep(.select-text) {
-        font-size: 14px;
-    }
-    
-    :deep(.dropdown-menu) {
-        min-width: 80px;
-    }
-    
-    :deep(.dropdown-item) {
-        min-width: 80px;
-        justify-content: center;
-    }
-}
-</style>
diff --git a/src/config/models/flux.js b/src/config/models/flux.js
new file mode 100644
index 0000000..96e7edb
--- /dev/null
+++ b/src/config/models/flux.js
@@ -0,0 +1,51 @@
+// Flux 2 Dev — 文生图
+export default {
+  name: 'Flux 2',
+  tag: '文生图',
+  inputType: 'text',
+  params: [
+    {
+      name: 'prompt',
+      label: '提示词',
+      type: 'string',
+      required: true,
+      ui: 'textarea',
+    },
+    {
+      name: 'aspectRatio',
+      label: '比例',
+      type: 'select',
+      default: '1:1',
+      options: ['1:1', '3:4', '4:3', '9:16', '16:9', '2:3', '3:2', 'custom'],
+      ui: 'proportion',
+    },
+    {
+      name: 'customWidth',
+      label: '宽度',
+      type: 'number',
+      default: 1024,
+      min: 256,
+      max: 1536,
+      ui: 'number',
+      showWhen: { aspectRatio: 'custom' },
+    },
+    {
+      name: 'customHight',
+      label: '高度',
+      type: 'number',
+      default: 1024,
+      min: 256,
+      max: 1536,
+      ui: 'number',
+      showWhen: { aspectRatio: 'custom' },
+    },
+    {
+      name: 'outputFormat',
+      label: '输出格式',
+      type: 'select',
+      default: 'png',
+      options: ['png', 'jpeg', 'webp(lossless)', 'webp(lossy)'],
+      ui: 'select',
+    },
+  ],
+}
diff --git a/src/config/models/gpt-image-i2i.js b/src/config/models/gpt-image-i2i.js
new file mode 100644
index 0000000..a6dd143
--- /dev/null
+++ b/src/config/models/gpt-image-i2i.js
@@ -0,0 +1,48 @@
+// GPT-Image-2 — 图生图/图片编辑
+export default {
+  name: 'GPT-Image-2 I2I',
+  tag: '图片编辑',
+  inputType: 'image',
+  maxImages: 10,
+  params: [
+    {
+      name: 'prompt',
+      label: '编辑指令',
+      type: 'string',
+      required: true,
+      ui: 'textarea',
+    },
+    {
+      name: 'imageUrls',
+      label: '参考图片',
+      type: 'image',
+      required: true,
+      maxCount: 10,
+      ui: 'imageUpload',
+    },
+    {
+      name: 'aspectRatio',
+      label: '比例',
+      type: 'select',
+      default: '1:1',
+      options: ['1:1', '1:2', '2:1', '1:3', '3:1', '2:3', '3:2', '3:4', '4:3', '4:5', '5:4', '9:16', '21:9', '9:21', '16:9'],
+      ui: 'proportion',
+    },
+    {
+      name: 'resolution',
+      label: '分辨率',
+      type: 'select',
+      default: '2k',
+      options: ['1k', '2k', '4k'],
+      ui: 'resolution',
+    },
+    {
+      name: 'quality',
+      label: '画质',
+      type: 'select',
+      default: 'medium',
+      options: ['low', 'medium', 'high'],
+      ui: 'select',
+    },
+  ],
+}
diff --git a/src/config/models/gpt-image.js b/src/config/models/gpt-image.js
new file mode 100644
index 0000000..46b73dc
--- /dev/null
+++ b/src/config/models/gpt-image.js
@@ -0,0 +1,39 @@
+// GPT-Image-2 — 文生图
+export default {
+  name: 'GPT-Image-2',
+  tag: '文生图',
+  inputType: 'text',
+  params: [
+    {
+      name: 'prompt',
+      label: '提示词',
+      type: 'string',
+      required: true,
+      ui: 'textarea',
+    },
+    {
+      name: 'aspectRatio',
+      label: '比例',
+      type: 'select',
+      default: '1:1',
+      options: ['1:1', '1:2', '2:1', '1:3', '3:1', '2:3', '3:2', '3:4', '4:3', '4:5', '5:4', '9:16', '21:9', '9:21', '16:9'],
+      ui: 'proportion',
+    },
+    {
+      name: 'resolution',
+      label: '分辨率',
+      type: 'select',
+      default: '2k',
+      options: ['1k', '2k', '4k'],
+      ui: 'resolution',
+    },
+    {
+      name: 'quality',
+      label: '画质',
+      type: 'select',
+      default: 'medium',
+      options: ['low', 'medium', 'high'],
+      ui: 'select',
+    },
+  ],
+}
diff --git a/src/config/models/index.js b/src/config/models/index.js
new file mode 100644
index 0000000..c3b4db1
--- /dev/null
+++ b/src/config/models/index.js
@@ -0,0 +1,30 @@
+// 模型配置注册表 — 按模型名称查找参数 schema
+import flux from './flux.js'
+import zImage from './z-image.js'
+import jimeng from './jimeng.js'
+import qwen from './qwen.js'
+import gptImage from './gpt-image.js'
+import nanoPro from './nano-pro.js'
+import qwenEdit from './qwen-edit.js'
+import gptImageI2i from './gpt-image-i2i.js'
+
+const configs = {
+  'Flux 2': flux,
+  'Z-Image Turbo': zImage,
+  '即梦4.6': jimeng,
+  '通义万相2.0': qwen,
+  'GPT-Image-2': gptImage,
+  'Nano Pro': nanoPro,
+  '通义万相2.0 Pro': qwenEdit,
+  'GPT-Image-2 I2I': gptImageI2i,
+}
+
+/** 根据模型名称获取参数配置 */
+export function getModelConfig(modelName) {
+  return configs[modelName] || null
+}
+
+/** 获取所有模型配置 */
+export function getAllModelConfigs() {
+  return configs
+}
diff --git a/src/config/models/jimeng.js b/src/config/models/jimeng.js
new file mode 100644
index 0000000..21687ae
--- /dev/null
+++ b/src/config/models/jimeng.js
@@ -0,0 +1,67 @@
+// 即梦 4.6 — 文生图
+export default {
+  name: '即梦4.6',
+  tag: '文生图',
+  inputType: 'text',
+  params: [
+    {
+      name: 'prompt',
+      label: '提示词',
+      type: 'string',
+      required: true,
+      ui: 'textarea',
+    },
+    {
+      name: 'width',
+      label: '宽度',
+      type: 'number',
+      default: 1024,
+      min: 900,
+      max: 6197,
+      ui: 'number',
+    },
+    {
+      name: 'height',
+      label: '高度',
+      type: 'number',
+      default: 1024,
+      min: 768,
+      max: 4096,
+      ui: 'number',
+    },
+    {
+      name: 'scale',
+      label: '文本影响度',
+      type: 'number',
+      default: 50,
+      min: 1,
+      max: 100,
+      ui: 'number',
+    },
+    {
+      name: 'forceSingle',
+      label: '强制单张',
+      type: 'boolean',
+      default: false,
+      ui: 'switch',
+    },
+    {
+      name: 'minRatio',
+      label: '最小宽高比',
+      type: 'number',
+      default: 0.333333,
+      min: 0.06,
+      max: 16,
+      ui: 'number',
+    },
+    {
+      name: 'maxRatio',
+      label: '最大宽高比',
+      type: 'number',
+      default: 3,
+      min: 0.06,
+      max: 16,
+      ui: 'number',
+    },
+  ],
+}
diff --git a/src/config/models/nano-pro.js b/src/config/models/nano-pro.js
new file mode 100644
index 0000000..684b00b
--- /dev/null
+++ b/src/config/models/nano-pro.js
@@ -0,0 +1,40 @@
+// Nano Pro — 图片编辑
+export default {
+  name: 'Nano Pro',
+  tag: '图片编辑',
+  inputType: 'image',
+  maxImages: 10,
+  params: [
+    {
+      name: 'imageUrls',
+      label: '参考图片',
+      type: 'image',
+      required: true,
+      maxCount: 10,
+      ui: 'imageUpload',
+    },
+    {
+      name: 'prompt',
+      label: '编辑指令',
+      type: 'string',
+      required: true,
+      ui: 'textarea',
+    },
+    {
+      name: 'resolution',
+      label: '分辨率',
+      type: 'select',
+      default: '2k',
+      options: ['1k', '2k', '4k'],
+      ui: 'resolution',
+    },
+    {
+      name: 'aspectRatio',
+      label: '比例',
+      type: 'select',
+      default: '1:1',
+      options: ['1:1', '3:2', '2:3', '3:4', '4:3', '4:5', '5:4', '9:16', '16:9', '21:9'],
+      ui: 'proportion',
+    },
+  ],
+}
diff --git a/src/config/models/qwen-edit.js b/src/config/models/qwen-edit.js
new file mode 100644
index 0000000..bd3eb12
--- /dev/null
+++ b/src/config/models/qwen-edit.js
@@ -0,0 +1,52 @@
+// 通义万相 2.0 Pro — 图片编辑
+export default {
+  name: '通义万相2.0 Pro',
+  tag: '图片编辑',
+  inputType: 'image',
+  maxImages: 3,
+  params: [
+    {
+      name: 'imageUrls',
+      label: '参考图片',
+      type: 'image',
+      required: true,
+      maxCount: 3,
+      ui: 'imageUpload',
+    },
+    {
+      name: 'prompt',
+      label: '编辑指令',
+      type: 'string',
+      ui: 'textarea',
+    },
+    {
+      name: 'negativePrompt',
+      label: '反向提示词',
+      type: 'string',
+      default: '',
+      ui: 'textarea',
+    },
+    {
+      name: 'size',
+      label: '分辨率',
+      type: 'select',
+      default: '1024*1024',
+      options: [
+        '1024*1024', '1536*1536',
+        '768*1152', '1024*1536', '1152*768', '1536*1024',
+        '960*1280', '1080*1440', '1280*960', '1440*1080',
+        '720*1280', '1080*1920', '1280*720', '1920*1080',
+        '1344*576', '2048*872',
+      ],
+      ui: 'select',
+    },
+    {
+      name: 'imageNum',
+      label: '生成数量',
+      type: 'select',
+      default: '1',
+      options: ['1', '2', '3', '4', '5', '6'],
+      ui: 'select',
+    },
+  ],
+}
diff --git a/src/config/models/qwen.js b/src/config/models/qwen.js
new file mode 100644
index 0000000..bb6df22
--- /dev/null
+++ b/src/config/models/qwen.js
@@ -0,0 +1,51 @@
+// 通义万相 2.0 — 文生图
+export default {
+  name: '通义万相2.0',
+  tag: '文生图',
+  inputType: 'text',
+  params: [
+    {
+      name: 'prompt',
+      label: '提示词',
+      type: 'string',
+      required: true,
+      ui: 'textarea',
+    },
+    {
+      name: 'negativePrompt',
+      label: '反向提示词',
+      type: 'string',
+      default: '',
+      ui: 'textarea',
+    },
+    {
+      name: 'size',
+      label: '分辨率',
+      type: 'select',
+      default: '1024*1024',
+      options: [
+        '1024*1024', '1536*1536',
+        '768*1152', '1024*1536', '1152*768', '1536*1024',
+        '960*1280', '1080*1440', '1280*960', '1440*1080',
+        '720*1280', '1080*1920', '1280*720', '1920*1080',
+        '1344*576', '2048*872',
+      ],
+      ui: 'select',
+    },
+    {
+      name: 'imageNum',
+      label: '生成数量',
+      type: 'select',
+      default: '1',
+      options: ['1', '2', '3', '4', '5', '6'],
+      ui: 'select',
+    },
+    {
+      name: 'promptExtend',
+      label: '提示词智能扩展',
+      type: 'boolean',
+      default: true,
+      ui: 'switch',
+    },
+  ],
+}
diff --git a/src/config/models/z-image.js b/src/config/models/z-image.js
new file mode 100644
index 0000000..8650aba
--- /dev/null
+++ b/src/config/models/z-image.js
@@ -0,0 +1,31 @@
+// Z-Image Turbo — 文生图
+export default {
+  name: 'Z-Image Turbo',
+  tag: '文生图',
+  inputType: 'text',
+  params: [
+    {
+      name: 'prompt',
+      label: '提示词',
+      type: 'string',
+      required: true,
+      ui: 'textarea',
+    },
+    {
+      name: 'aspectRatio',
+      label: '比例',
+      type: 'select',
+      default: '1:1',
+      options: ['1:1', '3:4', '4:3', '9:16', '16:9', '2:3', '3:2'],
+      ui: 'proportion',
+    },
+    {
+      name: 'outputFormat',
+      label: '输出格式',
+      type: 'select',
+      default: 'png',
+      options: ['png', 'jpeg', 'webp(lossless)', 'webp(lossy)'],
+      ui: 'select',
+    },
+  ],
+}
diff --git a/src/utils/createTask.js b/src/utils/createTask.js
index d80114f..cecee4a 100644
--- a/src/utils/createTask.js
+++ b/src/utils/createTask.js
@@ -1,10 +1,14 @@
 import outPlatform from '@/config/index'
 
-// 处理音频生成任务的数据并返回
+// 构造任务 body
 export async function createTask(data) {
-  console.log(data)
-  const payload = await outPlatform[data.platform].Playload(data)
+  // Painting 使用新架构：直接使用动态模型参数
+  if (data.type === 'Painting') {
+    return data.modelParams || {}
+  }
 
+  // Video 继续使用旧 workflow 适配器
+  const payload = await outPlatform[data.platform].Playload(data)
   return payload
 }
 
@@ -15,4 +19,4 @@ export async function getTask(result) {
     return { type: true, urls: urls }
   }
   return { type: false, message: result.data.exception_message || '生成失败' }
-}
\ No newline at end of file
+}