页面细节调整

Web/src/App.vue

@@ -66,7 +66,7 @@ const handleTabClick = (path) => {
 @media only screen and (max-width: 768px) {
   :deep(.van-tabbar) {
     /* 为小白条添加额外高度 */
-    padding-bottom: env(safe-area-inset-bottom);
+    padding-bottom: max(10px, calc(env(safe-area-inset-bottom) - 20px));
   }
 }
 </style>

Web/src/views/CalendarView.vue

@@ -1,51 +1,28 @@
 <template>
   <div class="calendar-container">
-    <van-calendar 
+    <van-calendar title="日历" :poppable="false" :show-confirm="false" :formatter="formatterCalendar" :min-date="minDate"
-      title="日历" 
+      :max-date="maxDate" @month-show="onMonthShow" @select="onDateSelect" />
-      :poppable="false" 
-      :show-confirm="false" 
-      :formatter="formatterCalendar"
-      :min-date="minDate"
-      :max-date="maxDate"
-      @month-show="onMonthShow"
-      @select="onDateSelect"
-    />
 
     <!-- 日期交易列表弹出层 -->
-    <van-popup 
+    <van-popup v-model:show="listVisible" position="bottom" :style="{ height: '85%' }" round closeable>
-      v-model:show="listVisible" 
-      position="bottom"
-      :style="{ height: '85%' }"
-      round
-      closeable
-    >
       <div class="date-transactions">
         <div class="popup-header">
           <h3>{{ selectedDateText }}</h3>
           <p v-if="dateTransactions.length">共 {{ dateTransactions.length }} 笔交易</p>
         </div>
 
-        <TransactionList
+        <TransactionList :transactions="dateTransactions" :loading="listLoading" :finished="true" :show-delete="false"
-          :transactions="dateTransactions"
+          @click="viewDetail" />
-          :loading="listLoading"
-          :finished="true"
-          :show-delete="false"
-          @click="viewDetail"
-        />
       </div>
     </van-popup>
 
     <!-- 交易详情组件 -->
-    <TransactionDetail
+    <TransactionDetail v-model:show="detailVisible" :transaction="currentTransaction" @save="onDetailSave" />
-      v-model:show="detailVisible"
-      :transaction="currentTransaction"
-      @save="onDetailSave"
-    />
   </div>
 </template>
 
 <script setup>
-import { ref } from 'vue'
+import { ref, onMounted, nextTick } from 'vue'
 import { showToast } from 'vant'
 import request from '@/api/request'
 import { getTransactionDetail, getTransactionsByDate } from '@/api/transactionRecord'
@@ -65,6 +42,20 @@ const selectedDateText = ref('')
 const minDate = new Date(new Date().getFullYear() - 2, 0, 1) // 2年前的1月1日
 const maxDate = new Date(new Date().getFullYear() + 1, 11, 31) // 明年12月31日
 
+onMounted(async () => {
+  await nextTick()
+  setTimeout(() => {
+    // 计算页面高度，滚动3/4高度以显示更多日期
+    const height = document.querySelector('.calendar-container').clientHeight * 0.45
+    document
+      .querySelector('.van-calendar__body')
+      .scrollBy({
+        top: -height,
+        behavior: 'smooth'
+      })
+  }, 300);
+})
+
 // 获取日历统计数据
 const fetchDailyStatistics = async (year, month) => {
   try {

Web/src/views/TransactionsRecord.vue

@@ -569,7 +569,6 @@ onMounted(async () => {
 </script>
 
 <style scoped>
-@import '@/styles/common.css';
 
 .floating-search {
   position: fixed;