fix: initialize mcp_tool_ids as an empty array and update conditional rendering for mcp_servers

Author: liuruibin

ui/src/views/application/component/McpServersDialog.vue

@@ -135,7 +135,7 @@ watch(dialogVisible, (bool) => {
   if (!bool) {
     form.value = {
       mcp_servers: '',
-      mcp_tool_ids: '',
+      mcp_tool_ids: [],
       mcp_source: 'referencing',
     }
     paramFormRef.value?.clearValidate()
@@ -146,7 +146,7 @@ function mcpSourceChange() {
   if (form.value.mcp_source === 'referencing') {
     form.value.mcp_servers = ''
   } else {
-    form.value.mcp_tool_ids = ''
+    form.value.mcp_tool_ids = []
   }
 }
 

ui/src/workflow/nodes/ai-chat-node/index.vue

@@ -146,10 +146,7 @@
         </div>
         <div
           class="w-full mb-16"
-          v-if="
-            chat_data.mcp_tool_ids?.length > 0 ||
-            (chat_data.mcp_servers && chat_data.mcp_servers.length > 0)
-          "
+          v-if=" chat_data.mcp_tool_ids?.length > 0"
         >
           <template v-for="(item, index) in chat_data.mcp_tool_ids" :key="index">
             <div
@@ -188,6 +185,22 @@
             </div>
           </template>
         </div>
+        <div v-if="chat_data.mcp_servers && chat_data.mcp_servers.length > 0"
+             class="flex-between border border-r-6 white-bg mb-4"
+             style="padding: 5px 8px"
+        >
+          <div class="flex align-center" style="line-height: 20px">
+            <ToolIcon type="MCP" class="mr-8" :size="20"/>
+            <div class="ellipsis">
+              {{
+                $t('common.custom') + ' MCP'
+              }}
+            </div>
+          </div>
+          <el-button text @click="chat_data.mcp_servers = ''">
+            <el-icon><Close/></el-icon>
+          </el-button>
+        </div>
         <!-- 工具       -->
         <div class="flex-between mb-16">
           <div class="lighter">{{ $t('views.tool.title') }}</div>