<template>
    <div>
        <el-table ref="multipleTable" border :data="tableData" tooltip-effect="dark"
            :header-cell-style="{ textAlign: 'center' }" :cell-style="{ textAlign: 'center' }" style="width: 100%"
            @selection-change="handleSelectionChange">
            <el-table-column type="index" width="50" label="序号">
            </el-table-column>
            <el-table-column prop="buildingName" label="楼宇名称">
            </el-table-column>
            <el-table-column prop="contact_person" label="联系人">
            </el-table-column>
            <el-table-column prop="contact_phone" label="联系方式">
            </el-table-column>
            <el-table-column prop="operation" label="操作">
                <template slot-scope="scope">
                    <el-button v-show="scope.row.buildingName == null ? false : true" size="mini" type="text">查看</el-button>
                    <el-button v-show="scope.row.buildingName == null ? false : true" size="mini" type="text">编辑</el-button>
                    <el-button v-show="scope.row.buildingName == null ? false : true" size="mini" type="text">删除</el-button>
                </template>
            </el-table-column>
        </el-table>
        <page class="page"></page>
    </div>
</template>

<script>
import page from '@/components/pagination/index'
export default {
    components: { page },
    data() {
        return {
            tableData: [{
                buildingName: 'A',
                contact_person: '张三',
                contact_phone: '12345678901',
            }, {
                buildingName: 'B',
                contact_person: '张三',
                contact_phone: '12345678901',
            }, {
                buildingName: 'C',
                contact_person: '张三',
                contact_phone: '12345678901',
            },],
        }
    },
    methods: {

    }
}
</script>
<style lang="less" scoped>
.el-table{
    width: 95% !important;
    margin-top: 20px;
    margin-left: 2.5%;
    margin-right: 2.5%;
}
.page{
    position: relative;
    margin-top: 20px;
}
</style>