<script>


export default {
    data: () => {
        return {
            tableData: [],
            loading2: true
        }
    },
    created() {
        this.list()
    },
    methods: {
        list() {
          //this.$loader.show()
            axios.get('/api/roles/list')
                .then(resolve => {
                    Vue.set(this, 'tableData', resolve.data)
                    //this.$loader.hide()
                    console.log(this.tableData)
                })
                .catch(err => {
                    console.log(vm.tableData)
                })

        },
        excluir(id){
            axios.delete('/api/roles/delete/'+id)
            .then(resolve =>{
                this.list()
            })
             .catch(err => {
                    console.log(err)
            })
        }
    }
}
</script>

<template>
  <el-table
    v-loading="loading2"
    element-loading-text="Loading..."
    :data="tableData"
    style="width: 100%">
    <el-table-column
      prop="name"
      label="Nome"
      width="180">
    </el-table-column>
    <el-table-column
      prop="label"
      label="Label"
      width="180">
    </el-table-column>
  </el-table>
</template>