<!--开始检查/编辑检查/检查详情/整改/复核-->
<template>
  <div class="page-container initiateInspect" v-show="loadType">
    <div class="page-top-title-box">
      <!--开始检查/检查详情/隐患整改/整改详情/复查验证/复查详情-->
      <p class="page-top-title-name-p">{{initiateData.orderTitle}}</p>
      <p class="page-top-title-edit-p" @click="submitForm(1)" v-if="!lookInfoType&&projectData.checkStatus != 1">保存草稿</p>
      <p class="page-top-title-edit-p" @click="submitForm(2)" v-if="!lookInfoType&&projectData.checkStatus != 1">继续检查</p>
      <p class="page-top-title-add-p" @click="submitForm(3)" v-if="!lookInfoType&&projectData.checkStatus != 1">提交查看</p>
      <p class="page-top-title-add-p" @click="submitForm(3)" v-if="!lookInfoType&&projectData.checkStatus == 1 && projectData.checkSetProgress < 100">编辑</p>
      <p class="page-top-title-out-p" @click="backPage">返回</p>
      <p class="page-top-title-add-p" @click="submitForm(4)" v-if="!lookInfoType&&(initiateData.orderType == 3||initiateData.orderType == 5)">提交</p>
    </div>
    <div class="content-box">
      <!--校级角标-->
      <img class="corner-mark-img" v-if="projectData.checkCategory == '1'"
           src="@/assets/ZDimages/safetyCheck/icon_aqjc_xx@1x.png">
      <!--院级角标-->
      <img class="corner-mark-img" v-if="projectData.checkCategory == '2'"
           src="@/assets/ZDimages/safetyCheck/icon_jcjh_xy@1x.png">
      <div class="content-left-box scrollbar-box">
        <div class="content-left-top-box">
          <div class="left-text-box">
            <p class="left-text-name-p">计划标题</p>
            <div class="left-text-text-box">
              <p>{{projectData.planTitle}}</p>
            </div>
          </div>
          <div class="left-text-box">
            <p class="left-text-name-p">检查类型</p>
            <div class="left-text-title-box" style="width:130px;">
              <p>{{projectData.checkTypeName}}</p>
            </div>
          </div>
          <div class="left-text-box">
            <p class="left-text-name-p">计划周期</p>
            <div class="left-text-title-box">
              <p>{{projectData.cycleStartTime}}至{{projectData.cycleEndTime}}</p>
            </div>
          </div>
          <div class="left-text-box">
            <p class="left-text-name-p">检查组织</p>
            <div class="left-text-title-box">
              <p>{{projectData.checkGroupName}}</p>
            </div>
          </div>
          <div class="left-text-box">
            <p class="left-text-name-p">检查要求</p>
            <div class="left-text-text-box" style="min-height:80px;">
              <p>{{projectData.checkDemand}}</p>
            </div>
          </div>
          <div class="left-text-box" v-if="projectData.uploadDtoList[0]">
            <p class="left-text-name-p">材料附件</p>
            <div class="file-max-box">
              <p class="file-button-p" @click="downloadAll">全部下载</p>
              <div class="file-for-max-box" v-for="(item,index) in projectData.uploadDtoList" :key="index">
                <img src="@/assets/ZDimages/safetyCheck/icon_dr_wj.png">
                <p>{{item.fileName}}</p>
                <p @click="fullScreenFileLookClick(item)">查看</p>
                <p @click="downloadButton(item)">下载</p>
              </div>
            </div>
          </div>
        </div>
        <div class="content-left-bottom-box">
          <div class="left-text-box">
            <p class="left-text-name-p">检查名称</p>
            <div class="left-text-title-box">
              <p>{{projectData.checkName}}</p>
            </div>
          </div>
          <div class="left-text-box">
            <p class="left-text-name-p">检查开始日期</p>
            <div class="left-text-title-box">
              <p>{{projectData.checkStartTime}}</p>
            </div>
          </div>
          <div class="left-text-box">
            <p class="left-text-name-p">整改期限</p>
            <div class="left-text-title-box">
              <p>{{projectData.rectifyDeadline}}</p>
            </div>
          </div>
        </div>
      </div>
      <div class="content-right-box scrollbar-box">
        <p class="content-right-title-p">基本信息
          <span :class="itemShowType_1?'el-icon-arrow-down':'el-icon-arrow-up'" @click="itemShowButton(1)"></span>
        </p>
        <div v-if="itemShowType_1">
          <div class="content-right-flex-border-box" style="padding-top:20px;">
            <div class="right-text-box">
              <p class="right-text-name-p">实验室</p>
              <div class="right-text-title-box">
                <p>{{projectData.subName}}({{projectData.roomNum}})</p>
              </div>
            </div>
            <div class="right-text-box">
              <p class="right-text-name-p" style="width:138px;">分级分类</p>
              <div class="right-text-title-box">
                <p>{{projectData.classLevelName}}丨{{projectData.classTypeNames}}</p>
              </div>
            </div>
          </div>
          <div class="content-right-flex-border-box">
            <div class="right-text-box">
              <p class="right-text-name-p">学院单位</p>
              <div class="right-text-title-box">
                <p>{{projectData.deptName}}</p>
              </div>
            </div>
            <div class="right-text-box">
              <p class="right-text-name-p" style="width:138px;">楼栋楼层</p>
              <div class="right-text-title-box">
                <p>{{projectData.buildName}}-{{projectData.floorName}}</p>
              </div>
            </div>
          </div>
          <div class="content-right-flex-border-box" v-if="projectData.checkStatus == 1">
            <div class="right-text-box">
              <p class="right-text-name-p">检查人</p>
              <div class="right-text-title-box">
                <p>{{projectData.checkUserName}}-{{projectData.checkAccount}}</p>
              </div>
            </div>
            <div class="right-text-box">
              <p class="right-text-name-p" style="width:138px;">检查时间</p>
              <div class="right-text-title-box">
                <p>{{parseTime(projectData.checkTime,"{y}-{m}-{d} {h}:{i}")}}</p>
              </div>
            </div>
          </div>
        </div>
        <el-form class="add-form-box" :model="addForm" ref="addForm"
                 :rules="lookInfoType||!freeChoiceType?rulesNo:rules" label-width="110px">
          <p class="content-right-title-min-p">
            检查内容
            <span :class="itemShowType_2?'el-icon-arrow-down':'el-icon-arrow-up'" @click="itemShowButton(2)"></span>
          </p>
          <div v-if="itemShowType_2" style="margin-top:20px;">
            <el-form-item label="检查项目" prop="hazardCheckPro">
              <el-cascader
                v-if="!freeChoiceType"
                :disabled="lookInfoType||!freeChoiceType"
                placeholder="请选择检查项目"
                style="width:700px;"
                v-model="projectData.hazardCheckPro"
                filterable
                @change="hazardCheckProChange"
                :options="cascaderData"
                :props="{ value: 'id', label: 'labelName',emitPath:false }"
              ></el-cascader>
              <el-cascader
                v-if="freeChoiceType"
                :disabled="lookInfoType"
                placeholder="请选择检查项目"
                style="width:700px;"
                v-model="addForm.hazardCheckPro"
                filterable
                @change="hazardCheckProChange"
                :options="cascaderData"
                :props="{ value: 'id', label: 'labelName',emitPath:false }"
              ></el-cascader>
            </el-form-item>
            <p class="dangers-num-p" v-if="dangersNum>0">此检查项在当前实验室累计出现 <span>{{dangersNum}}</span> 次隐患</p>
            <el-form-item label="检查要点" prop="hazardCheckPoint">
              <el-input v-model="projectData.hazardCheckPoint" disabled placeholder="-"
                        style="width:700px;"></el-input>
            </el-form-item>
            <div style="display: flex;">
              <!--未检查-->
              <el-form-item label="检查结果" prop="checkFlag" v-if="!lookInfoType&& projectData.checkSetProgress < 100">
                <div class="check-button-box">
                  <div :class="addForm.checkFlag == 0?'check-button-border':''" @click="checkButton(0)">
                    <p>不符合</p>
                    <img v-if="addForm.checkFlag == 0" src="@/assets/ZDimages/safetyCheck/icom_xjjc_jcjc@1x.png">
                  </div>
                  <div :class="addForm.checkFlag == 1?'check-button-border':''" @click="checkButton(1)">
                    <p>符合</p>
                    <img v-if="addForm.checkFlag == 1" src="@/assets/ZDimages/safetyCheck/icom_xjjc_jcjc@1x.png">
                  </div>
                </div>
              </el-form-item>
              <!--查看-已检查-->
              <el-form-item label="检查结果" prop="checkFlag" v-if="lookInfoType&&projectData.checkStatus == 1">
                <div class="check-button-border-box">
                  <p>{{projectData.checkFlag == 0?'不符合':'符合'}}</p>
                  <img src="@/assets/ZDimages/safetyCheck/icom_xjjc_jcjc@1x.png">
                </div>
              </el-form-item>
              <!--查看-未检查-->
              <el-form-item label="检查结果" prop="checkFlag" v-if="lookInfoType&&projectData.checkStatus != 1">
                <div class="check-button-border-box" style="border:1px solid #999!important;color:#666!important;">
                  <p>待检查</p>
                </div>
              </el-form-item>
            </div>
          </div>
          <!--第一次检查时选择不符合时展示-->
          <p class="content-right-title-min-p" v-if="addForm.checkFlag == 0 && initiateData.orderType == 1">
            隐患信息
            <span :class="itemShowType_3?'el-icon-arrow-down':'el-icon-arrow-up'" @click="itemShowButton(3)"></span>
          </p>
          <div v-if="addForm.checkFlag == 0 && initiateData.orderType == 1 && projectData.checkSetProgress < 100 && itemShowType_3" style="margin-top:20px;">
            <el-form-item label="隐患描述" prop="hazardDescribe">
              <el-input placeholder="请输入隐患描述" maxLength='200' type="textarea" style="width:704px;"
                        resize="none" v-model="addForm.hazardDescribe" show-word-limit :rows="3"></el-input>
            </el-form-item>
            <el-form-item label="现场照片" prop="uploadDtoList">
              <div class="snapshotManagement-for-img-box" v-for="(img,imgIndex) in addForm.uploadDtoList"
                   :key="imgIndex">
                <img class="for-img" :src="img.fileUrl" @click="fullScreenViewClick(addForm.uploadDtoList,imgIndex)">
                <p class="for-del-button el-icon-circle-close" @click="delImg(imgIndex)"></p>
              </div>
              <el-upload
                v-if="addForm.uploadDtoList.length<6"
                style="display: inline-block;overflow: hidden"
                class="avatar-uploader"
                :action="uploadImgUrl"
                :show-file-list="false"
                :on-success="(res)=>handleAvatarSuccess(res)"
                :headers="headers"
                :before-upload="(res)=>beforeAvatarUpload(res)">
                <p class="el-icon-plus up-img-p" style="display: inline-block"></p>
              </el-upload>
              <p class="up-img-text">支持jpg/png/bmp/gif格式，且不超过2M，最多上传6张</p>
            </el-form-item>
            <el-form-item label="语音备注" prop="speechRemarksList" v-if="addForm.speechRemarksList[0]">
              <div class="for-audio-box" v-for="(item,index) in addForm.speechRemarksList" :key="index">
                <audio-player class="audio-box" :fileurl="item.fileUrl" :refId="'audioPlayer'+index"></audio-player>
              </div>
            </el-form-item>
          </div>
        </el-form>
        <!--历史记录-->
        <history-records-component ref="historyRecordsComponent" v-if="projectData.checkStatus == 1 && initiateData.orderType != 1 && historyRecordsComponentPropsType"
                                   :historyRecordsComponentPropsData="historyRecordsComponentPropsData"></history-records-component>
        <!--整改-->
        <rectification-component ref="rectificationComponent" v-if="initiateData.orderType == 3"></rectification-component>
        <!--复核-->
        <recheck-component ref="recheckComponent" v-if="initiateData.orderType == 5"></recheck-component>
      </div>
    </div>
    <fullScreenView :fullScreenViewProps="fullScreenViewProps" ref="fullScreenView"></fullScreenView>
    <fullScreenFileLook ref="fullScreenFileLook"></fullScreenFileLook>
  </div>
</template>

<script>
  import saveAs from 'file-saver'
  import JSZip from 'jszip'
  import { getToken } from '@/utils/auth'
  import fullScreenView from '@/components/fullScreenView/fullScreenView.vue'
  import fullScreenFileLook from '@/components/fullScreenFileLook/fullScreenFileLook.vue'
  import historyRecordsComponent from './historyRecordsComponent.vue'
  import recheckComponent from './recheckComponent.vue'
  import rectificationComponent from './rectificationComponent.vue'
  import audioPlayer from '@/components/audioPlayer/audioPlayer.vue'
  import {
    securityCheckPlanCheckInfo,
    securityCheckPhotoGetCheckNumBySub,
    securityCheckOptionSelAllList,
    securityCheckSetOptionCheckCommit,
    securityCheckSetOptionUnCheckList,
    securityCheckDangerGetDangerId,
    securityDraftFindBySetOptionId,
    securityCheckDangerCheckRectify,
    securityCheckDangerApprove,
    securityCheckPlanBatchDownloadFile,
  } from '@/api/safetyCheck/index'

  export default {
    name: 'initiateInspect',
    components: {
      fullScreenView,
      fullScreenFileLook,
      historyRecordsComponent,
      recheckComponent,
      rectificationComponent,
      audioPlayer
    },
    props: {
      initiateInspectData: {}
    },
    data() {
      return {
        //上传相关
        uploadImgUrl: this.uploadUrl(), // 上传的图片服务器地址
        headers: {
          Authorization: getToken()
        },
        //页面加载状态
        loadType:false,
        initiateData:{},
        //图片组件数据
        fullScreenViewProps: [],
        //查看详情状态
        lookInfoType: false,
        //项目选择开关-是否允许修改检查项目
        freeChoiceType: false,
        //校级检查/院级自查
        schoolCollegeType: 1,
        //计划详情
        projectData: {
          uploadDtoList: []
        },
        //检查项详情
        checkItemData: {},
        //检查项
        cascaderData: [],
        cascaderDataList: [],
        dangerLevel: [],
        //子项展开状态
        itemShowType_1: true,
        itemShowType_2: true,
        itemShowType_3: true,
        //隐患次数
        dangersNum: 0,
        addForm: {
          checkFlag: 0,
          hazardDescribe: '',
          uploadDtoList: [],
          speechRemarksList: []
        },
        rulesNo: {
          checkFlag: [
            { required: true, message: '请选择检查结果', trigger: 'blur' },
            { required: true, message: '请选择检查结果', validator: this.spaceJudgment, trigger: 'blur' }
          ],
          hazardDescribe: [
            { required: true, message: '请输入隐患描述', trigger: 'blur' },
            { required: true, message: '请输入隐患描述', validator: this.spaceJudgment, trigger: 'blur' }
          ],
          uploadDtoList: [
            { required: true, message: '请上传现场照片', trigger: 'blur' }
          ]
        },
        rules: {
          hazardCheckPro: [
            { required: true, message: '请选择检查项目', trigger: 'blur' },
            { required: true, message: '请选择检查项目', validator: this.spaceJudgment, trigger: 'blur' }
          ],
          checkFlag: [
            { required: true, message: '请选择检查结果', trigger: 'blur' },
            { required: true, message: '请选择检查结果', validator: this.spaceJudgment, trigger: 'blur' }
          ],
          hazardDescribe: [
            { required: true, message: '请输入隐患描述', trigger: 'blur' },
            { required: true, message: '请输入隐患描述', validator: this.spaceJudgment, trigger: 'blur' }
          ],
          uploadDtoList: [
            { required: true, message: '请上传现场照片', trigger: 'blur' }
          ]
        },
        //历史记录组件数据
        historyRecordsComponentPropsData: {},
        historyRecordsComponentPropsType:false,
      }
    },
    created() {
      this.$set(this,'initiateData',this.initiateInspectData);
      this.initialize()
    },
    mounted() {

    },
    methods: {
      //初始化
      initialize() {
        //计划详情
        this.securityCheckPlanCheckInfo('initialize');
        // 是否是详情进入
        if (this.initiateData.showType) {
          this.$set(this, 'lookInfoType', true)
        } else {
          this.$set(this, 'lookInfoType', false)
        }
      },
      //开始检查计划详情
      securityCheckPlanCheckInfo(type) {
        //type 初始化时为FALSE 提交再次调用为true
        let self = this
        securityCheckPlanCheckInfo({
          manageId: this.initiateData.manageId,
          setOptionId:this.initiateData.setOptionId ? this.initiateData.setOptionId : ''
        }).then(response => {
          this.$set(this, 'projectData', response.data)
          this.$set(this.projectData, 'uploadDtoList', response.data.uploadDtoList?response.data.uploadDtoList:[])
          this.$nextTick(()=>{
            //已制定检查项
            if (this.projectData.hazardCheckPro) {
              //查询次数
              this.securityCheckPhotoGetCheckNumBySub()
              if (this.projectData.checkStatus == 1) {
                //已提交
                this.securityCheckDangerGetDangerId();
                if(this.projectData.checkSetProgress < 100){
                  this.$set(this.addForm, 'uploadDtoList', response.data.photoList?response.data.photoList:[])
                  this.$set(this.addForm, 'checkFlag', response.data.checkFlag?response.data.checkFlag:0)
                  this.$set(this.addForm, 'hazardDescribe', response.data.hazardDescribe?response.data.hazardDescribe:'')
                }
              } else if (this.projectData.checkStatus == 0&&this.initiateData.checkDraftVo) {
                //草稿
                this.securityDraftFindBySetOptionId(this.initiateData.setOptionId);
              }else{
                this.$set(this,'loadType',true);
              }
            }else{
              //未指定检查项
              this.$set(this,'loadType',true);
            }
            if(type == 'initialize'){
              // 上级页面检查项状态 指定时false,未指定true
              if (this.initiateData.freeChoiceType) {
                this.$set(this, 'freeChoiceType', true)
                //开始检查/未指定检查项-获取未执行过的检查项列表
                this.securityCheckSetOptionUnCheckList();
              }else{
                //开始检查/开始整改/开始复查-获取所有检查项列表
                this.securityCheckOptionSelAllList();
              }
            }
          })
        })
      },
      //草稿数据查询
      securityDraftFindBySetOptionId(setOptionId){
        let self = this;
        securityDraftFindBySetOptionId({setOptionId:setOptionId}).then(response => {
          this.$set(this.addForm, 'uploadDtoList', response.data.photoList?response.data.photoList:[])
          this.$set(this.addForm, 'speechRemarksList', response.data.voiceList?response.data.voiceList:[])
          this.$nextTick(() => {
            for (let i = 0; i < self.addForm.speechRemarksList.length; i++) {
              self.addForm.speechRemarksList[i].playType = false
            }
          })
          this.$set(this.addForm, 'checkFlag', response.data.checkFlag?response.data.checkFlag:0)
          this.$set(this.addForm, 'hazardDescribe', response.data.hazardDescribe?response.data.hazardDescribe:'')
          this.$refs['addForm'].clearValidate();
          this.$nextTick(() => {
            this.$set(this,'loadType',true);
          })
        })
      },
      //查询检查项流程详情
      securityCheckDangerGetDangerId(){
        securityCheckDangerGetDangerId({
          manageId: this.initiateData.manageId,
          setOptionId: this.initiateData.setOptionId
        }).then(response => {
          let obj = {
            orderInfo:{
              hazardDescribe:this.projectData.hazardDescribe,
              uploadDtoList:this.projectData.photoList,
              checkFlag:this.projectData.checkFlag,
              showType:true,
            },
            checkRectifyVoList:[],
          }
          if(response.data){
            if(this.initiateInspectData.editType){
              let rectifyUploadList = [];
              for(let i=0;i<response.data.checkRectifyVoList[0].rectifyUploadList.length;i++){
                rectifyUploadList.push({
                  fileName:response.data.checkRectifyVoList[0].rectifyUploadList[i].fileName,
                  fileUrl:response.data.checkRectifyVoList[0].rectifyUploadList[i].fileUrl,
                  fileType:response.data.checkRectifyVoList[0].rectifyUploadList[i].fileType,
                })
              }
              this.$refs['rectificationComponent'].addForm = {
                rectifyResult:response.data.checkRectifyVoList[0].rectifyResult?1:0,
                rectifyMeasure:response.data.checkRectifyVoList[0].rectifyMeasure?response.data.checkRectifyVoList[0].rectifyMeasure:'',
                rectifyUploadList:rectifyUploadList,
                rectifyMaterialUrl:'',
              }
            }else{
              obj.checkRectifyVoList = response.data.checkRectifyVoList?response.data.checkRectifyVoList:[]
            }
          }
          this.$set(this,'checkItemData',response.data);
          this.$set(this,'historyRecordsComponentPropsData',obj);
          this.$set(this,'historyRecordsComponentPropsType',true);
          this.$nextTick(() => {
            this.$set(this,'loadType',true);
          })
        })
      },
      //查询隐患发生次数
      securityCheckPhotoGetCheckNumBySub() {
        securityCheckPhotoGetCheckNumBySub({
          subId: this.initiateData.subId,
          hazardCheckId: this.projectData.hazardCheckPro
        }).then(response => {
          this.$set(this, 'dangersNum', response.data)
        })
      },
      //手动选择检查项目
      hazardCheckProChange(val){
        let self = this;
        if (val){
          for (let i=0;i<self.cascaderDataList.length;i++){
            if(val == self.cascaderDataList[i].hazardCheckPro){
              self.$set(self.projectData,'setOptionId',self.cascaderDataList[i].setOptionId);
              self.$set(self.projectData,'hazardCheckPoint',self.cascaderDataList[i].hazardCheckPoint);
              self.$set(self.projectData,'hazardCheckPro',self.cascaderDataList[i].hazardCheckPro);
              self.$nextTick(()=>{
                self.securityDraftFindBySetOptionId(self.cascaderDataList[i].setOptionId);
                self.securityCheckPhotoGetCheckNumBySub()
              })
              break
            }
          }
        }
      },
      // 返回按钮
      backPage() {
        this.$parent.tableButton(6)
      },
      /** 提交按钮 */
      submitForm(type) {
        let self = this;
        if (type == 1 || type == 2 || type == 3) {
          self.$refs['addForm'].validate(valid => {
            if (valid) {
              this.$confirm(type==1?'确认保存草稿?':(type==2?'确认继续检查?':(type==3?'确认提交查看?':'')), "警告", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning"
              }).then(function() {
              }).then(() => {
                //保存草稿/继续检查/提交查看
                self.securityCheckSetOptionCheckCommit(type)
              }).catch(() => {});
            }
          })
        } else if (type == 4) {
          if(this.initiateData.orderType == 3){
            //整改提交
            this.$refs['rectificationComponent'].submitData().then(data => {
              let obj = {
                checkCategory:this.projectData.checkCategory,
                dangerId:this.checkItemData.dangerId,
                rectifyMeasure:data.rectifyMeasure,
                rectifyMaterialName:data.rectifyMaterialName,
                rectifyMaterialUrl:data.rectifyMaterialUrl,
                rectifyResult:data.rectifyResult,
                rectifyUploadList:data.rectifyUploadList,
              };
              securityCheckDangerCheckRectify(obj).then(response => {
                this.msgSuccess(response.message)
                this.$parent.tableButton(6)
              })
            });
          }else if(this.initiateData.orderType == 5){
            //复查提交
            this.$refs['recheckComponent'].submitData().then(data => {
              let list = JSON.parse(JSON.stringify(this.$refs['historyRecordsComponent'].dataList))
              let obj = {
                rectifyId:list[list.length-1].rectifyId,
                examineResult:data.examineResult,
                examineOpinion:data.examineOpinion,
                examineUploadList:data.examineUploadList,
              };
              securityCheckDangerApprove(obj).then(response => {
                this.msgSuccess(response.message)
                this.$parent.tableButton(6)
              })
            });
          }
        }
      },
      //检查提交
      securityCheckSetOptionCheckCommit(type) {
        let obj = {
          checkFlag: this.addForm.checkFlag,
          checkStatus: type == 1 ? '2' : 1,
          hazardDescribe: this.addForm.hazardDescribe,
          setOptionId: this.freeChoiceType?this.projectData.setOptionId:this.initiateData.setOptionId,
          photoList: this.addForm.uploadDtoList,
          voiceList: this.addForm.speechRemarksList,
        }
        securityCheckSetOptionCheckCommit(obj).then(response => {
          this.msgSuccess(response.message)
          if (type == 1) {
            //保存草稿
            this.$parent.tableButton(6)
          } else if (type == 2) {
            //继续检查
            this.$set(this,'addForm',{
              checkFlag: 0,
              hazardDescribe: '',
              uploadDtoList: [],
              speechRemarksList: []
            })
            this.$set(this,'dangersNum',0)
            this.$set(this.initiateData,'freeChoiceType',true)
            this.$set(this.initiateData,'setOptionId',null)
            this.initialize()
          } else if (type == 3) {
            //提交查看
            this.$set(this.initiateData, 'setOptionId', this.projectData.setOptionId)
            this.securityCheckPlanCheckInfo();
            this.$set(this, 'lookInfoType', true)
            this.$set(this, 'historyRecordsComponentPropsType', false)
            this.$set(this.initiateData, 'orderType', 2)
          }
        })
      },
      //子项展开隐藏按钮
      itemShowButton(type) {
        if (type == 1) {
          this.$set(this, 'itemShowType_1', !this.itemShowType_1)
        } else if (type == 2) {
          this.$set(this, 'itemShowType_2', !this.itemShowType_2)
        } else if (type == 3) {
          this.$set(this, 'itemShowType_3', !this.itemShowType_3)
        }
      },
      //检查结果勾选
      checkButton(type) {
        if (this.addForm.checkFlag != type) {
          this.$set(this.addForm, 'checkFlag', type)
        }
      },

      /*==========上传相关==========*/
      handleAvatarSuccess(res) {
        if (this.addForm.uploadDtoList.length > 5) {
          this.msgError('最多只可上传6张')
          return
        }
        let suffixName = this.upDataName.split('.')[this.upDataName.split('.').length - 2]
        //判断文件名中是否有逗号和分号
        if (suffixName.indexOf(',') == -1 && suffixName.indexOf(';') == -1) {
        } else {
          this.msgError('文件名里包含逗号或分号，请修改后重新上传！')
          return
        }
        let obj = {
          fileName: this.upDataName,
          fileUrl: res.data.url
        }
        this.addForm.uploadDtoList.push(obj)
        this.$forceUpdate()
      },
      beforeAvatarUpload(file) {
        if (this.addForm.uploadDtoList.length > 5) {
          this.msgError('最多只可上传6张')
          return false
        }
        let type = false
        if (file.type == 'image/png' || file.type == 'image/jpeg' || file.type == 'image/jpg' || file.type == 'image/gif' || file.type == 'image/bmp') {
          if (file.size > 2100000) {
            this.msgError('上传图片大小不能超过2M')
            return false
          }
          this.upDataName = file.name
          type = true
        } else {
          this.msgError('仅支持jpeg/jpg/png/bmp/gif格式')
          type = false
        }
        return type
      },
      //删除照片
      delImg(imgIndex) {
        this.addForm.uploadDtoList.splice(imgIndex, 1)
      },
      //照片预览
      fullScreenViewClick(list, index) {
        let newList = [];
        for(let i=0;i<list.length;i++){
          newList.push(list[i].fileUrl)
        }
        this.$set(this, 'fullScreenViewProps', newList)
        this.$refs['fullScreenView'].initialize(index)
      },
      //文件预览
      fullScreenFileLookClick(item) {
        //判断类型
        let type = ''
        if (item.fileUrl.split('.')[1] == 'docx') {
          type = 'docx'
        } else if (item.fileUrl.split('.')[1] == 'xlsx') {
          type = 'excel'
        } else if (item.fileUrl.split('.')[1] == 'pdf') {
          type = 'pdf'
        }
        let url = localStorage.getItem('fileBrowseEnvironment') + item.fileUrl
        this.$refs['fullScreenFileLook'].initialize(item.fileName, url, type)
      },
      // 单个下载按钮
      downloadButton(item) {
        this.downloadUrl(item.fileUrl, item.fileName)
      },
      // 下载全部
      downloadAll() {
        this.download('security/checkPlan/batchDownloadFile', {
          ...{planId:this.initiateData.planId}
        }, `材料附件.zip`)
      },
      //检查项列表
      securityCheckOptionSelAllList() {
        securityCheckOptionSelAllList({}).then(response => {
          let list = this.getCascaderData(JSON.parse(JSON.stringify(response.data)),3)
          this.$nextTick(()=>{
            this.$set(this, 'cascaderData', list)
          })
        })
      },
      //未执行过的检查项列表
      securityCheckSetOptionUnCheckList(){
        securityCheckOptionSelAllList({}).then(response => {
          let maxList = this.getCascaderData(JSON.parse(JSON.stringify(response.data)),2)
          this.$nextTick(()=>{
            securityCheckSetOptionUnCheckList({
              manageId: this.initiateData.manageId,
            }).then(response => {
              if(response.data[0]){
                this.$set(this,'cascaderDataList',response.data);
                for(let i=0;i<maxList.length;i++){
                  for(let o=0;o<maxList[i].children.length;o++){
                    for(let x=0;x<response.data.length;x++){
                      if(maxList[i].children[o].id == response.data[x].hazardCheckPro2){
                        if(maxList[i].children[o].children){
                          maxList[i].children[o].children.push({
                            id: response.data[x].hazardCheckPro,
                            name: response.data[x].hazardCheckName,
                            mainPoint: response.data[x].hazardCheckPoint,
                            hazardLevelName: null,
                            code: response.data[x].hazardCheckCode,
                            parentId: response.data[x].hazardCheckPro2,
                            type: 1,
                            level: 3,
                            hazardReid: null,
                          })
                        }else{
                          maxList[i].children[o].children = [{
                            id: response.data[x].hazardCheckPro,
                            name: response.data[x].hazardCheckName,
                            mainPoint: response.data[x].hazardCheckPoint,
                            hazardLevelName: null,
                            code: response.data[x].hazardCheckCode,
                            parentId: response.data[x].hazardCheckPro2,
                            type: 1,
                            level: 3,
                            hazardReid: null,
                          }]
                        }
                      }
                    }
                  }
                }
                let list = this.getCascaderData(JSON.parse(JSON.stringify(maxList)),3)
                this.$nextTick(()=>{
                  this.$set(this, 'cascaderData', list)
                  this.$set(this.addForm, 'hazardCheckPro', list[0].children[0].children[0].id)
                  this.hazardCheckProChange(list[0].children[0].children[0].id);
                })
              }else{
                this.$parent.tableButton(6)
              }
            })
          })
        })
      },
      //检查项格式处理
      getCascaderData(list,type) {
        let self = this
        for (let i = 0; i < list.length; i++) {
          list[i].labelName = list[i].code ? list[i].code + ' ' + list[i].name : list[i].name
          if(list[i].level == type){
            delete list[i].children
          }else if (list[i].children) {
            if (list[i].children[0]) {
              list[i].children = self.getCascaderData(list[i].children,type)
            } else {
              list.splice(i, 1)
              i--
            }
          } else {
            list.splice(i, 1)
            i--
          }
        }
        for (let i = 0; i < list.length; i++) {
          list[i].labelName = list[i].code ? list[i].code + ' ' + list[i].name : list[i].name
          if(list[i].level == type){
            delete list[i].children
          }else if (list[i].children) {
            if (list[i].children[0]) {
              list[i].children = self.getCascaderData(list[i].children,type)
            } else {
              list.splice(i, 1)
              i--
            }
          } else {
            list.splice(i, 1)
            i--
          }
        }
        for (let i = 0; i < list.length; i++) {
          list[i].labelName = list[i].code ? list[i].code + ' ' + list[i].name : list[i].name
          if(list[i].level == type){
            delete list[i].children
          }else if (list[i].children) {
            if (list[i].children[0]) {
              list[i].children = self.getCascaderData(list[i].children,type)
            } else {
              list.splice(i, 1)
              i--
            }
          } else {
            list.splice(i, 1)
            i--
          }
        }
        return list
      },
    }
  }
</script>

<style scoped lang="scss">
  .initiateInspect {
    .content-box {
      flex: 1;
      display: flex;
      overflow: hidden;
      position: relative;
      .corner-mark-img {
        position: absolute;
        top: 0;
        left: 0;
        width: 80px;
        height: 80px;
      }
      .content-left-box {
        width: 529px;
        display: flex;
        flex-direction: column;
        margin: 40px 0;
        border-right: 1px dashed #D8D8D8;
        .content-left-top-box {
          margin: 0 28px 20px 29px;
          border-bottom: 2px dashed #D8D8D8;
        }
        .content-left-bottom-box {
          margin: 0 28px 0 29px;

        }
        .left-text-box {
          display: flex;
          margin-bottom: 20px;
          .left-text-name-p {
            width: 96px;
            line-height: 40px;
            text-align: right;
            margin-right: 14px;
            font-size: 16px;
          }
          .left-text-title-box {
            font-size: 14px;
            width: 350px;
            padding: 10px 20px;
            background-color: #f5f5f5;
            border: 1px solid #E0E0E0;
            border-radius: 4px 4px 4px 4px;
            p {
              line-height: 20px;
              /*单行省略号*/
              display: block;
              overflow: hidden;
              text-overflow: ellipsis;
              white-space: nowrap;
            }
          }
          .left-text-text-box {
            font-size: 14px;
            width: 350px;
            padding: 10px 20px;
            background-color: #f5f5f5;
            border: 1px solid #E0E0E0;
            border-radius: 4px 4px 4px 4px;
            p {
              line-height: 20px;
            }
          }
          .file-max-box {
            .file-button-p {
              cursor: pointer;
              text-align: center;
              line-height: 40px;
              font-size: 14px;
              color: #fff;
              width: 80px;
              height: 40px;
              background: #0183FA;
              border-radius: 4px 4px 4px 4px;
              margin-bottom: 10px;
            }
            .file-for-max-box {
              display: flex;
              flex: 1;
              overflow: hidden;
              img {
                display: block;
                width: 20px;
                height: 20px;
                margin: 10px 20px 0 0;
              }
              p {
                font-size: 14px;
                height: 40px;
                line-height: 40px;
              }
              p:nth-child(2) {
                width: 230px;
                /*单行省略号*/
                display: block;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
              }
              p:nth-child(3) {
                width: 40px;
                text-align: center;
                color: #0183FA;
                cursor: pointer;
              }
              p:nth-child(4) {
                width: 40px;
                text-align: center;
                color: #0183FA;
                cursor: pointer;
              }
            }
          }
        }
      }
      .content-right-box {
        margin: 40px 0;
        flex: 1;
        padding: 0 26px 0 48px;
        .content-right-title-p {
          line-height: 40px;
          background: #F5F5F5;
          border: 1px solid #E0E0E0;
          padding-left: 23px;
          span {
            float: right;
            font-size: 20px;
            line-height: 40px;
            margin-right: 20px;
            cursor: pointer;
          }
        }
        .content-right-flex-border-box {
          display: flex;
          border-left: 1px solid #E0E0E0;
          border-right: 1px solid #E0E0E0;
        }
        .add-form-box {
          border: 1px solid #E0E0E0;
          border-top: none;
          .content-right-title-min-p {
            line-height: 40px;
            background: #F5F5F5;
            padding-left: 23px;
            border-top: 1px solid #E0E0E0;
            border-bottom: 1px solid #E0E0E0;
            span {
              float: right;
              font-size: 20px;
              line-height: 40px;
              margin-right: 20px;
              cursor: pointer;
            }
          }
          ::v-deep .snapshotManagement-for-img-box {
            width: 80px;
            height: 80px;
            border-radius: 4px;
            display: inline-block;
            overflow: hidden;
            margin-right: 20px;
            position: relative;
            .for-img {
              width: 80px;
              height: 80px;
              display: inline-block;
              overflow: hidden;
            }
            .for-del-button {
              background: rgba(0, 0, 0, 0.7);
              width: 20px;
              height: 20px;
              line-height: 20px;
              text-align: center;
              color: #fff;
              border-bottom-left-radius: 4px;
              cursor: pointer;
              position: absolute;
              top: 0;
              right: 0;
            }
          }
          ::v-deep .up-img-p {
            height: 80px;
            width: 80px;
            line-height: 80px;
            text-align: center;
            font-size: 16px;
            border-radius: 4px;
            border: 1px dashed #E0E0E0;
          }
          .up-img-text {
            line-height: 40px;
            margin-bottom: 20px;
            font-size: 14px;
            color: #999;
          }
          ::v-deep .el-form-item--medium .el-form-item__label {
            font-size: 16px;
          }
          .dangers-num-p {
            margin-left: 110px;
            margin-bottom: 20px;
            font-size: 14px;
            color: #333;
            display: block;
            span {
              color: #FF0000;
            }
          }
          .check-button-box {
            display: flex;
            div {
              border: 1px solid #A2A2A2;
              width: 100px;
              height: 40px;
              text-align: center;
              position: relative;
              cursor: pointer;
              p {
                width: 100px;
                line-height: 40px;
                font-size: 14px;
                text-align: center;
              }
              img {
                position: absolute;
                bottom: 0;
                right: 0;
                width: 20px;
                height: 20px;
              }
            }
            div:nth-child(1) {
              border-bottom-left-radius: 4px;
              border-top-left-radius: 4px;
              border-right: none;
            }
            div:nth-child(2) {
              border-bottom-right-radius: 4px;
              border-top-right-radius: 4px;
              border-left: none;
            }
            .check-button-border {
              border: 1px solid #0183FA !important;
              color: #0183FA;
            }
          }
          .check-button-border-box {
            border: 1px solid #0183FA !important;
            color: #0183FA;
            border-radius: 4px;
            width: 100px;
            height: 40px;
            text-align: center;
            position: relative;
            p {
              width: 100px;
              line-height: 40px;
              font-size: 14px;
              text-align: center;
            }
            img {
              position: absolute;
              bottom: 0;
              right: 0;
              width: 20px;
              height: 20px;
            }
          }
          .for-audio-box {
            width: 400px;
            margin-bottom: 10px;
          }
        }
        .right-text-box {
          display: flex;
          margin-bottom: 20px;
          .right-text-name-p {
            width: 90px;
            line-height: 40px;
            text-align: right;
            margin-right: 14px;
            font-size: 16px;
          }
          .right-text-title-box {
            font-size: 14px;
            width: 300px;
            padding: 10px 20px;
            background-color: #f5f5f5;
            border: 1px solid #E0E0E0;
            border-radius: 4px 4px 4px 4px;
            p {
              line-height: 20px;
              /*单行省略号*/
              display: block;
              overflow: hidden;
              text-overflow: ellipsis;
              white-space: nowrap;
            }
          }
          .right-text-text-box {
            font-size: 14px;
            width: 300px;
            padding: 10px 20px;
            background-color: #f5f5f5;
            border: 1px solid #E0E0E0;
            border-radius: 4px 4px 4px 4px;
            p {
              line-height: 20px;
            }
          }
          .right-no-check-box {
            height: 40px;
            margin-right: 20px;
            overflow: hidden;
            display: flex;
            cursor: pointer;
            div {
              margin: 13px 0 0;
              width: 16px;
              height: 16px;
              border: 1px solid #999;
              border-radius: 50%;
              p {
                height: 10px;
                width: 10px;
                margin: 2px;
                border-radius: 50%;
              }
            }
            .right-no-check-title-p {
              margin-left: 8px;
              height: 40px;
              line-height: 40px;
              color: #333;
              font-size: 16px;
            }
          }
          .right-check-box {
            height: 40px;
            margin-right: 20px;
            overflow: hidden;
            display: flex;
            cursor: pointer;
            div {
              margin: 13px 0 0;
              width: 16px;
              height: 16px;
              border: 1px solid #0183FA;
              border-radius: 50%;
              p {
                height: 10px;
                width: 10px;
                margin: 2px;
                border-radius: 50%;
                background-color: #0183FA;
              }
            }
            .right-check-title-p {
              margin-left: 8px;
              height: 40px;
              line-height: 40px;
              color: #0183FA;
              font-size: 16px;
            }
          }
          img {
            cursor: pointer;
            display: block;
            width: 100px;
            height: 100px;
            margin-right: 20px;
          }
        }
        ::v-deep .el-input.is-disabled .el-input__inner {
          background-color: #f5f5f5;
          border: 1px solid #E0E0E0;
          color: #333;
          cursor: auto;
        }
      }
    }
  }
</style>
