<template>
	<view class="deliveryCard">
		<view class="shipment-header flex_sb">
			<view class="shipment_code flex_center">
				<text selectable> 交货单号：{{deliveryInfo["deliverySchedule.billNo"]}}</text>
			</view>
			<view
				:class="deliveryInfo['deliverySchedule.status'] !== 'Executing' ? 'shipment-state' : 'shipment-state shipmenting'">
				{{deliveryInfo['deliverySchedule.statusLabel']}}
			</view>
		</view>
		<u-line customStyle="position: absolute; left: 0" margin="22rpx 0"></u-line>
		<!-- 主要运单信息 -->
		<view style="padding-top: 18rpx; margin-bottom: 32rpx;">
			<bs-customCell label="交货地址" :value="deliveryInfo['deliverySchedule.address.name']" labelCol="3"
				wrapCol="9" />
			<bs-customCell label="交货日期" :value="commitTime" labelCol="3" wrapCol="9" />

			<bs-customCell label="业务类型" :value="deliveryInfo['deliverySchedule.billTypeLabel']" labelCol="3"
				wrapCol="9" />
			<bs-customCell label="车牌号" :value="deliveryInfo['truck.name']" labelCol="3" wrapCol="9" />
			</bs-customCell>

		</view>
		<view class="deliveryCardButton">
			<button @click="signIn">确认</button>
		</view>
		
		<view class="success_info" @click="isError=false">
			<u-popup v-model="isError" :show="isError" mode="center">
				<img src="../../static/img/icon/fail.png" />
				<view style="font-size: 36rpx; font-weight: bolder; margin-bottom: 24rpx;">确认失败</view>
				<view style="font-size: 28rpx;margin-bottom: 56rpx;">{{messageInfo}}</view>
		
			</u-popup>
		</view>

	</view>
</template>

<script>
	import {
		userMobileOperation,
		GetReserveExamResult,
		CreatSubscribeArrowDelivery
	} from '../../api/apiList.js'
	const getUserLocation = require('../../mixins/getUserLocation')
	
	export default {
		name: "deliveryCard",
		props: ['deliveryInfo'],
		mixins: [getUserLocation],
		options: {
		  // 组件可选值：isolated | apply-shared | shared
		  // 页面组件可选值：page-isolated | page-apply-shared | page-shared
		  styleIsolation: 'shared',
		},
		data() {
			return {
				userInfo: {},
				isError: false,
				messageInfo: '',
			};
		},
		mounted() {
			this.getUserInfo()
		},
		methods: {
			deliveryCardBg(path){
				// #ifdef MP
				let base64Png = uni.getFileSystemManager().readFileSync( path, 'base64');
				path = 'data:image/jpg;base64,' + base64Png
				// #endif

				return `url(${path})`
			},
			getUserInfo() {
				userMobileOperation('getUserInfo').then(res => {
					const data = res.data.data
					this.userInfo = {
						...data
					}
					// this.getReserveExamResult()
				})
			},
			getReserveExamResult() {
				GetReserveExamResult({
					"aux": {
						"accessId": this.deliveryInfo.id,
						// "driverTel": this.userInfo.userExt.mobile,
						// "driverName": this.userInfo.name,
						// "address": this.deliveryInfo['deliverySchedule.address.name']
					}
				}).then(res => console.log(res))
			},
			signIn() {
				this.getUserSetting()
				// const data = {
				// 	formNumber: this.deliveryInfo["deliverySchedule.billNo"],
				// 	deliveryId: this.deliveryInfo["id"],
				// 	type: "delivery"
				// }
				CreatSubscribeArrowDelivery({
					"args": {
						"selectedIds": [ this.deliveryInfo["id"]],
						"additionalIds": null
					}
				}).then(res => {
					if (res.data.messageType === "success") {
						const data = {
							subscribeInfo: res.data.data
						}
						uni.hideToast()
						// this.isSuccess = true
						uni.navigateTo({
							url: `/subpkg/orderTime/orderTime?data=${JSON.stringify(data)}`,
						})
				
					} else {
						uni.hideToast()
						this.isError = true
						this.messageInfo = res.data.message
						setTimeout(() => {
							this.isError = false
						}, 3000)
					}
				}).catch(err => {
					
					uni.hideToast()
					this.isError = true
					this.messageInfo = err.message
					
					setTimeout(() => {
						this.isError = false
					}, 3000)
				})
				// uni.navigateTo({
				// 	url: `/subpkg/signIn/signIn?data=${JSON.stringify(data)}`,
				// })
			}
		},
		computed: {
			commitTime() {
				return this.deliveryInfo['deliverySchedule.deliveryDate'].split('T').join(' ').split('Z').join('')
			}
		}
	}
</script>

<style lang="scss">
	.deliveryCard {
		position: relative;
		padding: 28rpx 24rpx 32rpx 24rpx;
		border-radius: 24rpx;
		margin-top: 24rpx;
		font-size: 28rpx;
		box-shadow: 1rpx 3rpx 12rpx rgba(0, 0, 0, 0.0400);
		background: rgba(46, 117, 230, 0.15);
		.bg{
			position:absolute;
			top:0;
			height:100%;
			width:100%
		}

		.shipment_code {
			color: #8C8C8C;
			line-height: 40rpx;
			text-shadow: 1rpx 3rpx 12rpx rgba(0, 0, 0, 0.04);
		}

		.shipment-state {
			font-size: 28rpx;
			color: #F7A64A;
			line-height: 33rpx;
			padding: 6rpx 24rpx;
			border-radius: 8rpx;
			background: rgba(247, 166, 74, .1);
			text-shadow: 1rpx 3rpx 12rpx rgba(0, 0, 0, 0.04);
		}

		.shipmenting {
			color: #66CCCC;
			background: rgba(61, 204, 185, .1);
		}

		.t-icon-location {
			width: 50rpx;
			height: 50rpx;
		}

		.deliveryCardButton {
			button {
				background-image: linear-gradient(90deg, #2E75E6, #5E58EE), linear-gradient(90deg, #2E75E6, #5E58EE);
				height: 88rpx;
				line-height: 88rpx;
				color: #FFFFFF;
				font-size: 32rpx;
				font-weight: bolder;
				border-radius: 44rpx;
			}
		}
		.success_info {
			opacity: 1;
		
			/deep/.u-popup__content {
		
				border-radius: 24rpx;
				display: flex;
				justify-content: center;
				align-items: center;
				width: 620rpx;
		
				img {
					height: 120rpx;
					width: 120rpx;
					margin-bottom: 34rpx;
					margin-top: 60rpx;
				}
			}
		}
	}
</style>
