收支明细界面0.5

api/balanceLog.js

@@ -0,0 +1,19 @@
+import request from '../utils/request'
+
+/**
+ * 获取余额日志列表
+ * @param {Object} params - 查询参数
+ * @param {string} params.beginCreateTime - 开始日期时间 (yyyy-MM-dd HH:mm:ss)
+ * @param {string} params.endCreateTime - 结束日期时间 (yyyy-MM-dd HH:mm:ss)
+ * @param {string} params.type - 1支出 2收入 (可选)
+ * @param {string} params.bstType - 记录类型 ORDER:订单、WITHDRAW:提现 (可选)
+ * @param {Array} params.excludeBstTypes - 排除的记录类型数组 (可选)
+ * @returns {Promise}
+ */
+export function getBalanceLogList(params) {
+  return request({
+    url: '/app/balanceLog/list',
+    method: 'GET',
+    params
+  })
+} 

pages/cashFlow/cashFlow.vue

@@ -36,7 +36,13 @@
     </view>
 
     <!-- 卡片区域 -->
-    <cash-flow-card v-for="(item, index) in cardList" :key="index" :cardData="item" />
+    <view v-if="loading" class="loading-container">
+      <text class="loading-text">加载中...</text>
+    </view>
+    <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" />
   </view>
   <!-- 底部弹窗 -->
   <uni-popup ref="popup" :mask-click="true" type="bottom">
@@ -70,6 +76,7 @@ import commonEnum from '../../enum/commonEnum'
 import { getNavBarHeight } from '../../utils/system'
 import uniPopup from '../../uni_modules/uni-popup/components/uni-popup/uni-popup.vue'
 import CashFlowCard from '../../components/cashFlowCard/cashFlowCard.vue'
+import { getBalanceLogList } from '../../api/balanceLog'
 
 export default {
   name: 'CashFlowPage',
@@ -85,64 +92,12 @@ export default {
       startDate: this.getDate('start'),
       endDate: this.getDate('end'),
       expenseTypes: [
-        '餐饮',
+        '提现',
-        '交通',
+        '订单',
-        '服饰',
+        '其他'
-        '购物',
-        '服务',
-        '教育',
-        '娱乐',
-        '运动',
-        '生活缴费',
-        '旅行',
-        '宠物',
-        '医疗',
-        '保险',
-        '公益',
-        '发红包',
-      ],
-      cardList: [
-        {
-          date: '4月28日',
-          outflow: 200.0,
-          inflow: 200.0,
-          items: [
-            {
-              title: '提现',
-              status: '审核中',
-              time: '15:22',
-              orderNumber: '213646848744124758',
-              amount: -200.0,
-            },
-            {
-              title: '订单',
-              time: '15:22',
-              orderNumber: '213646848744124758',
-              amount: 200.0,
-            },
-          ],
-        },
-        {
-          date: '4月28日',
-          outflow: 200.0,
-          inflow: 200.0,
-          items: [
-            {
-              title: '提现',
-              status: '审核中',
-              time: '15:22',
-              orderNumber: '213646848744124758',
-              amount: -200.0,
-            },
-            {
-              title: '订单',
-              time: '15:22',
-              orderNumber: '213646848744124758',
-              amount: 200000.0,
-            },
-          ],
-        },
       ],
+      cardList: [],
+      loading: false,
     }
   },
   computed: {
@@ -151,12 +106,13 @@ export default {
     },
   },
   onLoad() {
-    // 页面加载时的逻辑
+    this.loadBalanceLogData()
   },
   methods: {
     // 日期选择变化处理
     bindDateChange: function (e) {
       this.date = e.detail.value
+      this.loadBalanceLogData()
     },
     getDate(type) {
       const date = new Date()
@@ -167,6 +123,8 @@ export default {
       if (type === 'start') {
         year = year - 10
       } else if (type === 'end') {
+        // 结束日期设为当前时间
+        return new Date().toISOString().split('T')[0]
       }
       month = month > 9 ? month : '0' + month
       day = day > 9 ? day : '0' + day
@@ -185,6 +143,151 @@ export default {
       console.log('选择的类型：', type)
       this.expenseType = type
       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
+        }
+        
+        console.log('查询参数:', {
+          beginCreateTime: params.beginCreateTime,
+          endCreateTime: params.endCreateTime
+        })
+        
+        // 根据选择的类型添加筛选条件
+        if (this.expenseType !== '全部类型') {
+          if (this.expenseType === '提现') {
+            params.bstType = 'WITHDRAW'
+            console.log('查询类型: 提现')
+          } else if (this.expenseType === '订单') {
+            params.bstType = 'ORDER'
+            console.log('查询类型: 订单')
+          } else if (this.expenseType === '其他') {
+            console.log('查询类型: 其他 (前端过滤)')
+          }
+        } 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'
+          })
+        }
+      } catch (error) {
+        console.error('API调用失败:', error)
+        uni.showToast({
+          title: '网络错误，请重试',
+          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 // 保留原始类型用于过滤
+          }
+        })
+        
+        // 如果是"其他"类型，过滤掉提现和订单
+        if (this.expenseType === '其他') {
+          const originalCount = items.length
+          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
+        }
+      })
+      
+      // 更新页面显示的支出和收入金额
+      this.updateTotalAmounts()
+    },
+    
+    // 根据业务类型获取标题
+    getTitleByBstType(bstType) {
+      const titleMap = {
+        'WITHDRAW': '提现',
+        'ORDER': '订单'
+      }
+      return titleMap[bstType] || '其他'
+    },
+    
+    // 根据业务类型获取状态
+    getStatusByBstType(bstType) {
+      const statusMap = {
+        'WITHDRAW': '审核中',
+        'ORDER': ''
+      }
+      return statusMap[bstType] || ''
+    },
+    
+    // 格式化日期显示
+    formatDateForDisplay(dateString) {
+      const date = new Date(dateString)
+      const month = date.getMonth() + 1
+      const day = date.getDate()
+      return `${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)
     },
   },
 }
@@ -327,4 +430,20 @@ view {
   font-size: 28rpx;
   box-shadow: #ff803a 0 2rpx 8rpx;
 }
+
+/* 加载和空状态样式 */
+.loading-container,
+.empty-container {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 200rpx;
+  margin: 40rpx;
+}
+
+.loading-text,
+.empty-text {
+  font-size: 28rpx;
+  color: #999;
+}
 </style>