<template>
  <TablaProgramas
    :programas="programas"
    :total="programas.length"
    :isLoadingTable="isLoadingTable"
    :obtenerProgramas="obtenerProgramas"
    :updateIsLoading="updateIsLoading"
  />
</template>

<script>
import axios from 'axios'
import TablaProgramas from '@/components/tablas/TablaProgramas'

export default {
  components: { TablaProgramas },
  props: {
    updateIsLoading: { type: Function, required: true },
    idInstitucion: { type: Number, required: true, default: false },
  },
  data() {
    return {
      programas: [],
      isLoadingTable: false,
    }
  },
  methods: {
    obtenerProgramas() {
      this.isLoadingTable = true
      axios
        .get(
          `${process.env.api}/institucion-programa/programas?id_institucion=${this.idInstitucion}`,
          this.$getToken.token()
        )
        .then((res) => {
          this.programas = res.data
          this.isLoadingTable = false
        })
        .catch((err) => {
          this.isLoadingTable = false
          this.$alertsGenericos.imprimirError(this.$buefy, err.response.data)
        })
    },
  },
  created() {
    this.obtenerProgramas()
  },
}
</script>
