From 41efe305bb40097bf5cfd4c948d49ff787a4634c Mon Sep 17 00:00:00 2001
From: calvin <jianghuachinacom@163.com>
Date: Fri, 4 Feb 2022 16:41:16 +0800
Subject: [PATCH] fix this issue (#8280)

---
 .../home/pages/dag/_source/canvas/canvas.vue  | 29 +++++++++++++++++++
 1 file changed, 29 insertions(+)

diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/canvas/canvas.vue b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/canvas/canvas.vue
index 67c56a62df..7a7f41d296 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/canvas/canvas.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/canvas/canvas.vue
@@ -277,6 +277,35 @@
             edge.setSource(sourceNode)
           }
         })
+
+        // Add a node tool when the mouse entering
+        this.graph.on('node:mouseenter', ({ e, x, y, node, view }) => {
+          const nodeName = node.getData().taskName
+          node.addTools({
+            name: 'button',
+            args: {
+              markup: [
+                {
+                  tagName: 'text',
+                  textContent: nodeName,
+                  attrs: {
+                    fill: '#868686',
+                    'font-size': 16,
+                    'text-anchor': 'center'
+                  }
+                }
+              ],
+              x: 0,
+              y: 0,
+              offset: { x: 0, y: -10 }
+            }
+          })
+        })
+
+        // Remove all tools when the mouse leaving
+        this.graph.on('node:mouseleave', ({ node }) => {
+          node.removeTools()
+        })
       },
       /**
        * @param {Edge|string} edge