BRS1.0/pages/search/index.vue

<template>
	<view class="app-content">
		<view class="nav">
			<liu-search @fall="fall" @input="input" @change="change"
				@changes='changes'></liu-search>
		</view>
		<view class="title">
			<!-- <view class="date">
				<uni-datetime-picker type="date" :clear-icon="false" v-model="date" @change="maskClick" />
			</view> -->
			<view class="inOut">
				<uni-data-checkbox v-model="inOut" :localdata="inOutList" @change="inOutChange"></uni-data-checkbox>
			</view>
		</view>
		 <scroll-view  class="content" scroll-y="true" @scrolltolower="scrolltolower">
			 <!-- <view class="craid" v-for="(item,index) in flightList" :key="index"  @tap="toIndex(item)">
			 	<view class="craid_data">
			 		{{item.carrierFlights}}
			 	</view>
				<view class="craid_data">
					{{item.carrierFlightsDate}}
				</view>
			 </view> -->
			 <uni-list>
			 	<uni-list-item  v-for="(item,index) in flightList" :key="index" :clickable= 'true'  @click="toIndex(item)">
					<template v-slot:body>
						<view style="display: flex;flex-direction: row;justify-content: space-between;">
							<view style="margin-right: 30px;width: 80px;">{{item.carrierFlights}}</view>
							<view style="margin-right: 30px;width: 90px;">{{item.outAirport}} - {{item.landAirport}}</view>
							<view>{{item.carrierFlightsDate}}</view>
						</view>
					</template>
				</uni-list-item>
			 </uni-list>
		 </scroll-view>
		<!-- <view class="content" v-if="flightList.length">
			<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'
	import {
		Format
	} from '@/components/utils/validate'
	export default {
		data() {
			return {
				// date:null,
				historyList: [],
				maskTitle: '请核对录入的航班号或行李号是否正确',
				tabname: '', //按钮名称
				typeShow: true,
				headername: '请核对信息',
				value:null,
				flightList:[],
				inOut:1,
				inOutList: [ {
					text: '离港',
					value: 1
				}, {
					text: '进港',
					value: 2
				}],
				page:1
			}
		},
		created(option) {},
		onLoad() {},
		onUnload() {uni.$off("scancodemsg");},
		onShow() {
			// this.date = this.datatime()
			uni.$on("scancodemsg", (data) => {
				if (data.msg.length > 9) {
					uni.navigateTo({
						url: "/pages/detail/index?luggageNum=" + data.msg
					})
				}
			});
			this.getDataList()
		},
		onHide() {uni.$off("scancodemsg");},
		mounted() {
		},
		components: {
			Nav
		},
		methods: {
			// maskClick(e){
			// 	console.log(e)
			// },
			inOutChange(){
				this.page = 1;
				this.flightList = [];
				this.getDataList();
			},
			scrolltolower(){
				this.getDataList()
			},
			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 if(this.value.length<=9 && this.value.length>0){
					this.getFlightData(this.value)
					this.cancel()
				}
				else{
					this.flightList = [];
					this.page = 1;
					this.getDataList()
				}
			},
			async getFlightData(num) {
				let data = {
					"serviceId": 3000,
					"page": 1,
					"pageSize": 20,
					"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 if(res.code == "0" && res.returnData.length==0){
						uni.showToast({
							icon:'none',
							title: "没有更多信息",
							duration: 5000
						});
					}
					else{
						this.$scanAudio.src = "../../static/hqhb.mp3"
						this.$scanAudio.play()
						uni.showToast({
							icon:'none',
							title: "无此航班号信息，请确认航班号",
							duration: 5000
						});
					}
				})
			},
			async getDataList(){
				let data = {
					"serviceId": 3010,
					"page": this.page,
					"pageSize": 20,
					"dataContent": [{
					}],
					"event": "0"
				}
				if(this.inOut == 1){
					data.dataContent = [{
						"outAirport": this.$storage.get("airportName")
					}]
				}
				else{
					data.dataContent = [{
						"landAirport": this.$storage.get("airportName")
					}]
				}
				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');
						let list = res.returnData
						list.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 = "-"
							}
							this.flightList.push(item)
						})
						this.page++
					}
				})
			},
			cancel(){},
			//input事件
			input(e) {
				console.log('搜索框输入的内容：' + e)
				if(e.length==0){
					this.flightList = [];
					this.page = 1;
					this.getDataList()
				}
			},
			datatime() {
				let dataTime = Format("yyyy-MM-dd", new Date());
				return dataTime
			},
		},
	}
</script>

<style lang="scss" scoped>
	.app-content {
		height:100vh;
		overflow: hidden;
		>.nav {
			width: 100%;
			position: relative;
			display: flex;
			margin-top: 1.875rem;
			height: 3.5rem;
			>.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%;
			}
		}
		>.title{
			height: 3rem;
			padding: 0 35px;
			box-sizing: border-box;
			>.date{
				margin-bottom: 15px;
			}
		}
		>.content{
			height: calc(100vh - 9.5rem);
			>.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>