From d39e8aa36a547734a81a35274cb57715cb82cb05 Mon Sep 17 00:00:00 2001
From: shaohuzhang1 <80892890+shaohuzhang1@users.noreply.github.com>
Date: Tue, 14 Oct 2025 14:54:43 +0800
Subject: [PATCH] fix: Wordflow implements multi-select nodes (#4183)

Co-authored-by: wangdan-fit2cloud <dan.wang@fit2cloud.com>
---
 .../views/problem/component/DetailProblemDrawer.vue  |  2 +-
 ui/src/workflow/common/NodeContainer.vue             |  6 ++++--
 ui/src/workflow/common/shortcut.ts                   | 12 ++++++------
 ui/src/workflow/index.vue                            |  6 ++++--
 4 files changed, 15 insertions(+), 11 deletions(-)

diff --git a/ui/src/views/problem/component/DetailProblemDrawer.vue b/ui/src/views/problem/component/DetailProblemDrawer.vue
index 1cf56dca8..6b38ea7c3 100644
--- a/ui/src/views/problem/component/DetailProblemDrawer.vue
+++ b/ui/src/views/problem/component/DetailProblemDrawer.vue
@@ -19,7 +19,7 @@
               <template v-for="(item, index) in paragraphList" :key="index">
                 <CardBox
                   :title="item.title || '-'"
-                  class="cursor mb-8"
+                  class="cursor mb-8 w-full"
                   :showIcon="false"
                   @click.stop="permissionPrecise.doc_edit(id as string) && editParagraph(item)"
                   style="height: 210px"
diff --git a/ui/src/workflow/common/NodeContainer.vue b/ui/src/workflow/common/NodeContainer.vue
index 2685d792c..4020c2c7a 100644
--- a/ui/src/workflow/common/NodeContainer.vue
+++ b/ui/src/workflow/common/NodeContainer.vue
@@ -265,8 +265,10 @@ const editName = async (formEl: FormInstance | undefined) => {
   })
 }
 
-const mousedown = () => {
-  props.nodeModel.graphModel.clearSelectElements()
+const mousedown = (event?: any) => {
+  if (!event?.shiftKey) {
+    props.nodeModel.graphModel.clearSelectElements()
+  }
   set(props.nodeModel, 'isSelected', true)
   set(props.nodeModel, 'isHovered', true)
   props.nodeModel.graphModel.toFront(props.nodeModel.id)
diff --git a/ui/src/workflow/common/shortcut.ts b/ui/src/workflow/common/shortcut.ts
index 874a825c9..759abf399 100644
--- a/ui/src/workflow/common/shortcut.ts
+++ b/ui/src/workflow/common/shortcut.ts
@@ -100,12 +100,12 @@ export function initDefaultShortcut(lf: LogicFlow, graph: GraphModel) {
     const nodes = elements.nodes.filter((node) =>
       ['start-node', 'base-node', 'loop-body-node'].includes(node.type),
     )
-    if (nodes.length > 0) {
-      MsgError(
-        `${nodes[0].properties?.stepName}${t('views.applicationWorkflow.delete.deleteMessage')}`,
-      )
-      return
-    }
+    // if (nodes.length > 0) {
+    //   MsgError(
+    //     `${nodes[0].properties?.stepName}${t('views.applicationWorkflow.delete.deleteMessage')}`,
+    //   )
+    //   return
+    // }
     MsgConfirm(t('common.tip'), t('views.applicationWorkflow.delete.confirmTitle'), {
       confirmButtonText: t('common.confirm'),
       confirmButtonClass: 'danger',
diff --git a/ui/src/workflow/index.vue b/ui/src/workflow/index.vue
index 30cc3b040..7b963134a 100644
--- a/ui/src/workflow/index.vue
+++ b/ui/src/workflow/index.vue
@@ -10,6 +10,7 @@ import { ref, onMounted, onUnmounted } from 'vue'
 import AppEdge from './common/edge'
 import loopEdge from './common/loopEdge'
 import Control from './common/NodeControl.vue'
+import { SelectionSelect } from '@logicflow/extension'
 import '@logicflow/extension/lib/style/index.css'
 import '@logicflow/core/dist/style/index.css'
 import { initDefaultShortcut } from '@/workflow/common/shortcut'
@@ -50,7 +51,7 @@ const renderGraphData = (data?: any) => {
   const container: any = document.querySelector('#container')
   if (container) {
     lf.value = new LogicFlow({
-      plugins: [Dagre],
+      plugins: [Dagre, SelectionSelect],
       textEdit: false,
       adjustEdge: false,
       adjustEdgeStartAndEnd: false,
@@ -107,12 +108,13 @@ const renderGraphData = (data?: any) => {
       // 清除当前节点下面的子节点的所有缓存
       data.nodeModel.clear_next_node_field(false)
     })
-
+    lf.value.openSelectionSelect()
     setTimeout(() => {
       lf.value?.fitView()
     }, 500)
   }
 }
+
 const validate = () => {
   return Promise.all(lf.value.graphModel.nodes.map((element: any) => element?.validate?.()))
 }