<template>
	<view class="" v-if="show">
		<view class="moveCar">
			<div class="move_car__content">
				<div class="menu__top" @click="goUrl({url: '/pagesB/pages/move-car/loveCar',})">
					<div>
						<image src="@/static/move-car/move-car1.png" />
					</div>
					<div>
						爱车管理
					</div>
				</div>

				<div class="menu__list">
					<div class="list__items" v-for="(vo,inx) in items" :key="inx" @click="goUrl(vo)">
						<div>
							<image :src="vo.icon" />
						</div>
						<div>
							{{vo.title}}
						</div>
					</div>
				</div>
			</div>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				show: false,
				items: [{
						icon: require("@/static/move-car/move-car6.png"),
						url: "/pagesB/pages/move-car/oneMoveCar",
						title: "扫一扫联系车主"
					},
					{
						icon: require("@/static/move-car/move-car3.png"),
						url: "/pagesB/pages/move-car/myCall",
						title: "我的呼叫记录"
					}, {
						icon: require("@/static/move-car/move-car2.png"),
						url: "/pagesB/pages/move-car/myMoveCar",
						title: "我的挪车牌"
					}, {
						icon: require("@/static/move-car/move-car4.png"),
						url: "/pagesB/pages/move-car/myRecord",
						title: "我的挪车记录"
					},
				],
				scanClick: true, //扫一扫节流
			}
		},
		methods: {
			goUrl(vo) {
				let token = uni.getStorageSync('userToken');
				uni.removeStorageSync('routerLogin')
				uni.setStorageSync('routerLogin',vo.url)
				if (!token) {
					// uni.navigateTo({
					//     url: '/pages/binding/index?url=/pages/main&index=1'
					// })
					uni.navigateTo({
						url: '/pages/login/index/index'
					})
					return;
				}
				const that = this
				if (vo.title != "扫一扫联系车主") {
					uni.navigateTo({
						url: vo.url
					})
				} else {
					//跳转绑定页面
					// uni.navigateTo({
					//     url: vo.url
					// })
					//扫码
					if (this.scanClick) {
						this.scanClick = false;
						setTimeout(() => {
							uni.scanCode({
						 	success: (res) => {
									this.scanClick = true

									let path = res.path
									if (path) {
										let paths = path.split('?')[1]
										let scene = paths.split("=")[1]
										let param = {
											code: scene
										}
										let opts = {
											url: '/app/user/c/m/c',
											method: 'post'
										}

										that.http.httpTokenRequest(opts, param).then(res => {
											// console.log(res, "扫码通知车主")
											if (res.data.code == 200) {
												if (res.data.data.bindFlag) {
													that.gotoMoveCar(scene)
												} else {
													that.gotoBindMoveCar(scene)
												}
											} else {
												uni.showToast({
													title: res.data.msg,
													icon: 'none',
												})
											}
										})
									} else {
										uni.showToast({
											title: "扫码失败!",
											icon: 'error',
										})
									}
								},
								fail: () => {
									this.scanClick = true
								}
							});
						}, 300)
					}
				}
			},
			//跳转到挪车页面
			gotoMoveCar(s) {
				let that = this;
				uni.navigateTo({
					url: '/pagesB/pages/move-car/oneMoveCar?scene=' + s
				});
			},
			//跳转到绑定页面
			gotoBindMoveCar(s) {
				let that = this;
				uni.navigateTo({
					url: '/pagesB/pages/move-car/scan?moveCode=' + s
				});
			},
		},
		onReady: function() {
			uni.setNavigationBarTitle({
				title: '我要挪车'
			});
		},
		mounted() {
			setTimeout(() => {
				this.show = true
			}, 100);
		},
	};
</script>

<style lang="scss">
	.moveCar {
		.move_car__content {
			padding: 40rpx;

			.menu__top {
				height: 220rpx;
				background: #FFFFFF;
				border: 1rpx solid #EFE7E7;
				box-shadow: 0rpx 0rpx 28rpx 1rpx rgba(232, 232, 232, 0.16);
				border-radius: 20rpx;
				margin-bottom: 30rpx;
				display: flex;
				flex-wrap: wrap;
				align-items: center;
				justify-content: center;
				box-sizing: border-box;
				padding: 45rpx 0;

				>div {
					width: 100%;
					text-align: center;
				}

				>div:nth-of-type(1) {
					image {
						width: 58rpx;
						height: 50rpx;
					}
				}

				>div:nth-of-type(2) {
					font-size: 40rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #333333;
					line-height: 42rpx;
				}
			}

			.menu__list {
				display: flex;
				justify-content: space-between;
				flex-wrap: wrap;

				.list__items {
					width: 325rpx;
					height: 220rpx;
					background: #FFFFFF;
					border: 1rpx solid #EFE7E7;
					box-shadow: 0rpx 0rpx 28rpx 1rpx rgba(232, 232, 232, 0.16);
					border-radius: 20rpx;
					display: flex;
					flex-wrap: wrap;
					align-items: center;
					justify-content: center;
					box-sizing: border-box;
					padding: 45rpx 0;
					margin-bottom: 30rpx;

					>div {
						width: 100%;
						text-align: center;
					}

					>div:nth-of-type(1) {
						image {
							width: 58rpx;
							height: 58rpx;
						}
					}

					>div:nth-of-type(2) {
						font-size: 40rpx;
						font-family: PingFang SC;
						font-weight: 500;
						color: #333333;
						line-height: 42rpx;
					}
				}

				.list__items:nth-of-type(2) {
					>div:nth-of-type(1) {
						image {
							width: 55rpx;
							height: 58rpx;
						}
					}
				}

				.list__items:nth-of-type(3) {
					>div:nth-of-type(1) {
						image {
							width: 58rpx;
							height: 58rpx;
						}
					}

				}

				.list__items:nth-of-type(4) {
					>div:nth-of-type(1) {
						image {
							width: 54rpx;
							height: 58rpx;
						}
					}

				}
			}
		}
	}
</style>
