yunshan/pages/finance/computat.vue

<template>
	<view class="container">
		<view class="swiper-box">
			<scroll-view scroll-y class="cate-list" @scrolltolower="loadData">
				<view v-for="(item, index) in orderList" class="content-box">
					<view class="list-box">
						<view class="list-item">订单号：{{item.order_id}}</view>
						<view class="list-item">产品名称：{{item.body}}</view>
						<view class="list-item">购买数量：{{item.num}}</view>
						<view class="list-item">状态：{{item.status}}</view>
						<view class="list-item grey">购买时间：{{item.add_time}}</view>
						<view class="list-item grey">到期倒计时：{{item.end_time}}</view>
					</view>
				</view>
				<uni-load-more :status="loadingType"></uni-load-more>
			</scroll-view>
		</view>
	</view>
</template>
<script>
	import { order } from '@/api/quotation.js';
	import { getTime } from '@/utils/rocessor.js';
export default {
	data() {
		return {
			loadingType:'',
			loading:'',
			page:1,
			limit:3,
			orderList:[],
			
		};
	},
	onShow: function() {
		this.loadData();
	},
	methods: {
		// 请求载入数据
		async loadData(type) {
			//这里是将订单挂载到tab列表下
			let obj = this;
			if (type != 'refresh') {
				//没有更多数据直接跳出方法
				if (obj.loadingType === 'nomore') {
					return;
				} else {
					// 设置当前为数据载入中
					obj.loadingType = 'loading';
				}
			} else {
				//当重新加载数据时更新状态为可继续添加数据
				obj.loadingType = 'more';
			}
			order({
				page: obj.page,
				limit: obj.limit
			})
				.then(({ data }) => {
					if (type === 'refresh') {
						obj.orderList = [];
					}
					let arr = data.list.map(e => {
						let now = new Date();
						//现在时间转换成时间戳
						let nowTime = now.getTime();
						let data = e.end_time;
						data = data.replace(/-/g, '/');
						let time = new Date(data);
						let end_time = time.getTime();
						if(nowTime > end_time){
							e.status = '过期了'
						}else{
							e.status = '正常'
						}
						return e;
					});
					obj.orderList = obj.orderList.concat(arr);
					//判断是否还有下一页，有是more  没有是nomore
					if (obj.limit == arr.length) {
						obj.page++;
						obj.loadingType = 'more';
					} else {
						obj.loadingType = 'nomore';
					}
					// 判断是否为刷新数据
					if (type == 'refresh') {
						// 判断是否为点击搜索按钮跳转加载
						if (obj.loading == 1) {
							uni.hideLoading();
						} else {
							uni.stopPullDownRefresh();
						}
					}
				})
				.catch(e => {
					obj.loadingType = 'nomore';
					uni.stopPullDownRefresh();
					uni.hideLoading();
				});
		},
	}
};
</script>

<style lang="scss">
page {
	min-height: 100%;
	background-color: #F7F7F7;
	.container {
		width: 100%;
		background-color: #FFFFFF;
		font-size: 30rpx;
	}
}
.swiper-box {
	height: 90vh;
	.cate-list {
		height: 90vh;
	}
}
.list-box{
	padding: 25rpx 25rpx;
	border-bottom: 2rpx solid #EAEAEA;
	.list-item{
		padding-bottom: 25rpx;
	}
}
.grey{
	color: #A8A8A8;
	font-size: 26rpx;
}
</style>