<template>
    <div>
        <el-dialog :title="'上报历史'" width="90%" v-model="visible" @close="closed">
            <div class="treeBox2 ww100">
                <el-table ref="multipleTableRef" v-loading="loading" :row-key="keyid" :data="pageData.tableData" border
                    style="width: 100%" height="50vh">
                    <el-table-column label="企业名称" prop="baOrgName" fixed width="200" />
                    <el-table-column label="特种作业人员（按照国家目录）">
                        <el-table-column label="高压电工（人）" prop="hpElectricianQty"></el-table-column>
                        <el-table-column label="低压电工（人）" prop="lpElectricianQty"></el-table-column>
                        <el-table-column label="制冷与空调工（人）" prop="reAcwQty"></el-table-column>
                        <el-table-column label="焊接与热切割工（人）" prop="weHcWorkerQty"></el-table-column>
                        <el-table-column label="高处作业（人）" prop="highAlWorkerQty"></el-table-column>
                    </el-table-column>
                    <el-table-column label="特种设备管理及操作人员（按照国家目录）">
                        <el-table-column label="特种设备安全管理员（人）" prop="safetyManagementQty"></el-table-column>
                        <el-table-column label="工业锅炉司炉（人）" prop="ibFiremanQty"></el-table-column>
                        <el-table-column label="锅炉水处理（人）" prop="waterTreatmentQty"></el-table-column>
                        <el-table-column label="起重司机（人）" prop="craneDriverQty"></el-table-column>
                        <el-table-column label="压力容器操作工（人）" prop="pvOperatorQty"></el-table-column>
                        <el-table-column label="叉车司机（人）" prop="forkliftDriverQty"></el-table-column>
                        <el-table-column label="观光车司机（人）" prop="sbDriverQty"></el-table-column>
                        <el-table-column label="特种设备焊接作业（人）" prop="weldingOperationsQty"></el-table-column>
                    </el-table-column>
                    <el-table-column label="消防控制室值班和操作持证人员（人）">
                        <el-table-column label="五级/初级工人数（人）" prop="juniorWorkerQty"></el-table-column>
                        <el-table-column label="四级/中级工人数（人）" prop="intermediateWorkerQty"></el-table-column>
                    </el-table-column>
                    <el-table-column prop="sbcs" label="上报次数" width="110" fixed="right" />
                    <el-table-column prop="gxTime" label="上报时间" width="150" fixed="right" />
                    <el-table-column align="center" label="操作" width="170" fixed="right">
                        <template #default="{ row }">
                            <el-link type="primary" @click="handleClickDetail(row)">详情</el-link>
                        </template>
                    </el-table-column>

                </el-table>
            </div>
        </el-dialog>
        <Dialog v-if="dialogVisibles" :title="'查看上报历史'" :isEdit="false" :id="rowId" @close="onSave" />
    </div>
</template>
<script setup>
// 引入
import { ref, reactive, onMounted } from "vue";
import Dialog from './Dialog.vue'
import { postApi, getApi } from "@/api/tobAcco_api.js";
const pageData = reactive({
    tableData: [],
    orgCodes: [],
    params: {},
    currItem: {}
});
const rowId = ref(null);
const loading = ref(false);
const dialogVisibles = ref(false);
const multipleTableRef = ref(null);
const orgCode = ref(false)
const visible = ref(true)
const props = defineProps({
    chooseUserVisible: {
        type: Boolean,
        default: true,
    },

    currCode: {
        type: String,
        default: ''
    },


    params: {
        type: Object,
        default: () => { }
    },
    isReport: {
        type: Boolean,
    },
    currTotal: Number,
});

function onSave(val) {
    dialogVisibles.value = false
    if (val) {
        getListData();
    }
}
// 详情
const handleClickDetail = (row) => {
    rowId.value = row.sourceId;
    dialogVisibles.value = true;
}
const emits = defineEmits(["close"]);
const closed = () => {
    emits("close");
};
onMounted(() => {
    orgCode.value = props.currCode
    getListData()
})

//获取列表
const getListData = (params = {}) => {
    params.cs = props.currTotal
    params.jtsj = props.params.bn
    params.year = props.params.year
    params.orgcode = orgCode.value
    loading.value = true
    postApi(params, '/mosty-jcgl/data/certifiedPerson/getLsjlList').then(res => {
        if (res) {
            pageData.tableData = res
        }
    }).finally(() => {
        loading.value = false
    })
}

</script>

<style lang="scss" scoped>
@import "@/assets/css/layout.scss";
@import "@/assets/css/element-plus.scss";

::v-deep .el-form--inline {
    padding-left: 0 !important;
}

::v-deep .el-radio__label {
    display: none !important;
}

.table-box-radio .el-table1__header-wrapper .el-checkbox {
    display: none !important;
}

:v-deep .el-tree-node {
    .is-leaf+el-checkbox .el-checkbox__inner {
        display: inline-block;
    }
}

::v-deep .el-overlay-dialog {
    overflow: hidden !important;
}

:v-deep .el-checkbox .el-checkbox__inner {
    display: none;
}

:v-deep .wrap .el-checkbox__input.is-disabled {
    display: none;
}

.el-form {
    margin-top: 10px;
    display: flex;
    //   flex-wrap: wrap;
    justify-content: space-between;
}

.search {
    width: 300px;
    display: flex;
    position: absolute;
    right: 20px;
    top: 20px;
}

.el-form-item {
    text-align: center;
    width: 400px;
}

.flx {
    display: flex;
    width: 100%;

    .el-button {
        margin-left: 10px;
    }
}

.box {
    width: 100%;
    height: 516px;
    overflow-y: hidden;
    border: 1px solid var(--el-color-primary);
    display: flex;
    justify-content: space-between;
}

.treeBox2 {
    overflow: auto;
}

.cskbox {
    width: 40px;
    padding: 107px 0;
    margin-right: 20px;

    .el-icon {
        width: 4em !important;
        height: 6em !important;
    }

    .el-icon svg {
        width: 3em !important;
        height: 3em !important;
    }
}

.listbox {
    border: 1px solid var(--el-color-primary);
    width: 45%;
    overflow-y: scroll;

    ul>li {
        padding: 4px 10px;
        box-sizing: border-box;
    }

    .activ {
        background-color: var(--el-color-primary);
    }
}

.bot_font {
    width: 100%;
    text-align: center;
    font-size: 16px;
    color: #ffff;
    margin-top: 10px;
}

.fenye {
    margin-top: 10px;
}
</style>