pcpuma_unam_operador/components/admin/SelectInstitucion.vue

<template>
  <div>
    <b-field
      class="column is-4"
      label="Nombre de la Institución"
      v-if="admin.tipoUsuario.id_tipo_usuario === 2"
    >
      <b-select v-model="idInstitucion" expanded rounded>
        <option value="" disabled>Institución</option>
        <option
          v-for="institucion in instituciones"
          :value="institucion.id_institucion"
          :key="institucion.id_insitucion"
        >
          {{ institucion.institucion }}
        </option>
      </b-select>
    </b-field>

    <TablaModulTodos
      :admin="admin"
      :data="data"
      :imprimirError="imprimirError"
      :imprimirWarning="imprimirWarning"
      :imprimirMensaje="imprimirMensaje"
      :updateIsLoading="updateIsLoading"
      :obtenerCatalogoModulo="obtenerCatalogoModulo"
      :updateActualizarTabla="updateActualizarTabla"
      :actualizarTabla="actualizarTabla"
    />
  </div>
</template>
<script>
import axios from 'axios'
import TablaModulTodos from '@/components/admin/TablaModulTodos'
export default {
  components: {
    TablaModulTodos,
  },
  props: {
    admin: { typeof: Object, require: true },
    imprimirMensaje: { type: Function, required: true },
    imprimirWarning: { type: Function, required: true },
    imprimirError: { type: Function, required: true },
    updateIsLoading: { type: Function, require: true },
    updateActualizarTabla: { type: Function, required: true },
    actualizarTabla: { type: Boolean, required: true },
  },
  data() {
    return {
      instituciones: [],
      institucion: {},
      idInstitucion: '',
      data: [],
    }
  },
  methods: {
    obtenerCatalogoInstitucion() {
      axios
        .get(`${process.env.api}/institucion`)
        .then((res) => {
          this.instituciones = res.data
        })
        .catch((err) => {
          this.imprimirError(err)
        })
    },
    obtenerCatalogoModulo(id_institucion) {
      axios
        .get(
          `${process.env.api}/modulo/modulos?id_institucion=${id_institucion}`
        )
        .then((res) => {
          this.data = res.data
        })
        .catch((err) => {
          this.imprimirError(err)
        })
    },
  },
  watch: {
    idInstitucion(value) {
      this.obtenerCatalogoModulo(value)
    },
    actualizarTabla(value) {
      if (value) {
        this.obtenerCatalogoModulo(this.admin.institucion.id_institucion)
        this.updateActualizarTabla(false)
      }
    },
  },
  created() {
    this.admin.tipoUsuario.id_tipo_usuario === 2
      ? this.obtenerCatalogoInstitucion()
      : this.obtenerCatalogoModulo(this.admin.institucion.id_institucion)
  },
}
</script>