<script>
import {mapGetters, useStore} from "vuex"
import Button from "@atoms/VButton.vue"
import Tabulator from "@molecules/VTabulator/VTabulator.vue"

export default {
  name: 'AddUsers',
  components: {
    Button,
    Tabulator
  },
  setup() {
    const store = useStore()
    store.dispatch('add_users/uploadData')
  },
  data() {
    return {
      
    }
  },
  computed: {
    ...mapGetters('add_users', ['adminData']),
  },
  unmounted() {
    const store = useStore()
    store.dispatch('add_users/resetStore')
  },
  methods: {
  }
}

</script>


<template>
  {{ console.log('adminData', adminData)
  }}
  <div class="rounded w-full pt-4 pb-1 bg-light cursor-pointer transition-all">
    <div class="mx-2 mb-3">
      <a :href="`/html/admin/manage/new?prev_page=/\?page_display_mode=users`">
        <Button
          title="Создать"
          classBtn="cursor-pointer text-white bg-primary hover:brightness-90 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-ssm w-full px-5 py-1 text-center transition-all "
        />
      </a>
    </div>
    <div
      id="admin_list"
      class="tab-pane m-4 active bg-light relative col-span-12 text-center min-h-[300px] rounded-md tabulator"
    >
      <Tabulator v-bind="adminData" />
    </div>
  </div>
</template>