Add reset password form

app/Http/Controllers/Auth/ResetPasswordController.php

@@ -20,13 +20,6 @@ class ResetPasswordController extends Controller
 
     use ResetsPasswords;
 
-    /**
-     * Where to redirect users after resetting their password.
-     *
-     * @var string
-     */
-    protected $redirectTo = '/home';
-
     /**
      * Create a new controller instance.
      *
@@ -36,4 +29,28 @@ class ResetPasswordController extends Controller
     {
         $this->middleware('guest');
     }
+
+    /**
+     * Get the response for a successful password reset.
+     *
+     * @param  \Illuminate\Http\Request $request
+     * @param  string  $response
+     * @return \Illuminate\Http\RedirectResponse
+     */
+    protected function sendResetResponse(Request $request, $response)
+    {
+        return ['status' => trans($response)];
+    }
+
+    /**
+     * Get the response for a failed password reset.
+     *
+     * @param  \Illuminate\Http\Request $request
+     * @param  string  $response
+     * @return \Illuminate\Http\RedirectResponse
+     */
+    protected function sendResetFailedResponse(Request $request, $response)
+    {
+        return response()->json(['email' => trans($response)], 400);
+    }
 }

resources/js/app.js

@@ -13,6 +13,7 @@ import Accounts         from './views/Accounts'
 import Create           from './views/Create'
 import Edit             from './views/Edit'
 import PasswordRequest  from './views/auth/password/Request'
+import PasswordReset    from './views/auth/password/Reset'
 import NotFound         from './views/Error'
 
 
@@ -42,7 +43,7 @@ const router = new VueRouter({
         { path: '/edit/:twofaccountId', name: 'edit',component: Edit },
 
         { path: '/password/request', name: 'password.request', component: PasswordRequest },
-        //{ path: '/password/reset/:token', name: 'password.reset', component: page('auth/password/reset.vue') },
+        { path: '/password/reset/:token', name: 'password.reset', component: PasswordReset },
 
         { path: '/flooded', name: 'flooded',component: NotFound,props: true },
         { path: '/error', name: 'genericError',component: NotFound,props: true },

resources/js/views/auth/password/Request.vue

@@ -2,8 +2,8 @@
     <div class="section">
         <div class="columns is-mobile  is-centered">
             <div class="column is-two-thirds-tablet is-half-desktop is-one-third-widescreen is-one-quarter-fullhd">
-                <h1 class="title">{{ $t('passwords.reset_password') }}</h1>
-                <form method="POST" action="/login">
+                <h1 class="title">{{ $t('auth.reset_password') }}</h1>
+                <form method="POST" action="/password/email">
                     <div class="field">
                         <label class="label">{{ $t('auth.forms.email') }}</label>
                         <div class="control">
@@ -13,7 +13,7 @@
                     </div>
                     <div class="field is-grouped">
                         <div class="control">
-                            <button type="submit" class="button is-link" @click="handleSubmit">{{ $t('passwords.send_password_reset_link') }}</button>
+                            <button type="submit" class="button is-link" @click="handleSubmit">{{ $t('auth.send_password_reset_link') }}</button>
                         </div>
                         <div class="control">
                             <router-link :to="{ name: 'login' }" class="button is-text">{{ $t('commons.cancel') }}</router-link>
@@ -22,6 +22,12 @@
                 </form>
             </div>
         </div>
+        <div class="columns is-mobile is-centered" v-if="response">
+            <div class="column is-two-thirds-tablet is-half-desktop is-one-third-widescreen is-one-quarter-fullhd">
+                {{ response }}
+                </router-link>
+            </div>
+        </div>
     </div>
 </template>
 
@@ -30,7 +36,8 @@
         data(){
             return {
                 email : '',
-                validationErrors: {}
+                validationErrors: {},
+                response: ''
             }
         },
         methods : {
@@ -41,12 +48,14 @@
                     email: this.email
                 })
                 .then(response => {
-                    alert('email sent')
+                    this.response = response.data.status
                 })
                 .catch(error => {
                     console.log(error.response)
                     if( error.response.data.errors ) {
                         this.validationErrors = error.response.data.errors
+                    } else if( error.response.data ) {
+                        this.response = error.response.data.email
                     }
                     else {
                         this.$router.push({ name: 'genericError', params: { err: error.response.data.message } });

resources/js/views/auth/password/Reset.vue

@@ -0,0 +1,90 @@
+<template>
+    <div class="section">
+        <div class="columns is-mobile  is-centered">
+            <div class="column is-two-thirds-tablet is-half-desktop is-one-third-widescreen is-one-quarter-fullhd">
+                <h1 class="title">{{ $t('auth.new_password') }}</h1>
+                <form method="POST" action="/password/reset">
+                    <div class="field">
+                        <label class="label">{{ $t('auth.forms.email') }}</label>
+                        <div class="control">
+                            <input id="email" type="email" class="input" v-model="email" required />
+                        </div>
+                        <p class="help is-danger" v-if="validationErrors.email">{{ validationErrors.email.toString() }}</p>
+                    </div>
+                    <div class="field">
+                        <label class="label">{{ $t('auth.forms.password') }}</label>
+                        <div class="control">
+                            <input id="password" type="password" class="input" v-model="password" required />
+                        </div>
+                        <p class="help is-danger" v-if="validationErrors.password">{{ validationErrors.password.toString() }}</p>
+                    </div>
+                    <div class="field">
+                        <label class="label">{{ $t('auth.forms.password_confirmation') }}</label>
+                        <div class="control">
+                            <input id="password_confirmation" type="password" class="input" v-model="password_confirmation" required />
+                        </div>
+                        <p class="help is-danger" v-if="validationErrors.password_confirmation">{{ validationErrors.password_confirmation.toString() }}</p>
+                    </div>
+                    <div class="field is-grouped">
+                        <div class="control">
+                            <button type="submit" class="button is-link" @click="handleSubmit">{{ $t('auth.register') }}</button>
+                        </div>
+                        <div class="control">
+                            <router-link :to="{ name: 'login' }" class="button is-text">{{ $t('commons.cancel') }}</router-link>
+                        </div>
+                    </div>
+                </form>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+    export default {
+        data(){
+            return {
+                token : '',
+                email : '',
+                password : '',
+                password_confirmation : '',
+                validationErrors: {}
+            }
+        },
+
+        created () {
+            this.email = this.$route.query.email
+            this.token = this.$route.params.token
+        },
+
+        methods : {
+            handleSubmit(e) {
+                e.preventDefault()
+
+                axios.post('api/password/reset', {
+                    email: this.email,
+                    password: this.password,
+                    password_confirmation : this.password_confirmation,
+                    token: this.token
+                })
+                .then(response => {
+                    console.log(response)
+                    // localStorage.setItem('user',response.data.message.name)
+                    // localStorage.setItem('jwt',response.data.message.token)
+
+                    // if (localStorage.getItem('jwt') != null){
+                    //     this.$router.go('/');
+                    // }
+                })
+                .catch(error => {
+                    console.log(error.response)
+                    if( error.response.data.errors ) {
+                        this.validationErrors = error.response.data.errors
+                    }
+                    else {
+                        this.$router.push({ name: 'genericError', params: { err: error.response.data.message } });
+                    }
+                });
+            }
+        },
+    }
+</script>