ex.vue

<!--

  Sistema Tagnos
  TDR Informatica Ltda
  Todos os direitos reservados ©
  ***********************************************
  Nome do arquivo: listagem.vue
  Criado por : Hamilton Gabriel
  Data da criacao : 07/04/2018
  Observacao :
  *******************************************

-->

<template>
  <div class="row">
    <div class="col-md-12">
      <b-card>
        <div slot="header">
          <h5>Operações</h5>
        </div>
        <div class="row">
          <div class="form-group col-sm-12 col-md-12 col-xl-">
            <button class="btn btn-outline-primary">Incluir</button>
            <button class="btn btn-outline-primary">Editar</button>
            <button class="btn btn-outline-primary">Excluir</button>
            <button class="btn btn-outline-primary">Resetar Senha</button>
            <button class="btn btn-outline-primary" @click="buscarUsuarios">Atualizar</button>

          </div>
          <div class="form-group col-sm-12 col-md-12 col-xl-12">
            <vue-good-table
              :rowStyleClass="'rowlef'"
              :columns="columns"
              :rows="rows"
              :paginate="false"
              :globalSearch="true"
              styleClass="table table-bordered table-striped table-hover">

              <div slot="emptystate" style="text-align: center">
                Sem dados a serem exibidos
              </div>
            </vue-good-table>
          </div>
        </div>
      </b-card>
    </div>
  </div>
</template>

<script>
  import VueGoodTable from "vue-good-table/src/components/Table";
  import Http from '../../services/axiosClientConfig'

  import cSwitch from '../../components/Switch'

  export default {

    name: "listagem",
    components: {
      VueGoodTable
    },

    mounted() {
      
    this.listData() 

    },
    data() {
      return {
        columns: [
          {
            label: 'Permissao',
            field: 'id',
          },
          {
            label: 'Nome',
            field: 'nome',
          },
          {
            label: 'Ativo',
            field: 'ativo',
            html: true,

          },

          {
            label: 'Bloqueado',
            field: 'bloqueado',
            html: true,
          },
        ],
        rows: [],

      };
    },

    methods: {

      listData() {
        Http.get('/usuarios')
          .then(response => {
              console.log(response.data);
              this.rows = response.data;

            }
          ).catch(error => {
        });

      }

    }





  }
</script>

<style scoped>

</style>