<!--
 * @Author: euzhi
 * @Description: 呼叫记录详情
-->
<template>
	<view class="appCotent">
		<div class="callDetail">
			<div class="view__content">
				<div class="view__item" v-for="(vo,inx) in items" :key="inx">
					<div class="view__title">
						{{vo.title}}
					</div>
					<div class="view__value">
						{{vo.value}}
					</div>
				</div>
			</div>
			<div class="view__btn view__back" @click="goBack">
				返回
			</div>
		</div>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				items: [{
						title: "车主车牌号:",
						value: ""
					},
					{
						title: "品牌:",
						value: ""
					},
					{
						title: "车型:",
						value: ""
					},
					{
						title: "车主手机号:",
						value: ""
					}, {
						title: "时间:",
						value: ""
					},
					{
						title: "地点:",
						value: ""
					}, {
						title: "申请手机号:",
						value: ""
					},
					{
						title: "通知方式:",
						value: ""
					}, {
						title: "通知类型:",
						value: ""
					}
				],
				id: '',
				moveLog: '',
			};
		},
		methods: {
			goBack() {
				uni.navigateBack({
					delta: 1
				})
			},
			getApplyMoveLog() {
				let opts = {
					url: '/app/moveLog/apply/' + this.id,
					method: 'get'
				};
				let that = this
				this.http.httpTokenRequest(opts, {}).then(res => {
					if (res.data.code == 200) {
						this.moveLog = res.data.data
						let moveLogInfo = []
						moveLogInfo.push({
							title: "车主车牌号:",
							value: this.moveLog.carNo
						})
						moveLogInfo.push({
							title: "品牌:",
							value: this.moveLog.brand || ''
						})
						moveLogInfo.push({
							title: "车型:",
							value: this.moveLog.carModel || ''
						})
						if (this.moveLog.confirmType == '1') {
							moveLogInfo.push({
								title: "车主手机号:",
								value: this.moveLog.userMobile || ''
							})
						}
						moveLogInfo.push({
							title: "时间:",
							value: this.moveLog.applyDate
						})
						moveLogInfo.push({
							title: "地点:",
							value: this.moveLog.detailInfo
						})
						if (this.moveLog.confirmType == '1') {
							moveLogInfo.push({
								title: "申请手机号:",
								value: this.moveLog.applyUserMobile || ''
							})
							moveLogInfo.push({
								title: "通知方式:",
								value: "拨打电话"
							})
						} else {
							moveLogInfo.push({
								title: "通知方式:",
								value: "微信通知"
							})
						}
						moveLogInfo.push({
							title: "通知类型:",
							value: "请求他人挪车"
						})
						this.items = moveLogInfo
					}
				})
			},
		},
		onShow() {
			this.getApplyMoveLog()
		},
		onLoad(option) {
			this.id = option.id
		},
	}
</script>

<style lang="scss" scoped>
	.callDetail {
		padding: 40rpx 0rpx;

		.view__content {
			background: #FFFFFF;
			box-shadow: 0rpx 0rpx 28rpx 1rpx rgba(232, 232, 232, 0.2);
			border-radius: 20rpx;
			margin-bottom: 60rpx;

			.view__item {
				padding: 34rpx 0rpx;
				margin: 0 40rpx;
				display: flex;
				align-items: center;
				justify-content: space-between;
				border-bottom: 1rpx solid rgba(0, 0, 0, .1);

				.view__title {

					font-size: 32rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #333333;
				}

				.view__value {
					width:480rpx;
					text-align: right;
					font-size: 28rpx;
					font-family: DIN;
					font-weight: 500;
					color: #666666;
				}
			}

			.view__item:nth-last-child(1) {
				border-bottom: none;
			}
		}

		.view__btn {
			width: 670rpx;
			height: 76rpx;
			text-align: center;
			line-height: 76rpx;
			margin: 0 auto;
			font-size: 32rpx;
		}

		.view__no__bind {
			background: url('@/static/move-car/move-car-view2.png') no-repeat;
			margin-bottom: 30rpx;
			background-size: contain;
			color: rgba(255, 255, 255, 1);
		}

		.view__back {
			background: url('@/static/move-car/move-car-view1.png') no-repeat;
			background-size: contain;
			color: rgba(153, 153, 153, 1);
		}
	}
</style>
