收入明细网格结构优化

pages/cashFlow/cashFlow.vue

@@ -42,7 +42,7 @@
     <view v-else-if="cardList.length === 0" class="empty-container">
       <text class="empty-text">暂无数据</text>
     </view>
-    <cash-flow-card v-else v-for="(item, index) in cardList" :key="index" :cardData="item" />
+    <cash-flow-card v-for="(item, index) in cardList" v-else :key="index" :cardData="item" />
   </view>
   <!-- 底部弹窗 -->
   <uni-popup ref="popup" :mask-click="true" type="bottom">
@@ -91,11 +91,7 @@ export default {
       date: currentDate,
       startDate: this.getDate('start'),
       endDate: this.getDate('end'),
-      expenseTypes: [
-        '提现',
-        '订单',
-        '其他'
-      ],
+      expenseTypes: ['提现', '订单'],
       cardList: [],
       loading: false,
     }
@@ -145,27 +141,27 @@ export default {
       this.closePopup()
       this.loadBalanceLogData()
     },
-    
+
     // 加载余额日志数据
     async loadBalanceLogData() {
       if (this.loading) return
-      
+
       this.loading = true
       try {
         // 获取当前时间的格式化字符串
         const now = new Date()
         const endTime = now.toISOString().slice(0, 19).replace('T', ' ')
-        
+
         const params = {
           beginCreateTime: this.date + ' 00:00:01',
-          endCreateTime: endTime
+          endCreateTime: endTime,
         }
-        
+
         console.log('查询参数:', {
           beginCreateTime: params.beginCreateTime,
-          endCreateTime: params.endCreateTime
+          endCreateTime: params.endCreateTime,
         })
-        
+
         // 根据选择的类型添加筛选条件
         if (this.expenseType !== '全部类型') {
           if (this.expenseType === '提现') {
@@ -180,94 +176,92 @@ export default {
         } else {
           console.log('查询类型: 全部类型')
         }
-        
+
         const response = await getBalanceLogList(params)
         console.log('API响应:', response)
-        
+
         if (response.code === 200 && response.data) {
           this.processBalanceLogData(response.data)
         } else {
           console.error('获取数据失败:', response.msg)
           uni.showToast({
             title: response.msg || '获取数据失败',
-            icon: 'none'
+            icon: 'none',
           })
         }
       } catch (error) {
         console.error('API调用失败:', error)
         uni.showToast({
           title: '网络错误，请重试',
-          icon: 'none'
+          icon: 'none',
         })
       } finally {
         this.loading = false
       }
     },
-    
+
     // 处理余额日志数据
     processBalanceLogData(data) {
       this.cardList = data.map(item => {
         // 计算当日总支出和总收入
         const totalExpense = Math.abs(item.totalExpense || 0)
         const totalIncome = item.totalIncome || 0
-        
+
         // 处理余额日志列表
         let items = item.balanceLogList.map(log => {
           const createTime = new Date(log.createTime)
           const time = createTime.toTimeString().substring(0, 5) // 获取 HH:mm 格式
-          
+
           return {
             title: this.getTitleByBstType(log.bstType),
             status: this.getStatusByBstType(log.bstType),
             time: time,
             orderNumber: log.id,
             amount: log.amount,
-            bstType: log.bstType // 保留原始类型用于过滤
+            bstType: log.bstType, // 保留原始类型用于过滤
           }
         })
-        
+
         // 如果是"其他"类型，过滤掉提现和订单
         if (this.expenseType === '其他') {
           const originalCount = items.length
-          items = items.filter(item => 
-            item.bstType !== 'WITHDRAW' && item.bstType !== 'ORDER'
-          )
+          items = items.filter(item => item.bstType !== 'WITHDRAW' && item.bstType !== 'ORDER')
           console.log(`其他类型过滤: 原始${originalCount}条，过滤后${items.length}条`)
         }
-        
+
         // 格式化日期显示
         const date = this.formatDateForDisplay(item.createTime)
-        
+
         return {
           date: date,
           outflow: totalExpense,
           inflow: totalIncome,
-          items: items
+          items: items,
         }
       })
-      
+
       // 更新页面显示的支出和收入金额
       this.updateTotalAmounts()
     },
-    
+
     // 根据业务类型获取标题
     getTitleByBstType(bstType) {
       const titleMap = {
-        'WITHDRAW': '提现',
-        'ORDER': '订单'
+        WITHDRAW: '提现',
+        ORDER: '订单',
       }
       return titleMap[bstType] || '其他'
     },
-    
+
     // 根据业务类型获取状态
     getStatusByBstType(bstType) {
       const statusMap = {
-        'WITHDRAW': '审核中',
-        'ORDER': ''
+        WITHDRAW: '审核中',
+        ORDER: '',
       }
       return statusMap[bstType] || ''
     },
-    
+
     // 格式化日期显示
     formatDateForDisplay(dateString) {
       const date = new Date(dateString)
@@ -276,17 +270,17 @@ export default {
       const day = date.getDate()
       return `${year}年${month}月${day}日`
     },
-    
+
     // 更新总金额显示
     updateTotalAmounts() {
       let totalExpense = 0
       let totalIncome = 0
-      
+
       this.cardList.forEach(card => {
         totalExpense += card.outflow
         totalIncome += card.inflow
       })
-      
+
       this.expenditures = totalExpense.toFixed(2)
       this.Recorded = totalIncome.toFixed(2)
     },
@@ -420,7 +414,7 @@ view {
 }
 
 .type-item {
-  width: 30%;
+  width: 45%;
   height: 100rpx;
   background-color: #fff;
   border-radius: 10rpx;