<template>
	<view >
		<u-navbar title="无牌车辆扫码停车" :is-back="false" ></u-navbar>
		<view class="main">
			<view class="park-name" v-if="detail.parkName">
				<img src="@/assets/static/img/if-location-pin@2x.png" alt="">
				<text>{{detail.parkName}}</text>
			</view>
			<view class="unlabeled"  >
				无牌车
			</view>
			<view class="bus-number" v-if="detail.id">
				{{detail.carNum}}
			</view>
			<view class="bus-number"  v-if="!detail.id">
				{{message}}
			</view>	
		</view>
		
		<view v-if="detail.inParkingStatus==1" style="
				text-align: center;
				font-size: 30px;
				font-weight: bold;
			">
			车辆已进场
		</view>
		<u-button v-if="detail.inParkingStatus==0" @click="submit" >请求进场</u-button>
		<view class="notice" v-if="txt">
			<view class="title">
				停车场须知
			</view>
			<p v-html="txt"></p>
			
			
		</view>
		
		<view class="notice" v-if="titleShow">
			<view class="title">
				停车场须知
			</view>
			<h3 style="color:red">入住酒店客户请截图保留此页面</h3>
			
			
		</view>
	</view>
</template>

<script>
	import * as API from '@/apis/parking.js'
	import * as newsApi from '@/apis/news.js'
	
	export default {
		data() {
			return {
				idList: [
					'1597417780772667394',
					'1597520273619877889',
					'1597419066154876929',
					'1598241772815319041'
				],
				titleShow: false,
				channelId:'',
				detail:{},
			 message:"",
				txt:''
			}
		},onLoad(op) {
			this.getNewsInfoDetail()
			if(op.id){
				this.channelId=op.id
				
				for (var i = 0; i < this.idList.length; i++) {
					if(this.idList[i] == this.channelId) {
						this.titleShow = true;
					}
				}
				
				this.getInfo()
			}else{
				uni.showModal({
					content:"参数错误"
				})
			}
			
		},	methods: {
			getNewsInfoDetail() {
				
				
				newsApi.findConfigureByKey({
					key:'parking-registration-txt'
				}).then((res) => {
									
					this.txt = res.data.value;
					
				}).catch(error => {
					uni.showToast({
						title: error,
						icon: "none"
					})
				})
			},
			submit(){
				uni.showLoading({
					title: "加载中",
					mask: true,
				})
				
				API.temporaryCarNumInPark({
					id: this.detail.id,
					openId: this.carhelp.getOpenId(),
					channelId:this.channelId
				}).then(data => {
					var obj=data.data;
					 
					this.carhelp.set("parkingregistration_submit",obj)
					uni.reLaunch({
						url:'/pages/parking/request'
					})
					
				}).catch(error => {
						uni.hideLoading()
					uni.showToast({
						title: error,
						icon: "none"
					})
				})
				
			},
			getInfo(){
				uni.showLoading({
					title: "加载中",
					mask: true,
				})
				API.generateTemporaryCarNum({
					openId:this.carhelp.getOpenId(),
					channelId:this.channelId
				}).then((res) => {
					
					uni.hideLoading();
					
					this.detail = res.data;
					if(this.detail.status==2){
						uni.reLaunch({
							url:'/pages/parking/outPayment?id='+this.channelId
						})
					}
				}).catch(error => {
						uni.hideLoading()
						this.message=error
				})
			}
		}
	}
	
</script>

<style lang="scss" scoped>
	
	.main{
		
		padding: 20px 0px 28px 23px;
		background: linear-gradient(#1F55FF,#27ABFF);
		.park-name{
		    line-height: 20px;
			color: rgba(255, 255, 255, 100);
			font-size: 20px;
			position: relative;
			text{
				margin-left: 25px;
			}
			img{
				width: 20px;
				height: 20px;
				margin-right: 8px;
				position: absolute;
				
			}
		}
		.unlabeled{
			line-height: 36px;
			color: rgba(255, 255, 255, 100);
			font-size: 36px;
			margin-top: 28px;
		}
		.bus-number{
			line-height: 48px;
			color: rgba(255, 255, 255, 100);
			font-size: 48px;
			margin-top: 20px;
		}
	}
	.u-btn{
		width: 89.3% ;
		background-color:#005AD9;
		color: #ffffff;
		border-radius: 12px;
		margin-top: 20px;
	}
	.notice{
		padding: 20px 23px;
		.title{
			font-size: 16px;
			color: #101010;
		}
		p{
			color: #666666;
			margin-top: 8px;
		}
	}
</style>