From 9e03187a95f9f54bc02b12742da7454193dca6e0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=AD=99=E8=AF=9A?= <cheng2.sun@ly.com>
Date: Thu, 15 Jan 2026 17:55:37 +0800
Subject: [PATCH] =?UTF-8?q?=E6=A0=B7=E5=BC=8F=E4=BF=AE=E5=A4=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 Web/src/components/ContributionHeatmap.vue | 70 +++++++++++-----------
 Web/src/views/CalendarView.vue             |  5 +-
 2 files changed, 38 insertions(+), 37 deletions(-)

diff --git a/Web/src/components/ContributionHeatmap.vue b/Web/src/components/ContributionHeatmap.vue
index d8a51a8..25bccbb 100644
--- a/Web/src/components/ContributionHeatmap.vue
+++ b/Web/src/components/ContributionHeatmap.vue
@@ -1,45 +1,45 @@
 <template>
   <div class="heatmap-card">
-        <div class="grid-row">
-          <!-- Weekday Labels (Fixed Left) -->
-          <div class="weekday-col-fixed">
-            <div class="weekday-label">二</div>
-            <div class="weekday-label">四</div>
-            <div class="weekday-label">六</div>
+    <div class="grid-row">
+      <!-- Weekday Labels (Fixed Left) -->
+      <div class="weekday-col-fixed">
+        <div class="weekday-label">二</div>
+        <div class="weekday-label">四</div>
+        <div class="weekday-label">六</div>
+      </div>
+      
+      <!-- Scrollable Heatmap Area -->
+      <div ref="scrollContainer" class="heatmap-scroll-container">
+        <div class="heatmap-content">
+          <!-- Month Labels -->
+          <div class="month-row">
+            <div 
+              v-for="(month, index) in monthLabels" 
+              :key="index" 
+              class="month-label"
+              :style="{ left: month.left + 'px' }"
+            >
+              {{ month.text }}
+            </div>
           </div>
-          
-          <!-- Scrollable Heatmap Area -->
-          <div ref="scrollContainer" class="heatmap-scroll-container">
-            <div class="heatmap-content">
-              <!-- Month Labels -->
-              <div class="month-row">
-                <div 
-                  v-for="(month, index) in monthLabels" 
-                  :key="index" 
-                  class="month-label"
-                  :style="{ left: month.left + 'px' }"
-                >
-                  {{ month.text }}
-                </div>
-              </div>
 
-              <!-- Heatmap Grid -->
-              <div class="heatmap-grid">
-                <div v-for="(week, wIndex) in weeks" :key="wIndex" class="heatmap-week">
-                  <div
-                    v-for="(day, dIndex) in week"
-                    :key="dIndex"
-                    class="heatmap-cell"
-                    :class="getLevelClass(day)"
-                    @click="onCellClick(day)"
-                  >
-                    <!-- Tooltip could be implemented here or using title -->
-                  </div>
-                </div>
+          <!-- Heatmap Grid -->
+          <div class="heatmap-grid">
+            <div v-for="(week, wIndex) in weeks" :key="wIndex" class="heatmap-week">
+              <div
+                v-for="(day, dIndex) in week"
+                :key="dIndex"
+                class="heatmap-cell"
+                :class="getLevelClass(day)"
+                @click="onCellClick(day)"
+              >
+                <!-- Tooltip could be implemented here or using title -->
               </div>
             </div>
           </div>
         </div>
+      </div>
+    </div>
     
     <div class="heatmap-footer">
       <div v-if="totalCount > 0" class="summary-text">
@@ -59,7 +59,7 @@
 </template>
 
 <script setup>
-import { ref, onMounted, computed, nextTick } from 'vue';
+import { ref, onMounted, nextTick } from 'vue';
 import { getDailyStatisticsRange } from '@/api/statistics';
 
 const stats = ref({});
diff --git a/Web/src/views/CalendarView.vue b/Web/src/views/CalendarView.vue
index 304bec9..6090c0f 100644
--- a/Web/src/views/CalendarView.vue
+++ b/Web/src/views/CalendarView.vue
@@ -13,6 +13,9 @@
     
     <ContributionHeatmap ref="heatmapRef" />
 
+    <!-- 底部安全距离 -->
+    <div style="height: calc(80px + env(safe-area-inset-bottom, 0px))"></div>
+
     <!-- 日期交易列表弹出层 -->
     <PopupContainer
       v-model="listVisible"
@@ -303,8 +306,6 @@ onBeforeUnmount(() => {
 
 .calendar-container {
   /* 使用准确的视口高度减去 TabBar 高度（50px）和安全区域 */
-  height: calc(var(--vh, 100vh) - 50px - env(safe-area-inset-bottom, 0px));
-  max-height: calc(var(--vh, 100vh) - 50px - env(safe-area-inset-bottom, 0px));
   display: flex;
   flex-direction: column;
   overflow: hidden;