FE-V2-XCX/pages/pages_safetyExamine/examineManage/examineDetail.vue

<!-- 安全检查-检查详情 -->
<template>
  <view class="examine">
	<scroll-view scroll-y @scrolltolower="scrollGet" class="info-max-box">
		<view class="basics">
			<view class="basics_li">
				<text>学院：</text>
				<text>{{infoData.collegeName}}</text>
			</view>
			<view class="basics_li">
				<text>实验室：</text>
				<text>{{infoData.subjectName}}-{{infoData.roomNumber}}</text>	
			</view>
			<view class="basics_li">
				<text>楼栋：</text>
				<text>{{infoData.buildName}}</text>
			</view>
			<view class="basics_li">
				<text>检查类型：</text>
				<text>{{infoData.checkType==1?'校园巡查':(infoData.checkType==2?'实验室自查':'')}}</text>
			</view>
			<view class="basics_li">
				<text>检查范围：</text>
				<text>{{infoData.checkRange==1?'全校':(infoData.checkRange==2?'学院':'实验室')}}</text>
			</view>
			<view class="basics_li" style="border:none;">
				<text>检查计划：</text>
				<text>{{infoData.title}}</text>
			</view>
		</view>
		<!-- <view class="attachment">
			<view class="attachment_t">
				<text>材料附件</text>
				<text>点击文件标题查看</text>
			</view>
			<view class="attachment_li">
				<img src="@/images/Version3.3.3/icon_djc_wj.png"/>
				<text>文件标题文件标题</text>
				<img class="attachment_li_del" src="@/images/Version3.3.3/icon_fjgk_sc.png"/>
			</view>
		</view> -->
		<view class="basics" v-if="manageStatus==2">
			<view class="basics_li">
				<text>检查结果：</text>
				<text>{{infoData.checkResult==0?'不符合':(infoData.checkResult==1?'符合':'')}}</text>
			</view>
			<view class="basics_li">
				<text>整改期限：</text>
				<text>{{infoData.rectifyDeadline}}</text>	
			</view>	
			<view class="basics_li">
				<text>整改通知：</text>
				<text style="color: #0183FA;">{{infoData.rectifyNotice == 1?'整改告知书':(infoData.rectifyNotice == 2?'整改通知书':'')}}</text>
			</view>
			<view class="basics_li">
				<text>检查者：</text>
				<text>{{infoData.checkUser}}</text>
			</view>
			<view class="basics_li" style="border:none;">
				<text>检查时间：</text>
				<text>{{infoData.checkTime}}</text>
			</view>
		</view>
		<view class="inconformity" @click="inconformityFun()" v-if="manageStatus==2">不符合项<img v-if="inconformityStatus" src="@/images/Version3.3.3/icon_bfhx_xq.png"/><img v-if="!inconformityStatus" src="@/images/Version3.3.3/icon_bfhx_sq.png"/></view>
		<view v-for="(item,index) in infoData.checkHazardDtoList" v-if="manageStatus==2">
			<view class="danger">
				<view class="sort">{{item.sort}}</view>
				<view class="grade" :style="item.switch?'border-bottom: 1rpx solid #D8D8D8;':'border:none;'">
					<text>第{{index+1}}项隐患</text>
					<text style="color: #0183FA;" @click="dangerItem(item)">{{item.rectifyStatus==1?'已完成':(item.rectifyStatus==2?'待整改':(item.rectifyStatus==3?'待复核':(item.rectifyStatus==4?'暂无法整改':'')))}} >></text>
				</view>
				<view v-if="item.switch">
					<view class="grade">
						<text>隐患等级：</text>
						<text>{{item.hazardLevel==2?'一般隐患':(item.hazardLevel==1?'重大隐患':(item.hazardLevel==3?'管理问题':''))}}</text>
					</view>
					<view class="project">
						<view class="project_t">检查项目：</view>
						<view class="project_b">{{item.hazardCheckProStr}}</view>
						<view class="project_b2" v-if="item.hazardCheckCount>0">此检查项在当前实验室累计出现{{item.hazardCheckCount}}次隐患</view>
					</view>
					<view class="project">
						<view class="project_t">检查要点：</view>
						<view class="project_b">{{item.hazardCheckPoint}}</view>
					</view>
					<view class="project">
						<view class="project_t">隐患描述：</view>
						<view class="project_b">{{item.hazardDescribe}}</view>
					</view>
					<view class="picture">
						<view class="picture_t">隐患照片</view>
						<view class="picture_b" @click="lockImg(item.uploadDtoList)">
							<img  :src="baseUrl+imgItem.fileUrl"   v-for="(imgItem,imgIndex) in item.uploadDtoList"/>
						</view>
					</view>
				</view>
			</view>
			<view class="pack_up" @click="switchFun(item)">{{item.switch?'收起':'展开'}}<img v-if="item.switch" src="@/images/Version3.3.3/icon_06_1.png"/><img v-if="!item.switch" src="@/images/Version3.3.3/icon_06.png"/></view>
		</view>
	</scroll-view>
	<view class="report" @change="buttonChange" v-if="manageStatus==2">整改报告</view>	
	<view class="bottom_btn" v-if="manageStatus==0" @click="handleClick('','startInspect')">开始检查</view>
  </view>

</template>

<script>
import { config } from '@/api/request/config.js'
import {checkSign,queryDeptSignByUserId,findCheckManage} from '@/api/index.js'
export default {
  name: "rectifyList",
  components: {
   
  },
  data() {
    return {
		baseUrl:config.base_url,
		manageStatus:0,//0 待检查 1 检查中 2已检查
		pageType:0,
		inconformityStatus:false,
		infoData:{},
	}
  },
  onLoad(option) {
	 if(option.id){
	 	this.id=option.id
	 	this.findCheckManage()
	 }
	 if(option.manageStatus){//检查状态
		 this.manageStatus=option.manageStatus;
	 }
	 if(option.manageStatus==0 || option.manageStatus==1){
		uni.setNavigationBarTitle({
			title:'待检查'
		})
	 }else if(option.manageStatus==2){
	 	uni.setNavigationBarTitle({
	 		title:'已检查'
	 	})
	 }
  },
  onShow() {
	  
  },
  mounted(){
	  
  },
  methods: {
		
		//滚动事件
		scrollGet(){
			
		},
		//开展检查
		handleClick(row,doType){
			if(doType=='startInspect'){
				uni.navigateTo({
				    url: '/pages/pages_safetyExamine/examineManage/examineAdd?id='+this.id
				});
			}
		},
		//详情
		async findCheckManage(){
			let _this = this;
			const {data} = await findCheckManage({id:this.id});
			if(data.code == 200){
				
				data.data.checkHazardDtoList.forEach(function(item){
					item.switch=false;
				})
				this.infoData=data.data;
			}
		},
		//查看图片
		lockImg(list){
			console.log(list)
			if(!list[0]){
				return
			}
			let urlList=[];
			for(let i=0;i<list.length;i++){
				urlList.push(this.baseUrl+list[i].fileUrl)
			}
			wx.previewImage({
				urls: urlList, //需要预览的图片http链接列表，多张的时候，url直接写在后面就行了
				current: '', // 当前显示图片的http链接，默认是第一个
				success: function(res) {},
				fail: function(res) {},
				complete: function(res) {},
			})
		},
		//隐患项跳转详情
		dangerItem(row){
			uni.navigateTo({
				 url: '/pages/pages_safetyExamine/dangerManage/dangerDetail?item='+encodeURIComponent(JSON.stringify(row))
			})
		},
		//隐患项收起展开
	    inconformityFun(){
			this.inconformityStatus=!this.inconformityStatus;
			if(this.inconformityStatus){
				this.infoData.checkHazardDtoList.forEach(function(item){
					item.switch=true;
				})
			}else{
				this.infoData.checkHazardDtoList.forEach(function(item){
					item.switch=false;
				})
			}
		},
		//隐患小项收起展开
		switchFun(item){
			item.switch=!item.switch
		},
		//查看报告按钮
		async buttonChange(e){
			let namestatus;
			let sealstatus;
			//判断有没有电子签名
			const {data} = await checkSign();
			if(data.code==200){
				namestatus=data.data
				if(data.data==false){//true有电子签名false没有电子签名
		
					uni.showModal({
					  title: '',
					  cancelColor:'#999999',
					  confirmColor:'#FF6E6E',
					  cancelText: "取消", // 取消按钮的文字
					  confirmText: "去上传", // 确认按钮文字
					  content: '您未上传电子签名，无法生成整改通知书/整改报告!',
					  success (res) {
						if (res.confirm) {
						  console.log('用户点击确定')
						  uni.navigateTo({
							  url: '/pages_manage/workbench/signature/signature'
						  });
		
						} else if (res.cancel) {
						  console.log('用户点击取消')
		
						}
					  }
					})
				}else{
		
				}
			}
			//如果有电子签名判断有没有电子签章
			if(namestatus){
				const {data} = await queryDeptSignByUserId();
				if(data.code==200){
					console.log(data.data.data.isUpload)
					sealstatus=data.data.data.isUpload
					if(data.data.data.isUpload==false){
						uni.showToast({
							title: '学院未上传电子签章，无法生成整改通知书/整改报告',
							icon:"none",
							mask:true,
							duration: 2000
						});
					}
				};
			}
			//如果有电子签名和电气签章开始下载
			if(namestatus==true && sealstatus==true){
				if(this.buttonArrayType == 1){
					if(e.target.value == 0){
						this.genNotice();
					}else if(e.target.value == 1){
						this.genReport();
					}
				}else if(this.buttonArrayType == 2){
					this.genNotice();
				}
			}
		
		},
		genNotice(){
			uni.showLoading({
				title: '下载中'
			});
			wx.downloadFile({
				url: config.base_url+'/laboratory/checkOption/genNotice/' + this.newData.id,
				header: {
					Authorization: uni.getStorageSync('token')
				},
				success: function (res) {
					const fileManager = wx.getFileSystemManager()
					const filePath = wx.env.USER_DATA_PATH + '/整改通知书.docx'
					fileManager.saveFile({
						tempFilePath: res.tempFilePath,
						filePath,
						success: () => {
							uni.hideLoading();
							wx.openDocument({
							filePath: filePath,
							showMenu: true,
							fileType: 'docx'
							})
						},
						fail: function (res){
							uni.hideLoading();
							uni.showToast({
								title: '下载失败',
								icon:"none",
								mask:true,
								duration: 2000
							});
						}
					})
				},
				fail: function (res){
					uni.hideLoading();
					uni.showToast({
						title: '下载失败',
						icon:"none",
						mask:true,
						duration: 2000
					});
				}
			})
		},
		genReport(){
			uni.showLoading({
				title: '下载中'
			});
			wx.downloadFile({
				url: config.base_url+'/laboratory/checkOption/genReport/' + this.newData.id,
				header: {
					Authorization: uni.getStorageSync('token')
				},
				success: function (res) {
					const fileManager = wx.getFileSystemManager()
					const filePath = wx.env.USER_DATA_PATH + '/整改报告.docx'
					fileManager.saveFile({
						tempFilePath: res.tempFilePath,
						filePath,
						success: () => {
							uni.hideLoading();
							wx.openDocument({
								filePath: filePath,
								showMenu: true,
								fileType: 'docx'
							})
						},
						fail: function (res){
							uni.hideLoading();
							uni.showToast({
								title: '下载失败',
								icon:"none",
								mask:true,
								duration: 2000
							});
						}
					})
				},
				fail: function (res){
					uni.hideLoading();
					uni.showToast({
						title: '下载失败',
						icon:"none",
						mask:true,
						duration: 2000
					});
				}
			})
		},
	  
  }
}
</script>

<style lang="stylus" scoped>
.examine{
	height:100%;
	display flex;
	.info-max-box{
		flex: 1;
		overflow: scroll;
	}
	.basics{
		width: 690rpx;
		background: #FFFFFF;
		border-radius: 20rpx;
		padding: 30rpx 30rpx 32rpx;
		box-sizing: border-box;
		margin: 20rpx 30rpx ;
		.basics_li{
			height: 80rpx;
			display: flex;
			justify-content: space-between;
			border-bottom: 1rpx solid #D8D8D8;
			>text:nth-of-type(1){
				font-size: 28rpx;
				font-family: PingFang SC-Medium, PingFang SC;
				font-weight: 400;
				color: #666666;
				line-height: 80rpx;
				width: 140rpx;
			}
			>text:nth-of-type(2){
				flex: 1;
				font-size: 28rpx;
				font-family: PingFang SC-Medium, PingFang SC;
				font-weight: 400;
				color: #333333;
				line-height: 80rpx;
				text-align: right;
				white-space: nowrap;
			    overflow: hidden;
			    text-overflow: ellipsis;
			}
		}
	}
	.attachment{
		width: 690rpx;
		background: #FFFFFF;
		border-radius: 20rpx;
		margin: 20rpx 30rpx 0;
		padding-bottom: 32rpx;
		box-sizing: border-box;
		.attachment_t{
			border-bottom: 1rpx solid #D8D8D8;
			>text:nth-of-type(1){
				font-size: 30rpx;
				font-family: PingFang SC-Medium, PingFang SC;
				font-weight: 400;
				color: #333333;
				line-height: 110rpx;
				margin-left: 28rpx;
			}
			>text:nth-of-type(2){
				font-size: 30rpx;
				font-family: PingFang SC-Medium, PingFang SC;
				font-weight: 400;
				color: #999999;
				line-height: 110rpx;
				margin-left: 24rpx;
			}
		}
		.attachment_li{
			height: 40rpx;
			display: flex;
			justify-content: flex-start;
			align-items: center;
			margin-top: 32rpx;
			>img{
				width: 30rpx;
				height: 26rpx;
				margin-right: 20rpx;
				margin-left: 50rpx;
			}
			>text{
				flex: 1;
				font-size: 28rpx;
				font-family: PingFang SC-Medium, PingFang SC;
				font-weight: 400;
				color: #0183FA;
				line-height: 40rpx;
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
			}
			.attachment_li_del{
				width: 30rpx;
				height: 30rpx;
			}
		}
	}
	.inconformity{
		width: 690rpx;
		height: 100rpx;
		background: #FFFFFF;
		border-radius: 20rpx 20rpx 20rpx 20rpx;
		margin: 20rpx 30rpx;
		font-size: 30rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 400;
		color: #333333;
		line-height: 100rpx;
		text-align: center;
		display: flex;
		justify-content: center;
		align-items: center;
		>img{
			width: 30rpx;
			height: 26rpx;
			margin-left: 20rpx;
		}
	}
	.danger{
		width: 690rpx;
		background: #FFFFFF;
		border-radius: 20rpx;
		padding: 15rpx 30rpx 15rpx;
		box-sizing: border-box;
		margin: 20rpx 30rpx ;
		position: relative;
		.sort{
			width: 40rpx;
			height: 40rpx;
			background: #0183FA;
			border-radius: 20rpx 0rpx 10rpx 0rpx;
			font-size: 30rpx;
			font-family: PingFang SC-Medium, PingFang SC;
			font-weight: 400;
			color: #FFFFFF;
			line-height: 40rpx;
			text-align: center;
			position: absolute;
			left: 0;
			top: 0;
		}
		.danger_title{
			font-size: 30rpx;
			font-family: PingFang SC-Medium, PingFang SC;
			font-weight: 400;
			color: #333333;
			line-height:80rpx;
			border-bottom: 1rpx solid #D8D8D8;
		}
		.grade{
			height: 80rpx;
			display: flex;
			justify-content: space-between;
			border-bottom: 1rpx solid #D8D8D8;
			>text:nth-of-type(1){
				font-size: 28rpx;
				font-family: PingFang SC-Medium, PingFang SC;
				font-weight: 400;
				color: #666666;
				line-height: 80rpx;
				width: 140rpx;
			}
			>text:nth-of-type(2){
				flex: 1;
				font-size: 28rpx;
				font-family: PingFang SC-Medium, PingFang SC;
				font-weight: 400;
				color: #333333;
				line-height: 80rpx;
				text-align: right;
			}
		}
		.project{
			.project_t{
				font-size: 30rpx;
				font-family: PingFang SC-Medium, PingFang SC;
				font-weight: 400;
				color: #333333;
				line-height: 80rpx;
			}
			.project_b{
				min-height: 158rpx;
				font-size: 28rpx;
				font-family: PingFang SC-Medium, PingFang SC;
				font-weight: 400;
				color: #333333;
				line-height: 40rpx;
				padding: 20rpx 14rpx;
				box-sizing: border-box;
				background: #F5F5F5;
				border-radius: 20rpx 20rpx 20rpx 20rpx;
			}
			.project_b2{
				font-size: 26rpx;
				font-family: PingFang SC-Medium, PingFang SC;
				font-weight: 400;
				color: #666666;
				line-height: 26rpx;
				margin-top: 14rpx;
				text-align: right;
			}
		}
		.picture{
			.picture_t{
				font-size: 30rpx;
				font-family: PingFang SC-Medium, PingFang SC;
				font-weight: 400;
				color: #333333;
				line-height: 80rpx;
			}
			.picture_b{
				display: flex;
				justify-content: flex-start;
				flex-wrap: wrap;
				>img{
					width: 200rpx;
					height: 200rpx;
					border-radius: 10rpx 10rpx 10rpx 10rpx;
					margin-right: 14rpx;
					margin-bottom: 10rpx;
				}
				>img:nth-of-type(3n+3){
					margin-right: 0rpx;
				}
			}
		}
	}
	.pack_up{
		font-size: 30rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 400;
		color: #666666;
		line-height: 140rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		>img{
			width: 14rpx;
			height: 8rpx;
			margin-left: 22rpx;
		}
	}
	.report{
		width: 153rpx;
		height: 50rpx;
		background: #0183FA;
		border-radius: 25rpx 0rpx 0rpx 25rpx;
		font-size: 26rpx;
		font-family: Source Han Sans CN-Regular, Source Han Sans CN;
		font-weight: 400;
		color: #FFFFFF;
		line-height: 50rpx;
		position: fixed;
		top: 180rpx;
		right: 0;
		text-align: center;
	}
	.bottom_btn{
		position: fixed;
		bottom: 26rpx;
		left: 30rpx;
		font-size: 30rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 400;
		color: #FFFFFF;
		line-height: 90rpx;
		width: 690rpx;
		height: 90rpx;
		background: #0183FA;
		border-radius: 20rpx;
		text-align: center;
		
	}
}
</style>