From f49c868a44c61ed2261df8f2dcdff8781f66e879 Mon Sep 17 00:00:00 2001
From: ajaxzheng <894103554@qq.com>
Date: Wed, 26 Mar 2025 18:00:50 +0800
Subject: [PATCH] fix(calendar-view): [calendar-view] increase the maximum
 height and overflow handling of calendar-view tooltip content to optimize
 display effect (#3196)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* fix(calendar-view): [calendar-view] increase the maximum height and overflow handling of calendar-view tooltip content to optimize display effect

* fix(calendar-view): 调整日历视图工具提示内容的最大高度和溢出处理，以优化显示效果
---
 packages/theme-saas/src/calendar-view/index.less    | 2 ++
 packages/theme/src/calendar-view/index.less         | 5 +++++
 packages/vue/src/calendar-view/src/mobile-first.vue | 2 +-
 packages/vue/src/tooltip/src/mobile-first.vue       | 8 +++++++-
 4 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/packages/theme-saas/src/calendar-view/index.less b/packages/theme-saas/src/calendar-view/index.less
index fd498ea68..4d8299c7f 100644
--- a/packages/theme-saas/src/calendar-view/index.less
+++ b/packages/theme-saas/src/calendar-view/index.less
@@ -630,6 +630,8 @@
   @apply ~'max-w-[theme(spacing.80)]';
 
   .tooltip-main{
+    @apply overflow-auto;
+    @apply max-h-[80vh];
     @apply p-2;
 
     .title{
diff --git a/packages/theme/src/calendar-view/index.less b/packages/theme/src/calendar-view/index.less
index 71d2803fa..0607305ee 100644
--- a/packages/theme/src/calendar-view/index.less
+++ b/packages/theme/src/calendar-view/index.less
@@ -630,12 +630,17 @@
   .inject-CalendarView-vars();
   position: absolute;
   max-width: 320px;
+
   .tooltip-main {
+    overflow: auto;
+    max-height: 80vh;
     padding: var(--tv-CalendarView-tooltip-title-font-size);
+
     .title {
       font-size: var(--tv-CalendarView-tooltip-title-font-size);
       font-weight: var(--tv-CalendarView-tooltip-title-font-weight);
     }
+
     .date {
       margin: 6px 0;
       color: var(--tv-CalendarView-tooltip-date-text-color);
diff --git a/packages/vue/src/calendar-view/src/mobile-first.vue b/packages/vue/src/calendar-view/src/mobile-first.vue
index e5e8f654d..cd8e05d45 100644
--- a/packages/vue/src/calendar-view/src/mobile-first.vue
+++ b/packages/vue/src/calendar-view/src/mobile-first.vue
@@ -9,7 +9,7 @@
       placement="right"
     >
       <template #content>
-        <div class="p-2">
+        <div class="p-2 max-h-[80vh] overflow-auto">
           <div class="px-1.5 mb-1.5 border-l-2 border-color-brand">{{ state.eventTipContent.title }}</div>
           <div class="mb-1.5 px-2 text-color-text-placeholder">
             {{ state.eventTipContent.startDay }} {{ state.eventTipContent.startTime }} ~
diff --git a/packages/vue/src/tooltip/src/mobile-first.vue b/packages/vue/src/tooltip/src/mobile-first.vue
index fdb36505b..be2cafd4f 100644
--- a/packages/vue/src/tooltip/src/mobile-first.vue
+++ b/packages/vue/src/tooltip/src/mobile-first.vue
@@ -136,6 +136,8 @@ export default defineComponent({
                 component: {
                   render: () => {
                     let content = getContent(this)
+                    // 当内容为纯文本时，添加一层wrapper，其他情况（插槽、renderContent）原样输出
+                    const addWrapper = typeof content === 'string'
                     let propsData = { on: { 'after-leave': this.doDestroy } }
                     let mouseenter = () => this.setExpectedState(true)
                     let mouseleave = () => {
@@ -163,7 +165,11 @@ export default defineComponent({
                         aria-hidden={this.disabled || !this.state.showPopper ? 'true' : 'false'}
                         onMouseenter={() => mouseenter()}
                         onMouseleave={() => mouseleave()}>
-                        <div style={`overflow:auto; max-height:${this.contentMaxHeight}`}>{content}</div>
+                        {addWrapper ? (
+                          <div style={`overflow:auto;max-height:${this.contentMaxHeight}`}>{content}</div>
+                        ) : (
+                          content
+                        )}
                         {this.visibleArrow ? (
                           <div
                             x-arrow