From 64331c11a077fa3740ab7ad8860f9a21873177a8 Mon Sep 17 00:00:00 2001
From: zyh <zhuyanheng@geedgenetworks.com>
Date: Mon, 20 Jun 2022 09:52:42 +0800
Subject: [PATCH] =?UTF-8?q?NEZ-1951=20fix=EF=BC=9A=E4=BF=AE=E5=A4=8D?=
 =?UTF-8?q?=E5=9B=BE=E8=A1=A8=E6=9C=80=E5=A4=A7=E5=8C=96=E6=82=AC=E6=B5=AE?=
 =?UTF-8?q?=E6=A1=86=E4=BD=8D=E7=BD=AE=E9=94=99=E8=AF=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/chart/chart/chartStat.vue  | 26 +++++++++++++++++--
 1 file changed, 24 insertions(+), 2 deletions(-)

diff --git a/nezha-fronted/src/components/chart/chart/chartStat.vue b/nezha-fronted/src/components/chart/chart/chartStat.vue
index 4a0aec166..017ded674 100644
--- a/nezha-fronted/src/components/chart/chart/chartStat.vue
+++ b/nezha-fronted/src/components/chart/chart/chartStat.vue
@@ -4,7 +4,7 @@
       class="chart-stat-item"
       v-for="(item,index) in statData"
       :key="index"
-      @mouseenter="statMouseEnter(item)"
+      @mouseenter="statMouseEnter(item,$event)"
       @mouseleave="statMouseleave(item)"
       :class="statData.length===1 ?'only-stat' : ''"
       :style="{
@@ -163,11 +163,33 @@ export default {
         this.tooltip.x = e.pageX + 15
       }
     },
-    statMouseEnter (that) {
+    statMouseEnter (that, e) {
       this.tooltip.title = that.legend
       this.tooltip.value = that.showValue
       this.tooltip.mapping = that.mapping
       this.tooltip.show = true
+      this.$nextTick(() => {
+        const windowWidth = window.innerWidth// 窗口宽度
+        const windowHeight = window.innerHeight// 窗口高度
+        const box = document.getElementById(`chart-canvas-tooltip-${this.chartId}`)
+        if (box) {
+          const boxWidth = box.offsetWidth
+          const boxHeight = box.offsetHeight
+          if (e.pageX < (windowWidth / 2)) { // 说明鼠标在左边放不下提示框
+            this.tooltip.x = e.pageX + 15
+          } else {
+            this.tooltip.x = e.pageX - boxWidth - 15
+          }
+          if (e.pageY + 50 + boxHeight < windowHeight) { // 说明鼠标上面放不下提示框
+            this.tooltip.y = e.pageY + 15
+          } else {
+            this.tooltip.y = e.pageY - boxHeight - 10
+          }
+        } else {
+          this.tooltip.y = e.pageY + 15
+          this.tooltip.x = e.pageX + 15
+        }
+      })
     },
     statMouseleave (taht) {
       this.tooltip.show = false