pcpuma_unam_operador/components/panel_admin/AdminModulo.vue

<template>
  <div class="column is-4">
    <h3 class="is-size-4 mb-4">Administrador</h3>

    <b-field label="Cambiar nombre del módulo" v-if="modulo.id_modulo">
      <b-input
        icon="list-status"
        v-model="nuevoNombreModulo"
        placeholder="Nuevo nombre del módulo"
        rounded
      />
    </b-field>

    <b-button
      class="my-5"
      type="is-link"
      v-show="modulo.id_modulo"
      @click="
        $alertsGenericos.imprimirWarning(
          $buefy,
          `¿Estas segur@ que deseas cambiar esta información?`,
          updateCarrito
        )
      "
      :disabled="mostrarBoton()"
      rounded
      expanded
    >
      Actualizar Información
    </b-button>
  </div>
</template>

<script>
import axios from 'axios'

export default {
  props: {
    admin: { type: Object, required: true },
    modulo: { type: Object, required: true },
    updateIsLoading: { type: Function, required: true },
    buscar: { type: Function, required: true },
  },
  data() {
    return {
      nuevoNombreModulo: '',
    }
  },
  methods: {
    mostrarBoton() {
      if (this.nuevoNombreModulo) return false
      else return true
    },
    updateCarrito() {
      const data = {
        id_modulo: this.modulo.id_modulo,
        modulo: this.nuevoNombreModulo
          ? this.nuevoNombreModulo
          : this.modulo.modulo,
      }
      this.updateIsLoading(true)
      axios
        .put(`${process.env.api}/modulo`, data, this.$getToken.token())
        .then((res) => {
          this.buscar()
          this.updateIsLoading(false)
          this.$alertsGenericos.imprimirMensaje(this.$buefy, res.data.message)
        })
        .catch((err) => {
          this.updateIsLoading(false)
          this.$alertsGenericos.imprimirError(this.$buefy, err.response.data)
        })
    },
  },
}
</script>

<style></style>