From 91838d1b713ccb331786c8f155a4db6546f47b66 Mon Sep 17 00:00:00 2001
From: Fine <fanxue0830@gmail.com>
Date: Fri, 17 Nov 2023 00:12:42 +0800
Subject: [PATCH] feat: add tooltip

---
 src/styles/theme.scss                               |  2 +-
 .../dashboard/related/log/LogTable/LogService.vue   | 13 ++++++++-----
 .../related/trace/components/Table/TableItem.vue    |  2 --
 3 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/src/styles/theme.scss b/src/styles/theme.scss
index 4617bac5..56e8fe13 100644
--- a/src/styles/theme.scss
+++ b/src/styles/theme.scss
@@ -62,7 +62,7 @@ html {
 }
 
 html.dark {
-  --el-color-primary: rgb(64, 158, 255);
+  --el-color-primary: #409eff;
   --theme-background: #212224;
   --font-color: #fafbfc;
   --disabled-color: #ccc;
diff --git a/src/views/dashboard/related/log/LogTable/LogService.vue b/src/views/dashboard/related/log/LogTable/LogService.vue
index a27bb629..61cb4ffb 100644
--- a/src/views/dashboard/related/log/LogTable/LogService.vue
+++ b/src/views/dashboard/related/log/LogTable/LogService.vue
@@ -25,9 +25,11 @@ limitations under the License. -->
         {{ dateFormat(data.timestamp) }}
       </span>
       <span v-else-if="item.label === 'tags'" :class="level.toLowerCase()"> > </span>
-      <span v-else-if="item.label === 'traceId'" :class="noLink ? '' : 'blue'">
-        <Icon v-if="!noLink" iconName="merge" />
-      </span>
+      <el-tooltip v-else-if="item.label === 'traceId'" content="Trace Link">
+        <span :class="noLink ? '' : 'blue'">
+          <Icon v-if="!noLink" iconName="merge" />
+        </span>
+      </el-tooltip>
       <span v-else>{{ data[item.label] }}</span>
     </div>
   </div>
@@ -89,6 +91,7 @@ limitations under the License. -->
       cursor: pointer;
       width: 20px;
       text-align: center;
+      position: relative;
 
       span {
         display: inline-block;
@@ -96,7 +99,7 @@ limitations under the License. -->
       }
 
       .blue {
-        color: #448dfe;
+        color: var(--el-color-primary);
       }
     }
 
@@ -104,7 +107,7 @@ limitations under the License. -->
       width: 15px;
       text-align: center;
       color: var(--sw-green);
-      font-weight: 600;
+      font-weight: 400;
       font-size: 14px;
     }
 
diff --git a/src/views/dashboard/related/trace/components/Table/TableItem.vue b/src/views/dashboard/related/trace/components/Table/TableItem.vue
index 52297534..ff03d6d1 100644
--- a/src/views/dashboard/related/trace/components/Table/TableItem.vue
+++ b/src/views/dashboard/related/trace/components/Table/TableItem.vue
@@ -287,7 +287,6 @@ limitations under the License. -->
   }
 
   .profiled {
-    // background-color: #eee;
     background-color: var(--sw-table-header);
     position: relative;
   }
@@ -329,7 +328,6 @@ limitations under the License. -->
   }
 
   .trace-item {
-    // display: flex;
     white-space: nowrap;
     position: relative;
     cursor: pointer;