pcpuma_unam_operador/components/panel_admin/AdminInstitucionA.vue

<template>
  <div class="column is-4">
    <h3 class="is-size-4 mb-4">Configuración</h3>

    <b-field label="Días de multa por retraso">
      <b-input
        type="number"
        :placeholder="institucion.dias_multa_retraso"
        :disabled="!institucion.id_institucion"
        v-model="diasMultaRetraso"
      />
    </b-field>

    <b-field label="Tiempo para recoger equipo">
      <b-input
        type="number"
        :placeholder="institucion.tiempo_recoger"
        :disabled="!institucion.id_institucion"
        v-model="tiempoRecoger"
      />
    </b-field>

    <b-field label="Tiempo para entregar equipo">
      <b-input
        type="number"
        :placeholder="institucion.tiempo_entrega"
        :disabled="!institucion.id_institucion"
        v-model="tiempoEntrega"
      />
    </b-field>

    <b-field label="Tiempo de préstamo">
      <b-input
        type="number"
        :placeholder="institucion.tiempo_prestamo"
        :disabled="!institucion.id_institucion"
        v-model="tiempoPrestamo"
      />
    </b-field>

    <b-field>
      <b-upload
        accept=".png,.jpeg,.jpg"
        class="button is-primary"
        v-model="logo"
        expanded
      >
        <b-icon icon="upload" />

        <span>{{ logo.name || 'Cargar logo' }}</span>
      </b-upload>
    </b-field>

    <BotonGuardar
      :disabled="
        !diasMultaRetraso &&
        !tiempoPrestamo &&
        !tiempoRecoger &&
        !tiempoEntrega &&
        !logo.name
      "
      :guardar="actualizarDatos"
      msjWarning="¿Estas segur@ de querer guardar estos cambios?"
    />

    <BotonFinSemestre :updateIsLoading="updateIsLoading" :admin="admin" />
  </div>
</template>

<script>
import axios from 'axios'
import BotonFinSemestre from '@/components/botones/BotonFinSemestre'
import BotonGuardar from '@/components/botones/BotonGuardar'

export default {
  components: { BotonGuardar, BotonFinSemestre },
  props: {
    buscar: { type: Function, required: true, default: () => {} },
    updateIsLoading: { type: Function, required: true, default: () => {} },
    admin: { type: Object, required: true, default: () => ({}) },
    institucion: { type: Object, required: true, default: () => ({}) },
  },
  data() {
    return {
      diasMultaRetraso: '',
      tiempoRecoger: '',
      tiempoEntrega: '',
      tiempoPrestamo: '',
      logo: {},
    }
  },
  methods: {
    actualizarDatos() {
      const data = { id_institucion: this.institucion.id_institucion }

      this.updateIsLoading(true)
      if (this.logo.name) this.subirLogo()
      if (
        this.diasMultaRetraso ||
        this.tiempoRecoger ||
        this.tiempoEntrega ||
        this.tiempoPrestamo
      ) {
        if (this.diasMultaRetraso)
          data.dias_multa_retraso = Number(this.diasMultaRetraso)
        if (this.tiempoRecoger) data.tiempo_recoger = Number(this.tiempoRecoger)
        if (this.tiempoEntrega) data.tiempo_entrega = Number(this.tiempoEntrega)
        if (this.tiempoPrestamo)
          data.tiempo_prestamo = Number(this.tiempoPrestamo)
        return axios
          .put(`${process.env.api}/institucion`, data, this.$getToken.token())
          .then((res) => {
            this.diasMultaRetraso = ''
            this.tiempoRecoger = ''
            this.tiempoEntrega = ''
            this.tiempoPrestamo = ''
            this.buscar()
            this.updateIsLoading(false)
            this.$alertsGenericos.imprimirMensaje(this.$buefy, res.data.message)
          })
          .catch((err) => {
            this.updateIsLoading(false)
            this.$alertsGenericos.imprimirError(
              this.$buefy,
              this.$router,
              err.response.data
            )
          })
      }
    },
    subirLogo() {
      const formData = new FormData()

      this.updateIsLoading(true)
      formData.append('logo', this.logo)
      return axios
        .post(
          `${process.env.api}/upload-file/upload-logo?id_institucion=${this.admin.institucion.id_institucion}`,
          formData,
          this.$getToken.token()
        )
        .then((res) => {
          this.logo = {}
          this.updateIsLoading(false)
          this.$alertsGenericos.imprimirMensaje(this.$buefy, res.data.message)
        })
        .catch((err) => {
          this.updateIsLoading(false)
          this.$alertsGenericos.imprimirError(
            this.$buefy,
            this.$router,
            err.response.data
          )
        })
    },
  },
}
</script>

<style></style>