mabao/pages/personal/balance_info.vue

<template>
	<view class="main">
		<view class="opinionList flex align-center justify-between padding-lr-sm" v-for="(item,index) in balanceList">
			<view class="">
				<view class="flex align-center justify-between">
					<view class="flex align-center justify-between">
						<view class="margin-top-sm text-lg">
							{{item.remark}}
						</view>
					</view>
				</view>
				<view class="flex align-center margin-top-sm">
					<view class="margin-right-xs" style="color: #999999;">
						{{item.created_at}}
					</view>
				</view>
			</view>
			<view class="text-lg" style="color: #333333;">
				{{item.change_balance/100}}
			</view>
		</view>
		<u-empty text="暂无数据" :show="show" mode="order" margin-top="250"></u-empty>
		<view class="cu-tabbar-height"></view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				balanceList: [],
				pageindex: 1,
				show: false
			};
		},
		onReachBottom() {
			this.getbalanceinfo()
		},
		methods: {
			getbalanceinfo: async function() {
				let res = await this.$request.post("/api/v1/user/userBalanceLog", {
					page: this.pageindex
				})
				if (res.status == 0) {
					if (this.pageindex > res.data.last_page) {
						uni.showToast({
							title: "没有更多了",
							icon: "none"
						})
					} else {
						this.balanceList = this.balanceList.concat(res.data.data)
						this.pageindex++
					}
				}
				if (this.balanceList.length == 0) {
					this.show = true
				} else {
					this.show = false
				}

			}
		},
		onShow() {
			this.getbalanceinfo()
		}
	};
</script>
<style scoped lang="scss">
	.opinionList {
		padding-top: 40rpx;
		padding-bottom: 40rpx;
		border-radius: 16rpx;
		box-shadow: 0 0 50rpx 0 rgba(0, 0, 0, 0.1);
		margin-left: 20rpx;
		margin-right: 20rpx;
		margin-top: 15rpx;
	}

	.title_yijian {
		font-size: 20rpx;
		padding: 8rpx;
		border-radius: 20rpx;
		background-color: #0B73B9;
		color: #fff;
		width: 90rpx;
		text-align: center;
		margin-left: 20rpx;
		margin-right: 10rpx;
	}
</style>