Proyectos de Subversion LeadersLinked - Antes de SPA

<template>
  <div id="form-forgot-password-container">
    <h3>{{title}}</h3>
    <form @submit.prevent="submit" name="forgot-password" id="forgot-password" action="" method="post">
      <div class="row">
                          <div class="col-lg-12 no-pdd">
                                  <div class="sn-field" :class="{ 'sn-field-has-error': $v.form.email.$error }"> 
                                          <input type="text" name="forgot_password_email" id="forgot_password_email" v-bind:placeholder="placeHolderEmail"  maxlength="64" v-model="form.email">
                                                <i class="la la-envelope"></i>
                                        </div><!--sn-field end-->
                                </div>
        <div  v-if="$v.form.email.$error" class="sn-field-invalid-feedback">
          {{showErrorEmail}}
        </div>
        <div class="col-lg-12 no-pdd">
          <button type="submit" value="submit">{{textButtonSubmit}}</button>
        </div>
                  </div>
    </form>
  </div>  
</template>

<script>
module.exports = {
    props: [
        'action',
        'title',
        'textButtonSubmit',
        'placeHolderEmail',
        'errorRequired',
        'errorMaxlength',
        'errorEmail',
    ],
    data: function() {
        return {
            form: {
              email: "",
            }
        }
    },
    computed: {
      showErrorEmail: function () {
          if(!this.$v.form.email.required) {
            return this.errorRequired;
          }
          if(!this.$v.form.email.max) {
            return this.errorMaxlength.replace('{0}', 64);
          }
          if(!this.$v.form.email.email) {
            return this.errorEmail;
          }
          return '';''
      }
    },
    validations: {
      form: {
        email: { 
          required, 
          email, 
          max: maxLength(64) 
        },
      }
    },
    methods: {
      submit(event) {
        this.$v.form.$touch();
        if(this.$v.form.$error) { 
            return false;
        }  



        params = {
          'email': this.form.email, 
        }
        this.$Progress.start();
        this.$http.post(this.action, params).then(response => {

            this.email = '';
            event.target.reset();

            this.$Progress.finish()
            if(response.status == 200) {
              var data =  response.body;
              if(data.success) {
                $("#tabs").tabs("option", "active", 0);

                this.$toastr.success(data.message);
              } else {
                this.$toastr.error(data.message);
              }
            } else {
              this.$toastr.error(response.statusText);
            }
        }, response => {
          this.$Progress.fail()
          // error callback
        });
      }
    }
}
</script>

<style>
</style>