wxThird/pages/user/checkReport.vue

<template>
	<view class="box">
	   <homenav :iStatusBarHeight="iStatusBarHeight" :title="'车检报告'" ></homenav>
	  <view class="screenBox">
	  	<view class="status_bar" :style="{height: iStatusBarHeight + 'px'}"></view>
	  	<view style="height: 44px;"></view>
	     <picker @change="bindPickerChange" :value="index" :range="array">
	  		<view class="screenName"> <span>车牌号：{{array[index]}}</span> 
	  		  <image src="../../static/timg/icon_arrow_right.png" mode="" class="jtImg"></image>
	  		</view>
	  	</picker>
	  </view>
	  <view style="height: 90rpx;"></view>
		<view class="itemHistory" v-for="(item,index) in itemData" :key="index" @click="goDetail(item.id)">
			<view class="time">{{item.CreateTime}}</view>
			<view class="carPlate">
				<view class="plate">{{item.PlateNumber}}</view>
				<view class="mileage" v-if="item.currentMileage>0">{{item.currentMileage}}km</view>
			</view>

			<view class="shopName"v-if="item.carmodel">{{item.carmodel}}</view>
			<view class="itemContent">{{item.shopname}}</view>
		</view>

		<!-- 上拉 加载更多 -->
		<view class="noMore" v-if="noMoreShow && (itemData.length!=0)">没有更多数据</view>
		<!-- 无数据空白页 -->
		<nodata v-if="itemData.length==0"></nodata>

	</view>
</template>

<script>
	import homenav from "../../components/homenav/nav.vue"
	import nodata from '../../components/nodata/nodata.vue'
	export default {
		components: {
			nodata,homenav
		},

		data() {
			return {
				page: 1,
				itemData: [],
				noMoreShow: false,
				urlStr:'',
				iStatusBarHeight:'',
				array: [],
				index: 0,
				wxOpenData: '',
				plateNumber:'',
			}
		},
		onLoad() {
			/* uni.navigateTo({
				url: 'reportUni?id=6C977C54-575E-4F67-9101-7A6D74DDD8BA'
			}) */
			this.iStatusBarHeight = uni.getSystemInfoSync().statusBarHeight;
			this.page = 1;
			this.myOrderCoupon();
			this.getplateNumber()
			//this.urlStr = this.$request.webUrl+'#/carOwner/index'
		},
		methods: {
			bindPickerChange: function(e) {
					console.log('picker发送选择改变，携带值为', e.detail)
					this.index = e.detail.value
					this.plateNumber=this.array[this.index]
					if(this.index==0){
						this.plateNumber=''
					}
					this.myOrderCoupon()
			},
			getplateNumber(){
				console.log("444")
				this.wxOpenData= this.$store.state.wxOpenData;
				this.$http('openweiXinCardInfoController/plateNumber-by-customerId', {
				    customerId:this.wxOpenData.loginInfo.uid
				}, 'GET').then(res => {
					this.array=res.data.split(',')
					this.array.unshift('全部')
				})
			},
			goDetail(id) {
				//  uni.navigateTo({
				// 	url: 'reportDetail?id=' + id
				// }) 
				 uni.navigateTo({
					url: 'reportUni?id=' + id
				}) 
			},
			myOrderCoupon() {
				uni.showLoading({
					title: '加载中'
				})
				this.$http('opencheckSheet/getTestList', {
                    plateNumber:this.plateNumber
					// page: this.page,
					// limit: 10,
				}, 'GET').then(res => {
					uni.hideLoading();
					// var list = res.data.Items
					var list = res.data

					// 处理 undefined和null转为空白字符串
					// list.forEach((item, index) => {
					// 	for (const key in item) {
					// 		item[key] = this.$praseStrEmpty(item[key])
					// 	}
					// })

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

					if (list.length < 10) {
						this.noMoreShow = true
					} else {
						this.noMoreShow = false
					}

					



				})
			},


		},

		// 下拉刷新 上拉加载更多
		onPullDownRefresh() {
			this.page = 1
			this.myOrderCoupon()
			setTimeout(function() {
				uni.stopPullDownRefresh();
			}, 1000);
		},
		onReachBottom() {
			// this.page++;
			this.myOrderCoupon()
		},
	}
</script>

<style>
	.box {
		min-height: 100vh;
		background-color: #F4F5F7;
		padding-top: 20rpx;
	}
	.jtImg{
		width: 12rpx;height: 20rpx;
		margin-top: 10rpx;
	}
	.screenBox{
		background: #FFFFFF;
		margin-bottom: 20rpx;
		position: fixed;
		width: 100vw;
		top: 0;left: 0;
	}
     .screenName{
		 padding: 24rpx;font-size: 28rpx;
		 display: flex;
		 justify-content: space-between;
	 }
	.itemHistory {
		margin: 0rpx 24rpx 20rpx;
		padding: 20rpx;
		background-color: #FFFFFF;
		border-radius: 10rpx;

	}

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

	.carPlate {
		margin: 20rpx 0rpx 15rpx;
		display: flex;
		align-items: center;
		justify-content: flex-start;
	}

	.plate {
		font-size: 30rpx;
		color: #3C3C3C;
		font-weight: bold;
		margin-right: 20rpx;
	}

	.mileage {
		font-size: 24rpx;
		color: #F19D01;
		padding: 0rpx 10rpx;
		border: 1rpx solid #F19D01;
		border-radius: 4rpx;
		height: 36rpx;
	}
	
	.shopName{
		color: #666666;
		font-size: 24rpx;
		margin: 16rpx 0rpx;
		/* 隐藏文字显示 ...不换行 */
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	.itemContent {
		color: #666666;
		font-size: 24rpx;
		
		/* 隐藏文字显示 ...不换行 */
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	.noMore {
		text-align: center;
		line-height: 50rpx;
		color: #999999;
		font-size: 28rpx;
	}
</style>