<template>
    <el-dialog title="上报历史" width="80%" v-model="dialogVisible" @close="closed">
        <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">
            </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 == 'ecProjBuildStatusName'">
                    <dict-tag :options="D_BZ_SGZT" v-model="row.ecProjBuildStatusName" :tag="false" />
                </template>
            </el-table-column>
            <el-table-column align="center" label="操作" width="170" fixed="right">
                <template #default="{ row }">
                    <el-link type="primary" @click="handleDetail(row)">详情</el-link>
                </template>
            </el-table-column>
        </el-table>
    </el-dialog>
    <Dialog @close="detailCCVisible = false" :title="dialogTitle" :detail="detail" v-if="detailCCVisible"
        :query="props.params" :dict="props.dict" type="report" />
</template>

<script setup>
import { onMounted, ref, getCurrentInstance } from "vue"
import { postApi } from "@/api/tobAcco_api.js"
import Dialog from "./dialog.vue";
const { proxy } = getCurrentInstance()
const { D_BZ_SGZT } = proxy.$dict("D_BZ_SGZT")
const emit = defineEmits(["close"]);
const props = defineProps({
    params: Object,
    dict: Object
})
const dialogVisible = ref(true)
const dataTable = ref([])
const tableColumn = ref([
    { label: '企业名称', prop: 'baOrgName', fixed: 'left' },
    { label: '场所总数', prop: 'placeCount' },
    { label: '密闭设备', prop: 'mbsbCount' },
    { label: '地下有限空间', prop: 'dxyxkjCount' },
    { label: '地上有限空间', prop: 'dsyxkjCount' },
    { label: '最后一次上报时间', prop: 'updateTime', fixed: 'right' },
])
const tableLoading = ref(false)
const detailVisible = ref(false)
const detailCCVisible = ref(false)
const dialogTitle = ref("")
const detail = ref(null)
const detailTable = ref([])
const detailColumn = ref([
    { label: "企业名称", prop: "baOrgName" },
    { label: "场所（设备）名称", prop: "placeEquipmentName" },
    { label: "有限空间类别", prop: "categoryName" },
    { label: "有限空间数量", prop: "lsQty" },
    { label: "有限空间危害因素", prop: "hazardFactor" },
    { label: "有限空间可能造成的事故类别", prop: "accidentCategoryName" }
])
const detailLoading = ref(false)
onMounted(() => {
    getDataList()
})
const getDataList = () => {
    dataTable.value = []
    tableLoading.value = true

    postApi(props.params, "/mosty-jcgl/data/spaceOpsSite/queryReportingHistoryStat").then(res => {
        if (res) {
            dataTable.value = res
            tableLoading.value = false
        }
    })
}
const getDetailList = data => {
    detailTable.value = []
    detailLoading.value = true
    let _data = props.params
    _data.sbcs = data.sbcs
    _data.orgCode = data.orgCode
    postApi(_data, "/mosty-jcgl/data/spaceOpsSite/queryReportingHistoryStatLogDetails").then(res => {
        if (res) {
            detailTable.value = res
            detailLoading.value = false
        }
    })
}
const onDetail = e => {
    detailVisible.value = true
    getDetailList(e)
}
const handleDetail = row => {
    detail.value = row
    dialogTitle.value = `有限空间作业场所详情`
    detailCCVisible.value = true
}
const closed = () => {
    emit("close");
};
</script>

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