wxThird/pages/subPack/depositList.vue

<template>
	<view class="box">
		<homenav :iStatusBarHeight="iStatusBarHeight" :title="'寄存订单'" :cj="4"></homenav>
		<view class="cont">
			<view class="line" @click="goDetail(item)" v-for="(item,index) in items">
				<view class="lineLeft">
					<view class="plateNumber">{{item.plateNumber}}</view>
					<view class="tire" v-if="item.goodsQty">{{item.goodsQty}}条轮胎</view>
				</view>
				<view class="state1" v-if="item.sheetState==0">寄存中</view>
				<view class="state2" v-if="item.sheetState==-1">待寄存</view>
				<view class="state2" v-if="item.sheetState==1">已领取</view>
				<view class="state2" v-if="item.sheetState==2">已作废</view>
			</view>
			
		</view>

		<nodata v-show="items==''&&isload"></nodata>
		
	</view>
</template>

<script>
	import nodata from '@/components/nodata/nodata.vue'
	import homenav from "@/components/homenav/nav.vue"
	export default {
		components: {
			nodata,homenav
		},
		data() {
			return {
				page: 1,
				tabIndex: -1,
				items: [],
				isload: false,
                iStatusBarHeight:'',
			}
		},
		onLoad(opt) {
            this.iStatusBarHeight = uni.getSystemInfoSync().statusBarHeight;
			this.getData()
		},
		onShow() {
			
		},
		methods: {
			
			goDetail(item) {
					uni.navigateTo({
						url: "depositDetail?id="+item.id
					})
				
			},
			getData() {
				uni.showLoading({
					title: '加载中'
				});
				this.isload = false;
				var padata = {
					page: this.page,
					limit: 10,
				}

				this.$http('/applet/tire-deposit-sheet/list', padata, 'GET').then(res => {
					uni.hideLoading();
					this.isload = true;

					var list = res.data.Items;

					if (this.page == 1) {
						this.items = list
					} else {
						this.items = this.items.concat(list)
					}

				})
			},

		},
		onReachBottom() {
			this.page++;

			this.getData()
		},
		onPullDownRefresh() {
			this.page = 1;
			this.getData()
			setTimeout(function() {
				uni.stopPullDownRefresh();
			}, 1000);
		}
	}
</script>

<style scoped>
	.box {
		min-height: 100vh;
		background: #F4F5F7;
	}
.cont{
	padding:0 24rpx;
}
.line{
	display: flex;
	justify-content: space-between;
	line-height: 42rpx;
	padding: 29rpx 20rpx;
	margin-top: 20rpx;
	background: #ffffff;
	border-radius: 10rpx;
}
.lineLeft{
	display: flex;
}
.plateNumber{
	font-weight: 500;
	color: #3C3C3C;
	font-size: 30rpx;
}
.tire{
	color: #666666;
	font-size: 24rpx;
	padding-left: 24rpx;
}
.state1{
	color: #EC0F0A;font-size: 24rpx;
}
.state2{
	color: #00A040;font-size: 24rpx;
}
</style>