<template>
  <el-dialog title="上报历史" width="80%" v-model="dialogVisible">
    <el-table border :data="dataTable" style="width: 100%; margin-bottom: 10px" v-loading="tableLoading"
      :header-cell-style="{ background: '#F6F6F6' }" height="70vh">
      <el-table-column :prop="item.prop" :label="item.label" v-for="(item, i) in tableColumn" :key="i">
        <template #default="{ row }" v-if="item.label === '仓库总数量(个)'">
          {{ row.danCCKNum * 1 + row.duoCCKNum * 1 + row.luTHCNum * 1 + row.dongKNum * 1 }}
        </template>
      </el-table-column>
      <el-table-column align="center" label="操作" width="170" fixed="right">
        <template #default="{ row }">
          <el-link type="primary" @click="onDetail(row)">详情</el-link>
        </template>
      </el-table-column>
    </el-table>
  </el-dialog>

  <el-dialog title="上报历史" width="90%" v-model="detailVisible">
    <el-table border :data="detailTable" style="width: 100%; margin-bottom: 10px" v-loading="detailLoading"
      :header-cell-style="{ background: '#F6F6F6' }" height="70vh">
      <el-table-column :prop="item.prop" :label="item.label" v-for="(item, i) in detailColumn" :key="i">
        <template #default="{ row }" v-if="item.prop == 'conHydrantSysFlag'">
          <!-- <dict-tag :options="D_BZ_SF" v-for="it in row.boilerQty" :key="it" :value="it" :tag="false" /> -->
          {{ row.conHydrantSysFlag === "1" ? "是" : "否" }}
        </template>
        <template #default="{ row }" v-else-if="item.prop == 'conAlarmSysFlag'">
          {{ row.conAlarmSysFlag === "1" ? "是" : "否" }}
        </template>
        <template #default="{ row }" v-else-if="item.prop == 'conOutfireSysFlag'">
          {{ row.conOutfireSysFlag === "1" ? "是" : "否" }}
        </template>
      </el-table-column>
      <el-table-column label="操作" width="140" fixed="right">
        <template #default="{ row }">
          <el-link type="primary" @click="onView(row)">查看</el-link>
        </template>
      </el-table-column>
    </el-table>
  </el-dialog>

  <Detailcc @close="detailClose" :title="dialogTitle" v-if="detailVisible2" :detail="detail"
    :sbsslist="{ D_BZ_JYCCXS, D_BZ_JYCKXZ, D_BZ_SF }" :query="props.params" />
</template>

<script setup>
import { onMounted, ref, reactive, getCurrentInstance, nextTick, watch } from "vue"
import { getApi, postApi } from "@/api/tobAcco_api.js"
import * as MOSTY from "@/components/MyComponents/index"
import { getItem } from "@/utils/storage"
import { ElMessage } from "element-plus"
import Detailcc from "./Detailcc.vue"

const { proxy } = getCurrentInstance()
const { D_BZ_JYCCXS, D_BZ_JYCKXZ, D_BZ_SF } = proxy.$dict("D_BZ_JYCCXS", "D_BZ_JYCKXZ", "D_BZ_SF")
const props = defineProps({
  params: Object
})
const dialogVisible = ref(false)
const dataTable = ref([])
const tableColumn = ref([
  { label: "企业名称", prop: "orgName" },
  { label: "上报次数", prop: "sbcs" },
  { label: "上报时间", prop: "updateTime" },
  { label: "仓库总数量(个)", prop: "" },
  { label: "单层仓库(个)", prop: "danCCKNum" },
  { label: "多层仓库(个)", prop: "duoCCKNum" },
  { label: "露天货场(个)", prop: "luTHCNum" },
  { label: "洞库(个)", prop: "dongKNum" }
  // { label: "上报时间", prop: "gxTime" }
])
const tableLoading = ref(false)
const detailVisible = ref(false)
const detailVisible2 = ref(false)
const detail = ref(null)
const dialogTitle = ref("")
const detailTable = ref([])
const detailColumn = ref([
  { label: "企业名称", prop: "orgName" },
  { label: "物流节点名称", prop: "cgtLogtNodeName" },
  { label: "仓储形式", prop: "cgtStoreFormName" },
  { label: "仓储性质", prop: "cgtStorehousePropertyName" },
  { label: "火灾危险性等级", prop: "fireHazardClassifiesName" },
  { label: "占地面积", prop: "storehouseUseArea" },
  { label: "库容量", prop: "storehouseInventoryCapacity" },
  { label: "仓储物资类别", prop: "storehouseMeterialCatName" },
  { label: "仓库名称", prop: "storehouseName" },
  { label: "建筑结构", prop: "structureName" },
  { label: "建筑面积", prop: "totalBuildingArea" },
  { label: "是否配置消火栓系统", prop: "conHydrantSysFlag" },
  { label: "是否配置火灾自动报警系统", prop: "conAlarmSysFlag" },
  { label: "是否配置自动灭火系统", prop: "conOutfireSysFlag" }
])
const detailLoading = ref(false)
defineExpose({ dialogVisible })

const getDataList = () => {
  dataTable.value = []
  tableLoading.value = true

  postApi(props.params, "/mosty-jcgl/data/StorageEscalationStat/queryReportingHistoryStat").then(res => {
    if (res) {
      dataTable.value = res
      tableLoading.value = false
    }
  })
}
const getDetailList = orgCode => {
  detailTable.value = []
  detailLoading.value = true
  props.params.orgCode = orgCode
  postApi(props.params, "/mosty-jcgl/data/StorageEscalationStat/queryReportingHistoryStatLogDetails").then(res => {
    if (res) {
      detailTable.value = res
      detailLoading.value = false
    }
  })
}
const onDetail = e => {
  detailVisible.value = true
  getDetailList(e.orgCode)
}
const onView = data => {
  detail.value = data
  dialogTitle.value = `仓储设备设施详情`
  detailVisible2.value = true
}
const detailClose = val => {
  detailVisible2.value = false
}

watch(
  () => dialogVisible.value,
  (n, o) => {
    if (n) {
      getDataList()
    }
  },
  { deep: true }
  // { immediate: true, deep: true }
)
</script>

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