sct/pagesT/pointsMall/PointsDetail.vue

<template>
	<view :class="['qn-page-' + theme]">
		<view class="detail-ul">
			<view class="detail-li" v-for="(item, index) in detail_list" :key="index">
				<!-- 摘要 -->
				<view class="ellipsis title">{{ item.title }}</view>

				<!-- 创建时间 -->
				<view class="time">{{ $u.timeFormat(item.createTime, 'yyyy-mm-dd hh:MM:ss') }}</view>
				<!-- 剩余股权 -->
				<view class="money"><span>{{ parseInt(item.type) === 4 ? "-" : "+" }}</span>{{ item.amount }}</view>
			</view>
			<!-- 空白页 -->
			<Aempty text="暂无数据" src="https://onlineimg.qianniao.vip/list.png" v-if="detail_list.length === 0"></Aempty>
			<u-loadmore v-else :status="loading_status" />
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				loading_status: 'nomore',
				page: 1,
				pageSize: 10,
				total: 0,
				detail_list: []
			};
		},
		computed: {
			userId() {
				return this.$store.state.userStatus.id;
			}
		},
		onLoad() {
			this.getAllCustomerIntegralDesc();
		},
		onPullDownRefresh() {
			this.page = 1;
			this.getAllCustomerIntegralDesc();
		},
		onReachBottom() {
			if (this.total / this.pageSize > this.page) {
				this.page += 1;
				this.getAllCustomerIntegralDesc();
			}
		},
		methods: {
			// 股权流水
			getAllCustomerIntegralDesc() {
				this.loading_status = 'loading';
				this.$u.api.getAllCustomerIntegralDesc({
					// star:'',
					// end:'',
					customerId: this.userId,
					page: this.page,
					pageSize: this.pageSize,
				}).then(res => {
					uni.stopPullDownRefresh();
					this.detail_list = res.data.lists
					if (this.page === 1) {
						this.detail_list = res.data.lists;
					} else {
						this.detail_list = this.detail_list.concat(res.data.lists);
					}
					this.total = res.pageTotal;
					this.loading_status = this.$_utils.loadStatus(this.page, this.pageSize, this.total);
				}).catch(res=>{
					this.loading_status = 'nomore';
					uni.stopPullDownRefresh();
				});
			},

		}
	};
</script>

<style lang="scss" scoped>
	.detail-ul {
		.detail-li {
			width: 710rpx;
			margin: 20rpx auto;
			background-color: #ffffff;
			border-radius: 16rpx;
			padding: 24rpx;
			position: relative;

			.title {
				font-weight: bold;
				padding-bottom: 12rpx;
				-webkit-line-clamp: 2;
			}

			.time {
				font-size: 24rpx;
				color: #6c6c6c;
			}

			.money {
				position: absolute;
				font-family: DIN-Medium;
				right: 24rpx;
				top: 50%;
				font-weight: bold;
				transform: translateY(-50%);
				color: $price-color;
			}
		}
	}
</style>