<!--准入审核详情-->
<template>
  <div class="page-container info-page" v-if="pageType">
    <div class="page-top-title-box">
      <p class="page-top-title-name-p">准入信息</p>
      <p class="page-top-title-out-p" @click="backPage">返回</p>
      <p v-if="isLook" class="page-top-title-save-p" style="width:100px;" @click="handleExport(2,'')">打包下载</p>
      <p v-if="isLook&&subjectData.labSecurityApply.auditStatus!=2" class="page-top-title-submit-p" style="width:100px;" @click="backPage()">提交</p>
      <p v-if="!isLook" class="page-top-title-cancel-p" style="width:100px;" @click="auditClick(1)">驳回</p>
      <p v-if="!isLook" class="page-top-title-save-p" style="width:100px;" @click="auditClick(2)">通过</p>
    </div>
    <div class="info-page-box scrollbar-box">
      <div class="admittance_info">
        <li>申请实验室:<i>{{subjectData.labSecurityApply.deptName}}-{{subjectData.labSecurityApply.subName}}</i></li>
        <li>实验室负责人:<i>{{subjectData.fzrSysUser.userName}}</i></li>
        <li>申请时间:<i>{{parseTime(subjectData.labSecurityApply.creatTime,"{y}-{m}-{d} {h}:{i}")}}</i></li>
        <li>有效期:<i>{{parseTime(subjectData.labSecurityApply.validBeginTime,"{y}-{m}-{d} {h}:{i}")}} 至 {{parseTime(subjectData.labSecurityApply.validEndTime,"{y}-{m}-{d} {h}:{i}")}}</i></li>
        <li>申请状态:<i>{{subjectData.labSecurityApply.auditStatus == 0?'待审核':(subjectData.labSecurityApply.auditStatus == 1?'已驳回':(subjectData.labSecurityApply.auditStatus == 2?'已通过':''))}}</i></li>
        <li v-if="isLook">审核时间:<i>{{parseTime(subjectData.labSecurityApply.auditTime,"{y}-{m}-{d} {h}:{i}")}}</i></li>
        <li v-if="isLook">审核人:<i>{{subjectData.labSecurityApply.auditName?subjectData.labSecurityApply.auditName:'--'}}</i></li>
        <li v-if="isLook">审核备注:<i>{{subjectData.labSecurityApply.rejectCause}}</i></li>
      </div>
      <div class="admittance_materials">
        <p class="admittance_materials_title">准入材料</p>
        <div>
          <div class="item-title-box">
            <i style="color: #F56C6C;">* </i>身份信息：<span style="color:#999;">(关联学生信息材料)</span>
          </div>
          <div class="identity">
            <li>姓名:<i>{{subjectData.sysUser.userName}}</i></li>
            <li>学号:<i>{{subjectData.sysUser.account}}</i></li>
            <li>卡号:<i>{{subjectData.sysUser.cardNumSimple}}</i></li>
            <li>联系方式:<i>{{subjectData.sysUser.mobile}}</i></li>
            <li>导师:<i>{{subjectData.sysUser.tutorUserName}}</i></li>
            <li>班级:<i>{{subjectData.sysUser.gradeName}}</i></li>
            <li>学院:<i>{{subjectData.labSecurityApply.deptName}}</i></li>
            <li>专业:<i>{{subjectData.sysUser.majorName}}</i></li>
            <li>申请备注:<i>{{subjectData.labSecurityApply.applyCause}}</i></li>
          </div>
        </div>
        <div v-for="(item,index) in subjectData.listTemp" :key="index">
          <div class="item-title-box" v-if="item.materialType==1"><i style="color: #F56C6C;">* </i>{{item.materialName}}</div>
          <div class="file_list"  v-for="(minItem,minIndex) in item.upList">
            <el-checkbox  @change="checkedImg(minItem)" v-if="isLook" >{{minItem.name}}</el-checkbox>
            <i v-if="!isLook" >{{minItem.name}}</i>
            <i class="file_list_look" @click="fullScreenFileLookClick(minItem)">查看</i>
            <i v-if="isLook" class="file_list_look" @click="handleExport(1,minItem)">下载</i>
          </div>
          <div class="item-title-box" v-if="item.materialType==2&&item.relationType==2"><i style="color: #F56C6C;">* </i>安全考试证书：<span style="color:#999;">(已同步证书信息)</span></div>
          <img v-if="item.materialType==2&&item.relationType==2&&subjectData.userCertificate"
               @click="fullScreenViewClick(subjectData.userCertificate)"
               class="item-img-box" :src="subjectData.userCertificate">
          <p v-if="item.materialType==2&&item.relationType==2&&!subjectData.userCertificate"
             style="margin-left:80px;color:#999;font-size:14px;line-height:40px;">暂无证书</p>
        </div>
        <div class="item-title-box" v-if="subjectData.labSecurityApply.auditStatus!=2">审核备注:</div>
        <el-input class="item-textarea" v-if="subjectData.labSecurityApply.auditStatus!=2"
                  type="textarea" style="margin-top: 20px" resize="none"
                  v-model="rejectCause" placeholder="请输入审核备注" maxlength="50"/>
      </div>
    </div>
    <!-- 添加或修改安全准入申请材料配置对话框 -->
    <el-dialog title="准入资格审核-未通过" :visible.sync="open" width="500px" append-to-body :close-on-click-modal="false">
      <el-form ref="form" :model="form" :rules="rules" label-width="100px">
        <el-form-item label="未通过材料" prop="materialName">
          <el-checkbox-group v-model="checkList">
            <el-checkbox :label="item.materialId" style="display: block" v-for="(item,index) in subjectData.listTemp" :key="index">{{item.materialName}}</el-checkbox>
          </el-checkbox-group>
        </el-form-item>
        <el-form-item label="未通过原因" prop="rejectCause">
          <el-input type="textarea" v-model="form.rejectCause" placeholder="请输入未通过原因" maxlength="100"/>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="laboratoryApplyUpdate(1)">确 定</el-button>
        <el-button @click="auditClick(3)">取 消</el-button>
      </div>
    </el-dialog>
    <fullScreenView :fullScreenViewProps="fullScreenViewProps" ref="fullScreenView"></fullScreenView>
    <fullScreenFileLook ref="fullScreenFileLook"></fullScreenFileLook>
  </div>
</template>

<script>
let Base64 = require('js-base64').Base64;
//                      V3
import { laboratoryApplyGetDetails,laboratoryApplyUpdate} from "@/api/secureAccess/index";
import fullScreenView from "@/components/fullScreenView/fullScreenView.vue";
import fullScreenFileLook from "@/components/fullScreenFileLook/fullScreenFileLook.vue";

export default {
  name: "info-page",
  components: {
    fullScreenView,
    fullScreenFileLook
  },
  props:{
    infoData: {},
  },
  data() {
    return {
      pageType:false,
      forIndex:0,
      subjectData:{},
      iframeSrc:[],
      open:false,
      form:{},
      checkList:[],
      rejectCause:'',//审核备注
      isLook:false,//判断是查看还是审核
      //打包下载查询参数
      packDown:{
        userName:'',
        userNumber:'',
        subjectName:'',
        fileList:'',

      },
      mrList:[],
      // 表单校验
      rules: {
        name: [
          { required: true, message: "请输入检查项名称", trigger: "blur" },
          { required: true, message: "请输入检查项名称", validator: this.spaceJudgment, trigger: "blur" }
        ],
        code: [
          { required: true, message: "请输入条款号", trigger: "blur" },
          { required: true, message: "请输入条款号", validator: this.spaceJudgment, trigger: "blur" }
        ],
      },
      //图片浏览
      fullScreenViewProps:[],
    };
  },
  created() {
    if(this.infoData.type==0){
      this.isLook=false;
    }else if(this.infoData.type==1){
      this.isLook=true;
    }
    this.laboratoryApplyGetDetails();
  },
  methods: {
    //图片浏览
    fullScreenViewClick(url){
      this.$set(this,'fullScreenViewProps',[url]);
      this.$refs['fullScreenView'].initialize();
    },
    //文件浏览
    fullScreenFileLookClick(item){
      //判断类型
      let type = '';
      if(item.url.split('.')[1] == 'docx'){
        type = 'docx'
      }else if(item.url.split('.')[1] == 'xlsx'){
        type = 'excel'
      }else if(item.url.split('.')[1] == 'pdf'){
        type = 'pdf'
      }else if(item.url.split('.')[1] == 'png' || item.url.split('.')[1] == 'jpg' || item.url.split('.')[1] == 'gif'){
        type = 'img'
      }
      //整合地址
      let url = localStorage.getItem('fileBrowseEnvironment')+item.url;
      //判断图片还是文件
      if(type == 'img'){
        this.$set(this,'fullScreenViewProps',[url]);
        this.$refs['fullScreenView'].initialize();
      }else if(type == 'docx' || type == 'excel' || type == 'pdf'){
        this.$refs['fullScreenFileLook'].initialize(item.name,url,type);
      }
    },
    /** 下载 */
    handleExport(type,item) {
      if(type==1){
        //单个
        this.packDown.userName=this.subjectData.sysUser.nickName
        this.packDown.userNumber=this.subjectData.sysUser.userName
        this.packDown.subjectName=this.subjectData.labSecurityApply.subjectName
        this.packDown.fileList=item.name+';'+localStorage.getItem('fileBrowseEnvironment')+item.url+',';
        this.download('/laboratory/apply/downloadwBatch', {
          ...this.packDown
        }, this.packDown.userName+'_'+this.packDown.userNumber+'_'+this.packDown.subjectName+`.zip`)
      }else if(type==2){
        // 打包下载
        if(this.mrList.length<=0){
          this.msgError("请先勾选需要打包下载的文件！");
        }else{
          let list=[];
          this.mrList.forEach(function (item){
            list.push(item+',')
          })
          this.packDown.userName=this.subjectData.sysUser.nickName
          this.packDown.userNumber=this.subjectData.sysUser.userName
          this.packDown.subjectName=this.subjectData.labSecurityApply.subjectName
          this.packDown.fileList= list.join('@@')
          this.download('/laboratory/apply/downloadwBatch', {
            ...this.packDown
          }, this.packDown.userName+'_'+this.packDown.userNumber+'_'+this.packDown.subjectName+`.zip`)
        }
      }
    },
    checkedImg(item){
      if(event.target.checked==false){
        this.mrList.splice(this.mrList.indexOf(item.url),1);
      }else{
        this.mrList.push(item.name+';'+localStorage.getItem('fileBrowseEnvironment')+item.url)
      }
    },
    //审核按钮
    auditClick(type){
      let self = this;
      if(type == 1){
        this.open = true;
      }else if(type == 2){
        this.$confirm('是否确认审核?', "", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function() {
          self.laboratoryApplyUpdate(type);
        }).then(() => {}).catch(() => {});
      }else if(type == 3){
        this.open = false;
      }
    },
    laboratoryApplyUpdate(type){
      let self = this;
      let obj = {
        applyId:this.infoData.list.applyId,
        auditStatus:type,
        rejectCause:this.rejectCause
      };
      if(type == 1){
        obj.rejectCause = this.form.rejectCause;
        obj.rejectMaterial = this.checkList + '';
      }
      laboratoryApplyUpdate(obj).then(response => {
        if(response.code==200){
          this.msgSuccess("操作成功");
          this.$parent.pageClick(false);
        }else if(response.code==205){
          this.$confirm(response.message, "警告", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          }).then(() => {
            //  确定
            self.$router.push({ path: '/integratedManagement/laboratoryManagement/accessAuthorizationApply' });
          }).catch(function() {
            //  取消
            self.$parent.pageClick(false);
          });
        }
      })
    },
    //点击切换文件
    forClick(item,index,bigIndex){
      this.iframeSrc[bigIndex].forIndex = index;
      this.iframeSrc[bigIndex].url = this.urlJudge(item.url)
    },
    //获取数据
    laboratoryApplyGetDetails(){
      let self = this;
      laboratoryApplyGetDetails({id:this.infoData.list.applyId}).then(response => {
        let dataList = [];
        for(let i=0;i<response.data.listTemp.length;i++){
          if(response.data.listTemp[i].materialType == 2 && response.data.listTemp[i].materialType == 2){
            dataList.unshift(response.data.listTemp[i]);
          }
        }
        for(let i=0;i<response.data.listTemp.length;i++){
          if(response.data.listTemp[i].materialType == 1){
            dataList.push(response.data.listTemp[i]);
          }
        }
        for(let i=0;i<response.data.listTemp.length;i++){
          if(response.data.listTemp[i].materialType == 2 && response.data.listTemp[i].materialType == 1){
            dataList.unshift(response.data.listTemp[i]);
          }
        }
        this.$set(response.data,'listTemp',dataList);
        let newList = [];
        for(let i=0;i<response.data.listTemp.length;i++){
          if(response.data.listTemp[i].materialType == 1){
            let maxList = [];
            for(let o=0;o<response.data.listTemp[i].listMr.length;o++){
              let bigList = response.data.listTemp[i].listMr[o].dataUrl.split(',');
              for(let x=0;x<bigList.length;x++){
                if(bigList[x]){
                  let minList = bigList[x].split(';');
                  let obj = {
                    name:minList[0],
                    url:minList[1],
                  };
                  maxList.push(obj);
                }
              }
            }
            response.data.listTemp[i].upList = maxList;
            let obj ={};
            if(maxList.length>0){
              obj = {
                forIndex:0,
                url:this.urlJudge(maxList[0].url)
              }
            }
            newList.push(obj);
          }else{
            let obj = {
              forIndex:"",
              url:""
            }
            newList.push(obj);
          }
        }
        this.$set(this,"iframeSrc",newList);
        this.$set(this,"subjectData",response.data);
        //审核备注
        if(this.isLook){
          this.$set(this,"rejectCause",response.data.labSecurityApply.rejectCause);
        }
        this.$forceUpdate()
        this.pageType = true;
      })
    },
    //返回
    backPage(){
      this.$parent.pageClick(false);
    },
  }
};
</script>

<style scoped lang="scss">
.info-page {
  .info-page-box{
    padding-bottom:40px;
    .top-title-box{
      display: flex;
      border-bottom: 1px solid #E0E0E0;
      /*padding-top:20px;*/
      p:nth-child(1){
        flex: 1;
        line-height:60px;
        color: #0045AF;
        font-size:18px;
        margin:0 0 0 40px;
      }
      p:nth-child(2){
        margin-right:20px;
      }
      p:nth-child(3){
        margin-right:20px;
      }
      p:nth-child(4){
        margin-right:20px;
      }
    }
    /*准入信息*/
    .admittance_info{
      display: flex;
      justify-content: flex-start;
      flex-wrap: wrap;
      padding-left: 80px;
      box-sizing: border-box;
      >li{
        list-style-type:none;
        font-size: 16px;
        font-family: Microsoft YaHei;
        font-weight: 500;
        color: #999999;
        line-height: 70px;
        margin-right: 20px;
        >i{
          margin-left: 10px;
          display: inline-block;
          font-style:normal;
          font-size: 16px;
          font-family: Microsoft YaHei;
          font-weight: 500;
          color: #333333;
          line-height: 70px;
        }
      }
    }
    /*准入材料*/
    .admittance_materials{
      box-sizing: border-box;
      .item-title-box{
        margin-left:50px;
        font-size:16px;
        line-height:60px;
        font-weight:700;
      }
      .item-img-box{
        width:240px;
        margin-left:80px;
        cursor: pointer;
      }
      .item-textarea{
        margin:0 0 60px 75px;
        width:800px;
      }
      .admittance_materials_title{
        flex: 1;
        line-height:60px;
        color: #0045AF;
        font-size:16px;
        border-bottom: 1px solid #E0E0E0;
        margin-top: 0;
        padding-left:20px;
      }
      .identity{
        display: flex;
        justify-content: flex-start;
        flex-wrap: wrap;
        padding-left: 80px;
        box-sizing: border-box;
        >li{
          list-style-type:none;
          font-size: 16px;
          font-family: Microsoft YaHei;
          font-weight: 500;
          color: #999999;
          line-height: 40px;
          margin-right: 20px;
          >i{
            margin-left: 10px;
            display: inline-block;
            font-style:normal;
            font-size: 16px;
            font-family: Microsoft YaHei;
            font-weight: 500;
            color: #333333;
            line-height: 40px;
          }
        }
      }
      .file_list{
        padding-left: 80px;
        box-sizing: border-box;
        >i{
          font-style: normal;
          font-size: 14px;
          font-family: Microsoft YaHei;
          font-weight: bold;
          color: #0183FA;
          line-height: 40px;
        }
        .file_list_look{
          padding-left: 40px;
          cursor: pointer;
          font-style: normal;
          font-size: 14px;
          font-family: Microsoft YaHei;
          font-weight: bold;
          color: #0183FA;
          line-height: 40px;
        }

      }
      .btn_list{
        text-align: center;
        margin-top: 40px;
        >p{
          margin-right: 20px;
        }
      }
    }
    .item-max-box{
      .item-title-box{
        margin-left:50px;
        font-size:16px;
        line-height:80px;
      }
      .item-user-box{
        display: flex;
        margin-left:65px;
        div{
          display: flex;
          margin-right:60px;
          font-size:14px;
        }
      }
      .item-img-box{
        width:240px;
        margin-left:50px;
      }
      .item-for-text-box{
        margin-left:77px;
        p{
          display: inline-block;
          font-size:14px;
          line-height:40px;
          margin:0 57px 0 0;
        }
        .color-p{
          color:#0045AF;
        }
      }
      .item-html-box{
        margin:20px 0 40px 58px;
        width:900px;
        height:900px;
        background: #F5F5F5;
      }
    }
  }
}
</style>
