pcpuma_unam_operador/components/panel_admin/AdminUsuario.vue

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

    <BotonReenviarPassword
      :updateIsLoading="updateIsLoading"
      :usuario="usuario"
    />

    <!-- <b-button
      v-if="
        operador.tipoUsuario.id_tipo_usuario === 3 &&
        !institucion.multa &&
        usuario.instituciones[0]
      "
      class="my-5"
      label="Multar usuario"
      type="is-danger"
      @click="multa()"
      :disabled="!usuario.id_usuario"
      expanded
    /> -->

    <!-- <b-button
      v-if="institucion.multa"
      class="my-5"
      type="is-link"
      @click="
        imprimirWarning(
          '¿Estas segur@ que deseas retirar la multa a este usuario?',
          quitarMulta
        )
      "
      expanded
    >
      Quitar multa
    </b-button> -->

    <b-field label="Cambiar teléfono del usuario">
      <b-input
        icon="phone"
        v-model="telefono"
        placeholder="Teléfono"
        :disabled="!usuario.id_usuario"
        rounded
      />
    </b-field>

    <InputCorreo
      label="Cambiar correo del usuario"
      :correoPadre="correo"
      :disabled="!usuario.id_usuario"
      @correo="(correoNuevo) => (correo = correoNuevo)"
    />

    <BotonGuardar
      :disabled="!telefono && !correo"
      :guardar="actualizarDatos"
      msjWarning="¿Estas segur@ de querer guardar estos cambios?"
    />
  </div>
</template>

<script>
import axios from 'axios'
import BotonGuardar from '@/components/botones/BotonGuardar'
import BotonReenviarPassword from '@/components/botones/BotonReenviarPassword'
import InputCorreo from '@/components/inputs/InputCorreo'
import MultaModalAdmin from '@/components/operador/MultaModalAdmin'

export default {
  components: {
    BotonGuardar,
    BotonReenviarPassword,
    InputCorreo,
    MultaModalAdmin,
  },
  props: {
    operador: { type: Object, required: true, default: () => ({}) },
    usuario: { type: Object, required: true, default: () => ({}) },
    updateIsLoading: { type: Function, required: true, default: () => {} },
    buscar: { type: Function, required: true, default: () => {} },
  },
  data() {
    return {
      telefono: '',
      correo: '',
    }
  },
  methods: {
    multa() {
      const modalProps = {
        operador: this.operador,
        usuario: this.usuario,
        updateIsLoading: this.updateIsLoading,
        buscar: this.buscar,
      }

      this.$buefy.modal.open({
        props: modalProps,
        parent: this,
        component: MultaModalAdmin,
        hasModalCard: true,
        customClass: 'custom-class custom-class-2',
        trapFocus: true,
      })
    },
    quitarMulta() {
      const data = {
        id_institucion_usuario: 1,
      }

      this.updateIsLoading(true)
      axios
        .put(`${process.env.api}/multa`, 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,
            this.$router,
            err.response.data
          )
        })
    },
    actualizarDatos() {
      const data = { id_usuario: this.usuario.id_usuario }

      this.updateIsLoading(true)
      if (this.telefono) data.telefono = this.telefono
      if (this.correo) data.correo = this.correo
      axios
        .put(`${process.env.api}/usuario`, data, this.$getToken.token())
        .then((res) => {
          this.telefono = ''
          this.correo = ''
          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
          )
        })
    },
  },
}
</script>

<style></style>