<template>
	<view class="wrap">
		<template v-if="itemList.length>0">
			<view class="checklist" v-for="(hazard,idx) in itemList" :key="idx">
				<view class="title">{{hazard.hazardTitle}}</view>
				<view class="item-cont" v-if="hazard.riskList&&hazard.riskList.length>0">
					<view class="checklistItem" v-for="(risk,itemIdx) in hazard.riskList" :key="itemIdx">
						<view class="itemTitle">{{risk.riskTitle}}</view>
						<view  class="point-cont" v-if="risk.recordList&&risk.recordList.length>0">
							<view class="point" v-for="(measure,measureIdx) in risk.recordList" :key="measureIdx" @click="check(measure)">
								<view class="pointContent">{{measure.measureContent}}</view>
								<view class="status" v-if="measure.checkResult===1">通过</view>
								<view class="status" v-if="measure.checkResult===-1">不通过</view>
							</view>
						</view>
					</view>				
				</view>
			</view>
			<view class="handle-container" v-if="handleVisiable">
				<view class="handle" @click="handleSubmit(3)">全部通过</view>
				<view class="handle" @click="handleSubmit(4)">全不通过</view>				
				<view class="handle" @click="handleSubmit(1)">提交</view>
				<view class="handle" @click="handleSubmit(2)">撤销</view>				
			</view>
		</template>
		<template v-else>没有可处理的清单^-_-^</template>
	</view>
</template>
<script>
	import {
		initChecklistHazardRecord,
		getChecklistHazardRecordViewById,
		completeChecklistDoing,
		cancelChecklistDoing,
		batchUpdateChecklistHazardRecordDoing,
	} from '@/api/aqpt/checklistHazardRecordApi.js'
	export default {
		data() {
			return {
				defaultProps: {
					id: 'itemId', 
					children: 'children',
					label: 'itemTitle'
				},
				divider: false,
				edit: true,
				itemList:[],
				recordId:undefined,
				checklistId:undefined,
				handleVisiable:false
			}
		},
		onLoad({id,recordId,type}) {
			this.checklistId=id	
			this.recordId=recordId	
			if(type==="app"){
			    this.initCheckList(id)	
				this.handleVisiable=true
			}else{
				this.getChecklistHazardRecordViewById(id,recordId)			
			}
		},
		methods: {
			async initCheckList(checklistId){
				let qrcode=uni.getStorageSync('qrcode')	
				let {data}=await initChecklistHazardRecord({
					ocId:qrcode.ocId,
					targetId:qrcode.targetId,
					targetType:qrcode.targetType,
					targetTitle:qrcode.targetTitle,
					targetGroupId:qrcode.groupId,
					targetGroupName:qrcode.groupName,
					checklistId
				})
				this.itemList=data.hazardList
				this.recordId=data.recordId
			},
			getChecklistHazardRecordViewById(checklistId,recordId){
				/* status 0-未初始化；1-初始化完成 2-完成 -1-巡检完成【异常】*/
				getChecklistHazardRecordViewById(recordId,checklistId).then((res)=>{
					this.itemList=res.data.hazardList
					 let wxId=uni.getStorageSync('wxId')
					this.handleVisiable=(res.data.status===0||res.data.status===1)&&(res.data.accountId===wxId)
				})
			},
			check(measure){
				if(!this.handleVisiable) return
				uni.setStorageSync('hazard',{
					...measure,
					checklistId:this.checklistId,
					recordId:this.recordId
				})
				uni.navigateTo({
					url:"/pages/app_views/hazard/form/form"
				})
			},
			handleSubmit(type){
				let recordId=this.recordId;
				let checklistId=this.checklistId;
				if(type===1){//完成
					completeChecklistDoing(recordId,checklistId).then(()=>{
						uni.$emit('type',4)						
						uni.switchTab({
							url:'/pages/history/history'
						})
					}).catch(()=>{
						uni.showToast({
							icon:"none",
							title:"操作失败"
						})
					})
				}
				if(type===2){//放弃
					cancelChecklistDoing(recordId).then(()=>{
						uni.switchTab({
							url:'/pages/history/history'
						})
					}).catch(()=>{
						uni.showToast({
							icon:"none",
							title:"操作失败"
						})
					})
				}
				if(type===3){
					batchUpdateChecklistHazardRecordDoing(recordId,1).then(()=>{
						this.getChecklistHazardRecordViewById(checklistId,recordId)
					})
				}
				if(type===4){
					batchUpdateChecklistHazardRecordDoing(recordId,-1).then(()=>{
						this.getChecklistHazardRecordViewById(checklistId,recordId)
					})
				}			
			}
		}
	}
</script>

<style lang="scss" scoped>
	.wrap{
		padding: 20rpx;
		margin-bottom: 100rpx;
		.checklist{
			.title{
				color: #333;
				font-size: 36rpx;
				height: 60rpx;
				line-height: 60rpx;
			}
			.item-cont{
				padding-left: 20rpx;
				.checklistItem{
					.itemTitle{
						color: #424242;
						font-size: 32rpx;	
						line-height: 1;	
						padding: 10rpx 0;
					}
				}
				.point-cont{
					padding-left: 30rpx;
					.point{
						display: flex;						
						color: #666;
						font-size: 28rpx;	
						line-height: 1;	
						padding: 10rpx 0;	
						.pointContent{
							flex: 1;
						}
					}
				}
			}
		}
		.handle-container{
			position: fixed;
			width: 100%;
			left: 0;
			bottom: 0;
			background-color: #fff;
			display: flex;
			justify-content: center;
			align-items: center;
			border-top: 1rpx solid #eaeaea;
			.handle{
				display: inline-block;
				background-color: #3384FF;
				color: #fff;
				padding: 15rpx 20rpx;
				width: 25%;
				box-sizing: border-box;
				border-right: 1rpx solid #eaeaea;
				font-size: 30rpx;
				text-align: center;				
				&:nth-child(4){
					border: 0;
				}
			}
		}
	}
</style>
