<template>
    <div class="table-list">
        <el-table
            :data="tableData"
            highlight-current-row
            border >
                <el-table-column type="index" fixed width="50" align="center"></el-table-column>
                <el-table-column prop="title" fixed label="标题" width="300" align="center">
                </el-table-column>
                <el-table-column label="内容" width="100" align="center" >
                    <template slot="header">
                    </template>
                   <template slot-scope="scope">
                    </template>
                 </el-table-column>
                <el-table-column  fixed="right" label="操作" width="160" align="center">
                    <template slot-scope="scope">
                        <el-button @click="handleShowDetailClick(scope.$index)">查看</el-button>
                        <el-button type="primary" @click="handleEditClick(scope.$index)">编辑</el-button>
                        <el-button type="danger" @click="handleDeleteClick(scope.$index)">删除</el-button>
                    </template>
                </el-table-column>
        </el-table>
    </div>
</template>
<script>
export default {
    name: 'VTable',
    props: {
        tableData: {
            type: Array,
            default: () => {
                return []
            }
        }
    },
    data () {
        return {
        }
    },

    computed: {},
    watch: {},
    methods: {
        handleShowDetailClick (index) {
            this.$emit('showDetail', index)
        },
        handleEditClick (index) {
            this.$emit('edit', index)
        },
        handleDeleteClick (index) {
            this.$emit('delete', index)
        }
    },
    created () {
    }
}
</script>
<style lang="less" scoped>
.table-list {
    padding: 0 15px;
}
</style>
