diff --git a/resources/assets/scripts/components/Flash.vue b/resources/assets/scripts/components/Flash.vue index 860d94749..8da4dfd5a 100644 --- a/resources/assets/scripts/components/Flash.vue +++ b/resources/assets/scripts/components/Flash.vue @@ -12,7 +12,7 @@ - diff --git a/resources/assets/scripts/components/auth/LoginForm.ts b/resources/assets/scripts/components/auth/LoginForm.ts new file mode 100644 index 000000000..3ca24ec86 --- /dev/null +++ b/resources/assets/scripts/components/auth/LoginForm.ts @@ -0,0 +1,112 @@ +import Vue from 'vue'; +import {isObject} from 'lodash'; + +export default Vue.component('login-form', { + props: { + user: { + type: Object, + required: false, + default: function () { + return { + email: '', + password: '', + }; + }, + } + }, + data: function () { + return { + showSpinner: false, + } + }, + mounted: function () { + (this.$refs.email as HTMLElement).focus(); + }, + methods: { + // Handle a login request eminating from the form. If 2FA is required the + // user will be presented with the 2FA modal window. + submitForm: function () { + const self = this; + this.$data.showSpinner = true; + + this.$flash.clear(); + this.$store.dispatch('auth/login', {user: this.$props.user.email, password: this.$props.user.password}) + .then(response => { + if (response.complete) { + return window.location = response.intended; + } + + this.$props.user.password = ''; + this.$data.showSpinner = false; + this.$router.push({name: 'checkpoint', query: {token: response.token}}); + }) + .catch(err => { + this.$props.user.password = ''; + this.$data.showSpinner = false; + (this.$refs.password as HTMLElement).focus(); + this.$store.commit('auth/logout'); + + if (!err.response) { + return console.error(err); + } + + const response = err.response; + if (response.data && isObject(response.data.errors)) { + response.data.errors.forEach(function (error: any) { + self.$flash.error(error.detail); + }); + } + }); + }, + + // Update the email address associated with the login form + // so that it is populated in the parent model automatically. + updateEmail: function (event: { target: HTMLInputElement }) { + this.$emit('update-email', event.target.value); + } + }, + template: ` +
+
+
+ + +
+
+
+
+ + +
+
+
+ +
+
+ + {{ $t('auth.forgot_password.label') }} + +
+
+ `, +}); diff --git a/resources/assets/scripts/components/auth/LoginForm.vue b/resources/assets/scripts/components/auth/LoginForm.vue deleted file mode 100644 index 84770b379..000000000 --- a/resources/assets/scripts/components/auth/LoginForm.vue +++ /dev/null @@ -1,115 +0,0 @@ - - - diff --git a/resources/assets/scripts/components/auth/ResetPassword.vue b/resources/assets/scripts/components/auth/ResetPassword.vue index 1e84e2738..451b78ac8 100644 --- a/resources/assets/scripts/components/auth/ResetPassword.vue +++ b/resources/assets/scripts/components/auth/ResetPassword.vue @@ -55,7 +55,7 @@ -