<template>
	<view class="app-content">
		<Navs :navname.sync="navname" @fall="fall"></Navs>
		<img :src="icon" alt="" class="tuku">
		<view class="content">
			<view class="content_bootom" style="top:0">
				<scroll-view scroll-y="true" class="scroll-Y">
					<view class="up" v-for="(item, index) in listdata" :key="index" @tap="toDetail(item.ID)">
						<view class="list">
							<p>{{ item.location_descride }}</p>
						</view>
						<view class="list">
							{{item.processing_time}}
						</view>
					</view>
				</scroll-view>
			</view>
		</view>
		<view class="up" @tap="toPage">录入</view>
	</view>
</template>

<script>
	import Navs from '../../components/header/navs.vue'
	export default {
		data() {
			return {
				current:0,
				isShow: true,
				navname: '脱牌行李',
				icon: 'static/beijing.png',
				action: true,
				listdata: [],
				airport: null,
				currentLuggageNum: null,
			}
		},
		created(option) {},
		onLoad(option) {
			this.airport = this.$storage.get("airportName")
		},
		onUnload() {
			uni.$off("scancodemsg");
		},
		onShow() {
			if (this.airport) {
				this.getluggageList(this.airport)
			}
		},
		onHide() {
		},
		mounted() {},
		computed: {},
		components: {
			Navs,
		},
		methods: {

			async getluggageList(airport) {
				console.log(this.$storage.getJson("users"))
				let data = {
					"serviceId": 3013,
					"dataContent": [{
						"agentNumber": this.$storage.getJson("users").user_name
					}],
					"event": "0"
				}
				await this.$http.httpPost('/openApi/query', data).then(res => {
					if (res.code == "0") {
						this.listdata = res.returnData;
					}
				})
			},
			toDetail(luggageNum){
				uni.navigateTo({
					url: "/pages/delisting/info?id="+luggageNum
				})
			},
			toPage() {
				uni.navigateTo({
					url: "/pages/delisting/info"
				})
			},
			fall() {
				uni.navigateBack({
					delta: 1
				})
			},
			clear() {
				this.currentLuggageNum = null
			}
		},
	}
</script>

<style lang="scss" scoped>
	.app-content {
		position: relative;
		background: rgb(49, 85, 99);
		width: 100vw;
		height: 100vh;
		overflow: hidden;
		>.up {
			position: fixed;
			bottom: 10px;
			left: calc((100% - 20.5625rem) / 2);
			width: 20.5625rem;
			height: 3rem;
			background: linear-gradient(179.10deg, rgba(51, 161, 165, 1.00) 11.326%, rgba(59, 111, 142, 1.00) 119.032%, rgba(59, 111, 142, 1.00) 119.032%, rgba(59, 111, 142, 1.00) 119.032%);
			border-radius: .25rem;
			color: rgb(255, 255, 255);
			font-family: Noto Sans SC;
			font-size: 1rem;
			margin: 0 auto;
			display: flex;
			align-items: center;
			justify-content: center;
		}
		>.tuku {
			position: absolute;
			z-index: -1;
			width: 100%;
			top: -250px;
			let: 20px;
		}

		>.scanning {
			// height: 12rem;
			padding: 0 1.5rem 0 1.5rem;
			opacity: 1;
			transition: all 3s;

			.scanning_cds {
				width: 100%;
				height: 3rem;
				opacity: 1;
				transition: all 3s;
				background: rgb(51, 161, 165);
				margin-top: 1rem;
				margin-bottom: .5rem;
				border-radius: 4px;
				display: flex;
				justify-content: center;
				align-items: center;
				color: rgb(255, 255, 255);
				font-family: Noto Sans SC;
				font-size: 16px;

				>.log {
					width: .875rem;
					height: .875rem;
					background: url('../../static/saoma.png') no-repeat;
					background-size: 100% 100%;
					margin-left: 1rem;
				}

				>.log_l {
					width: .125rem;
					height: 1.3125rem;
					margin-left: 4rem;
					margin-right: .7rem;
					background: rgb(255, 255, 255);
				}
			}
		}

		>.content {
			width: 100%;
			height: calc(100vh - 8rem);
			position: relative;
			margin-top: .5rem;

			// overflow: hidden;
			// background: rgb(49, 85, 99);
			>.content_top {
				width: 100%;
				// background: rgb(49, 85, 99);
				padding-bottom: 1.3125rem;

				>.craid {
					// width: 100%;
					height: 5.625rem;
					padding: 0 2.5625rem 0 2.5625rem;
					display: flex;
					justify-content: space-between;
					flex-wrap: wrap;
					align-items: center;

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

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

						>span {
							color: rgb(255, 255, 255);
							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%;
					}
				}
			}

			>.content_bootom {
				width: 100%;
				// height: calc(100vh - 20.9375rem - 4.375rem);
				padding-bottom: 0;
				position: absolute;
				bottom: 0;
				top: 10.75rem;
				// border-radius: 6px 6px 0px 0px;
				overflow: hidden;
				background: rgb(255, 255, 255);
				padding: 0 10px;
				box-sizing: border-box;
				
				.up {
					width: 100%;
					display: flex;
					align-items: center;
					justify-content: space-between;
					padding: 0 5px;
					border-bottom: 1px solid rgb(238, 238, 238);
					box-sizing: border-box;
					// transform: all 3s;
					>.down_up {
						width: .875rem;
						height: .875rem;
						background: url('../../static/xia.png') no-repeat;
						background-size: 100% 100%;
					}

					>.error {
						width: 60px;
						color: red
					}

					>.normal {
						width: 160px;
						color: #4682b4
					}

					>.list {
						position: relative;
						height: 3rem;
						display: flex;
						align-items: center;
						transform: all 3s;
						right: 0;
						color: rgb(0, 0, 0);
						font-family: Noto Sans SC;
						font-size: 16px;
						font-weight: 500;
					}

					>.delete {
						width: 3.75rem;
						height: 3.75rem;
						background: rgb(237, 101, 101);
						display: flex;
						align-items: center;
						justify-content: center;
						position: relative;
						right: -3.75rem;
						transform: all 3s;

						>.log {
							width: .875rem;
							height: .875rem;
							background: url('../../static/vector@1x.png') no-repeat;
							background-size: 100% 100%;
						}
					}
				}

				.scroll-Y {
					// height: calc(100% - 2.5rem - 2.75rem - 2.25rem - 2.25rem);
					height: calc(100% - 2rem);
					margin-top: 10px;
				}

				.but {
					width: 20.5625rem;
					height: 2.5rem;
					background: linear-gradient(179.10deg, rgba(51, 161, 165, 1.00) 11.326%, rgba(59, 111, 142, 1.00) 119.032%, rgba(59, 111, 142, 1.00) 119.032%, rgba(59, 111, 142, 1.00) 119.032%);
					border-radius: .25rem;
					color: rgb(255, 255, 255);
					font-family: Noto Sans SC;
					font-size: 1rem;
					margin: 0 auto;
					display: flex;
					align-items: center;
					justify-content: center;
					margin-top: 0.25rem;
					margin-bottom: 2.25rem;
				}
			}
		}
	}
</style>