<template>
    <div class="right">
        <el-divider />
        <MOSTY.Search :searchArr="searchArr" @submit="onSearch" />

        <el-divider />
        <div class="btnBox">
            <span class="mr10" v-if="!showadd" style="color: red;">{{ msg ? '(' + msg + ')' : '' }}</span>
            <el-popconfirm v-if="showadd" confirm-button-text="是" cancel-button-text="否" icon-color="red"
                title="本月无事故，确定要一键报送?" @confirm="Addbs()">
                <template #reference>
                    <el-button>一键报送</el-button>

                </template>
            </el-popconfirm>
            <el-button @click="toAdd('add', null)" v-if="showadd"><el-icon size="small">
                    <CirclePlus />
                </el-icon>新增月报</el-button>
            <el-button type="primary" @click="onloadExcel" v-loading="loading">
                <el-icon>
                    <Download />
                </el-icon>
                <span>导出</span>
            </el-button>
            <el-button type="primary" @click="closebtn" v-if="showfhbtn">

                <span>返回</span>
            </el-button>

        </div>
        <div v-if="IssgsShow">
            <section class="eltab4">
                <MOSTY.Table :table-columns="data.tableColumn2" :tableData="data.tableData2"
                    :tableloading="tableloading" :isSelect="true" :isSort="true" actionsW="280" @SortChange="SortChange"
                    style="width: 100%;">
                    <template #status="{ row }">
                        <dict-tag v-if="['00', '01', '02', '03', '04', '05', '06', '07'].includes(row.status)"
                            :options="D_BZ_SGYB_LCZT" :value="row.status" :tag="false" />
                        <span v-else>{{ row.status }}</span>
                    </template>
                    <!-- 操作 -->
                    <template #actions="{ row }">
                        <div class="flex just-center">
                            <span class="operesee" @click="changesee(row)">
                                <el-icon>
                                    <View />
                                </el-icon>
                                查看
                            </span>
                            <el-popconfirm v-if="getItem('USERID') == '000000'" confirm-button-text="是"
                                cancel-button-text="否" icon-color="red" title="确定要撤回上报?" @confirm="sgybRevoke(row)">
                                <template #reference>
                                    <span class="operedit"><el-icon>
                                            <EditPen />
                                        </el-icon>
                                        撤回上报
                                    </span>

                                </template>
                            </el-popconfirm>
                        </div>
                    </template>
                </MOSTY.Table>
            </section>

        </div>
        <div v-else>
            <section class="eltab4">
                <MOSTY.Table :table-columns="data.tableColumn" :tableData="data.tableData" :tableloading="tableloading"
                    :isSelect="true" :isSort="true" actionsW="280" @SortChange="SortChange" style="width: 100%;">
                    <template #status="{ row }">
                        <dict-tag :options="D_BZ_SGYB_LCZT" :value="row.status" :tag="false" />
                    </template>
                    <template #reject="{ row }">
                        <span v-if="row.reject" style="color: red;">{{ row.reject }}</span>
                        <span v-else>--</span>
                    </template>
                    <!-- 操作 -->
                    <template #actions="{ row }">
                        <el-popconfirm v-if="row.status == '00' && row.orgcode == getItem('deptId').ssdwid"
                            confirm-button-text="是" cancel-button-text="否" icon-color="red" title="确定要上报?"
                            @confirm="onloadfil(row)">
                            <template #reference>
                                <span class="operedown">
                                    <el-icon>
                                        <Top />
                                    </el-icon>
                                    上报</span>
                            </template>
                        </el-popconfirm>

                        <span class="operedit" v-if="row.orgcode == getItem('deptId').ssdwid"
                            @click="toAdd('exit', row)">
                            <el-icon>
                                <EditPen />
                            </el-icon>
                            修改</span>
                        <el-popconfirm v-if="row.orgcode == getItem('deptId').ssdwid && row.status == '00'"
                            confirm-button-text="是" cancel-button-text="否" icon-color="red" title="确定要删除?"
                            @confirm="handledelete(row)">
                            <template #reference>
                                <span class="operdel" size="small">
                                    <el-icon>
                                        <Delete />
                                    </el-icon>
                                    删除</span>
                            </template>
                        </el-popconfirm>
                        <span class="operesee" @click="toAdd('see', row)">
                            <el-icon>
                                <View />
                            </el-icon> 查看</span>
                    </template>
                </MOSTY.Table>
            </section>
            <div class="fenye">
                <MOSTY.Pages :pageConfiger="data.pageConfiger" @changeNo="changeNo" @changeSize="changeSize">
                </MOSTY.Pages>
            </div>
        </div>

    </div>
    <div v-if="showAddSjyb" class="dialog-box">
        <Addsgyb v-if="showAddSjyb" :rowId="rowId" :savebtn="savebtn" :title='sgtitle' :status="status"
            @close="showAddSjyb = false, getTableData()" />
    </div>
</template>

<script setup>
import * as MOSTY from "@/components/MyComponents/index";
import { formatTime, dateFormat } from "@/utils/tools.js";
import Addsgyb from "@/views/sggl/sgbg/sgyb/AddOrEdite/Addsgyb.vue"
import { ElMessage } from "element-plus";
import { filterqx } from "@/utils/auth.js";
import { getApi, postApi } from "@/api/tobAcco_api.js";
import { getItem } from "@/utils/storage";
import { exportXlsx } from "@/excel/Export2Excel.js";
import { reactive, ref, watch, onMounted, getCurrentInstance } from "vue";
const emit = defineEmits("changePage");
const props = defineProps({ deptobj: Object, })
const timeny = ref(dateFormat({ type: "lastmonth" }))
const { proxy } = getCurrentInstance();
const { D_BZ_SGYB_LCZT } = proxy.$dict("D_BZ_SGYB_LCZT");
const searchArr = reactive([
    {
        showType: "month",
        prop: "time",
        defaultVal: ref(dateFormat({ type: "lastmonth" })),
        width: '250px',
    }
]);
const IssgsShow = ref(false)
const tableloading = ref(false);
const showAddSjyb = ref(false);
const showfhbtn = ref(false)
const showadd = ref(false)
const savebtn = ref(false)
const status = ref('00')//上报状态
const sgtitle = ref('')
const msg = ref('')
const rowId = ref(null)
const loading = ref(false)
const listQuery = reactive({
    pageCurrent: 1,
    pageSize: 20,
    time: timeny.value
});
const data = reactive({
    searchObj: {},
    tableData: [],
    tableData2: [],
    tableColumn: [
        {
            title: "上报名称",
            prop: "name",
            sortable: true
        },
        {
            title: "添加时间",
            prop: "time",
            width: '180',
            sortable: true
        },
        {
            title: "上报状态",
            prop: "status",
            width: '250',
            slot: true,
            sortable: true
        },
        {
            title: "是否驳回",
            prop: "reject",
            slot: true,
            width: '200',
            sortable: true
        },

        {
            title: "操作",
            prop: "actions",
            slot: true,
        }
    ],
    tableColumn2: [
        {
            title: "单位名称",
            prop: "orgname",
            sortable: true
        },
        {
            title: "添加时间",
            prop: "time",
            width: '180',
            sortable: true
        },
        {
            title: "上报状态",
            prop: "status",
            width: '250',
            slot: true,
            sortable: true
        },
        {
            title: "操作",
            prop: "actions",
            slot: true,
        }
    ],
    pageConfiger: {
        pageSize: 10,
        pageCurrent: 1,
        total: 0
    }
});
watch(
    () => props.deptobj,
    (val) => {
        if (val.id) {
            listQuery.pageCurrent = 1
            listQuery.orgcode = val.id
            data.pageConfiger.pageCurrent = 1;
            getTableData()
        }

    },
    { deep: true, immediate: true }
);
const onSearch = (obj) => {
    listQuery.pageCurrent = 1
    data.pageConfiger.pageCurrent = 1;
    listQuery.time = obj.time;
    getTableData()
};
onMounted(() => {
});

//	查询 人员是否可以添加数据
function IsaddData() {
    getApi({}, '/mosty-jcgl/sgyb/checkRule').then(res => {
        if (res) {
            showadd.value = res.flag
            msg.value = res.msg ? res.msg : null

        }
    })
}

//排序
function SortChange(prop, order) {
    listQuery.sortField = prop
    listQuery.sortOrder = order
    getTableData()
}
//省公司查看
function changesee(row) {
    showfhbtn.value = true
    listQuery.orgcode = row.orgid
    getTableData()
}
function sgybRevoke(row) {
    getApi({ id: row.id }, '/mosty-jcgl/sgyb/revoke').then(res => {
        ElMessage.success('撤回成功！')
        getTableData()
    })
}
//返回
function closebtn() {
    showfhbtn.value = false
    listQuery.orgcode = props.deptobj.id
    getTableData()
}
//获取列表数据
function getTableData() {
    IsaddData()
    tableloading.value = true;
    //判断是否是省公司

    if (filterqx('isSgs') == '1' && props.deptobj.orglevel == '10' && !showfhbtn.value) {
        IssgsShow.value = true
        getApi(
            {}, `/mosty-jcgl/sgyb/getList?time=${listQuery.time}`
        ).then((res) => {
            if (res) {
                tableloading.value = false;
                data.tableData2 = res;
            } else {
                data.tableData2 = [];
                tableloading.value = false;
            }
        });
    } else {
        IssgsShow.value = false
        getApi(
            listQuery, '/mosty-jcgl/sgyb/getPageList'
        ).then((res) => {
            if (res.records) {
                tableloading.value = false;
                data.tableData = res.records;
                data.pageConfiger.total = res.total;
            } else {
                data.tableData = [];
                tableloading.value = false;
            }
        });
    }


}

const changeNo = (val) => {
    listQuery.pageCurrent = val;
    data.pageConfiger.pageCurrent = val;
    getTableData();
};
const changeSize = (val) => {
    listQuery.pageSize = val;
    data.pageConfiger.pageSize = val;
    getTableData();
};


//点击新增
const toAdd = (type, row) => {
    if (type == 'add') {
        rowId.value = null
        status.value = '00'
        sgtitle.value = '事故月报新增'
        savebtn.value = true
    } else if (type == 'exit') {
        rowId.value = row.id
        status.value = row.status
        sgtitle.value = '事故月报修改'
        savebtn.value = true
    } else {
        rowId.value = row.id
        sgtitle.value = '事故月报查看'
        savebtn.value = false
    }
    showAddSjyb.value = true
};
function Addbs() {
    let obj = {
        name: `${getItem("deptId").ssdwmc}${timeny.value}事故事件月报`
    }
    postApi(obj, '/mosty-jcgl/sgyb/add').then(res => {
        ElMessage.success("报送成功");
        getTableData()
    })
}
//事故月报上报
function onloadfil(row) {
    getApi({ id: row.id }, '/mosty-jcgl/sgyb/reporting').then(res => {
        ElMessage.success("上报成功");
        getTableData()
    })
}

function handledelete(row) {
    postApi({}, `/mosty-jcgl/sgyb/del/${row.id}`).then(res => {
        ElMessage.success("删除成功");
        getTableData()
    })
}
//导出Excel
function onloadExcel() {
    let title = {
        name: '上报名称',
        time: '添加时间',
        status: '上报状态',
        reject: '是否驳回',
    }
    loading.value = true
    getApi(listQuery, '/mosty-jcgl/sgyb/exportData').then((res) => {
        if (res) {
            let data = res
            if (data.length > 0) {
                data.forEach(el => {
                    el.reject = el.reject ? el.reject : '--';
                    el.status = proxy.$getDictVal(el.status, D_BZ_SGYB_LCZT);
                });
                let tablename = `事故事件月报列表.xlsx`
                exportXlsx(title, data, '事故事件月报列表', tablename);
                loading.value = false

            } else {
                ElMessage.warning('暂无数据');
                loading.value = false
            }
        }

    }).catch(err => {
        loading.value = false
    })
}
</script>

<style lang="scss" scoped>
.eltab4 {
    height: calc(100vh - 390px);
}



.btnBox {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-bottom: 12px;
}
</style>
