fix: Loop node, MCP node cannot be dragged and added (#4159)

Author: shaohuzhang1

ui/src/workflow/index.vue

@@ -67,7 +67,6 @@ const renderGraphData = (data?: any) => {
       },
       isSilentMode: false,
       container: container,
-      saa: 'sssssss',
     })
     lf.value.setTheme({
       bezier: {
@@ -129,6 +128,7 @@ const onmousedown = (shapeItem: ShapeItem) => {
       properties: { ...shapeItem.properties },
     })
   }
+
   if (shapeItem.callback) {
     shapeItem.callback(lf.value)
   }

ui/src/workflow/nodes/loop-node/index.vue

@@ -170,7 +170,9 @@ onMounted(() => {
     }
   }
   set(props.nodeModel, 'validate', validate)
-  mountLoopBodyNode()
+  if (!props.nodeModel.virtual) {
+    mountLoopBodyNode()
+  }
 })
 </script>
 <style lang="scss" scoped></style>

ui/src/workflow/nodes/mcp-node/index.vue

@@ -246,8 +246,8 @@
         </el-form>
       </div>
     </template>
+    <McpServerInputDialog ref="mcpServerInputDialogRef" @refresh="handleMcpVariables" />
   </NodeContainer>
-  <McpServerInputDialog ref="mcpServerInputDialogRef" @refresh="handleMcpVariables" />
 </template>
 <script setup lang="ts">
 import { cloneDeep, set } from 'lodash'
@@ -258,7 +258,7 @@ import { t } from '@/locales'
 import { MsgError, MsgSuccess } from '@/utils/message'
 import TooltipLabel from '@/components/dynamics-form/items/label/TooltipLabel.vue'
 import NodeCascader from '@/workflow/common/NodeCascader.vue'
-import McpServerInputDialog from "./component/McpServerInputDialog.vue";
+import McpServerInputDialog from './component/McpServerInputDialog.vue'
 import { useRoute } from 'vue-router'
 import { loadSharedApi } from '@/utils/dynamics-api/shared-api'
 import { resetUrl } from '@/utils/common'
@@ -356,7 +356,7 @@ function getTools() {
 }
 
 function _getTools(mcp_servers: any) {
-   loadSharedApi({ type: 'application', systemType: apiType.value })
+  loadSharedApi({ type: 'application', systemType: apiType.value })
     .getMcpTools(id, mcp_servers, loading)
     .then((res: any) => {
       form_data.value.mcp_tools = res.data
@@ -371,32 +371,32 @@ function _getTools(mcp_servers: any) {
 const mcpServerInputDialogRef = ref()
 // 提取 JSON 中所有占位符（{{...}}）的变量路径
 function extractPlaceholders(input: unknown): string[] {
-  const re = /\{\{\s*([a-zA-Z_][\w.]*)\s*\}\}/g; // 捕获 {{ path.like.this }}
-  const found = new Set<string>();
+  const re = /\{\{\s*([a-zA-Z_][\w.]*)\s*\}\}/g // 捕获 {{ path.like.this }}
+  const found = new Set<string>()
 
   const visit = (v: unknown) => {
     if (typeof v === 'string') {
-      let m: RegExpExecArray | null;
-      while ((m = re.exec(v)) !== null) found.add(m[1]);
+      let m: RegExpExecArray | null
+      while ((m = re.exec(v)) !== null) found.add(m[1])
     } else if (Array.isArray(v)) {
-      v.forEach(visit);
+      v.forEach(visit)
     } else if (v && typeof v === 'object') {
-      Object.values(v as Record<string, unknown>).forEach(visit);
+      Object.values(v as Record<string, unknown>).forEach(visit)
     }
-  };
+  }
 
   // 如果传入的是 JSON 字符串，尝试解析，否则按字符串/对象处理
   if (typeof input === 'string') {
     try {
-      visit(JSON.parse(input));
+      visit(JSON.parse(input))
     } catch {
-      visit(input);
+      visit(input)
     }
   } else {
-    visit(input);
+    visit(input)
   }
 
-  return [...found];
+  return [...found]
 }
 
 function handleMcpVariables(vars: any) {
@@ -591,7 +591,10 @@ onMounted(() => {
       set(props.nodeModel.properties.node_data, 'is_result', true)
     }
   }
-  if (props.nodeModel.properties.node_data.mcp_servers && !props.nodeModel.properties.node_data.mcp_source) {
+  if (
+    props.nodeModel.properties.node_data.mcp_servers &&
+    !props.nodeModel.properties.node_data.mcp_source
+  ) {
     set(props.nodeModel.properties.node_data, 'mcp_source', 'custom')
   }
   getMcpToolSelectOptions()