servicio_social_front/pages/admin/programa/infoResponsable/modificar/index.vue

<template>
  <div class="container">
    <BotonRegresar :path="'/admin/programa/infoResponsable'" />
    <p class="is-size-2">Editar información del responsable</p>
    <b-field label="Nombre">
      <b-input type="text" v-model="nuevo.nombre" :placeholder="viejo.nombre">
      </b-input>
    </b-field>
    <b-field label="Correo eletrónico">
      <b-input type="email" v-model="nuevo.correo" :placeholder="viejo.correo">
      </b-input>
    </b-field>
    <BotonRegresar :path="'/admin/programa/infoResponsable'" />
    <b-button
      class="boton is-info my-5"
      v-if="mostrar()"
      @click="editarResponsable()"
    >
      Editar responsable
    </b-button>
    <b-button class="boton is-info my-5" v-else disabled>
      Editar responsable
    </b-button>
    <b-loading
      :is-full-page="true"
      v-model="isLoading"
      :can-cancel="true"
    ></b-loading>
  </div>
</template>

<script>
import validator from "validator";
import botonRegresar from "../../../../../components/botonRegresar";
//import axios from 'axios'

export default {
  components: {
    botonRegresar,
  },
  data() {
    return {
      viejo: {
        idResponsable: localStorage.getItem("idResponsable"),
        nombre: localStorage.getItem("nombre"),
        correo: localStorage.getItem("correo"),
      },
      nuevo: {
        nombre: "",
        correo: "",
      },
      idServicio: localStorage.getItem("idServicio"),
      token: localStorage.getItem("token"),
      isLoading: false,
    };
  },
  methods: {
    mostrar() {
      if (validator.isEmail(this.nuevo.correo) || this.nuevo.nombre) {
        if (this.nuevo.correo) {
          if (validator.isEmail(this.nuevo.correo)) {
            return true;
          } else {
            return false;
          }
        }
        return true;
      }
    },
  },
  beforeCreate() {
    if (!localStorage.getItem("idResponsable")) {
      this.$router.push("/admin/programa");
    }
  },
};
</script>