余额明细

hdPad/src/api/custom/index.js

@@ -31,4 +31,8 @@ export const changeLevel = data => {
 
 export const debtChangeList = data => {
 	return https.get('/custom-debt-change/list', data)
+}
+
+export const getBalanceChangeList = data => {
+	return https.get('/balance-change/list', data)
 }

hdPad/src/pages/home/components/balanceChange.vue

@@ -0,0 +1,285 @@
+<template>
+    <view class="balance-change">
+        <view class="app-content">
+            <block v-if="!$util.isEmpty(list.data)">
+                <view class="table-header-container">
+                    <view class="table-header table-row">
+                        <view class="table-cell cell-date table-header-text">日期</view>
+                        <view class="table-cell cell-event table-header-text">事项</view>
+                        <view class="table-cell cell-staff table-header-text">操作</view>
+                        <view class="table-cell cell-amount table-header-text">变动</view>
+                        <view class="table-cell cell-balance table-header-text">余额</view>
+                    </view>
+                </view>
+                <view class="balance-table">
+                    <view v-for="(item, index) in list.data" :key="index" class="table-body">
+                        <view class="table-row table-row-data" @click="goDetail(item)">
+                            <view class="table-cell cell-date">{{ formatDate(item.addTime) }}</view>
+                            <view class="table-cell cell-event">{{ formatText(item.event) }}</view>
+                            <view class="table-cell cell-staff">{{ formatText(item.staffName) }}</view>
+                            <view class="table-cell cell-amount">{{ item.amount }}</view>
+                            <view class="table-cell cell-balance">{{ parseFloat(item.balance) }}</view>
+                        </view>
+                        <view class="table-row table-row-extra" v-if="showExtraInfo(item)">
+                            <view class="table-cell cell-extra" :colspan="5">
+                                <view v-if="Number(item.settleId)>0" @click.stop="goSettle(item)" class="extra-item">结账单 {{formatText(item.settleNo)}} {{item.settleAmount?parseFloat(item.settleAmount):0}}元</view>
+                                
+                                <view v-if="Number(item.settleAmount)>0 && Number(item.becomeBalance)>0" class="extra-item">余额 {{item.becomeBalance}}元</view>
+                                
+                                <view v-if="Number(item.shOrderId)>0" @click.stop="goShPayOrder(item)" class="extra-item">售后单{{ formatText(item.shOrderSn) }}</view>
+
+                                <view v-if="Number(item.refundOrderId)>0" @click.stop="goRefundOrder(item)" class="extra-item">订单 {{ formatText(item.refundOrderSn) }}</view>
+
+                                <view v-if="!$util.isEmpty(item.remark)" class="extra-item">{{ formatText(item.remark) }}</view>
+                            </view>
+                        </view>
+                    </view>
+                </view>
+            </block>
+            <block v-else>
+                <view class="empty-data">暂无数据</view>
+            </block>
+        </view>
+    </view>
+</template>
+<script>
+import { getBalanceChangeList } from '@/api/custom'
+import list from '@/mixins/list'
+export default {
+    name: "balanceChange",
+    mixins:[list],
+    props: {
+        customId: {
+            type: [Number, String],
+            default: 0
+        }
+    },
+    data() {
+        return {
+        };
+    },
+    watch: {
+        customId: {
+            handler(newVal) {
+                if (newVal) {
+                    this.resetList()
+                    this.init()
+                }
+            },
+            immediate: true
+        }
+    },
+    methods: {
+        showExtraInfo(item) {
+            return Number(item.settleId)>0 || !this.$util.isEmpty(item.remark) || Number(item.refundOrderId)>0 || Number(item.shOrderId)>0;
+        },
+        formatDate(date) {
+            if (!date) return '';
+            // 只显示月日和时间
+            return date.substr(5, 11);
+        },
+        formatText(text) {
+            if (!text) return '';
+            // 如果文本太长，截取一部分
+            return text.length > 12 ? text.substring(0, 12) + '...' : text;
+        },
+        goRefundOrder(item){
+            this.$util.pageTo({ url: '/admin/order/detail?id='+item.refundOrderId})
+        },
+        goShPayOrder(item){
+            this.$util.pageTo({ url: '/admin/order/detail?id='+item.shOrderId})
+        },
+        goSettle(item){
+            this.$util.pageTo({url:'/admin/settle/detail?id='+item.settleId})
+        },
+        goDetail(item){
+            if(item.capitalType == 0){
+                //订单详情
+                this.$util.pageTo({url: '/admin/order/detail?id='+item.relateId})
+            }
+            if(item.capitalType == 59){
+                //售后单
+                this.$util.pageTo({url: '/admin/order/refundDetail?id='+item.relateId})
+            }
+        },
+        async init(){
+            if (!this.customId) return
+            
+            const res = await getBalanceChangeList({ 
+                page: this.list.page,
+                customId: this.customId 
+            })
+            
+            if (this.$util.isEmpty(res.data.list)){
+                this.completes(res)
+                return
+            }
+            
+            let currentList = res.data.list
+            currentList.forEach(function(item,index,array){
+                array[index].amount = item.io == 0 ? '-'+parseFloat(item.amount) : '+'+parseFloat(item.amount)
+            });
+
+            res.data.list = currentList
+            this.completes(res)
+        },
+        refresh() {
+            this.resetList()
+            this.init()
+        }
+    }
+};
+</script>
+<style lang="scss" scoped>
+.balance-change {
+    height: 100%;
+    width: 100%;
+    display: flex;
+    flex-direction: column;
+    max-height: 100vh;
+    box-sizing: border-box;
+    
+    .balance-title {
+        padding: 3upx;
+        font-size: 10upx;
+        background-color: #09C567;
+        color: #FFFFFF;
+        text-align: center;
+        flex-shrink: 0;
+        height: 16upx;
+        line-height: 16upx;
+    }
+    
+    .app-content {
+        flex: 1;
+        overflow-y: auto;
+        overflow-x: hidden;
+        padding: 0 2upx;
+        box-sizing: border-box;
+    }
+    
+    .empty-data {
+        text-align: center;
+        padding: 20upx 0;
+        color: #999;
+        font-size: 10upx;
+    }
+}
+
+.table-header-container {
+    position: sticky;
+    top: 0;
+    z-index: 10;
+    width: 100%;
+    background: #f5f7fa;
+    box-shadow: 0 2upx 4upx rgba(0,0,0,0.1);
+    
+    .table-row {
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+    }
+}
+
+.balance-table {
+    width: 100%;
+    border-radius: 8upx;
+    overflow: hidden;
+    background: #fff;
+    box-shadow: 0 2upx 12upx rgba(0,0,0,0.04);
+    margin: 0 0;
+    font-size: 8upx;
+    box-sizing: border-box;
+    
+    .table-row {
+        display: flex;
+        align-items: center;
+        min-height: 30upx;
+        border-bottom: 1px solid #f0f0f0;
+        
+        &.table-header {
+            background: #f5f7fa;
+            font-weight: bold;
+            font-size: 8upx;
+            color: #333;
+            height: 26upx;
+            width: 100%;
+            display: flex;
+            flex-direction: row;
+        }
+        
+        &.table-row-data {
+            font-size: 9upx;
+            color: #222;
+            transition: background 0.2s;
+            cursor: pointer;
+            height: 28upx;
+            
+            &:hover {
+                background: #f0f9ff;
+            }
+        }
+        
+        &.table-row-extra {
+            background: #f8f8f8;
+            color: #989494;
+            font-size: 8upx;
+            min-height: 20upx;
+            max-height: 40upx;
+            
+            .cell-extra {
+                padding: 2upx 4upx;
+                display: flex;
+                flex-direction: column;
+                
+                .extra-item {
+                    font-size: 8upx;
+                    line-height: 12upx;
+                    white-space: nowrap;
+                    overflow: hidden;
+                    text-overflow: ellipsis;
+                    margin-bottom: 1upx;
+                }
+            }
+        }
+    }
+    
+    .table-cell {
+        flex: 1;
+        padding: 4upx 3upx;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        
+        &.table-header-text {
+            font-size: 8upx;
+        }
+        
+        &.cell-date {
+            text-align: center;
+            flex: 0.9;
+        }
+        
+        &.cell-staff {
+            text-align: center;
+            flex: 0.6;
+        }
+        
+        &.cell-event {
+            text-align: left;
+            flex: 1.5;
+        }
+        
+        &.cell-amount {
+            text-align: right;
+            flex: 0.8;
+        }
+        
+        &.cell-balance {
+            text-align: right;
+            padding-right: 6upx;
+            flex: 0.8;
+        }
+    }
+}
+</style>

hdPad/src/pages/home/components/customInfo.vue

@@ -138,7 +138,7 @@ export default {
 
     },
     goBalance(){
-      this.$emit('goBalance',this.customInfo)
+      this.$emit('goBalance')
     },
     goRecharge(){
 

hdPad/src/pages/home/custom.vue

@@ -11,9 +11,12 @@
             <view class="custom-info">
                 <customInfo ref="customInforRef" :selectCustomId="selectCustomId" @goBalance="goBalance"></customInfo>
             </view>
-            <view class="custom-asset balance">
+            <view class="custom-asset" v-if="showIndex == 0">
 
             </view>
+            <view class="custom-asset balance" v-if="showIndex == 1">
+                <balanceChange ref="balanceChangeRef" :customId="selectCustomId"></balanceChange>
+            </view>
         </view>
     </view>
 </view>
@@ -24,23 +27,31 @@ import productMins from "@/mixins/product";
 import casherNav from './components/nav.vue'
 import customList from './components/customList.vue'
 import customInfo from './components/customInfo.vue'
+import balanceChange from './components/balanceChange.vue'
 export default {
     name: "custom",
-    components: {casherNav,customList,customInfo},
+    components: {casherNav,customList,customInfo,balanceChange},
     mixins: [productMins],
     data() {
         return {
             currentJobType:'custom',
             currentJobId:0,
             selectCustomId:0,
+            showIndex:0
         }
     },
     computed: {
         ...mapGetters(["getLoginInfo"])
     },
     methods: {
-        goBalance(info){
-            console.log(info)
+        goBalance(){
+            this.showIndex = 1
+            // 确保组件已经渲染后再调用refresh方法
+            this.$nextTick(() => {
+                if (this.$refs.balanceChangeRef) {
+                    this.$refs.balanceChangeRef.refresh()
+                }
+            })
         },
         getCustomInfo(item){
             this.selectCustomId = Number(item.id)
@@ -110,7 +121,12 @@ export default {
     }
     & .custom-asset{
         flex: 32;
-        padding: 20px;
+        
+        &.balance {
+            display: flex;
+            flex-direction: column;
+            padding: 0;
+        }
     }
 }
 </style>