页面细节调整

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 
-      title="日历" 
-      :poppable="false" 
-      :show-confirm="false" 
-      :formatter="formatterCalendar"
-      :min-date="minDate"
-      :max-date="maxDate"
-      @month-show="onMonthShow"
-      @select="onDateSelect"
-    />
+    <van-calendar title="日历" :poppable="false" :show-confirm="false" :formatter="formatterCalendar" :min-date="minDate"
+      :max-date="maxDate" @month-show="onMonthShow" @select="onDateSelect" />
 
     <!-- 日期交易列表弹出层 -->
-    <van-popup 
-      v-model:show="listVisible" 
-      position="bottom"
-      :style="{ height: '85%' }"
-      round
-      closeable
-    >
+    <van-popup 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
-          :transactions="dateTransactions"
-          :loading="listLoading"
-          :finished="true"
-          :show-delete="false"
-          @click="viewDetail"
-        />
+
+        <TransactionList :transactions="dateTransactions" :loading="listLoading" :finished="true" :show-delete="false"
+          @click="viewDetail" />
       </div>
     </van-popup>
 
     <!-- 交易详情组件 -->
-    <TransactionDetail
-      v-model:show="detailVisible"
-      :transaction="currentTransaction"
-      @save="onDetailSave"
-    />
+    <TransactionDetail 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 {
@@ -95,9 +86,9 @@ const fetchDateTransactions = async (date) => {
   try {
     listLoading.value = true
     const dateStr = date.toLocaleString('zh-CN', { year: 'numeric', month: '2-digit', day: '2-digit' }).replace(/\//g, '-')
-    
+
     const response = await getTransactionsByDate(dateStr)
-    
+
     if (response.success && response.data) {
       dateTransactions.value = response.data
     } else {
@@ -130,9 +121,9 @@ const onDateSelect = (date) => {
 
 // 格式化选中的日期
 const formatSelectedDate = (date) => {
-  return date.toLocaleDateString('zh-CN', { 
-    year: 'numeric', 
-    month: 'long', 
+  return date.toLocaleDateString('zh-CN', {
+    year: 'numeric',
+    month: 'long',
     day: 'numeric',
     weekday: 'long'
   })
@@ -160,7 +151,7 @@ const onDetailSave = () => {
   if (selectedDate.value) {
     fetchDateTransactions(selectedDate.value)
   }
-  
+
   // 重新加载当前月份的统计数据
   const now = selectedDate.value || new Date()
   fetchDailyStatistics(now.getFullYear(), now.getMonth() + 1)

Web/src/views/TransactionsRecord.vue

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