pcpuma_unam_operador/components/admin/Institucion.vue

<template>
  <div>
    <BuscarInstitucion
      :admin="admin"
      :updateIsLoading="updateIsLoading"
      :updateInstitucion="updateInstitucion"
      :institucion="institucion"
    />

    <TablaAdmins
      :admins="operadores"
      :isLoadingTable="isLoadingTable"
      :onPageChange="onPageChange"
      :total="total"
      :page="page"
      v-if="admin.tipoUsuario.id_tipo_usuario === 2"
    />

    <TablaOperadores
      :operadores="operadores"
      :isLoadingTable="isLoadingTable"
      :onPageChange="onPageChange"
      :total="total"
      :page="page"
      v-if="admin.tipoUsuario.id_tipo_usuario === 3"
    />
  </div>
</template>

<script>
import axios from 'axios'
import BuscarInstitucion from '@/components/buscar/BuscarInstitucion'
import TablaAdmins from '@/components/tablas/TablaAdmins'
import TablaOperadores from '@/components/tablas/TablaOperadores'

export default {
  components: { BuscarInstitucion, TablaAdmins, TablaOperadores },
  props: {
    admin: { type: Object, required: true },
    updateIsLoading: { type: Function, required: true },
  },
  data() {
    return {
      operadores: [],
      isLoadingTable: false,
      page: 1,
      total: 0,
      institucion: {},
      lastSearch: {},
    }
  },
  methods: {
    obtenerOperadores(idTipoUsuario) {
      this.isLoadingTable = true
      if (this.institucion.id_institucion != this.lastSearch.idInstitucion) {
        this.page = 1
        this.lastSearch.idInstitucion = this.institucion.id_institucion
      }
      axios
        .get(
          `${process.env.api}/operador/operadores?pagina=${this.page}&id_tipo_usuario=${idTipoUsuario}&id_institucion=${this.institucion.id_institucion}`,
          this.$getToken.token()
        )
        .then((res) => {
          this.operadores = res.data[0]
          this.total = res.data[1]
          this.isLoadingTable = false
        })
        .catch((err) => {
          this.isLoadingTable = false
          this.$alertsGenericos.imprimirError(this.$buefy, err.response.data)
        })
    },
    onPageChange(page) {
      this.page = page
      if (this.admin.tipoUsuario.id_tipo_usuario === 3)
        this.obtenerOperadores(4)
      else this.obtenerOperadores(3)
    },
    updateInstitucion(institucion) {
      this.institucion = institucion
    },
  },
  watch: {
    institucion() {
      if (this.institucion.id_institucion) {
        if (this.admin.tipoUsuario.id_tipo_usuario === 3)
          this.obtenerOperadores(4)
        else this.obtenerOperadores(3)
      }
    },
  },
}
</script>