<template>
  <div class="app-container">
    <el-card shadow="never">
      <template #header>
        <div class="card-header">
          <span>督办详情</span>
          <el-button plain icon="ArrowLeft" @click="goBack">返回</el-button>
        </div>
      </template>

      <div class="section-title">隐患信息</div>
      <el-descriptions :column="2" border>
        <el-descriptions-item label="隐患名称" :span="2">{{ form.hiddName }}</el-descriptions-item>
        <el-descriptions-item label="隐患级别">
          <dict-tag :options="hidd_grad" :value="form.hiddGrad" />
        </el-descriptions-item>
        <el-descriptions-item label="隐患部位">{{ form.proPart }}</el-descriptions-item>
        <el-descriptions-item label="所属工程">{{ form.engName }}</el-descriptions-item>
        <el-descriptions-item label="督办文号">{{ form.supLareId }}</el-descriptions-item>
        <el-descriptions-item label="督办日期">{{ form.supDate }}</el-descriptions-item>
        <el-descriptions-item label="督办单位">{{ form.supWiunName }}</el-descriptions-item>
        <el-descriptions-item label="整改期限">{{ form.rectPeri }}</el-descriptions-item>
        <el-descriptions-item label="是否挂牌督办">
          {{ form.isList === '1' ? '是' : '否' }}
        </el-descriptions-item>
        <el-descriptions-item label="督办意见" :span="2">{{ form.supOpin }}</el-descriptions-item>
        <el-descriptions-item label="督办附件" :span="2">
          <div v-if="form.medGuid">
            <el-link type="primary" :href="`/common/download?fileName=${form.medTitl}&delete=true`">
              <el-icon><Download /></el-icon>
              {{ form.medTitl || '附件' }}
            </el-link>
          </div>
          <span v-else style="color: #909399">暂无附件</span>
        </el-descriptions-item>
      </el-descriptions>

      <div class="section-title">销号信息</div>
      <el-descriptions :column="2" border>
        <el-descriptions-item label="治理完成日期">{{ form.requCompDate }}</el-descriptions-item>
        <el-descriptions-item label="验收时间">{{ form.accepDate }}</el-descriptions-item>
        <el-descriptions-item label="验收意见" :span="2">{{ form.accepOpin }}</el-descriptions-item>
        <el-descriptions-item label="备注" :span="2">{{ form.note }}</el-descriptions-item>
      </el-descriptions>
    </el-card>
  </div>
</template>

<script setup name="HiddSupDetail">
import { getBisMajHiddSup } from "@/api/slaj/hidd"
import { listBisHiddRectAcce } from "@/api/slaj/hidd"

const { proxy } = getCurrentInstance()
const route = useRoute()
const router = useRouter()
const { hidd_grad, hidd_stat } = proxy.useDict("hidd_grad", "hidd_stat")

const form = ref({})

function getInfo() {
  const guid = route.query.guid
  if (guid) {
    getBisMajHiddSup(guid).then(response => {
      const supData = response.data
      const hiddGuid = supData.hiddGuid
      
      if (hiddGuid) {
        listBisHiddRectAcce({ hiddGuid: hiddGuid }).then(acceRes => {
          const acceData = (acceRes.rows && acceRes.rows.length > 0) ? acceRes.rows[0] : {}
          form.value = { ...supData, ...acceData }
        }).catch(() => {
          form.value = supData
        })
      } else {
        form.value = supData
      }
    })
  }
}

function goBack() {
  router.push({ path: '/slaj/hidd/supList' })
}

onMounted(() => {
  getInfo()
})
</script>

<style scoped>
.card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.section-title {
  font-size: 14px;
  font-weight: bold;
  margin: 16px 0 12px 0;
  padding-left: 8px;
  border-left: 3px solid #409eff;
}
</style>
