<template>
  <div class="app-container">
    <el-card shadow="never">
      <template #header>
        <div class="card-header">
          <span>隐患基本信息</span>
          <div>
            <el-button type="success" plain icon="Check" @click="handleVerify" v-hasPermi="['hidd:objhidd:edit']">隐患核实</el-button>
            <el-button type="warning" plain icon="Finished" @click="handleAccept" v-hasPermi="['hidd:objhidd:edit']">整改验收</el-button>
            <el-button type="danger" plain icon="CircleCheck" @click="handleCancel" v-hasPermi="['hidd:objhidd:edit']">隐患销号</el-button>
            <el-button type="primary" plain icon="ArrowLeft" @click="goBack">返回列表</el-button>
          </div>
        </div>
      </template>
      <el-descriptions :column="2" border>
        <el-descriptions-item label="隐患名称">{{ form.hiddName }}</el-descriptions-item>
        <el-descriptions-item label="隐患等级">
          <dict-tag :options="hidd_grad" :value="form.hiddGrad" />
        </el-descriptions-item>
        <el-descriptions-item label="隐患类别">
          <dict-tag :options="hidd_clas" :value="form.hiddClas" />
        </el-descriptions-item>
        <el-descriptions-item label="隐患来源">
          <dict-tag :options="hidd_sour" :value="form.hiddSour" />
        </el-descriptions-item>
        <el-descriptions-item label="隐患状态">
          <dict-tag :options="hidd_stat" :value="form.hiddStat" />
        </el-descriptions-item>
        <el-descriptions-item label="涉及部位">{{ form.proPart }}</el-descriptions-item>
        <el-descriptions-item label="部位经度">{{ form.partLong }}</el-descriptions-item>
        <el-descriptions-item label="部位纬度">{{ form.partLat }}</el-descriptions-item>
        <el-descriptions-item label="采集时间" :span="2">{{ form.collTime }}</el-descriptions-item>
        <el-descriptions-item label="隐患描述" :span="2">{{ form.otlcolQiffFnvu }}</el-descriptions-item>
        <el-descriptions-item label="备注" :span="2">{{ form.note }}</el-descriptions-item>
      </el-descriptions>
    </el-card>

    <el-card shadow="never" class="mt10">
      <template #header>
        <div class="card-header">
          <span>隐患排查信息</span>
          <el-button type="primary" plain icon="Plus" @click="handleAddInve" v-hasPermi="['hidd:objhidd:edit']">新增排查</el-button>
        </div>
      </template>
      <el-table v-loading="inveLoading" :data="inveList">
        <el-table-column label="排查单位" align="center" prop="inspOrgGuid" />
        <el-table-column label="排查日期" align="center" prop="inspDate" width="180" />
        <el-table-column label="排查负责人" align="center" prop="inspLeader" />
        <el-table-column label="负责人职务" align="center" prop="inspLeaderPost" />
        <el-table-column label="排查成员" align="center" prop="inspMem" :show-overflow-tooltip="true" />
        <el-table-column label="隐患内容" align="center" prop="hiddContent" :show-overflow-tooltip="true" />
      </el-table>
    </el-card>

    <el-card shadow="never" class="mt10">
      <template #header>
        <div class="card-header">
          <span>整改落实信息</span>
          <el-button type="primary" plain icon="Plus" @click="handleAddRectImpl" v-hasPermi="['hidd:objhidd:edit']">新增整改</el-button>
        </div>
      </template>
      <el-table v-loading="rectImplLoading" :data="rectImplList">
        <el-table-column label="整改责任单位" align="center" prop="goverRespWiunGuid" />
        <el-table-column label="整改责任人" align="center" prop="rectLegPers" />
        <el-table-column label="联系电话" align="center" prop="rectPersOffiTel" />
        <el-table-column label="要求完成日期" align="center" prop="requCompDate" width="180" />
        <el-table-column label="整改资金" align="center" prop="acimpGoverFund" />
        <el-table-column label="整改措施" align="center" prop="corrMeas" :show-overflow-tooltip="true" />
      </el-table>
    </el-card>

    <el-card shadow="never" class="mt10">
      <template #header>
        <div class="card-header">
          <span>整改验收信息</span>
        </div>
      </template>
      <el-table v-loading="rectAcceLoading" :data="rectAcceList">
        <el-table-column label="验收负责人" align="center" prop="accepLegPers" />
        <el-table-column label="验收人" align="center" prop="accepPers" />
        <el-table-column label="验收日期" align="center" prop="accepDate" width="180" />
        <el-table-column label="验收意见" align="center" prop="accepOpin" :show-overflow-tooltip="true" />
        <el-table-column label="销号状态" align="center" prop="cancelState">
          <template #default="scope">
            <dict-tag :options="sys_yes_no" :value="scope.row.cancelState" />
          </template>
        </el-table-column>
      </el-table>
    </el-card>

    <el-card shadow="never" class="mt10">
      <template #header>
        <div class="card-header">
          <span>整改进展信息</span>
          <div>
            <el-button type="primary" plain icon="List" @click="handleViewRectProg" v-hasPermi="['hidd:objhidd:edit']">查看全部</el-button>
            <el-button type="primary" plain icon="Plus" @click="handleAddRectProg" v-hasPermi="['hidd:objhidd:edit']">新增进展</el-button>
          </div>
        </div>
      </template>
      <el-table v-loading="rectProgLoading" :data="rectProgList">
        <el-table-column label="序号" type="index" width="60" align="center" />
        <el-table-column label="整改进展" align="center" prop="rectProg" :show-overflow-tooltip="true" />
        <el-table-column label="记录人" align="center" prop="recPers" />
        <el-table-column label="记录时间" align="center" prop="collTime" width="180" />
      </el-table>
    </el-card>

    <el-card shadow="never" class="mt10">
      <template #header>
        <div class="card-header">
          <span>重大隐患核实信息</span>
        </div>
      </template>
      <el-table v-loading="majVeriLoading" :data="majVeriList">
        <el-table-column label="核实单位" align="center" prop="veriOrgGuid" />
        <el-table-column label="核实日期" align="center" prop="veriDate" width="180" />
        <el-table-column label="核实人" align="center" prop="veriPers" />
        <el-table-column label="核实结果" align="center" prop="veriResu">
          <template #default="scope">
            <dict-tag :options="veri_resu" :value="scope.row.veriResu" />
          </template>
        </el-table-column>
        <el-table-column label="核实意见" align="center" prop="veriAdvi" :show-overflow-tooltip="true" />
      </el-table>
    </el-card>

    <el-card shadow="never" class="mt10">
      <template #header>
        <div class="card-header">
          <span>重大隐患督办信息</span>
        </div>
      </template>
      <el-table v-loading="majHiddSupLoading" :data="majHiddSupList">
        <el-table-column label="是否挂牌" align="center" prop="isList">
          <template #default="scope">
            <dict-tag :options="sys_yes_no" :value="scope.row.isList" />
          </template>
        </el-table-column>
        <el-table-column label="整改期限" align="center" prop="rectPeri" />
        <el-table-column label="督办级别" align="center" prop="supLareId" />
        <el-table-column label="督办日期" align="center" prop="supDate" width="180" />
        <el-table-column label="督办负责人" align="center" prop="supLegPers" />
        <el-table-column label="督办意见" align="center" prop="supOpin" :show-overflow-tooltip="true" />
      </el-table>
    </el-card>

    <el-card shadow="never" class="mt10">
      <template #header>
        <div class="card-header">
          <span>隐患记录上报</span>
        </div>
      </template>
      <el-table v-loading="recRepLoading" :data="recRepList">
        <el-table-column label="上报单位" align="center" prop="repOrgGuid" />
        <el-table-column label="上报动作" align="center" prop="repAct" />
        <el-table-column label="退回说明" align="center" prop="returnDesc" :show-overflow-tooltip="true" />
      </el-table>
    </el-card>

    <!-- 隐患核实对话框 -->
    <el-dialog title="隐患核实" v-model="verifyOpen" width="600px" append-to-body>
      <el-form :model="verifyForm" :rules="verifyRules" ref="verifyRef" label-width="100px">
        <el-row>
          <el-col :span="24">
            <el-form-item label="核实结果" prop="veriResu">
              <el-select v-model="verifyForm.veriResu" placeholder="请选择核实结果">
                <el-option v-for="dict in veri_resu" :key="dict.value" :label="dict.label" :value="dict.value"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label="核实意见" prop="veriAdvi">
              <el-input v-model="verifyForm.veriAdvi" type="textarea" placeholder="请输入核实意见" />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <el-button type="primary" @click="submitVerify">确 定</el-button>
          <el-button @click="verifyOpen = false">取 消</el-button>
        </div>
      </template>
    </el-dialog>

    <!-- 整改验收对话框 -->
    <el-dialog title="整改验收" v-model="acceptOpen" width="600px" append-to-body>
      <el-form :model="acceptForm" :rules="acceptRules" ref="acceptRef" label-width="100px">
        <el-row>
          <el-col :span="12">
            <el-form-item label="验收负责人" prop="accepLegPers">
              <el-input v-model="acceptForm.accepLegPers" placeholder="请输入验收负责人" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="验收人" prop="accepPers">
              <el-input v-model="acceptForm.accepPers" placeholder="请输入验收人" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="验收日期" prop="accepDate">
              <el-date-picker v-model="acceptForm.accepDate" type="date" placeholder="请选择验收日期" value-format="YYYY-MM-DD" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label="验收意见" prop="accepOpin">
              <el-input v-model="acceptForm.accepOpin" type="textarea" placeholder="请输入验收意见" />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <el-button type="primary" @click="submitAccept">确 定</el-button>
          <el-button @click="acceptOpen = false">取 消</el-button>
        </div>
      </template>
    </el-dialog>

    <!-- 隐患销号对话框 -->
    <el-dialog title="隐患销号" v-model="cancelOpen" width="600px" append-to-body>
      <el-form :model="cancelForm" :rules="cancelRules" ref="cancelRef" label-width="100px">
        <el-row>
          <el-col :span="24">
            <el-form-item label="销号意见" prop="cancelOpin">
              <el-input v-model="cancelForm.cancelOpin" type="textarea" placeholder="请输入销号意见" />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <el-button type="primary" @click="submitCancel">确 定</el-button>
          <el-button @click="cancelOpen = false">取 消</el-button>
        </div>
      </template>
    </el-dialog>
  </div>
</template>

<script setup name="ObjHiddDetail">
import { getObjHidd, updateObjHidd } from "@/api/slaj/hidd"
import { listBisHiddInve, addBisHiddInve } from "@/api/slaj/hidd"
import { listBisHiddRectImpl, addBisHiddRectImpl } from "@/api/slaj/hidd"
import { listBisHiddRectAcce, addBisHiddRectAcce } from "@/api/slaj/hidd"
import { listBisHiddRectProg, addBisHiddRectProg } from "@/api/slaj/hidd"
import { listBisHiddMajVeri, addBisHiddMajVeri } from "@/api/slaj/hidd"
import { listBisMajHiddSup, addBisMajHiddSup } from "@/api/slaj/hidd"
import { listBisHiddRecRep } from "@/api/slaj/hidd"

const { proxy } = getCurrentInstance()
const { hidd_grad, hidd_stat, hidd_sour, hidd_clas, sys_yes_no, veri_resu } = proxy.useDict("hidd_grad", "hidd_stat", "hidd_sour", "hidd_clas", "sys_yes_no", "veri_resu")

const route = useRoute()
const form = ref({})
const inveList = ref([])
const rectImplList = ref([])
const rectAcceList = ref([])
const rectProgList = ref([])
const majVeriList = ref([])
const majHiddSupList = ref([])
const recRepList = ref([])

const inveLoading = ref(false)
const rectImplLoading = ref(false)
const rectAcceLoading = ref(false)
const rectProgLoading = ref(false)
const majVeriLoading = ref(false)
const majHiddSupLoading = ref(false)
const recRepLoading = ref(false)

// 核实对话框
const verifyOpen = ref(false)
const verifyForm = ref({})
const verifyRules = {
  veriResu: [{ required: true, message: "核实结果不能为空", trigger: "change" }]
}

// 验收对话框
const acceptOpen = ref(false)
const acceptForm = ref({})
const acceptRules = {
  accepLegPers: [{ required: true, message: "验收负责人不能为空", trigger: "blur" }],
  accepPers: [{ required: true, message: "验收人不能为空", trigger: "blur" }],
  accepDate: [{ required: true, message: "验收日期不能为空", trigger: "change" }]
}

// 销号对话框
const cancelOpen = ref(false)
const cancelForm = ref({})
const cancelRules = {
  cancelOpin: [{ required: true, message: "销号意见不能为空", trigger: "blur" }]
}

/** 查询隐患详细 */
function getInfo() {
  const guid = route.query.guid
  if (guid) {
    getObjHidd(guid).then(response => {
      form.value = response.data
      getInveList()
      getRectImplList()
      getRectAcceList()
      getRectProgList()
      getMajVeriList()
      getMajHiddSupList()
      getRecRepList()
    })
  }
}

/** 查询隐患排查信息 */
function getInveList() {
  inveLoading.value = true
  listBisHiddInve({ hiddGuid: form.value.guid }).then(res => {
    inveLoading.value = false
    inveList.value = res.rows
  })
}

/** 查询整改落实信息 */
function getRectImplList() {
  rectImplLoading.value = true
  listBisHiddRectImpl({ hiddGuid: form.value.guid }).then(res => {
    rectImplLoading.value = false
    rectImplList.value = res.rows
  })
}

/** 查询整改验收信息 */
function getRectAcceList() {
  rectAcceLoading.value = true
  listBisHiddRectAcce({ hiddGuid: form.value.guid }).then(res => {
    rectAcceLoading.value = false
    rectAcceList.value = res.rows
  })
}

/** 查询整改进展信息 */
function getRectProgList() {
  rectProgLoading.value = true
  listBisHiddRectProg({ hiddGuid: form.value.guid }).then(res => {
    rectProgLoading.value = false
    rectProgList.value = res.rows
  })
}

/** 查询重大隐患核实信息 */
function getMajVeriList() {
  majVeriLoading.value = true
  listBisHiddMajVeri({ hiddGuid: form.value.guid }).then(res => {
    majVeriLoading.value = false
    majVeriList.value = res.rows
  })
}

/** 查询重大隐患督办信息 */
function getMajHiddSupList() {
  majHiddSupLoading.value = true
  listBisMajHiddSup({ hiddGuid: form.value.guid }).then(res => {
    majHiddSupLoading.value = false
    majHiddSupList.value = res.rows
  })
}

/** 查询隐患记录上报 */
function getRecRepList() {
  recRepLoading.value = true
  listBisHiddRecRep({ hiddGuid: form.value.guid }).then(res => {
    recRepLoading.value = false
    recRepList.value = res.rows
  })
}

/** 隐患核实按钮 */
function handleVerify() {
  proxy.$router.push({ path: '/slaj/hidd/verify', query: { guid: form.value.guid } })
}

/** 提交核实 */
function submitVerify() {
  proxy.$refs["verifyRef"].validate(valid => {
    if (valid) {
      addBisHiddMajVeri(verifyForm.value).then(response => {
        proxy.$modal.msgSuccess("核实成功")
        verifyOpen.value = false
        getMajVeriList()
      })
    }
  })
}

/** 整改验收按钮 */
function handleAccept() {
  acceptForm.value = {
    hiddGuid: form.value.guid,
    accepLegPers: undefined,
    accepPers: undefined,
    accepDate: undefined,
    accepOpin: undefined
  }
  acceptOpen.value = true
}

/** 提交验收 */
function submitAccept() {
  proxy.$refs["acceptRef"].validate(valid => {
    if (valid) {
      addBisHiddRectAcce(acceptForm.value).then(response => {
        proxy.$modal.msgSuccess("验收成功")
        acceptOpen.value = false
        getRectAcceList()
      })
    }
  })
}

/** 隐患销号按钮 */
function handleCancel() {
  cancelForm.value = {
    guid: form.value.guid,
    cancelOpin: undefined
  }
  cancelOpen.value = true
}

/** 提交销号 */
function submitCancel() {
  proxy.$refs["cancelRef"].validate(valid => {
    if (valid) {
      const data = {
        guid: form.value.guid,
        hiddStat: '2',
        note: form.value.cancelOpin
      }
      updateObjHidd(data).then(response => {
        proxy.$modal.msgSuccess("销号成功")
        cancelOpen.value = false
        getInfo()
      })
    }
  })
}

/** 新增排查 */
function handleAddInve() {
  proxy.$router.push({ path: '/slaj/hidd/inveAdd', query: { hiddGuid: form.value.guid } })
}

/** 新增整改 */
function handleAddRectImpl() {
  proxy.$router.push({ path: '/slaj/hidd/rectImplAdd', query: { hiddGuid: form.value.guid } })
}

/** 新增进展 */
function handleAddRectProg() {
  proxy.$router.push({ path: '/slaj/hidd/rectProgAdd', query: { hiddGuid: form.value.guid } })
}

/** 查看全部进展 */
function handleViewRectProg() {
  proxy.$router.push({ path: '/slaj/hidd/rectProgList', query: { hiddGuid: form.value.guid } })
}

/** 返回列表 */
function goBack() {
  proxy.$router.push({ path: '/slaj/hidd/index' })
}

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

<style scoped>
.card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.mt10 {
  margin-top: 10px;
}
</style>
