From 0c30fb90912059ba76f543cc8826f5994ef814b2 Mon Sep 17 00:00:00 2001
From: kang <wankang2050@gmail.com>
Date: Wed, 27 May 2026 18:13:45 +0800
Subject: [PATCH] auto-save 2026-05-27 18:13 (~3)

---
 .memory/worklog.json                          | 13 +++++-----
 .../src/components/nodes/ImageConfigNode.vue  | 24 ++++++++++++++-----
 web/canvas-app/src/stores/pinia/models.js     |  2 +-
 3 files changed, 26 insertions(+), 13 deletions(-)

diff --git a/.memory/worklog.json b/.memory/worklog.json
index 7d9350a..0bc8f42 100644
--- a/.memory/worklog.json
+++ b/.memory/worklog.json
@@ -1,11 +1,5 @@
 {
   "entries": [
-    {
-      "files_changed": 1,
-      "message": "Codex 会话活跃 · 最近命令：codex · 分支 main · 1 项未提交变更 · 最近提交：docs: record common size layout deployment",
-      "ts": "2026-05-20T11:55:32Z",
-      "type": "session-heartbeat"
-    },
     {
       "files_changed": 6,
       "hash": "92a7f2f",
@@ -3197,6 +3191,13 @@
       "message": "auto-save 2026-05-27 17:51 (~4)",
       "hash": "dab4bde",
       "files_changed": 4
+    },
+    {
+      "ts": "2026-05-27T18:08:07+08:00",
+      "type": "commit",
+      "message": "auto-save 2026-05-27 18:08 (~2)",
+      "hash": "13d9057",
+      "files_changed": 2
     }
   ]
 }
diff --git a/web/canvas-app/src/components/nodes/ImageConfigNode.vue b/web/canvas-app/src/components/nodes/ImageConfigNode.vue
index 654df97..6af6ff2 100644
--- a/web/canvas-app/src/components/nodes/ImageConfigNode.vue
+++ b/web/canvas-app/src/components/nodes/ImageConfigNode.vue
@@ -41,7 +41,7 @@
         <!-- Model selector | 模型选择 -->
         <div class="flex items-center justify-between">
           <span class="text-xs text-[var(--text-secondary)]">模型</span>
-          <n-dropdown :options="modelOptions" @select="handleModelSelect">
+          <n-dropdown trigger="click" :options="modelOptions" @select="handleModelSelect">
             <button class="flex items-center gap-1 text-sm text-[var(--text-primary)] hover:text-[var(--accent-color)]">
               {{ displayModelName }}
               <n-icon :size="12"><ChevronDownOutline /></n-icon>
@@ -52,7 +52,7 @@
         <!-- Quality selector | 画质选择 -->
         <div v-if="hasQualityOptions" class="flex items-center justify-between">
           <span class="text-xs text-[var(--text-secondary)]">画质</span>
-          <n-dropdown :options="qualityOptions" @select="handleQualitySelect">
+          <n-dropdown trigger="click" :options="qualityOptions" @select="handleQualitySelect">
             <button class="flex items-center gap-1 text-sm text-[var(--text-primary)] hover:text-[var(--accent-color)]">
               {{ displayQuality }}
               <n-icon :size="12"><ChevronForwardOutline /></n-icon>
@@ -64,7 +64,7 @@
         <div v-if="hasSizeOptions" class="flex items-center justify-between">
           <span class="text-xs text-[var(--text-secondary)]">尺寸</span>
           <div class="flex items-center gap-2">
-            <n-dropdown :options="sizeOptions" @select="handleSizeSelect">
+            <n-dropdown trigger="click" :options="sizeOptions" @select="handleSizeSelect">
               <button
                 class="flex items-center gap-1 text-sm text-[var(--text-primary)] hover:text-[var(--accent-color)]">
                 {{ displaySize }}
@@ -97,7 +97,7 @@
         <!-- Generate button | 生成按钮 -->
         <div v-if="hasConnectedImageWithContent" class="flex gap-2">
           <!-- Create new (primary) | 新建节点（主按钮） -->
-          <button @click="handleGenerate('new')" :disabled="loading || !isConfigured"
+          <button @click="handleGenerate('new')" :disabled="loading || !canGenerate"
             class="flex-1 flex items-center justify-center gap-1.5 py-2 px-3 rounded-lg bg-[var(--accent-color)] hover:bg-[var(--accent-hover)] text-white text-sm font-medium transition-colors disabled:opacity-50 disabled:cursor-not-allowed">
             <n-spin v-if="loading" :size="14" />
             <template v-else>
@@ -106,7 +106,7 @@
             </template>
           </button>
           <!-- Replace existing (secondary) | 替换现有（次按钮） -->
-          <button @click="handleGenerate('replace')" :disabled="loading || !isConfigured"
+          <button @click="handleGenerate('replace')" :disabled="loading || !canGenerate"
             class="flex-shrink-0 flex items-center justify-center gap-1 py-2 px-2.5 rounded-lg border border-[var(--border-color)] text-[var(--text-secondary)] hover:border-[var(--accent-color)] hover:text-[var(--accent-color)] text-sm transition-colors disabled:opacity-50 disabled:cursor-not-allowed">
             <n-spin v-if="loading" :size="14" />
             <template v-else>
@@ -115,7 +115,7 @@
             </template>
           </button>
         </div>
-        <button v-else @click="handleGenerate('auto')" :disabled="loading || !isConfigured"
+        <button v-else @click="handleGenerate('auto')" :disabled="loading || !canGenerate"
           class="w-full flex items-center justify-center gap-2 py-2 px-4 rounded-lg bg-[var(--accent-color)] hover:bg-[var(--accent-hover)] text-white text-sm font-medium transition-colors disabled:opacity-50 disabled:cursor-not-allowed">
           <n-spin v-if="loading" :size="14" />
           <template v-else>
@@ -124,6 +124,9 @@
             立即生成
           </template>
         </button>
+        <div v-if="!canGenerate" class="text-xs text-amber-500 mt-2">
+          当前环境未配置该图片模型 API，只能预览和选择模型参数。
+        </div>
 
         <!-- Error message | 错误信息 -->
         <div v-if="error" class="text-xs text-red-500 mt-2">
@@ -182,6 +185,10 @@ const { updateNodeInternals } = useVueFlow()
 
 // API config state | API 配置状态
 const isConfigured = computed(() => !!modelStore.currentApiKey)
+const hasAvailableImageRuntime = computed(() => {
+  const runtimeModels = modelStore.runtimeImageModels || []
+  return runtimeModels.length === 0 || runtimeModels.some(model => model.available !== false)
+})
 
 // Image generation hook | 图片生成 hook
 const { loading, error, images: generatedImages, generate } = useImageGeneration()
@@ -232,6 +239,11 @@ const handleSelect = (item) => {
 
 // Get current model config | 获取当前模型配置
 const currentModelConfig = computed(() => getModelConfig(localModel.value))
+const canGenerate = computed(() => (
+  isConfigured.value &&
+  hasAvailableImageRuntime.value &&
+  currentModelConfig.value?.available !== false
+))
 
 // Model options from Pinia store (filtered by provider) | 从 Pinia store 获取模型选项（根据渠道过滤）
 const modelOptions = computed(() => modelStore.allImageModelOptions)
diff --git a/web/canvas-app/src/stores/pinia/models.js b/web/canvas-app/src/stores/pinia/models.js
index 29087a8..ec57aa9 100644
--- a/web/canvas-app/src/stores/pinia/models.js
+++ b/web/canvas-app/src/stores/pinia/models.js
@@ -324,7 +324,7 @@ export const useModelStore = defineStore('model', () => {
     allImageModels.value.map(m => ({
       label: m.label,
       key: m.key,
-      disabled: m.available === false
+      disabled: false
     }))
   )