<template>
  <layout-card>
    <div id="printContent">
      <el-divider content-position="left">隐患台账</el-divider>
      <div class="print_no_use">
        <layout-table :data="list" :show-pagination="false">
          <el-table-column type="index" label="序号" width="60" />
          <el-table-column prop="CREATTIME" label="排查时间" width="90" />
          <el-table-column prop="CREATORNAME" label="检查人" width="80" />
          <el-table-column
            prop="HIDDENFINDDEPTNAME"
            label="责任部门"
            width="90"
          />
          <el-table-column prop="HIDDENDESCR" label="事故隐患" width="90" />
          <el-table-column prop="HIDDENLEVELNAME" label="隐患等级" width="90" />
          <el-table-column prop="RECTIFYDESCR" label="治理措施" />
          <el-table-column label="完成时限" width="90">
            <template v-slot="{ row }">
              {{
                row.RECTIFICATIONTYPE === "1"
                  ? dayjs(row.CREATTIME).format("YYYY-MM-DD")
                  : row.RECTIFICATIONDEADLINE
              }}
            </template>
          </el-table-column>
          <el-table-column
            prop="RECTIFICATIONORNAME"
            label="整改责任人"
            width="110"
          />
          <el-table-column label="验收人员" width="90">
            <template v-slot="{ row }">
              {{ row.RECTIFICATIONTYPE === "1" ? "立即整改" : row.CHECKNAME }}
            </template>
          </el-table-column>
          <el-table-column label="验收时间" width="90">
            <template v-slot="{ row }">
              {{
                row.RECTIFICATIONTYPE === "1"
                  ? dayjs(row.CREATTIME).format("YYYY-MM-DD")
                  : row.CHECK_TIME
              }}
            </template>
          </el-table-column>
          <el-table-column label="验收结果" width="90">
            <template v-slot="{ row }">
              {{ row.STATE === "4" ? "验收通过" : "" }}
            </template>
          </el-table-column>
        </layout-table>
      </div>
      <table class="print_use">
        <thead>
          <tr>
            <th width="60">序号</th>
            <th width="90">排查时间</th>
            <th width="80">检查人</th>
            <th width="90">责任部门</th>
            <th width="90">事故隐患</th>
            <th width="90">隐患等级</th>
            <th>治理措施</th>
            <th width="90">完成时限</th>
            <th width="110">整改责任人</th>
            <th width="90">验收人员</th>
            <th width="90">验收时间</th>
            <th width="90">验收结果</th>
          </tr>
        </thead>
        <tbody>
          <tr v-for="(item, index) in list" :key="index">
            <td>{{ index + 1 }}</td>
            <td>{{ item.CREATTIME }}</td>
            <td>{{ item.CREATORNAME }}</td>
            <td>{{ item.HIDDENFINDDEPTNAME }}</td>
            <td>{{ item.HIDDENDESCR }}</td>
            <td>{{ item.HIDDENLEVELNAME }}</td>
            <td>{{ item.RECTIFYDESCR }}</td>
            <td>
              {{
                item.RECTIFICATIONTYPE === "1"
                  ? dayjs(item.CREATTIME).format("YYYY-MM-DD")
                  : item.RECTIFICATIONDEADLINE
              }}
            </td>
            <td>{{ item.RECTIFICATIONORNAME }}</td>
            <td>
              {{ item.RECTIFICATIONTYPE === "1" ? "立即整改" : item.CHECKNAME }}
            </td>
            <td>
              {{
                item.RECTIFICATIONTYPE === "1"
                  ? dayjs(item.CREATTIME).format("YYYY-MM-DD")
                  : item.CHECK_TIME
              }}
            </td>
            <td>{{ item.STATE === "4" ? "验收通过" : "" }}</td>
          </tr>
        </tbody>
      </table>
    </div>
    <div class="tc mt-10">
      <el-button type="primary" v-print="'#printContent'">打印</el-button>
    </div>
    <div v-html="PRINT_STYLE" />
  </layout-card>
</template>

<script setup>
import useListData from "@/assets/js/useListData.js";
import { getHiddenDangerPrintList } from "@/request/hidden_danger_government.js";
import { useRoute } from "vue-router";
import dayjs from "dayjs";
import { PRINT_STYLE } from "@/assets/js/constant.js";

const route = useRoute();
const { DATA_IDS } = route.query;
const { list } = useListData(getHiddenDangerPrintList, {
  otherParams: { ids: DATA_IDS },
  usePagination: false,
});
</script>

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