<template>
	<view>
		<headers class="fixedheader" :showBack="true">
			<view class="headerName">
				{{info.itemName}}
			</view>
			<view class="right" @click="getScanCode()">
				<image class="scancode" src="@/static/scancode.png" mode=""></image>
			</view>
		</headers>
		<view class="content">
			<view class="coordinate">
				<view class="coordinate-header">
					<view>
						<image src="@/static/inspecteIcon-normal.png" mode=""></image>
						已巡检-正常
					</view>
					<view class="abnormal">
						<image src="@/static/inspectelcon-abnormal.png" mode=""></image>
						已巡检-异常
					</view>
					<view>
						<image src="@/static/inspectelcon-not.png" mode=""></image>
						未巡检
					</view>
				</view>
				<view class="coordinate-item">
					<view>
						<image src="@/static/ppt.png" mode=""></image>
						<text>1号巡检点</text>
					</view>
					<view>
						<image src="@/static/ppt.png" mode=""></image>
						<text>1号巡检点</text>
					</view>
					<view>
						<image src="@/static/ppt.png" mode=""></image>
						<text>1号巡检点</text>
					</view>
					<view>
						<image src="@/static/ppt.png" mode=""></image>
						<text>1号巡检点</text>
					</view>
					<view>
						<image src="@/static/ppt.png" mode=""></image>
						<text>1号巡检点</text>
					</view>
					<view>
						<image src="@/static/ppt.png" mode=""></image>
						<text>1号巡检点</text>
					</view>
				</view>
			</view>

			<view class="detail-main">
				<view class="title">
					1号巡检点
				</view>
				<view class="detail-content">
					<view>巡检点名称:1号巡检点</view>
					<view>巡检点位置:东北角大院</view>
					<view>巡检人员:张三</view>
					<view>巡检通知人员:李四</view>
					<view>状态:正常</view>
					<view>巡检时间:2024-09-01 12:09:09</view>
					<view>异常详情:xx发现一个明风险,需要尽快处理</view>
					<view>异常图片:</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				info:{},
			}
		},
		onLoad(options) {
			this.info = JSON.parse(options.info);
			this.statusBarHeight = uni.getStorageSync('systemInfo').statusBarHeight
			this.projectSn = JSON.parse(uni.getStorageSync('projectDetail')).projectSn;
			console.log(options);
			this.getcheckingList();
			this.getcheckingInfo();
		},
		methods: {
			getcheckingList() {
				let that = this;
				//获取我整改的巡查记录数量
				this.sendRequest({
					url: 'xmgl/checkingPoint/selectPage',
					method: 'post',
					data: {
						projectSn: this.projectSn,
						xzCheckingRouteTaskId: this.info.xzCheckingRoute.id,
						checkingPointUserId:this.info.xzCheckingRoute.inspectUserIds,
					},
					success: res => {
						console.log(res);
						// that.emergencyTypeList = res.result;
					}
				})
			},
			getcheckingInfo() {
				let that = this;
				//获取我整改的巡查记录详情
				this.sendRequest({
					url: 'xmgl/checkingPointInfo/selectPage',
					method: 'post',
					data: {
						projectSn: this.projectSn,
						xzCheckingRouteTaskId: this.info.xzCheckingRoute.id,
						checkingPointUserId:this.info.xzCheckingRoute.inspectUserIds,
					},
					success: res => {
						console.log(res);
						// that.emergencyTypeList = res.result;
					}
				})
			},
			
			getScanCode(){
				uni.scanCode({
					scanType: ['qrCode'],
					success: function(res) {
						console.log('扫一扫得到的数据：' + res.result)
						uni.navigateTo({
							url: '../scan/saoSao?data=' + res.result
						})
				
						// let qrcodeVal=JSON.parse(res.result)
						// let param={
						// 	checkingPointId:qrcodeVal.checkingPointId,
						// 	checkingPointName:qrcodeVal.checkingPointName,
						// 	checkingPointUserId:that.userInfo.userId,
						// 	checkingPointUserName:that.userInfo.realName||that.userInfo.account,
						// 	position:qrcodeVal.position
						// }
				
						// that.sendRequest({
						// 	url: "xmgl/checkingPointInfo/add",
						// 	data:param,
						// 	method: "POST",
						// 	success(res) {
						// 		console.log(res,'res');
						// 		console.log(param,'===')
						// 		that.qrCode=param;
						// 		that.$refs.popupqrcode.open();
						// 		setTimeout(item=>{
						// 			that.$refs.popupqrcode.close();
						// 		},5000)
						// 	}
						// })
					}
				})
			}
		}
	}
</script>

<style lang="less" scoped>
	.fixedheader {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		z-index: 2;
		
		/deep/ .backImg  {
			color: #fff !important;
		}

		/deep/.headerBox {
			background: #2b8df3;
			color: #fff;
		}

		/deep/ .right {
			font-size: 24rpx;
			position: absolute;
			right: 20rpx;
			top: 50%;
			z-index: 4;
			transform: translateY(-50%);
			.scancode {
				width: 56rpx;
				height: 56rpx;
			}
		}
	}

	.content {
		padding: 88rpx 26rpx 15%;
		box-sizing: border-box;
		width: 100%;

		.coordinate {
			padding: 22rpx 28rpx 54rpx 12rpx;
			background: linear-gradient(180deg, rgba(255, 255, 255, 0.1) 0%, rgba(198, 220, 255, 0.2) 100%);
			box-shadow: 0 8rpx 32rpx -8rpx rgba(42, 60, 106, 0.24);
			border-radius: 34rpx;
			position: relative;
			margin-top: 22rpx;
			font-size: 24rpx;
			color: #000;

			.coordinate-header {
				display: flex;
				justify-content: center;

				>view:not(:last-child) {
					margin-right: 14rpx;
				}

				>view {
					display: flex;
					align-items: center;
					>image {
						width: 50rpx;
						height: 60rpx;
						margin-right: 8rpx;
					}
				}
				.abnormal{
					>image {
						width: 60rpx !important;
						height: 60rpx;
					}
				}
			}

			.coordinate-item {
				display: flex;
				flex-wrap: wrap;
				margin-top: 18rpx;

				>view {
					display: flex;
					flex-direction: column;
					align-items: center;
					margin-left: 28rpx;
					margin-top: 18rpx;

					>image {
						width: 50rpx;
						height: 60rpx;
						margin-right: 8rpx;
					}
				}
			}
		}

		.detail-main {
			padding: 22rpx 48rpx 0;
			color: #000000;

			.title {
				font-weight: bold;
				font-size: 36rpx;
				display: flex;
				justify-content: center;
				position: relative;
			}

			.title::before {
				content: "";
				border-bottom: 6rpx solid #3A7BFF;
				position: absolute;
				bottom: 0;
				bottom: -12rpx;
				width: 190rpx;
			}

			.detail-content {
				margin-top: 60rpx;

				>view:not(:first-child) {
					margin-top: 32rpx;
				}

				>view {
					font-size: 28rpx;
				}
			}
		}
	}
</style>