104 lines
4.2 KiB
Vue
104 lines
4.2 KiB
Vue
<template>
|
||
|
||
<div id='SIGNUP-FORM' :class='gstore.signupform ? "active" : ""'>
|
||
|
||
<!-- Header -->
|
||
<div class='head'>
|
||
<span>Création d'un compte</span>
|
||
<i></i>
|
||
</div>
|
||
|
||
<!-- Body -->
|
||
<div class='body'>
|
||
<form @submit.prevent='create_account'>
|
||
<label for='username'>Nom d'utilisateur</label>
|
||
<input :class='err_username ? "err" : ""' v-model='username_val' type='text' id='username'>
|
||
<label for='mail'>Adresse mail</label>
|
||
<input :class='err_mail ? "err" : ""' v-model='mail_val' type='email' id='mail'>
|
||
<label for='password'>Mot de passe</label>
|
||
<input v-model='password_val' type='password' id='password'>
|
||
<p v-if='err_username || err_mail || err_unknow' id='msg-err'>{{ err_message }}</p>
|
||
<button id='btn-create-account'>Créer mon compte</button>
|
||
<p @click='redirect_login' id='membre'>Déjà membre ? Connectez-vous !</p>
|
||
</form>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
name: 'SIGNUP_FORM',
|
||
data(){
|
||
return {
|
||
gstore: gstore.data,
|
||
username_val: '',
|
||
mail_val: '',
|
||
password_val: '',
|
||
err_username: false,
|
||
err_mail: false,
|
||
err_unknow: false,
|
||
err_message: ''
|
||
};
|
||
},
|
||
methods: {
|
||
create_account() {
|
||
const const_username = this.username_val;
|
||
const const_mail = this.mail_val;
|
||
const const_password = this.password_val;
|
||
|
||
let request = {
|
||
username: const_username,
|
||
mail: const_mail,
|
||
password: const_password
|
||
};
|
||
|
||
api.call("POST user/signup", request, function (response) {
|
||
/* (1) Check if is there an error and display theme that goes with */
|
||
if (response.error == 17 && response.ErrorDescription.indexOf('mail') !== -1) {
|
||
this.err_username = false;
|
||
this.err_mail = true;
|
||
this.err_unknow = false;
|
||
this.err_message = 'Le mail est invalide';
|
||
}
|
||
else if (response.error == 17 && response.ErrorDescription.indexOf('username') !== -1) {
|
||
this.err_username = true;
|
||
this.err_mail = false;
|
||
this.err_unknow = false;
|
||
this.err_message = 'Le nom d\'utilisateur a des caractères invalides';
|
||
}
|
||
else if (response.error == 29) {
|
||
this.err_username = true;
|
||
this.err_mail = true;
|
||
this.err_unknow = false;
|
||
this.err_message = 'Le nom d\'utilisateur ou le mail est déjà pris';
|
||
}
|
||
else if (!response.registered) {
|
||
this.err_username = false;
|
||
this.err_mail = false;
|
||
this.err_unknow = true;
|
||
this.err_message = 'Impossible de créer le compte pour le moment, veuillez réessayer plus tard';
|
||
}
|
||
/* (2) Close the sign up form authentication */
|
||
else {
|
||
infobox._display('Inscription terminée ! Connexion en cours ...', 'info', 3000);
|
||
|
||
let request = {
|
||
username: const_username,
|
||
password: const_password
|
||
};
|
||
|
||
api.call("POST user/login", request, function (response) {
|
||
document.location = '';
|
||
});
|
||
}
|
||
}.bind(this));
|
||
},
|
||
redirect_login() {
|
||
this.gstore.signupform = false;
|
||
this.gstore.loginform = true;
|
||
}
|
||
}
|
||
}
|
||
</script> |