BRS1.0/pages/index/index.vue

<template>
	<view class="app-content">
		<img :src="icon" alt="" class="tuku">
		<Nav :navname.sync="navname" :navtype="false" :index="index" @clear="clear" :flightNo="searchFlightNo"></Nav>
		<view class="fight" v-if="flightDetail" @tap="toFlight()">
			<view class="fight_card">
				<p>{{flightDetail.carrierFlights}}</p>
				<span>{{flightDetail.carrierFlightsDate}}</span>
			</view>
			<view class="fight_card">
				<p>{{flightDetail.outAirport}}</p>
				<span>{{flightDetail.scheduleTakeOffTime?flightDetail.scheduleTakeOffTime:"-"}}</span>
			</view>
			<view class="fight_center">
				<view class="type">
					{{flightDetail.normalState}}
				</view>
				<view class="aircraft"></view>
			</view>
			<view class="fight_card">
				<p>{{flightDetail.landAirport}}</p>
				<span>{{flightDetail.scheduleLandInTime?flightDetail.scheduleLandInTime:"-"}}</span>
			</view>
		</view>
		<view class="times">
			<p>{{ newData }}</p>{{ newDataday }}
		</view>
		<view class="content">
			<view class="card" v-if="APP_SORT" @tap="clickOrder('SORT')">
				<p>分拣</p>
			</view>
			<view class="card" v-if="APP_LOAD" @tap="clickOrder('LOAD')">
				<p>装车</p>
			</view>
			<view class="card" v-if="APP_INFL" @tap="clickOrder('INFL')">
				<p>装机</p>
			</view>
			<view class="card" v-if="APP_UNLOAD" @tap="clickOrder('UNLOAD')">
				<p>卸机</p>
			</view>
			<view class="card" v-if="APP_ARRIVED" @tap="clickOrder('ARRIVED')">
				<p>到达</p>
			</view>
			<view class="card" v-if="APP_EXTRACT" @tap="clickOrder('extract')">
				<p>提取</p>
			</view>
			<view class="card" v-if="APP_Abnormal" @tap="clickOrder('abnormal')">
				<p>异常登记</p>
			</view>
			<view class="card_no">
			</view>
		</view>
	</view>
</template>
<script>
	import Nav from '../../components/header/nav.vue'
	import {
		Format
	} from '@/components/utils/validate'
	export default {
		data() {
			return {
				APP_SORT: false,
				APP_LOAD: false,
				APP_INFL: false,
				APP_UNLOAD: false,
				APP_ARRIVED: false,
				APP_EXTRACT: false,
				APP_Abnormal: false,
				input: '',
				main: null,
				poll: null,
				filter: null,
				pusher: null,
				intentServer: null,
				timeShow: true,
				arr: [],
				navname: '首页',
				icon: 'static/beijing.png',
				newData: '',
				newDataday: '',
				index: 0,
				flightDetail: null,
				flightNO: null,
				airportName: null,
				flightDate: null,
				outAirport :null,
				landAirport :null,
				searchFlightNo: ""
			}
		},
		created(option) {
			let authList = this.$storage.getJson('authList');
			authList.map(item => {
				switch (item.auth_ident) {
					case "APP_SORT":
						this.APP_SORT = true;
						break;
					case "APP_LOAD":
						this.APP_LOAD = true;
						break;
					case "APP_INFL":
						this.APP_INFL = true;
						break;
					case "APP_UNLOAD":
						this.APP_UNLOAD = true;
						break;
					case "APP_ARRIVED":
						this.APP_ARRIVED = true;
						break;
					case "APP_EXTRACT":
						this.APP_EXTRACT = true;
						break;
					case "APP_Abnormal_registration":
						this.APP_Abnormal = true;
						break;
					default:
						break;
				}
			})

		},
		onLoad(option) {},
		onUnload() {
			uni.$off("scancodemsg");
		},
		onShow() {
			uni.$on("scancodemsg", (data) => {
				console.log(data.msg)
				if (data.msg.length > 9) {
					uni.navigateTo({
						url: "/pages/detail/index?luggageNum=" + data.msg
					})
				}
			});
			if (this.$storage.get('airport')) {
				this.index = this.$storage.get('airport')
			}
			if (this.$storage.get('flightDate')) {
				this.flightDate = this.$storage.get('flightDate')
			}
			if (this.$storage.getJson('searchData')) {
				this.flightDetail = this.$storage.getJson('searchData')
				this.flightNO = this.flightDetail.carrierFlights
				this.searchFlightNo = this.flightDetail.carrierFlights
				this.flightDate = this.flightDetail.carrierFlightsDate
				this.outAirport = this.flightDetail.outAirport
				this.landAirport = this.flightDetail.landAirport
			}
		},
		onHide() {
			uni.$off("scancodemsg");
		},
		mounted() {
			this.datatime()
		},
		beforeDestroy() {
			// console.log(this.arr[0],this.arr[1])
		},
		components: {
			Nav
		},
		methods: {
			toFlight() {
				uni.navigateTo({
					url: "/pages/flightdetails/index"
				})
			},
			clear() {
				this.$storage.remove('searchData')
				this.flightDetail = null
				this.flightNO = null
				this.searchFlightNo = ""
				this.flightDate = null
			},
			datatime() {
				setInterval(() => {
					this.newDataday = Format("yyyy/MM/dd", new Date());
					this.newData = Format("hh:mm", new Date());
				}, 1000);
			},
			clickOrder(data) {
				if (data == "extract") { //提取
					uni.navigateTo({
						url: "/pages/extract/index"
					})
				} else if (data == "abnormal") { //异常行李
					uni.navigateTo({
						url: "/pages/abnormal/index?airport=" + this.airportName
					})
				} else {
					uni.navigateTo({
						url: "/pages/sorting/index?item=" + data + "&flightNO=" + this.flightNO + "&date="+this.flightDate+ "&outAirport="+this.outAirport+ "&landAirport="+this.landAirport 
					})
				}

			}
		},
	}
</script>

<style lang="scss" scoped>
	.app-content {
		position: relative;

		>.tuku {
			position: absolute;
			z-index: -1;
			width: 100%;
			top: 0;
		}

		>.fight {
			padding: 0 1.75rem 0 1.75rem;
			// height: 3.75rem;
			display: flex;
			align-items: center;
			justify-content: space-around;
			margin-top: 1.375rem;

			.fight_center {
				width: 3rem;
				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content: center;
				color: rgb(255, 255, 255);
				font-family: Noto Sans SC;
				font-size: 16px;
				line-height: 24px;
				font-weight: 700;

				>.aircraft {
					width: 1.75rem;
					height: 1.75rem;
					background: url('../../static/hang.png') no-repeat;
					background-size: 100% 100%;
				}
			}

			>.fight_card {
				display: flex;
				flex-direction: column;
				align-items: start;
				justify-content: center;

				>p {
					color: rgb(255, 255, 255);
					font-family: Noto Sans SC;
					font-size: 16px;
					line-height: 24px;
					font-weight: 700;
				}

				>span {
					color: rgb(255, 255, 255);
					font-family: Noto Sans SC;
					font-size: 11px;
					font-weight: 500;
				}
			}
		}

		>.times {
			width: 100%;
			height: 2.6875rem;
			display: flex;
			align-items: center;
			justify-content: center;
			color: rgb(255, 255, 255);
			font-family: Noto Sans SC;
			font-size: 18px;
			font-weight: 700;
			margin-top: 10px;

			p {
				margin-right: .625rem;
			}
		}

		.content {
			padding: 0 1.5rem 0 1.5rem;
			display: flex;
			justify-content: space-around;
			flex-wrap: wrap;

			.card {
				width: 7.5rem;
				height: 5.5rem;
				/* 卡片渐变 */
				background: linear-gradient(188.06deg, rgba(65.49, 109.04, 128.64, 1.00) 3.551%, rgba(38, 68.32, 81.96, 1.00) 110.878%);
				box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
				border-radius: 4px;
				margin-bottom: 2rem;
				display: flex;
				flex-direction: column;
				justify-content: center;
				align-items: center;

				>p {
					color: rgb(255, 255, 255);
					font-family: Noto Sans SC;
					font-size: 18px;
					font-weight: 700;
					margin-bottom: .375rem;
					line-height: 1.6875rem;
				}

				>span {
					color: rgb(255, 255, 255);
					font-family: Noto Sans SC;
					font-size: 13px;
					font-weight: 500;
					line-height: 1.1875rem;
				}
			}

			.card_no {
				width: 7.5rem;
				height: 7.5rem;
			}
		}
	}
</style>