From fb95f1f18f3a33bb7e0d742fb69a74bda04938c3 Mon Sep 17 00:00:00 2001
From: Fine <fanxue0830@gmail.com>
Date: Thu, 27 Mar 2025 15:56:29 +0800
Subject: [PATCH] update id

---
 .../dashboard/related/trace/components/D3Graph/Index.vue  | 4 ++--
 src/views/dashboard/related/trace/utils/d3-trace-list.ts  | 8 ++++----
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/views/dashboard/related/trace/components/D3Graph/Index.vue b/src/views/dashboard/related/trace/components/D3Graph/Index.vue
index d491c19c..4843823b 100644
--- a/src/views/dashboard/related/trace/components/D3Graph/Index.vue
+++ b/src/views/dashboard/related/trace/components/D3Graph/Index.vue
@@ -15,7 +15,7 @@ limitations under the License. -->
     <Icon iconName="spinner" size="sm" />
   </div>
   <div ref="traceGraph" class="d3-graph"></div>
-  <div id="action-box">
+  <div id="trace-action-box">
     <div @click="showDetail = true">Span Details</div>
     <div v-for="span in parentSpans" :key="span.parentSegmentId" @click="viewParentSpan(span)">{{
       `Parent Span: ${span.parentSegmentId}`
@@ -426,7 +426,7 @@ limitations under the License. -->
     fill: #4caf50;
   }
 
-  #action-box {
+  #trace-action-box {
     position: absolute;
     color: $font-color;
     cursor: pointer;
diff --git a/src/views/dashboard/related/trace/utils/d3-trace-list.ts b/src/views/dashboard/related/trace/utils/d3-trace-list.ts
index e8599f3a..4c840b50 100644
--- a/src/views/dashboard/related/trace/utils/d3-trace-list.ts
+++ b/src/views/dashboard/related/trace/utils/d3-trace-list.ts
@@ -87,7 +87,7 @@ export default class ListGraph {
   }
   init(data: Recordable, row: Recordable[], fixSpansSize: number) {
     d3.select(`.${this.el?.className} .trace-xaxis`).remove();
-    d3.select("#action-box").style("display", "none");
+    d3.select("#trace-action-box").style("display", "none");
     this.row = row;
     this.data = data;
     this.min = d3.min(this.row.map((i) => i.startTime));
@@ -158,14 +158,14 @@ export default class ListGraph {
         const hasClass = d3.select(this).classed("highlighted");
         if (t.selectedNode) {
           t.selectedNode.classed("highlighted", false);
-          d3.select("#action-box").style("display", "none");
+          d3.select("#trace-action-box").style("display", "none");
         }
         if (hasClass) {
           t.selectedNode = null;
           return;
         }
         d3.select(this).classed("highlighted", true);
-        d3.select("#action-box")
+        d3.select("#trace-action-box")
           .style("display", "block")
           .style("left", `${event.pageX - 70}px`)
           .style("top", `${event.pageY + 30}px`);
@@ -420,7 +420,7 @@ export default class ListGraph {
     if (parentSpan) {
       d3.select(`#list-node-${parentSpan.id}`).classed("highlightedParent", true);
     }
-    d3.select("#action-box").style("display", "none");
+    d3.select("#trace-action-box").style("display", "none");
     this.selectedNode.classed("highlighted", false);
     if (!parentSpan) return;
     const container = document.querySelector(".trace-chart .charts");