<!-- 账户明细 -->
<template>
	<view class="recharge-code">
		<view class="list">
            <mescroll-body ref="mescrollRef" @init="mescrollInit" @up="upCallback" :up="upOption" @down="downCallback">
                <view class="p-t-20" >
                    <view class="bg-white item" v-for="(item, index) in list" :key="index">
                        <view class="row-between">
                            <view class="black mb10">{{item.desc}}</view>
                            <view class="xl primary">+{{item.total}}</view>
                        </view>
                        <view class="xs muted">{{item.create_time}}</view>
                    </view>
                </view>
		    </mescroll-body>
        </view>
	</view>
</template>

<script>
	import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
	import {getRechargeRecord} from "@/api/user"
	export default {
		mixins: [MescrollMixin], // 使用mixin
		data() {
			return {
				// Tabs 列表
                upOption:{
					noMoreSize: 4,
					empty:{
						tip: '~ 空空如也 ~', // 提示
						btnText: ''
					},
					textNoMore: '没有更多了'
				},
				list: [], // 列表数据--全部
			};
		},

		methods: {
			// 上拉加载 
			upCallback(page) {
				const pageNum = page.num // 页码, 默认从1开始
				const pageSize = page.size // 页长, 默认每页10条
				getRechargeRecord({
					page_size: pageSize,
					page_no: pageNum
				}).then(({
					data
				}) => {
					if (page.num == 1) this.list = [];
					const curPageData = data.list
					const curPageLen = curPageData.length
					const hasNext = !!data.more
					this.list = this.list.concat(curPageData)
					this.mescroll.endSuccess(curPageLen, hasNext)
				}).catch(() => {
					this.mescroll.endErr()
				})
			}
		},
	}
</script>

<style lang="scss" >
    .recharge-code {
		.list {
			.item {
				padding: 20rpx 30rpx;

				&:not(:last-of-type) {
					border-bottom: $-solid-border;
				}
			}
		}
	}
</style>