<template>
  <div>
    <el-divider content-position="left">隐患信息</el-divider>
    <el-descriptions :column="1" border>
      <el-descriptions-item label="隐患来源">
        <span v-if="data.info.SOURCE === '1'"> 隐患快报 </span>
        <span v-else-if="data.info.SOURCE === '2'"> 隐患排查 </span>
        <span v-else-if="data.info.SOURCE === '3'"> 隐患排查 </span>
        <span v-else-if="data.info.SOURCE === '4'"> 安全环保检查 </span>
        <span v-else-if="data.info.SOURCE === '5'"> 安全环保检查 </span>
      </el-descriptions-item>
      <template v-if="data.info.SOURCE === '2' && listType === '1'">
        <el-descriptions-item label="风险点（单元）">
          {{ data.info.RISK_UNIT }}
        </el-descriptions-item>
        <el-descriptions-item label="辨识部位">
          {{ data.info.IDENTIFICATION }}
        </el-descriptions-item>
        <el-descriptions-item label="存在风险">
          {{ data.info.RISK_DESCR }}
        </el-descriptions-item>
        <el-descriptions-item label="风险分级">
          {{ data.info.LEVEL }}
        </el-descriptions-item>
        <el-descriptions-item label="检查内容">
          {{ data.info.CHECK_CONTENT }}
        </el-descriptions-item>
      </template>
      <template v-if="data.info.SOURCE === '2' && listType === '2'">
        <el-descriptions-item label="检查类别">
          {{ data.info.CHECK_CATEGORY_NAME }}
        </el-descriptions-item>
        <el-descriptions-item label="检查项目">
          {{ data.info.CHECK_ITEM_NAME }}
        </el-descriptions-item>
        <el-descriptions-item label="检查内容">
          {{ data.info.CHECK_CONTENT }}
        </el-descriptions-item>
        <el-descriptions-item label="检查标准">
          {{ data.info.CHECK_STANDARD }}
        </el-descriptions-item>
        <el-descriptions-item label="参考依据">
          {{ data.info.REFERENCE_BASIS }}
        </el-descriptions-item>
      </template>
      <el-descriptions-item label="隐患级别">
        {{ data.info.HIDDENLEVELNAME }}
      </el-descriptions-item>
      <el-descriptions-item label="隐患类型">
        {{ data.info.HIDDENTYPE_NAME }}
      </el-descriptions-item>
      <el-descriptions-item label="隐患状态">
        <span v-if="data.info.STATE === '1'"> 未整改 </span>
        <span v-else-if="data.info.STATE === '3'"> 已整改 </span>
        <span v-else-if="data.info.STATE === '4'"> 已验收 </span>
        <span v-else-if="data.info.STATE === '-1'"> 已超期 </span>
        <span v-else-if="data.info.STATE === '10'"> 验收打回 </span>
        <span v-else-if="data.info.STATE === '100'"> 暂存 </span>
        <span v-else-if="data.info.STATE === '101'"> 待指派 </span>
        <span v-else-if="data.info.STATE === '102'"> 指派中 </span>
      </el-descriptions-item>
      <el-descriptions-item label="隐患描述">
        {{ data.info.HIDDENDESCR }}
      </el-descriptions-item>
      <el-descriptions-item label="隐患部位">
        {{ data.info.HIDDENPART }}
      </el-descriptions-item>
      <el-descriptions-item label="隐患发现部门">
        {{ data.info.HIDDENFINDDEPTNAME }}
      </el-descriptions-item>
      <el-descriptions-item label="发现人">
        {{ data.info.CREATORNAME }}
      </el-descriptions-item>
      <el-descriptions-item label="发现时间">
        {{ data.info.CREATTIME }}
      </el-descriptions-item>
      <el-descriptions-item label="整改类型">
        <span v-if="data.info.RECTIFICATIONTYPE === '1'"> 立即整改 </span>
        <span v-else-if="data.info.RECTIFICATIONTYPE === '2'"> 限期整改 </span>
      </el-descriptions-item>
      <el-descriptions-item
        label="整改期限"
        v-if="data.info.RECTIFICATIONTYPE === '2'"
      >
        {{ data.info.RECTIFICATIONDEADLINE }}
      </el-descriptions-item>
      <el-descriptions-item label="隐患类别" v-if="data.info.HIDDEN_CATEGORY">
        {{ data.info.HIDDEN_CATEGORY_NAME }}
      </el-descriptions-item>
      <el-descriptions-item label="隐患图片">
        <img
          v-viewer
          v-for="item in data.hImgs"
          :key="item.IMGFILES_ID"
          :src="VITE_FILE_URL + item.FILEPATH"
          alt=""
          width="100"
          height="100"
          class="ml-10"
        />
      </el-descriptions-item>
      <el-descriptions-item
        label="隐患视频"
        v-if="data.videoDialog.src"
        class-name="print_no_use"
        label-class-name="print_no_use"
      >
        <el-icon
          size="30px"
          @click="data.videoDialog.visible = true"
          style="cursor: pointer"
        >
          <video-play />
        </el-icon>
        <layout-video
          v-model:visible="data.videoDialog.visible"
          :src="data.videoDialog.src"
        />
      </el-descriptions-item>
    </el-descriptions>
    <template v-if="data.info.RECTIFYDESCR">
      <el-divider content-position="left">整改信息</el-divider>
      <el-descriptions :column="1" border>
        <el-descriptions-item label="整改描述">
          {{ data.info.RECTIFYDESCR }}
        </el-descriptions-item>
        <el-descriptions-item label="整改部门">
          {{ data.info.RECTIFICATIONDEPTNAME }}
        </el-descriptions-item>
        <el-descriptions-item label="整改人">
          {{ data.info.RECTIFICATIONORNAME }}
        </el-descriptions-item>
        <el-descriptions-item label="整改时间">
          {{ data.info.RECTIFICATIONTIME }}
        </el-descriptions-item>
        <el-descriptions-item label="整改后图片">
          <img
            v-viewer
            v-for="item in data.rImgs"
            :key="item.IMGFILES_ID"
            :src="VITE_FILE_URL + item.FILEPATH"
            alt=""
            width="100"
            height="100"
            class="ml-10"
          />
        </el-descriptions-item>
        <el-descriptions-item label="整改计划">
          {{ data.info.HAVEPLAN === "0" ? "无" : "" }}
          {{ data.info.HAVEPLAN === "1" ? "有" : "" }}
        </el-descriptions-item>
        <el-descriptions-item
          label="计划图片"
          v-if="data.info.HAVEPLAN === '1'"
        >
          <img
            v-viewer
            v-for="item in data.pImgs"
            :key="item.IMGFILES_ID"
            :src="VITE_FILE_URL + item.FILEPATH"
            alt=""
            width="100"
            height="100"
            class="ml-10"
          />
        </el-descriptions-item>
        <el-descriptions-item
          label="整改方案"
          v-if="data.info.RECTIFICATIONTYPE === '2'"
        >
          {{ data.info.HAVESCHEME === "0" ? "无" : "" }}
          {{ data.info.HAVESCHEME === "1" ? "有" : "" }}
        </el-descriptions-item>
        <template v-if="data.hs && data.info.HAVESCHEME === '1'">
          <el-descriptions-item label="排查日期">
            {{ data.hs.SCREENINGDATE }}
          </el-descriptions-item>
          <el-descriptions-item label="隐患清单">
            {{ data.hs.LISTNAME }}
          </el-descriptions-item>
          <el-descriptions-item label="治理标准要求">
            {{ data.hs.GOVERNSTANDARDS }}
          </el-descriptions-item>
          <el-descriptions-item label="治理方法">
            {{ data.hs.GOVERNMETHOD }}
          </el-descriptions-item>
          <el-descriptions-item label="经费和物资的落实">
            {{ data.hs.EXPENDITURE }}
          </el-descriptions-item>
          <el-descriptions-item label="负责治理人员">
            {{ data.hs.PRINCIPAL }}
          </el-descriptions-item>
          <el-descriptions-item label="工时安排">
            {{ data.hs.PROGRAMMING }}
          </el-descriptions-item>
          <el-descriptions-item label="时限要求">
            {{ data.hs.TIMELIMITFOR }}
          </el-descriptions-item>
          <el-descriptions-item label="工作要求">
            {{ data.hs.JOBREQUIREMENT }}
          </el-descriptions-item>
          <el-descriptions-item label="其他事项">
            {{ data.hs.OTHERBUSINESS }}
          </el-descriptions-item>
          <el-descriptions-item label="方案图片">
            <img
              v-viewer
              v-for="item in data.sImgs"
              :key="item.IMGFILES_ID"
              :src="VITE_FILE_URL + item.FILEPATH"
              alt=""
              width="100"
              height="100"
              class="ml-10"
            />
          </el-descriptions-item>
        </template>
      </el-descriptions>
    </template>
    <template v-if="data.checkList.length > 0">
      <el-divider content-position="left">验收信息</el-divider>
      <template v-for="(item, index) in data.checkList" :key="index">
        <el-descriptions :column="1" border class="mt-10">
          <el-descriptions-item label="验收描述">
            {{ item.CHECKDESCR }}
          </el-descriptions-item>
          <el-descriptions-item label="是否合格">
            <span v-if="item.STATUS === '1'"> 是 </span>
            <span v-else-if="item.STATUS === '0'"> 否 </span>
          </el-descriptions-item>
          <el-descriptions-item label="验收部门">
            {{ item.CHECKDEPTNAME }}
          </el-descriptions-item>
          <el-descriptions-item label="验收人">
            {{ item.CHECKORNAME }}
          </el-descriptions-item>
          <el-descriptions-item label="验收时间">
            {{ item.CHECK_TIME }}
          </el-descriptions-item>
          <el-descriptions-item label="验收图片">
            <img
              v-viewer
              v-for="item1 in item.cImgs"
              :key="item1.IMGFILES_ID"
              :src="VITE_FILE_URL + item1.FILEPATH"
              alt=""
              width="100"
              height="100"
              class="ml-10"
            />
          </el-descriptions-item>
        </el-descriptions>
      </template>
    </template>
  </div>
</template>

<script setup>
import { reactive, watchEffect } from "vue";
import { getFileSuffix } from "@/assets/js/utils.js";
import { VideoPlay } from "@element-plus/icons-vue";
import LayoutVideo from "@/components/video/index.vue";
import {
  getHiddenDangerView,
  getCustomHiddenDangerView,
} from "@/request/hazard_investigation.js";

defineOptions({
  name: "LayoutHiddenView",
});
const VITE_FILE_URL = import.meta.env.VITE_FILE_URL;
const props = defineProps({
  hiddenId: {
    type: String,
    required: true,
    default: "",
  },
  listType: {
    type: String,
    default: "1",
  },
});
const emits = defineEmits(["throw-data"]);
const data = reactive({
  info: {},
  hs: {},
  hImgs: [],
  rImgs: [],
  sImgs: [],
  pImgs: [],
  checkList: [],
  videoDialog: {
    src: "",
    visible: false,
  },
});
const fnGetData = async () => {
  const resData =
    props.listType === "2"
      ? await getCustomHiddenDangerView({ HIDDEN_ID: props.hiddenId })
      : await getHiddenDangerView({
          HIDDEN_ID: props.hiddenId,
        });
  data.info = resData.pd;
  data.hs = resData.hs;
  data.checkList = resData.checkList;
  data.hImgs = [];
  for (let i = 0; i < resData.hImgs.length; i++) {
    if (getFileSuffix(resData.hImgs[i].FILEPATH) === "mp4") {
      data.videoDialog.src = resData.hImgs[i].FILEPATH;
    } else {
      data.hImgs.push(resData.hImgs[i]);
    }
  }
  data.rImgs = resData.rImgs;
  data.sImgs = resData.sImgs;
  data.pImgs = resData.pImgs;
  emits("throw-data", data.info);
};
watchEffect(() => {
  if (props.hiddenId) fnGetData();
});
</script>

<style scoped lang="scss"></style>