<template>
    <div>
        <!-- <div class="btn-container">
            <el-button type="primary" @click="addActivity">新增</el-button>
        </div> -->
        <div class='tabox'>

            <MOSTY.Table :table-columns="pageData.tableColumns" :tableData="pageData.tableData"
                :tableloading="tableloading" :tableHeight="'40vh'">
                <template #dangerLevel="{ row }">
                    <dict-tag :options="D_BZ_WXZYJB" :value="row.dangerLevel" :tag="false" />
                </template>
            </MOSTY.Table>
            <div class="fenye">
                <MOSTY.Pages :pageConfiger="pageData.pageConfiger" @changeNo="handleCurrentChange"
                    @changeSize="handleSizeChange" />
            </div>
        </div>
        <addxgfWxzyjl v-if="isShowTC" title="新增相关方" :xgfid="props.obj.id" :xgfywlx="props.obj.relatedtype"  :tcType="tcType" @close="tcClose"/>
    </div>

</template>
<script setup>
import * as MOSTY from "@/components/MyComponents/index";
import { reactive, ref, onMounted, getCurrentInstance } from "vue"
import { postApi, getApi } from "@/api/tobAcco_api.js";
import addxgfWxzyjl from "./xiangGfwxzyjlCom/addxgfWxzyjl.vue";

const { proxy } = getCurrentInstance();
const { D_BZ_WXZYJB } =
    proxy.$dict("D_BZ_WXZYJB");
const fileid = ref(null)
const tcType = ref('add')
const isShowTC = ref(false)
const emits = defineEmits(["handleChange", 'searchChange']);
const props = defineProps({
    obj: {
        default: () => { },
        type: Object
    },
    // 是否可以编辑
    isEdit: {
        type: Boolean,
        default: true
    },
});
const tableloading = ref(false);
const total = ref(0)
console.log('obj: ', props.obj);

const pageData = reactive({
    listQuery: {
        pageCurrent: 1,
        pageSize: 5,
        relatedid: props.obj.id
    },
    pageConfiger: {
        pageSize: 5,
        pageCurrent: 1,
        total: 0
    },
    tableColumns: [
        {
            title: "作业内容",
            prop: "jobcontent"
        },
        {
            title: "作业地点",
            prop: "jobplace"
        },
        {
            title: "作业开始日期",
            prop: "jobstarttime"
        },
        {
            title: "作业结束日期",
            prop: "jobendtime"
        },
        {
            title: "危险级别",
            prop: "dangerLevel",
            slot: true
        }
    ],
    tableData: []
})
const addActivity = () => { 
    console.log('新增');
    isShowTC.value = true
    tcType.value = 'add'
}
const tcClose = () => {
    isShowTC.value = false
    getzblist()
}
onMounted(() => {

    //获取子表
    getzblist()
});

//获取列表
function getzblist() {
    getApi(pageData.listQuery, '/mosty-jcgl/relatedpartyinfo/getWxzyPage').then(res => {
        pageData.tableData = res.records
            ? res.records : [];
        pageData.pageConfiger.total = res.total
    })
}

//页码发生变化
const handleCurrentChange = (val) => {
    pageData.pageConfiger.pageCurrent = val;
    pageData.listQuery.pageCurrent = val;
    getzblist()
};
//查询条数发生变化
const handleSizeChange = (val) => {
    pageData.pageConfiger.pageSize = val;
    pageData.listQuery.pageSize = val;
    getzblist()
};
</script>

<style lang="scss" scoped>
.btn-container {
    padding-left: 10px;
    padding-bottom: 10px;
}
.headBox {
    display: flex;
    justify-content: end;
    width: 100%;
    margin-bottom: 10px;
}

.top_ul {
    display: flex;
    justify-content: start;
    flex-wrap: wrap;

    >li {
        width: 15%;
        height: 83px;
        margin: 6px 32px;
    }
}
</style>