停车记录

pages/information/parkingInfo.vue

@@ -1,38 +1,170 @@
 <template>
 	<view>
-		<u-steps :list="numList" mode="number" :current="current" un-active-color="#999999"></u-steps>
-		<view class="top">
-			<view class="view1">
+		<view class="top-step">
+			<u-steps :list="numList" activeColor="#00B962"
+			 mode="number" :current="current" un-active-color="#999999"></u-steps>
+		</view>
+		<view class="top" :class="'top'+current">
+			
+			<view class="view1 viewa">
 				<view class="name">
-					
+					扫码订单
 				</view>
 				<view class="time">
-					
+					{{showTime(info.userParkingRecord.createTime)}}
 				</view>
 			</view>
-			<view class="view1">
+			<view class="view1 viewb">
 				<view class="name">
-					
+					落锁使用
 				</view>
 				<view class="time">
-					
+					{{showTime(info.userParkingRecord.startTime)}}
 				</view>
 			</view>
-			<view class="view1">
+			<view class="view1 viewc">
 				<view class="name">
-					
+					结束抬锁
 				</view>
 				<view class="time">
-					
+					{{showTime(info.userParkingRecord.endTime)}}
+				</view>
+			</view>
+		</view>
+		<view class="main">
+			<view class="item">
+				<view class="name">
+					停车状态
+
+				</view>
+				<view class="value" :class="'userParkingRecord-status'+info.userParkingRecord.status">
+					{{(info.userParkingRecord.statusN)}}
+				</view>
+			</view>
+			<view class="item">
+				<view class="name">
+					停车时长
+
+				</view>
+				<view class="value">
+					{{getTime(info.userParkingRecord)}}
+				</view>
+			</view>
+			<view class="item" v-if="info.parkingInfo">
+				<view class="name">
+					停车场
+
+				</view>
+				<view class="value">
+					{{info.parkingInfo.name}}
+				</view>
+			</view>
+			<view class="item">
+				<view class="name">
+					车位号
+
+				</view>
+				<view class="value">
+					{{info.floorlockInfo.name}}
+				</view>
+			</view>
+			<view class="item">
+				<view class="name">
+					车位类型
+
+				</view>
+				<view class="value">
+					{{info.floorlockInfo.typeN}}
+				</view>
+			</view>
+			<view class="item">
+				<view class="name">
+					停车单号
+			
+				</view>
+				<view class="value">
+					{{info.userParkingRecord.orderNo}}
+				</view>
+			</view>
+			
+
+			
+		</view>
+		
+		<view class="main">
+			<view class="item">
+				<view class="name">
+					地锁状态
+
+				</view>
+				<view class="value">
+					{{info.floorlockInfo.lockStatusN}}
+				</view>
+			</view>
+			<view class="item" v-if="0">
+				<view class="name">
+					电池电量
+
+				</view>
+				<view class="value">
+					123
 				</view>
 			</view>
+			
+			
+		</view>
+		
+		<view class="main" v-if="info.recordUser">
+			<view class="item">
+				<view class="name">
+					用户名
+
+				</view>
+				<view class="value">
+					{{info.recordUser.nickName?info.recordUser.nickName:'未填写'}}
+				</view>
+			</view>
+			<view class="item">
+				<view class="name">
+					用户类型
+
+				</view>
+				<view class="value">
+					停车用户
+
+				</view>
+			</view>
+			<view class="item">
+				<view class="name">
+					联系方式
+
+				</view>
+				<view class="value">
+					{{info.recordUser.phone?info.recordUser.phone:'未填写'}}
+				</view>
+			</view>
+			<view class="item">
+				<view class="name">
+					车牌号
+
+				</view>
+				<view class="value">
+					{{info.recordUser.carNumber?info.recordUser.carNumber:'未填写'}}
+				</view>
+			</view>
+			
+			
 		</view>
 	</view>
 </template>
 
+
 <script>
 	import * as API from '@/apis/pagejs/index.js'
+	import {
+		newDate,
 	
+	} from '@/apis/utils'
 	export default {
 		data() {
 			return {
@@ -44,7 +176,12 @@
 				}, {
 					name: ''
 				}],
-				info:{}
+				info:{
+					parkingInfo:{},
+					userParkingRecord:{},
+					recordUser:{},
+					floorlockInfo:{}
+				}
 			};
 		},
 		onLoad(op) {
@@ -53,6 +190,36 @@
 		
 		},
 		methods: {
+			getTime(item){
+				if(item.startTime&&item.endTime){
+					var stime=newDate(item.startTime)
+					var etime=newDate(item.endTime)
+					//etime=new Date()
+					var k=(etime.getTime()-stime.getTime())/1000/60
+					
+					var H=k/60
+					var fen=k%(60)
+					var str="";
+					if(k>60){
+						str+=parseInt(H)+'小时'
+					}
+					if(fen==0&&str!=''){
+						
+					}else{
+						str+=parseInt(fen)+'分钟'
+					}
+					return str
+				}else{
+					return '未结束'
+				}
+			},
+			showTime(time){
+					if(time){
+						return time.substr(5).replace('-','.')
+					}else{
+						return ''
+					}
+			},
 			getInfo() {
 			
 				uni.showLoading({
@@ -64,9 +231,11 @@
 				}
 			
 				API.recordDetails(obj).then((res) => {
-				//	this.floorlockInfo = res.data.floorlockInfo
+					this.info = res.data
 			
 					uni.hideLoading();
+					this.current=this.info.userParkingRecord.status
+					
 					//this.getWhiteList()
 				}).catch(error => {
 			
@@ -82,6 +251,75 @@
 	}
 </script>
 
+<style>
+	page {
+		background-color: rgba(242, 244, 246, 1);
+	}
+</style>
 <style lang="scss" scoped>
-
+	.top-step{
+		margin-top: 40rpx;
+	}
+	.top{
+		margin-bottom: 40rpx;
+		display: flex;
+		    justify-content: space-between;
+			
+			.view1{
+				width: 33%;
+				    text-align: center;
+					.name{
+						color: rgba(51,51,51,1);
+						font-size: 28rpx;
+					}
+					.time{
+						color: rgba(119,119,119,1);
+						font-size: 20rpx;
+					}
+			}
+	}
+	.top0{
+		.viewb,.viewc{
+			.name{
+				color: rgba(119,119,119,1);
+			}
+			
+		}
+	}
+	.top1{
+		.viewc{
+			.name{
+				color: rgba(119,119,119,1);
+			}
+			
+		}
+	}
+	.main{
+		margin-bottom: 24rpx;
+		background: #fff;
+		.item{
+			display: flex;
+			    justify-content: space-between;
+				padding: 20rpx 32rpx;
+				border-top: 1px solid rgba(232,232,232,1);
+				color: rgba(51,51,51,1);
+				font-size: 16px;
+			.name{
+				white-space: pre;
+				
+			}
+			.value{
+				
+			}
+			.userParkingRecord-status0{
+				
+			}
+			.userParkingRecord-status1{
+				color: #FF5100 ;
+			}
+			.userParkingRecord-status2{
+				color: rgba(22,119,255,1);
+			}
+		}
+	}
 </style>

pages/information/parkingRecord.vue

@@ -3,8 +3,8 @@
 		<view class="top">
 			<view class="search">
 				<view class="searchBox">
-					<u-search shape="square" placeholder="搜索姓名/车牌/手机号" :show-action="false" :animation="true"></u-search>
-					<u-button type="primary" size="mini">搜素</u-button>
+					<u-search shape="square" placeholder="搜索停车场" v-model="testName" :show-action="false" :animation="true"></u-search>
+					<u-button type="primary" size="mini" @click="testBtn">搜素</u-button>
 				</view>
 			</view>
 		</view>
@@ -36,9 +36,10 @@
 
 				</view>
 			</view>
-			<u-divider  color="#B6BDC3"  :isnone="list.length==0"
-				bg-color="#fff">已经到底了</u-divider>
-		</view>
+			
+		</view>
+		<u-divider  color="#B6BDC3"  :isnone="list.length==0"
+			>已经到底了</u-divider>
 
 	</view>
 </template>
@@ -52,7 +53,8 @@
 	export default {
 		data() {
 			return {
-				list: [],
+				list: [],
+				testName:"",
 				listForm: {
 					name: "",
 					pageIndex: 1,
@@ -70,6 +72,12 @@
 			}
 		},
 		methods: {
+			testBtn(){
+				this.listForm.name=this.testName;
+				this.list=[]
+				this.listForm.pageIndex=1
+				this.getList()
+			},
 			showTime(time){
 					if(time){
 						return time.substr(5).replace('-','.')