<template>
    <div class='zhsx-log'>
        <el-dialog title='综合记录事项' width='70%' :visible.sync='visible'>
            <div class='top'></div>
            <div class='bottom'>
                <p>1.各级政府部门在广场检查中口头及书面提出的工作要求，整改事项</p>
                <p>2.广场消防安全培训、消防演习</p>
                <p>3.相关政府强制性检测的按时完成情况及检测中提出的问题</p>
                <p>4.广场安全质量第三方检测过程中列出的整改事项</p>
                <div class='bottom-table'>
                    <el-table :data='tableData' height='500' style='width:100%;' :span-method='objectSpanMethod' border v-if='tableData.length>0'>
                        <el-table-column label='序号' type='index' width='50'></el-table-column>
                        <el-table-column prop='jcsx' label='检测事项' :show-overflow-tooltip='true'></el-table-column>
                        <el-table-column prop='zgbm' label='主管部门' :show-overflow-tooltip='true'></el-table-column>
                        <el-table-column prop='jlsx' label='记录事项' :show-overflow-tooltip='true'></el-table-column>
                    </el-table>
                </div>
            </div>
        </el-dialog>
    </div>
</template>
<script>
export default {
    props: ['tableData'],
    data() {
        return {
            visible: false
        }
    },
    methods: {
        open() {
            this.visible = true
        },
        objectSpanMethod({ row, column, rowIndex, columnIndex }) {
            if (columnIndex === 2) {
                if (rowIndex > 0 && row[column.property] === this.tableData[rowIndex - 1][column.property]) {
                    return {
                        rowspan: 0,
                        colspan: 0
                    }
                } else {
                    let rows = 1
                    for (let i = rowIndex; i < this.tableData.length - 1; i++) {
                        if (row[column.property] === this.tableData[i + 1][column.property]) {
                            rows++
                        }
                    }
                    return {
                        rowspan: rows,
                        colspan: 1
                    }
                }
            } else if (columnIndex == 3) {
                console.log(row, column)
            }
        }
    }
}
</script>
<style lang="less" scoped>
.top {
    width: 100%;
    height: 1px;
    background: rgba(0, 0, 0, 0.06);
    margin-bottom: 20px;
}
.bottom {
    padding: 0 30px 14px 30px;
    p {
        font-size: 14px;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        color: rgba(96, 106, 120, 1);
        line-height: 22px;
    }
    .bottom-table {
        margin-top: 12px;
    }
}
</style>
<style lang="less">
.zhsx-log {
}
</style>