extern/2FAuth
1
0
Fork 0
mirror of https://github.com/Bubka/2FAuth.git synced 2025-06-29 08:21:51 +02:00
Code Issues Packages Projects Releases Wiki Activity

Error handling and validation during registration

Browse Source
This commit is contained in:
Bubka 2020-01-06 17:23:54 +01:00
parent 50bccf1526
commit c5161b880f
1 changed files with 34 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

47
resources/js/views/Register.vue
View File

@ -7,26 +7,30 @@
<div class="field"> <div class="field">
<label class="label">Name</label> <label class="label">Name</label>
<div class="control"> <div class="control">
<input id="name" type="email" class="input" v-model="name" required autofocus /> <input id="name" type="email" class="input" v-model="name" v-bind:class="{ 'is-danger' : nameMissing }" required autofocus />
</div> </div>
<p class="help is-danger" v-if="nameMissing">Field required</p>
</div> </div>
<div class="field"> <div class="field">
<label class="label">Email</label> <label class="label">Email</label>
<div class="control"> <div class="control">
<input id="email" type="email" class="input" v-model="email" required /> <input id="email" type="email" class="input" v-model="email" v-bind:class="{ 'is-danger' : emailMissing }" required />
</div> </div>
<p class="help is-danger" v-if="emailMissing">Field required</p>
</div> </div>
<div class="field"> <div class="field">
<label class="label">Password</label> <label class="label">Password</label>
<div class="control"> <div class="control">
<input id="password" type="password" class="input" v-model="password" required /> <input id="password" type="password" class="input" v-model="password" v-bind:class="{ 'is-danger' : passwordMissing }" required />
</div> </div>
<p class="help is-danger" v-if="passwordMissing">Field required</p>
</div> </div>
<div class="field"> <div class="field">
<label class="label">Confirm Password</label> <label class="label">Confirm Password</label>
<div class="control"> <div class="control">
<input id="password-confirm" type="password" class="input" v-model="password_confirmation" required /> <input id="password-confirm" type="password" class="input" v-model="password_confirmation" v-bind:class="{ 'is-danger' : passwordConfirmationMissing }" required />
</div> </div>
<p class="help is-danger" v-if="passwordConfirmationMissing">Field required</p>
</div> </div>
<div class="field"> <div class="field">
<div class="control"> <div class="control">
@ -34,6 +38,10 @@
</div> </div>
</div> </div>
</form> </form>
<br />
<span class="tag is-danger" v-if="errorMessage">
{{ errorMessage }}
</span>
</div> </div>
</div> </div>
</div> </div>
@ -43,16 +51,30 @@
export default { export default {
data(){ data(){
return { return {
name : "", name : '',
email : "", nameMissing : false,
password : "", email : '',
password_confirmation : "" emailMissing : false,
password : '',
passwordMissing : false,
password_confirmation : '',
passwordConfirmationMissing : false,
errorMessage : '',
} }
}, },
methods : { methods : {
handleSubmit(e) { handleSubmit(e) {
e.preventDefault() e.preventDefault()
this.nameMissing = (this.name.length === 0) ? true : false;
this.emailMissing = (this.email.length === 0) ? true : false;
this.passwordMissing = (this.password.length === 0) ? true : false;
this.passwordConfirmationMissing = (this.password_confirmation.length === 0) ? true : false;
if( this.nameMissing || this.emailMissing || this.passwordMissing || this.passwordConfirmationMissing ) {
return false;
}
if (this.password === this.password_confirmation && this.password.length > 0) if (this.password === this.password_confirmation && this.password.length > 0)
{ {
axios.post('api/register', { axios.post('api/register', {
@ -66,17 +88,16 @@
localStorage.setItem('jwt',response.data.success.token) localStorage.setItem('jwt',response.data.success.token)
if (localStorage.getItem('jwt') != null){ if (localStorage.getItem('jwt') != null){
this.$router.go('/') this.$router.push({name: 'accounts'});
} }
}) })
.catch(error => { .catch(error => {
console.error(error); console.error(error);
this.errorMessage = error.message
}); });
} else { } else {
this.password = "" this.errorMessage = 'Passwords do not match'
this.passwordConfirm = "" return false;
return alert('Passwords do not match')
} }
} }
}, },