From 0a9bb3fd78ea60ef4b0fc57a0d3f9c59dd174f0c Mon Sep 17 00:00:00 2001
From: Cell <1024@lruihao.cn>
Date: Thu, 6 Jun 2024 18:07:54 +0800
Subject: [PATCH] =?UTF-8?q?Fix:=20v-overflow-tooltip=20=E5=A2=9E=E5=8A=A0?=
 =?UTF-8?q?=E8=BE=B9=E7=95=8C=E6=A3=80=E6=B5=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/directives/overflow-tooltip.js | 24 ++++++++++++++++++++++--
 1 file changed, 22 insertions(+), 2 deletions(-)

diff --git a/src/directives/overflow-tooltip.js b/src/directives/overflow-tooltip.js
index ef61b81..026c578 100644
--- a/src/directives/overflow-tooltip.js
+++ b/src/directives/overflow-tooltip.js
@@ -38,8 +38,28 @@ const setTooltip = (el, binding) => {
   el.onmousemove = function(e) {
     if (!isEllipsis) { return }
     const vcTooltipDom = document.getElementById('vc-tooltip')
-    vcTooltipDom.style.top = e.clientY + 15 + 'px'
-    vcTooltipDom.style.left = e.clientX + 15 + 'px'
+    const padding = 5
+    let offsetX = e.clientX + 15
+    let offsetY = e.clientY + 15
+    // 判断是否超出视窗边界（横向）
+    if (offsetX + vcTooltipDom.offsetWidth > document.documentElement.clientWidth) {
+      offsetX = document.documentElement.clientWidth - vcTooltipDom.offsetWidth - padding
+    }
+    if (offsetX <= 0) {
+      offsetX = padding
+      vcTooltipDom.style.width = document.documentElement.clientWidth - padding * 2 + 'px'
+    }
+    // 判断是否超出视窗边界（纵向）
+    if (offsetY + vcTooltipDom.offsetHeight > document.documentElement.clientHeight) {
+      offsetY = document.documentElement.clientHeight - vcTooltipDom.offsetHeight - padding
+    }
+    if (offsetY <= 0) {
+      offsetY = padding
+      vcTooltipDom.style.height = document.documentElement.clientHeight - padding * 2 + 'px'
+    }
+    vcTooltipDom.style.left = offsetX + 'px'
+    vcTooltipDom.style.top = offsetY + 'px'
+    // 注：当浮层元素和窗口大小差不多时，浮层会覆盖原本的内容，导致浮层闪一下就不见了
   }
   // 鼠标移出时将浮层元素销毁
   el.onmouseleave = function() {