<template>
	<view class="app-content">
		<view class="nav">
			<liu-search @fall="fall" :historyList="historyList" @input="input" @change="change"
				@changes='changes'></liu-search>
		</view>
		<view class="content" v-if="flightList.length">
			<!-- <button  v-for="(item, index) in flightList" :key="index"  @tap="input(1)">11111111</button> -->
			<button class="craid" v-for="(item,index) in flightList" :key="index"  @tap="toIndex(item)">
				<view class="craid_data">
					<p>{{item.carrierFlights}}</p>
					<span>{{item.carrierFlightsDate}}</span>
				</view>
				<view class="craid_data">
					<p>{{item.outAirport}}</p>
					<span>{{item.scheduleTakeOffTime}}</span>
				</view>
				<view class="aircraft">To</view>
				<view class="craid_data">
					<p>{{item.landAirport}}</p>
					<span>{{item.scheduleLandInTime}}</span>
				</view>
			</button>
		</view>
		<!-- 提示信息和下拉弹窗 -->
		<mask-model :headername="headername" :typeShow="typeShow" :tabname="tabname" ref="showMask" btnType="1"
			@confirm="confirm" @cancel="cancel" titleColoe="#666666" cancelColor="#666666" confirmColor="#007AFF"
			:maskTitle="maskTitle"></mask-model>
	</view>
</template>
<script>
	import Nav from '../../components/header/nav.vue'
	import maskModel from '../../components/mask-model/mask-model.vue'
	export default {
		data() {
			return {
				historyList: [],
				maskTitle: '请核对录入的航班号或行李号是否正确',
				tabname: '', //按钮名称
				typeShow: true,
				headername: '请核对信息',
				value:null,
				flightList:[]
			}
		},
		created(option) {},
		onLoad() {},
		onUnload() {uni.$off("scancodemsg");},
		onShow() {
			uni.$on("scancodemsg", (data) => {
				if (data.msg.length > 9) {
					uni.navigateTo({
						url: "/pages/detail/index?luggageNum=" + data.msg
					})
				}
			});
		},
		onHide() {uni.$off("scancodemsg");},
		mounted() {
		},
		components: {
			Nav
		},
		methods: {
			toIndex(item){
				this.$storage.setJson('searchData',item);
				// this.$storage.set('flightDate',item.carrierFlightsDate);
				uni.switchTab({
					url: "/pages/index/index"
				})
			},
			fall() {
				uni.navigateBack({
					delta: 1
				})
			},
			changes() {
				//     uni.redirectTo({
				// 	url: "/pages/myrecords/index"
				// })
			},
			//搜索内容
			change(e) {
				this.value = e
				this.typeShow = false
				this.maskTitle = '请核对录入的航班号或行李号是否正确'
				this.headername = '请核对信息'
				this.$refs.showMask.show();
			},
			confirm: function() { //确定按钮
				if(this.value.length>9){
					uni.navigateTo({
						url: "/pages/detail/index?luggageNum=" + Number(this.value)
					})
				}
				else{
					this.getFlightData(this.value)
					this.cancel()
				}
			},
			async getFlightData(num) {
				let data = {
					"serviceId": 3000,
					"page": 1,
					"pageSize": 10,
					"dataContent": [{
						"carrierFlights":num
					}],
					"event": "0"
				}
				await this.$http.httpPost('/openApi/query', data).then(res => {
					if (res.code == "0" && res.returnData.length>0) {
						this.$storage.remove('searchData')
						this.$storage.remove('flightDate');
						if(res.returnData.length==1){
							if(res.returnData[0].scheduleTakeOffTime){
								res.returnData[0].scheduleTakeOffTime = res.returnData[0].scheduleTakeOffTime.split("T")[1]
							}
							if(res.returnData[0].scheduleLandInTime){
								res.returnData[0].scheduleLandInTime = res.returnData[0].scheduleLandInTime.split("T")[1]
							}
							this.$storage.setJson('searchData',res.returnData[0]);
							uni.switchTab({
								url: "/pages/index/index"
							})
						}
						else {
							this.flightList = res.returnData
							this.flightList.map(item => {
								if(item.scheduleTakeOffTime){
									item.scheduleTakeOffTime = item.scheduleTakeOffTime.split("T")[1]
								}
								else{
									item.scheduleTakeOffTime = "-"
								}
								if(item.scheduleLandInTime){
									item.scheduleLandInTime = item.scheduleLandInTime.split("T")[1]
								}
								else{
									item.scheduleLandInTime = "-"
								}
							})
						}
					}
					else{
						this.$scanAudio.src = "../../static/hqhb.mp3"
						this.$scanAudio.play()
						uni.showToast({
							icon:'none',
							title: "无此航班号信息，请确认航班号",
							duration: 5000
						});
					}
				})
			},
			
			cancel(){},
			//input事件
			input(e) {
				console.log('搜索框输入的内容：' + e)
			},
		},
	}
</script>

<style lang="scss" scoped>
	.app-content {
		height:100vh;
		overflow: hidden;
		>.nav {
			width: 100%;
			position: relative;
			display: flex;
			margin-top: 1.875rem;
			height: 10rem;
			>.log {
				width: .375rem;
				height: .75rem;
				font-size: .75rem;
				position: absolute;
				left: 1.5rem;
				background: url('../../static/ico@1x.png') no-repeat;
				background-size: 100% 100%;
			}
		}
		>.content{
			height: calc(100vh - 14rem);
			overflow-x: hidden;
			overflow-y: auto;
			>.craid {
				// width: 100%;
				border-radius: 0!important;
				border-color: none;
				border: none;
				z-index: 10;
				height: 5.625rem;
				padding: 0 2.5625rem 0 2.5625rem;
				display: flex;
				justify-content: space-between;
				flex-wrap: wrap;
				align-items: center;
				border-bottom: 1px solid rgba(59, 111, 142, 1.00);
				>.craid_data {
					display: flex;
					flex-direction: column;
					justify-content: center;
					align-items: start;
			
					>p {
						color: rgb(0, 0, 0);
						font-family: Noto Sans SC;
						font-size: 18px;
						font-weight: 700;
					}
			
					>span {
						color: rgb(0, 0, 0);
						font-family: Noto Sans SC;
						font-size: 13px;
						font-weight: 500;
					}
				}
			
				>.aircraft {
					width: 1.75rem;
					height: 1.75rem;
					background: url('../../static/hang.png') no-repeat;
					background-size: 100% 100%;
				}
			}
		}
		
	}
</style>