From 4ecb047700f16c154e7de7c654053bbd7e04683b Mon Sep 17 00:00:00 2001
From: Qiuxia Fan <fine0830@outlook.com>
Date: Wed, 22 Jun 2022 11:30:32 +0800
Subject: [PATCH] update timeline

---
 src/store/modules/dashboard.ts                |  6 ------
 src/styles/reset.scss                         |  1 +
 src/views/dashboard/controls/Event.vue        |  1 +
 src/views/dashboard/related/event/Content.vue | 17 ++++++++++++-----
 src/views/dashboard/related/event/Header.vue  |  7 -------
 5 files changed, 14 insertions(+), 18 deletions(-)

diff --git a/src/store/modules/dashboard.ts b/src/store/modules/dashboard.ts
index 0a071f37..d324b4c8 100644
--- a/src/store/modules/dashboard.ts
+++ b/src/store/modules/dashboard.ts
@@ -110,9 +110,6 @@ export const dashboardStore = defineStore({
               : 3,
         };
       }
-      if (type === "Event") {
-        newItem.h = 24;
-      }
       if (["Trace", "Profile", "Log", "DemandLog", "Ebpf"].includes(type)) {
         newItem.h = 36;
       }
@@ -168,9 +165,6 @@ export const dashboardStore = defineStore({
           showDepth: true,
         };
       }
-      if (type === "Event") {
-        newItem.h = 24;
-      }
       if (["Trace", "Profile", "Log", "DemandLog", "Ebpf"].includes(type)) {
         newItem.h = 32;
       }
diff --git a/src/styles/reset.scss b/src/styles/reset.scss
index e6b3f8fd..e3e1053a 100644
--- a/src/styles/reset.scss
+++ b/src/styles/reset.scss
@@ -160,6 +160,7 @@ div.vis-tooltip {
   overflow: hidden;
   background-color: #fff !important;
   white-space: normal !important;
+  font-size: 12px !important;
 }
 
 .vis-item {
diff --git a/src/views/dashboard/controls/Event.vue b/src/views/dashboard/controls/Event.vue
index a20bc5e9..e510a138 100644
--- a/src/views/dashboard/controls/Event.vue
+++ b/src/views/dashboard/controls/Event.vue
@@ -72,6 +72,7 @@ function removeWidget() {
   position: absolute;
   top: 5px;
   right: 3px;
+  z-index: 9999;
 }
 
 .header {
diff --git a/src/views/dashboard/related/event/Content.vue b/src/views/dashboard/related/event/Content.vue
index 11e41039..7ce35316 100644
--- a/src/views/dashboard/related/event/Content.vue
+++ b/src/views/dashboard/related/event/Content.vue
@@ -59,23 +59,30 @@ function visTimeline() {
     };
   });
   const items: any = new DataSet(events);
-  const options = {
+  const options: any = {
     height: h,
     width: "100%",
+    minHeight: "150px",
     locale: "en",
     autoResize: false,
     tooltip: {
+      overflowMethod: "cap",
       template(item) {
         const data = item.data || {};
-        return `<div>ID: ${data.uuid || ""}</div>
+        let tmp = `<div>ID: ${data.uuid || ""}</div>
         <div>Name: ${data.name || ""}</div>
         <div>Event Type: ${data.type || ""}</div>
         <div>Start Time: ${data.startTime ? visDate(data.startTime) : ""}</div>
         <div>End Time: ${data.endTime ? visDate(data.endTime) : ""}</div>
         <div>Message: ${data.message || ""}</div>
-        <div>Service: ${data.source.service || ""}</div>
-        <div>Endpoint: ${data.source.endpoint || ""}</div>
-        <div>Service Instance: ${data.source.instance || ""}</div>`;
+        <div>Service: ${data.source.service || ""}</div>`;
+        if (data.source.endpoint) {
+          tmp += `<div>Endpoint: ${data.source.endpoint}</div>`;
+        }
+        if (data.source.instance) {
+          tmp += `<div>Service Instance: ${data.source.instance}</div>`;
+        }
+        return tmp;
       },
     },
   };
diff --git a/src/views/dashboard/related/event/Header.vue b/src/views/dashboard/related/event/Header.vue
index f0aad3dc..5ce838ff 100644
--- a/src/views/dashboard/related/event/Header.vue
+++ b/src/views/dashboard/related/event/Header.vue
@@ -213,18 +213,11 @@ watch(
   width: 120px;
 }
 
-.row {
-  position: relative;
-}
-
 .inputs-max {
   width: 270px;
 }
 
 .search-btn {
-  position: absolute;
-  top: 0;
-  right: 10px;
   cursor: pointer;
   width: 120px;
 }