<template>
  <el-dialog v-if="dialogVisible" :visible.sync="dialogVisible" :append-to-body="appendToBody" :fullscreen="fullscreen" title="隐患详细信息" width="1000px">
    <el-scrollbar style="height: 100%;margin-top: 10px;" class="information">
      <div id="printTest" class="app-container">
        <div class="print-break">
          <div class="level-title">
            <h1>隐患信息</h1>
          </div>
          <div class="mb-20">
            <table class="table-ui">
              <tr>
                <td class="tbg">隐患发现人</td>
                <td>{{ pd.CREATORNAME }}</td>
              </tr>
              <tr>
                <td class="tbg">隐患来源</td>
                <template v-if="pd.SOURCE=='1'">
                  <td>隐患快报</td>
                </template>
                <template v-else-if="pd.SOURCE=='2'">
                  <td>隐患排查</td>
                </template>
                <template v-else-if="pd.SOURCE=='3'">
                  <td>隐患排查</td>
                </template>
                <template v-else-if="pd.SOURCE=='4'">
                  <td>安全环保检查(监管端)</td>
                </template>
                <template v-else-if="pd.SOURCE=='5'">
                  <td>安全环保检查(企业端)</td>
                </template>
                <template v-else-if="pd.SOURCE=='6'">
                  <td>消防检查</td>
                </template>
              </tr>
              <tr>
                <td class="tbg">隐患描述</td>
                <td>{{ pd.HIDDENDESCR }}</td>
              </tr>
              <tr v-if="pd.SOURCE=='2'">
                <td class="tbg">风险点（单元）</td>
                <td>{{ pd.RISK_UNIT }}</td>
              </tr>
              <tr v-if="pd.SOURCE=='2'">
                <td class="tbg">辨识部位</td>
                <td>{{ pd.IDENTIFICATION }}</td>
              </tr>
              <tr v-if="pd.SOURCE=='2'">
                <td class="tbg">存在风险</td>
                <td>{{ pd.RISK_DESCR }}</td>
              </tr>
              <tr v-if="pd.SOURCE=='2'">
                <td class="tbg">风险分级</td>
                <td>{{ pd.LEVEL }}</td>
              </tr>
              <tr v-if="pd.SOURCE=='2'">
                <td class="tbg">检查内容</td>
                <td>{{ pd.CHECK_CONTENT }}</td>
              </tr>
              <tr>
                <td class="tbg">隐患级别</td>
                <td>{{ pd.editLevelName ? pd.editLevelName : '' }}</td>
              </tr>
              <tr>
                <td class="tbg">隐患类型</td>
                <td>{{ pd.HIDDENTYPENAME }}</td>
              </tr>
              <tr>
                <td class="tbg">隐患状态</td>
                <td>
                  {{ transformation(pd.STATE) }}
                </td>
              </tr>
              <tr>
                <td class="tbg">隐患部位</td>
                <td>{{ pd.hregionName ? pd.hregionName : pd.HIDDENPART }}</td>
              </tr>
              <tr>
                <td class="tbg">隐患上报位置</td>
                <td>经度:{{ pd.LONGITUDE }} , 纬度:{{ pd.LATITUDE }}</td>
              </tr>
              <tr>
                <td class="tbg">隐患位置描述</td>
                <td>{{ pd.POSITIONDESC }}</td>
              </tr>
              <tr>
                <td class="tbg">隐患图片</td>
                <td class="img-select">
                  <viewer :images="hImgs">
                    <img v-for="item in hImgs" :src="config.fileUrl + item.FILEPATH" :key="item.IMGFILES_ID" width="100" height="100">
                  </viewer>
                </td>
              </tr>
              <tr v-for="item in hiddenFindPeople" :key="item.USER_ID">
                <td class="tbg">隐患发现人</td>
                <td>{{ item.NAME }}</td>
              </tr>
              <tr>
                <td class="tbg">隐患发现时间</td>
                <td>{{ formatDate(pd.DISCOVERYTIME, 'YYYY-MM-DD HH:mm:ss') }}</td>
              </tr>
              <tr>
                <td class="tbg">整改类型</td>
                <td>
                  <template>
                    限期整改
                  </template>
                </td>
              </tr>
              <tr v-if="pd.editDeptName ?pd.editDeptName :pd.RECTIFICATIONDEPTNAME">
                <td class="tbg">整改负责部门</td>
                <td>{{ pd.editDeptName ? pd.editDeptName : pd.RECTIFICATIONDEPTNAME }}</td>
              </tr>
              <tr v-if="pd.editUserName ?pd.editUserName :pd.RECTIFICATIONORNAME">
                <td class="tbg">整改负责人</td>
                <td>{{ pd.editUserName ? pd.editUserName : pd.RECTIFICATIONORNAME }}</td>
              </tr>
              <tr>
                <td class="tbg">是否相关方</td>
                <td>{{ pd.ISRELEVANT == '1' ? '是' : '否' }}</td>
              </tr>
              <tr v-if="videoUrl">
                <td class="tbg">隐患视频</td>
                <td>
                  <span style="color: #4395ff;cursor: pointer" @click="openUtil('video')">隐患视频</span>
                </td>
              </tr>
              <tr v-if="pd.RECTIFICATIONTYPE=='2' && pd.RECTIFICATIONDEADLINE">
                <td class="tbg">整改期限</td>
                <td>{{ pd.RECTIFICATIONDEADLINE }}</td>
              </tr>
              <template v-if="repulsecause">
                <tr v-for="item in repulsecause" :key="item.USER_ID">
                  <td class="tbg">打回原因</td>
                  <td>{{ item.REPULSE_CAUSE }}</td>
                </tr>
              </template>
              <template v-if="repulsecause">
                <tr v-for="item in repulsecause" :key="item.USER_ID">
                  <td class="tbg">打回时间</td>
                  <td>{{ item.OPERATTIME }}</td>
                </tr>
              </template>
            </table>
          </div>
        </div>
        <div v-for="(item,index) in hiddenExamineList" :key="index">
          <div v-if="item.TYPE === 4 || item.TYPE === 2 || item.TYPE === 1" class="print-break">
            <div class="level-line"/>
            <table v-if="item.TYPE === 4" class="table-ui">
              <div class="level-title">
                <h1>确认信息</h1>
              </div>
              <tr>
                <td class="tbg">隐患级别</td>
                <td>{{ item.editLevelName }}</td>
              </tr>
              <tr v-if="item.editUserName">
                <td class="tbg">整改负责人</td>
                <td>{{ item.editUserName }}</td>
              </tr>
              <tr v-if="item.spare3">
                <td class="tbg">整改完成期限</td>
                <td>{{ item.spare3 }}</td>
              </tr>
              <tr>
                <td class="tbg">隐患确认人</td>
                <td>{{ pd.conUserName }}</td>
              </tr>
              <tr>
                <td class="tbg">隐患确认时间</td>
                <td>{{ pd.CONFIRM_TIME }}</td>
              </tr>
            </table>
            <table v-else-if="item.TYPE === 2" class="table-ui">
              <div class="level-title">
                <h1>延期信息</h1>
              </div>
              <tr>
                <td class="tbg">申请延期日期</td>
                <td>{{ item.DELAY_TIME }}</td>
              </tr>
              <tr>
                <td class="tbg">审核人</td>
                <td>{{ pd.conUserName }}</td>
              </tr>
              <tr>
                <td class="tbg">处置方案</td>
                <td>{{ item.DISPOSAL_PLAN }}</td>
              </tr>
              <tr v-if="item.DISPOSAL_FILE">
                <td class="tbg">方案附件</td>
                <td><a style="color: #1e9fff" @click="openUtil('pdf',item.DISPOSAL_FILE)">[预览]</a></td>
              </tr>
              <tr>
                <td class="tbg">延期审核状态</td>
                <template v-if="item.STATE===-1">
                  <td>待审核</td>
                </template>
                <template v-else-if="item.STATE===1">
                  <td>通过</td>
                </template>
                <template v-else-if="item.STATE===2">
                  <td>未通过</td>
                </template>
              </tr>
              <tr v-if="item.STATE===1">
                <td class="tbg">审核时间</td>
                <td>{{ item.OPERATTIME }}</td>
              </tr>
            </table>
            <table v-else-if="item.TYPE === 1" class="table-ui">
              <div class="level-title">
                <h1>特殊处理审核信息</h1>
              </div>
              <tr>
                <td class="tbg">无法整改原因</td>
                <td>{{ item.EXAMINE }}</td>
              </tr>
              <tr>
                <td class="tbg">特殊处置审核状态</td>
                <template v-if="item.STATE===-1">
                  <td>待审核</td>
                </template>
                <template v-else-if="item.STATE===2">
                  <td>通过</td>
                </template>
                <template v-else-if="item.STATE===1">
                  <td>未通过</td>
                </template>
              </tr>
              <tr v-if="item.STATE===2">
                <td class="tbg">处置方案</td>
                <td>{{ item.DISPOSAL_PLAN }}</td>
              </tr>
              <tr v-if="item.STATE===2 && item.DISPOSAL_FILE">
                <td class="tbg">处置方案附件</td>
                <td><a style="color: #1e9fff" @click="openUtil('pdf',item.DISPOSAL_FILE)">[预览]</a></td>
              </tr>
              <tr v-if="item.STATE!==-1">
                <td class="tbg">审核时间</td>
                <td>{{ item.OPERATTIME }}</td>
              </tr>
              <tr v-if="item.STATE!==-1">
                <td class="tbg">审核人</td>
                <td>{{ pd.conUserName }}</td>
              </tr>
              <tr v-if="item.TYPE ==='2'">
                <td class="tbg">是否更换整改负责人</td>
                <td v-if="item.spare1==='1'">是</td>
                <td v-if="item.spare1==='0'">否</td>
              </tr>
              <tr v-if="item.STATE!==-1">
                <td class="tbg">是否更换整改负责人</td>
                <td v-if="item.spare2 == undefined">否</td>
                <td v-else>是</td>
              </tr>
              <tr v-if="item.spare1==='1'">
                <td class="tbg">整改负责人</td>
                <td>{{ item.NEWRECTIFICATIONOR }}</td>
              </tr>
            </table>
          </div>
        </div>
        <div v-if="pd.STATE ==2 || pd.STATE ==4 || pd.STATE == 10" class="level-line"/>
        <div v-if="pd.STATE ==2 || pd.STATE ==4 || pd.STATE == 10" class="print-break">
          <div class="level-line"/>
          <div class="level-title">
            <h1>整改信息</h1>
          </div>
          <table class="table-ui">
            <tr>
              <td class="tbg">整改描述</td>
              <td>{{ pd.RECTIFYDESCR }}</td>
            </tr>

            <tr v-if="pd.RECTIFICATIONDEPTNAME">
              <td class="tbg">整改部门</td>
              <td>{{ pd.RECTIFICATIONDEPTNAME }}</td>
            </tr>
            <tr v-if="pd.RECTIFICATIONORNAME">
              <td class="tbg">整改人</td>
              <td>{{ pd.RECTIFICATIONORNAME }}</td>
            </tr>
            <tr v-if="pd.RECTIFICATIONTIME">
              <td class="tbg">整改时间</td>
              <td>{{ pd.RECTIFICATIONTIME }}</td>
            </tr>
            <tr v-if="pd.INVESTMENT_FUNDS">
              <td class="tbg">投入资金</td>
              <td>{{ pd.INVESTMENT_FUNDS }}元</td>
            </tr>
            <tr>
              <td class="tbg">整改后图片</td>
              <td class="img-select">
                <viewer :images="rImgs">
                  <img v-for="item in rImgs" :src="config.fileUrl + item.FILEPATH" :key="item.IMGFILES_ID" width="100" height="100">
                </viewer>
              </td>
            </tr>
            <tr v-if="pd.HAVESCHEME">
              <td class="tbg">整改方案</td>
              <td v-if="pd.HAVESCHEME==0">无</td>
              <td v-else-if="pd.HAVESCHEME==1">有</td>
              <td v-else/>
            </tr>
            <tr v-if="hs && pd.HAVESCHEME==1">
              <td class="tbg">排查日期</td>
              <td>{{ hs.SCREENINGDATE }}</td>
            </tr>
            <tr v-if="hs && pd.HAVESCHEME==1 && hs.LISTNAME">
              <td class="tbg">隐患清单</td>
              <td>{{ hs.LISTNAME }}</td>
            </tr>
            <tr v-if="hs && pd.HAVESCHEME==1">
              <td class="tbg">治理标准要求</td>
              <td>{{ hs.GOVERNSTANDARDS }}</td>
            </tr>
            <tr v-if="hs && pd.HAVESCHEME==1">
              <td class="tbg">治理方法</td>
              <td>{{ hs.GOVERNMETHOD }}</td>
            </tr>
            <tr v-if="hs && pd.HAVESCHEME==1">
              <td class="tbg">经费和物资的落实</td>
              <td>{{ hs.EXPENDITURE }}</td>
            </tr>
            <tr v-if="hs && pd.HAVESCHEME==1">
              <td class="tbg">负责治理人员</td>
              <td>{{ hs.PRINCIPAL }}</td>
            </tr>
            <tr v-if="hs && pd.HAVESCHEME==1">
              <td class="tbg">工时安排</td>
              <td>{{ hs.PROGRAMMING }}</td>
            </tr>
            <tr v-if="hs && pd.HAVESCHEME==1">
              <td class="tbg">时限要求</td>
              <td>{{ hs.TIMELIMITFOR }}</td>
            </tr>
            <tr v-if="hs && pd.HAVESCHEME==1">
              <td class="tbg">工作要求</td>
              <td>{{ hs.JOBREQUIREMENT }}</td>
            </tr>
            <tr v-if="hs && pd.HAVESCHEME==1">
              <td class="tbg">其他事项</td>
              <td>{{ hs.OTHERBUSINESS }}</td>
            </tr>
            <tr v-if="hs && pd.HAVESCHEME==1">
              <td class="tbg">方案图片</td>
              <td class="img-select">
                <viewer :images="sImgs">
                  <img v-for="item in sImgs" :src="config.fileUrl + item.FILEPATH" :key="item.IMGFILES_ID" width="100" height="100">
                </viewer>
              </td>
            </tr>
          </table>
        </div>
        <div v-if="pd.STATE ==4 && pd.STATE !=8" class="level-line"/>
        <div v-if="pd.STATE ==4 && pd.STATE !=8" class="print-break">
          <div class="level-line"/>
          <div class="level-title">
            <h1>验收信息</h1>
          </div>
          <template v-if="pd.RECTIFICATIONTYPE!='1'">
            <table v-for="(data) in checkList" :key="data.value" class="table-ui">
              <tr>
                <td class="tbg">验收描述</td>
                <td>{{ data.CHECKDESCR }}</td>
              </tr>
              <tr>
                <td class="tbg">是否合格</td>
                <td>
                  <template v-if="data.STATUS=='1'">
                    是
                  </template>
                  <template v-else-if="data.STATUS=='0'">
                    否
                  </template>
                </td>
              </tr>
              <tr>
                <td class="tbg">验收部门</td>
                <td>{{ data.CHECKDEPTNAME }}</td>
              </tr>
              <tr>
                <td class="tbg">验收人</td>
                <td>{{ data.CHECKORNAME }}</td>
              </tr>

              <tr>
                <td class="tbg">验收时间</td>
                <td>{{ data.CHECK_TIME }}</td>
              </tr>
              <tr>
                <td class="tbg">验收图片</td>
                <td class="img-select">
                  <viewer :images="data.cImgs">
                    <img v-for="item in data.cImgs" :src="config.fileUrl + item.FILEPATH" :key="item.IMGFILES_ID" width="100" height="100">
                  </viewer>
                </td>
              </tr>
            </table>
          </template>
          <template v-if="pd.RECTIFICATIONTYPE=='1'">
            <table class="table-ui">
              <tr>
                <td class="tbg">验收人</td>
                <td>{{ pd.CHECKORNAME }}</td>
              </tr>
            </table>
          </template>
        </div>
        <div v-if="pd.FINAL_CHECK" class="level-line"/>
        <div v-if="pd.FINAL_CHECK" class="print-break">
          <div class="level-title">
            <h1>安全环保检查验收信息</h1>
          </div>
          <template>
            <table class="mb-20 table-ui">
              <tr>
                <td class="tbg">验收描述</td>
                <td>{{ pd.FINAL_CHECKDESCR }}</td>
              </tr>
              <tr>
                <td class="tbg">是否合格</td>
                <td>
                  <template v-if="pd.FINAL_CHECK=='1'">
                    是
                  </template>
                  <template v-else-if="pd.FINAL_CHECK=='2'">
                    否
                  </template>
                </td>
              </tr>
              <tr>
                <td class="tbg">验收人</td>
                <td>{{ pd.FINAL_CHECKOR_NAME }}</td>
              </tr>

              <tr>
                <td class="tbg">验收时间</td>
                <td>{{ pd.FINAL_CHECKTIME }}</td>
              </tr>
              <tr>
                <td class="tbg">验收图片</td>
                <td class="img-select">
                  <viewer :images="fcImgs">
                    <img v-for="item in fcImgs" :src="config.fileUrl + item.FILEPATH" :key="item.IMGFILES_ID" width="100" height="100">
                  </viewer>
                </td>
              </tr>
            </table>
          </template>
        </div>
        <div v-if="pd.FINAL_CHECK" class="level-line"/>
        <div v-if="pd.INSPECTION_ASSESS_ID" class="print-break">
          <div class="level-title">
            <h1>安全环保检查考评</h1>
          </div>
          <template>
            <table class="mb-20 table-ui">
              <tr>
                <td class="tbg">考评扣分</td>
                <td>{{ pd.ASSESS_SCORE }}</td>
                <td class="tbg">处罚金额</td>
                <td>{{ validStr(pd.ASSESS_PENALTY_AMOUNT) ? pd.ASSESS_PENALTY_AMOUNT + '元' : '' }}</td>
              </tr>
            </table>
          </template>
        </div>
      </div>
      <div class="ui-height"/>
    </el-scrollbar>
    <span slot="footer">
      <el-button v-print="'#printTest'" type="primary">打 印</el-button>
      <el-button v-if="!fullscreen" plain type="info" @click="allin('open')">全 屏</el-button>
      <el-button v-if="fullscreen" plain type="info" @click="allin('close')">关闭全屏</el-button>
      <el-button plain type="info" @click="back">返 回</el-button>
    </span>
    <browse-util ref="browseUtil" :type="message"/>
  </el-dialog>
</template>

<script>
import Pagination from '@/components/Pagination' // 通过 el-pagination二次打包
import formatDate from '@/utils/dateformat'
import { requestFN } from '@/utils/request'
import browseUtil from './browseUtil'

// 改前需知
// 该组件需要做的通用些！！
// 点检记录中也使用了这个组件展示隐患信息！！

export default {
  components: { Pagination, browseUtil },
  data() {
    return {
      HIDDEN_ID: '',	// 主键ID
      pd: [],						// 存放字段参数
      hs: [],
      checkList: [],
      repulsecause: [],
      msg: 'add',
      pageType: '',
      config: config,
      hImgs: [],
      rImgs: [],
      sImgs: [],
      fcImgs: [],
      dialogVisible: false,
      hiddenFindPeople: [],
      hiddenExamineList: [],
      message: '',
      videoUrl: '',
      appendToBody: false,
      fullscreen: false
    }
  },
  methods: {
    init(id, appendToBody) {
      this.dialogVisible = true
      if (appendToBody) {
        this.appendToBody = true
      }
      this.getData(id)
    },
    getData(hiddenId) {
      this.listLoading = true
      requestFN(
        '/hidden/goEdit',
        {
          HIDDEN_ID: hiddenId,
          tm: new Date().getTime()
        }
      ).then((data) => {
        var vm = this
        vm.pd = data.pd							// 参数map
        vm.hs = data.hs							// 参数map
        vm.checkList = data.checkList
        this.hImgs = data.hImgs
        this.rImgs = data.rImgs
        this.sImgs = data.sImgs
        this.fcImgs = data.fcImgs
        this.repulsecause = data.repulsecause
        this.hiddenFindPeople = data.hiddenFindPeople
        if (data.hiddenVideo.length > 0) {
          this.videoUrl = data.hiddenVideo[0].FILEPATH
        } else {
          this.videoUrl = ''
        }
        this.hiddenExamineList = data.hiddenExa
        if (data.hiddenExa.length > 0) {
          data.hiddenExa.forEach(item => {
            if (item.TYPE === 0) {
              this.pd.oldUserName = item.editUserName
              this.pd.oldDeptName = item.editDeptName
              this.pd.oldLevelName = item.editLevelName
              this.pd.oldRectificationDeadline = item.spare3
            }
          })
        }
        this.$forceUpdate()
      }).catch((e) => {
        console.log(e)
        this.listLoading = false
      })
    },
    back() {
      this.dialogVisible = false
    },
    allin(condition) {
      if (condition === 'open') {
        this.fullscreen = true
      } else {
        this.fullscreen = false
      }
    },
    formatDate(date, format) {
      return formatDate(date, format)
    },
    openUtil(type, url) {
      this.message = type
      if (type === 'video') {
        this.$refs.browseUtil.init(this.videoUrl, type)
      } else {
        this.$refs.browseUtil.init(url)
      }
    },
    transformation(code) {
      switch (code) {
        case '-2':
          return '待确认'
        case '0':
          return '未提交'
        case '1':
          return '未整改'
        case '2':
          return '已整改'
        case '3':
          return '已复查'
        case '4':
          return '已验收'
        case '5':
          return '待处理的特殊申请隐患'
        case '6':
          return '重大隐患'
        case '7':
          return '待处理的特殊隐患'
        case '8':
          return '处理的特殊隐患'
        case '9':
          return ''
        case '10':
          return '验收打回'
        case '11':
          return '分公司安委会办公室副主任核定'
        case '12':
          return '分公司安委会办公室副主任核实'
        case '13':
          return '港股分公司安委会办公室副主任核定、重大隐患待整改'
        case '14':
          return '重大隐患待验收'
        case '15':
          return '重大隐患已归档'
        case '16':
          return '确认打回'
        case '100':
          return '安全环保检查暂存的隐患'
        case '101':
          return '待指派'
        case '102':
          return '指派中'
      }
    }
  }
}
</script>

<style lang="sass" scoped>
.table-ui
  .tbg
    width: 150px

  .img-flex
    display: flex

    .img-ui
      width: 240px
      height: 240px
      margin-right: 20px

      & img
        width: 100%
        height: 100%
</style>

<style scoped>
.information >>> .el-scrollbar__wrap {
  overflow-x: hidden;
}
</style>
