From 2ffe322697aba1537ba20225184a04e6323bc4cc Mon Sep 17 00:00:00 2001
From: Ethan-Zhang <ethanzhang55@outlook.com>
Date: Sat, 2 Aug 2025 06:20:08 +0800
Subject: [PATCH 1/2] =?UTF-8?q?Fix:=20=E4=BF=AE=E5=A4=8D=E6=96=B0=E5=BB=BA?=
 =?UTF-8?q?=E8=8A=82=E7=82=B9input=E5=92=8Coutput=E6=A8=A1=E6=9D=BF?=
 =?UTF-8?q?=E6=95=B0=E6=8D=AE=E8=A2=AB=E9=94=99=E8=AF=AF=E6=B8=85=E7=A9=BA?=
 =?UTF-8?q?=E7=9A=84=E9=97=AE=E9=A2=98=20&&=20=E5=88=A0=E9=99=A4=E8=B0=83?=
 =?UTF-8?q?=E8=AF=95=E4=BB=A3=E7=A0=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/createapp/components/workFlowConfig/useDnD.js       | 4 ++--
 .../createapp/components/workFlowConfig/workFlowDialog.vue    | 1 -
 2 files changed, 2 insertions(+), 3 deletions(-)

diff --git a/src/views/createapp/components/workFlowConfig/useDnD.js b/src/views/createapp/components/workFlowConfig/useDnD.js
index 5ec7aaa..aa9851d 100644
--- a/src/views/createapp/components/workFlowConfig/useDnD.js
+++ b/src/views/createapp/components/workFlowConfig/useDnD.js
@@ -150,8 +150,8 @@ export default function useDragAndDrop() {
         output_parameters: {}
       };
     } else {
-      // 对于所有其他节点类型（LLM、RAG、API、SQL等），确保parameters结构正确且内容为空
-      cleanNodeData.parameters = {
+      // 对于所有其他节点类型（LLM、RAG、API、SQL等），保留API返回的原始parameters或使用空结构
+      cleanNodeData.parameters = cleanNodeData.parameters || {
         input_parameters: {},
         output_parameters: {}
       };
diff --git a/src/views/createapp/components/workFlowConfig/workFlowDialog.vue b/src/views/createapp/components/workFlowConfig/workFlowDialog.vue
index c600411..c69cb3b 100644
--- a/src/views/createapp/components/workFlowConfig/workFlowDialog.vue
+++ b/src/views/createapp/components/workFlowConfig/workFlowDialog.vue
@@ -113,7 +113,6 @@ const handleSubmit = (formEl: FormInstance | undefined) => {
       const appId = route.query?.appId;
       // 创建使用生成的flowId
       const flowId = uuidv4();
-      console.log('flowId', flowId, 'here');
       // 调用接口新建工作流
       api
         .createOrUpdateFlowTopology(
-- 
Gitee


From 42c62b234cadf2e189dcfff224522786bd1b4d78 Mon Sep 17 00:00:00 2001
From: Ethan-Zhang <ethanzhang55@outlook.com>
Date: Sat, 2 Aug 2025 06:22:00 +0800
Subject: [PATCH 2/2] =?UTF-8?q?Feat:=20=E5=8F=98=E9=87=8F=E6=8F=92?=
 =?UTF-8?q?=E5=85=A5=E9=80=89=E6=8B=A9=E8=8F=9C=E5=8D=95=E6=96=B0=E5=A2=9E?=
 =?UTF-8?q?=E9=AA=A8=E6=9E=B6=E6=A0=B7=E5=BC=8F=E5=8C=B9=E9=85=8D=E9=9D=9E?=
 =?UTF-8?q?=E7=BC=93=E5=AD=98=E6=95=B0=E6=8D=AE=E8=AF=BB=E5=8F=96=E6=97=B6?=
 =?UTF-8?q?=E9=97=B4=E9=95=BF=E7=9A=84Loading=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/VariableInsertDropdown.vue   | 273 +++++++++++++++++---
 src/views/createapp/components/workFlow.vue |   5 +-
 2 files changed, 244 insertions(+), 34 deletions(-)

diff --git a/src/components/VariableInsertDropdown.vue b/src/components/VariableInsertDropdown.vue
index 7686027..ecbb8f7 100644
--- a/src/components/VariableInsertDropdown.vue
+++ b/src/components/VariableInsertDropdown.vue
@@ -16,49 +16,90 @@
     </div>
     
     <div class="dropdown-content">
-      <div 
-        v-for="group in groupedVariables" 
-        :key="group.scope"
-        class="variable-group"
-        v-loading="loading"
-      >
-        <div class="group-header">
-          <span class="group-title">{{ getScopeLabel(group.scope, group.nodeId, group.nodeName) }}</span>
-          <span class="group-count">{{ group.variables.length }}</span>
-        </div>
-        
-        <div class="group-variables">
-          <div 
-            v-for="variable in group.variables" 
-            :key="`${group.scope}-${variable.name}`"
-            class="variable-item"
-            @mousedown.prevent
-            @click.stop="() => $emit('variable-selected', variable)"
-          >
-            <div class="variable-info">
-              <div class="variable-name">{{ getVariableDisplayName(variable) }}</div>
-              <div class="variable-description" v-if="variable.description">
-                {{ variable.description }}
+      <!-- 骨架屏：初始加载时显示 -->
+      <div v-if="loading && groupedVariables.length === 0" class="skeleton-container">
+        <div v-for="i in 3" :key="`skeleton-${i}`" class="skeleton-group">
+          <div class="skeleton-header">
+            <div class="skeleton-title"></div>
+            <div class="skeleton-count"></div>
+          </div>
+          <div class="skeleton-items">
+            <div v-for="j in 2" :key="`skeleton-item-${j}`" class="skeleton-item">
+              <div class="skeleton-item-info">
+                <div class="skeleton-name"></div>
+                <div class="skeleton-desc"></div>
               </div>
-            </div>
-            <div class="variable-type-tag">
-              {{ getVariableTypeDisplay(variable.var_type) }}
+              <div class="skeleton-tag"></div>
             </div>
           </div>
         </div>
       </div>
-      
-      <div v-if="groupedVariables.length === 0 && !loading" class="empty-state">
-        <div class="empty-text">{{ searchText ? '未找到匹配的变量' : '暂无可用变量' }}</div>
+
+      <!-- 搜索加载遮罩：仅在搜索时显示 -->
+      <div v-if="searchLoading" class="search-loading-overlay">
+        <el-icon class="loading-icon">
+          <IconSearch />
+        </el-icon>
+        <span>搜索中...</span>
+      </div>
+
+      <!-- 变量列表内容 -->
+      <div v-if="!loading || groupedVariables.length > 0">
+        <div 
+          v-for="group in groupedVariables" 
+          :key="group.scope"
+          class="variable-group"
+        >
+          <div class="group-header">
+            <span class="group-title">{{ getScopeLabel(group.scope, group.nodeId, group.nodeName) }}</span>
+            <span class="group-count">{{ group.variables.length }}</span>
+          </div>
+          
+          <div class="group-variables">
+            <div 
+              v-for="variable in group.variables" 
+              :key="`${group.scope}-${variable.name}`"
+              class="variable-item"
+              @mousedown.prevent
+              @click.stop="() => $emit('variable-selected', variable)"
+            >
+              <div class="variable-info">
+                <div class="variable-name">{{ getVariableDisplayName(variable) }}</div>
+                <div class="variable-description" v-if="variable.description">
+                  {{ variable.description }}
+                </div>
+              </div>
+              <div class="variable-type-tag">
+                {{ getVariableTypeDisplay(variable.var_type) }}
+              </div>
+            </div>
+          </div>
+        </div>
+        
+        <!-- 空状态：区分加载中和无数据 -->
+        <div v-if="!loading && !searchLoading && groupedVariables.length === 0" class="empty-state">
+          <div class="empty-icon">
+            <el-icon size="32" color="#c0c4cc">
+              <IconRemind v-if="!searchText" />
+              <IconSearch v-else />
+            </el-icon>
+          </div>
+          <div class="empty-text">
+            {{ searchText ? '未找到匹配的变量' : '暂无可用变量' }}
+          </div>
+          <div class="empty-tip" v-if="!searchText">
+            请确保相关作用域中已定义变量
+          </div>
+        </div>
       </div>
     </div>
   </div>
 </template>
 
 <script setup lang="ts">
-import { onMounted, watch } from 'vue'
+import { onMounted, watch, ref, computed } from 'vue'
 import { ElInput, ElIcon } from 'element-plus'
-import { IconSearch } from '@computing/opendesign-icons'
+import { IconSearch, IconRemind } from '@computing/opendesign-icons'
 import { useVariables, type Variable } from '@/components/useVariables'
 
 interface Props {
@@ -89,6 +130,10 @@ const {
   loadVariables
 } = useVariables(props.supportedScopes, props.flowId, props.conversationId, props.currentStepId)
 
+// 搜索加载状态 
+const searchLoading = ref(false)
+let searchTimer: ReturnType<typeof setTimeout> | undefined
+
 // 生命周期
 onMounted(() => {
   loadVariables()
@@ -99,6 +144,23 @@ watch([() => props.flowId, () => props.conversationId, () => props.currentStepId
   loadVariables()
 })
 
+// 监听搜索文本变化，添加搜索loading效果
+watch(searchText, (newValue, oldValue) => {
+  if (searchTimer) {
+    clearTimeout(searchTimer)
+  }
+  
+  // 只有在实际有内容变化时才显示搜索loading
+  if (newValue && newValue !== oldValue) {
+    searchLoading.value = true
+    searchTimer = setTimeout(() => {
+      searchLoading.value = false
+    }, 200) // 200ms的搜索loading延迟
+  } else {
+    searchLoading.value = false
+  }
+})
+
 // 监听变量列表变化，通过事件传递给父组件
 watch(variables, (newVariables) => {
   emit('variables-loaded', newVariables)
@@ -134,8 +196,10 @@ watch(variables, (newVariables) => {
   }
 
   .dropdown-content {
+    min-height: 200px; // 设置最小高度，避免初始高度为0
     max-height: 300px;
     overflow-y: auto;
+    position: relative; // 为搜索遮罩定位
 
     .variable-group {
       &:not(:last-child) {
@@ -218,15 +282,158 @@ watch(variables, (newVariables) => {
       }
     }
 
+    // 骨架屏样式
+    .skeleton-container {
+      padding: 8px 0;
+      
+      .skeleton-group {
+        &:not(:last-child) {
+          border-bottom: 1px solid #f5f5f5;
+        }
+        
+        .skeleton-header {
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          padding: 12px 16px 8px 16px;
+          background-color: #f8f9fa;
+          
+          .skeleton-title {
+            width: 80px;
+            height: 12px;
+            background-color: #f0f0f0;
+            border-radius: 6px;
+            animation: skeleton-loading 1.5s ease-in-out infinite;
+          }
+          
+          .skeleton-count {
+            width: 20px;
+            height: 16px;
+            background-color: #e9ecef;
+            border-radius: 10px;
+            animation: skeleton-loading 1.5s ease-in-out infinite;
+          }
+        }
+        
+        .skeleton-items {
+          padding: 0 8px 8px 8px;
+          
+          .skeleton-item {
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            padding: 8px 12px;
+            margin: 4px 0;
+            
+            .skeleton-item-info {
+              flex: 1;
+              
+              .skeleton-name {
+                width: 120px;
+                height: 13px;
+                background-color: #f0f0f0;
+                border-radius: 4px;
+                margin-bottom: 6px;
+                animation: skeleton-loading 1.5s ease-in-out infinite;
+              }
+              
+              .skeleton-desc {
+                width: 180px;
+                height: 11px;
+                background-color: #f5f5f5;
+                border-radius: 4px;
+                animation: skeleton-loading 1.5s ease-in-out infinite;
+              }
+            }
+            
+            .skeleton-tag {
+              width: 50px;
+              height: 20px;
+              background-color: #f0f0f0;
+              border-radius: 4px;
+              margin-left: 8px;
+              animation: skeleton-loading 1.5s ease-in-out infinite;
+            }
+          }
+        }
+      }
+    }
+
+    // 搜索加载遮罩
+    .search-loading-overlay {
+      position: absolute;
+      top: 0;
+      left: 0;
+      right: 0;
+      bottom: 0;
+      background-color: rgba(255, 255, 255, 0.8);
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      justify-content: center;
+      z-index: 10;
+      
+      .loading-icon {
+        font-size: 24px;
+        color: #409eff;
+        margin-bottom: 8px;
+        animation: rotate 1s linear infinite;
+      }
+      
+      span {
+        font-size: 13px;
+        color: #606266;
+      }
+    }
+
     .empty-state {
-      padding: 32px 16px;
+      padding: 40px 16px;
       text-align: center;
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      justify-content: center;
+
+      .empty-icon {
+        margin-bottom: 16px;
+        opacity: 0.6;
+      }
 
       .empty-text {
-        font-size: 13px;
+        font-size: 14px;
         color: #909399;
+        font-weight: 500;
+        margin-bottom: 8px;
+      }
+
+      .empty-tip {
+        font-size: 12px;
+        color: #c0c4cc;
+        line-height: 1.4;
       }
     }
   }
 }
+
+// 动画定义
+@keyframes skeleton-loading {
+  0% {
+    opacity: 1;
+  }
+  50% {
+    opacity: 0.4;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+
+@keyframes rotate {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}
 </style> 
\ No newline at end of file
diff --git a/src/views/createapp/components/workFlow.vue b/src/views/createapp/components/workFlow.vue
index 59fddd0..f4a9d9c 100644
--- a/src/views/createapp/components/workFlow.vue
+++ b/src/views/createapp/components/workFlow.vue
@@ -615,12 +615,15 @@ const nodesChange = (nodes) => {
 };
 
 // 子组件获取的flow
-const getCreatedFlow = (createdFlowObj) => {
+const getCreatedFlow = async (createdFlowObj) => {
   if (flowObj.value) {
     flowObj.value = { ...createdFlowObj };
     workFlowItemName.value = createdFlowObj.name;
     // 回显工作流节点和边
     redrageFlow(createdFlowObj?.nodes, createdFlowObj?.edges);
+    
+    // 重新加载对话变量，确保显示当前flow的正确变量状态
+    await loadConversationVariablesForDisplay();
   }
   // 更新当前应用下的工作流列表下拉框
   queryFlow('create');
-- 
Gitee