Validation dei campi di registrazione: OK

Invio al server e scrittura su DB: OK
This commit is contained in:
paolo
2018-10-15 21:58:29 +02:00
parent d261ed8ea8
commit e6808f6214
2 changed files with 68 additions and 50 deletions

View File

@@ -13,10 +13,12 @@
<q-field <q-field
:helper="$t('reg.richiesto')" :helper="$t('reg.richiesto')"
:error="$v.form.email.$error" :error="$v.form.email.$error"
:error-label="$t('reg.email') + ` ${errorMsg($v.form.email)}`" :error-label="`${errorMsg('email', $v.form.email)}`"
> >
<q-input <q-input
v-model="form.email" v-model="form.email"
:value="form.email"
@change="val => { form.email = val }"
:before="[{icon: 'mail', handler () {}}]" :before="[{icon: 'mail', handler () {}}]"
@blur="$v.form.email.$touch" @blur="$v.form.email.$touch"
:error="$v.form.email.$error" :error="$v.form.email.$error"
@@ -27,10 +29,11 @@
<q-field <q-field
:helper="$t('reg.richiesto')" :helper="$t('reg.richiesto')"
:error="$v.form.username.$error" :error="$v.form.username.$error"
:error-label="$t('reg.username') + ` ${errorMsg($v.form.username)}`" :error-label="`${errorMsg('username', $v.form.username)}`"
> >
<q-input <q-input
v-model="form.username" :value="form.username"
@change="val => { form.username = val }"
:before="[{icon: 'person', handler () {}}]" :before="[{icon: 'person', handler () {}}]"
@blur="$v.form.username.$touch" @blur="$v.form.username.$touch"
:error="$v.form.username.$error" :error="$v.form.username.$error"
@@ -41,7 +44,7 @@
<q-field <q-field
:helper="$t('reg.richiesto')" :helper="$t('reg.richiesto')"
:error="$v.form.password.$error" :error="$v.form.password.$error"
:error-label="$t('reg.password') + ` ${errorMsg($v.form.password)}`" :error-label="`${errorMsg('password', $v.form.password)}`"
> >
<q-input <q-input
v-model="form.password" v-model="form.password"
@@ -54,22 +57,22 @@
<q-field <q-field
:helper="$t('reg.richiesto')" :helper="$t('reg.richiesto')"
:error="$v.form.confirmpassword.$error" :error="$v.form.repeatPassword.$error"
:error-label="$t('reg.password') + ` ${errorMsg($v.form.confirmpassword)}`" :error-label="`${errorMsg('repeatpassword', $v.form.repeatPassword)}`"
> >
<q-input <q-input
v-model="form.confirmpassword" v-model="form.repeatPassword"
:before="[{icon: 'vpn_key', handler () {}}]" :before="[{icon: 'vpn_key', handler () {}}]"
@blur="$v.form.confirmpassword.$touch" @blur="$v.form.repeatPassword.$touch"
:error="$v.form.confirmpassword.$error" :error="$v.form.repeatPassword.$error"
:float-label="$t('reg.confirmpassword')" :float-label="$t('reg.repeatPassword')"
/> />
</q-field> </q-field>
<q-field <q-field
:helper="$t('reg.richiesto')" :helper="$t('reg.richiesto')"
:error="$v.form.terms.$error" :error="$v.form.terms.$error"
:error-label="$t('reg.terms') + ` ${errorMsg($v.form.terms)}`" :error-label="`${errorMsg('terms', $v.form.terms)}`"
> >
<q-checkbox <q-checkbox
@@ -108,8 +111,6 @@
import axios from 'axios'; import axios from 'axios';
import { debounce } from 'quasar'
export default { export default {
data() { data() {
@@ -119,7 +120,7 @@
email: process.env.TEST_EMAIL, email: process.env.TEST_EMAIL,
username: process.env.TEST_USERNAME, username: process.env.TEST_USERNAME,
password: process.env.TEST_PASSWORD, password: process.env.TEST_PASSWORD,
confirmpassword: process.env.TEST_PASSWORD, repeatPassword: process.env.TEST_PASSWORD,
dateOfBirth: '', dateOfBirth: '',
terms: true, terms: true,
}, },
@@ -152,35 +153,30 @@
form: { form: {
email: { email: {
required, email, required, email,
isUnique: value => {
if (value === '') return true;
return axios.get(process.env.MONGODB_HOST + '/email/' + value)
.then(res => {
return (res.status !== 200)
}).catch((e) => {
return true;
})
}
}, },
password: {required, minLength: minLength(8), maxLength: maxLength(20)}, password: {required, minLength: minLength(8), maxLength: maxLength(20)},
username: { username: {
required, minLength: minLength(6), maxLength: maxLength(20), required, minLength: minLength(6), maxLength: maxLength(20),
unique: value => { isUnique: value => {
if (value === '') return true; if (value === '') return true;
debounce(function() { return axios.get(process.env.MONGODB_HOST + '/users/' + value)
return axios.get(process.env.MONGODB_HOST + '/users/' + value) .then(res => {
.then(res => { return (res.status !== 200)
console.log("STATUS: "); }).catch((e) => {
console.log(res.status); return true;
if (res.status !== 200) })
return true;
else
return false;
}).then(ris => {
setTimeout(() => {
//
return ris;
}, 1000);
})
.catch((e) => {
console.log(e);
return true;
})
}, 2000);
} }
}, },
confirmpassword: { repeatPassword: {
sameAsPassword: sameAs('password') sameAsPassword: sameAs('password')
}, },
terms: {required}, terms: {required},
@@ -191,20 +187,40 @@
...mapActions("user", { ...mapActions("user", {
signup: types.USER_SIGNUP, signup: types.USER_SIGNUP,
}), }),
errorMsg(item) { errorMsg(cosa, item) {
if (!item.$error) return ''; try {
if (item.$params.email && !item.email) return this.$t('reg.err.email'); if (!item.$error) return '';
if (!item.required) return this.$t('reg.err.required'); if (item.$params.email && !item.email) return this.$t('reg.err.email');
if (!item.minLength) return this.$t('reg.err.atleast') + ` ${item.$params.minLength.min} ` + this.$t('reg.err.char');
if (!item.maxLength) return this.$t('reg.err.notmore') + ` ${item.$params.maxLength.max} ` + this.$t('reg.err.char'); if (cosa === 'repeatpassword') {
return ''; if (!item.sameAsPassword) {
return this.$t('reg.err.sameaspassword');
}
}
if (cosa === 'email') {
//console.log("EMAIL " + item.isUnique);
//console.log(item);
if (!item.isUnique) return this.$t('reg.err.duplicate_email');
} else if (cosa === 'username') {
//console.log(item);
if (!item.isUnique) return this.$t('reg.err.duplicate_username');
}
if (!item.required) return this.$t('reg.err.required');
if (!item.minLength) return this.$t('reg.err.atleast') + ` ${item.$params.minLength.min} ` + this.$t('reg.err.char');
if (!item.maxLength) return this.$t('reg.err.notmore') + ` ${item.$params.maxLength.max} ` + this.$t('reg.err.char');
return '';
} catch (error) {
//console.log("ERR : " + error);
}
}, },
checkErrors(riscode){ checkErrors(riscode) {
//console.log("RIS = " + riscode); //console.log("RIS = " + riscode);
if (riscode === Errori_MongoDb.DUPLICATE_EMAIL_ID) { if (riscode === Errori_MongoDb.DUPLICATE_EMAIL_ID) {
this.$q.notify(this.$t('reg.err.duplicate_email')); this.$q.notify(this.$t('reg.err.duplicate_email'));
}else if (riscode === Errori_MongoDb.DUPLICATE_USERNAME_ID) { } else if (riscode === Errori_MongoDb.DUPLICATE_USERNAME_ID) {
this.$q.notify(this.$t('reg.err.duplicate_username')); this.$q.notify(this.$t('reg.err.duplicate_username'));
} else if (riscode === Errori_MongoDb.OK) { } else if (riscode === Errori_MongoDb.OK) {
this.$router.push('/'); this.$router.push('/');
} else { } else {

View File

@@ -10,7 +10,7 @@ const messages = {
email: 'Email', email: 'Email',
username : 'Nome Utente', username : 'Nome Utente',
password: 'Password', password: 'Password',
confirmpassword: 'Ripeti password', repeatPassword: 'Ripeti password',
terms: "Accetti i termini e le condizioni?", terms: "Accetti i termini e le condizioni?",
err: { err: {
required: 'è richiesto', required: 'è richiesto',
@@ -21,7 +21,8 @@ const messages = {
char: 'caratteri', char: 'caratteri',
terms: 'Devi accettare le condizioni, per continuare.', terms: 'Devi accettare le condizioni, per continuare.',
duplicate_email: 'l\'Email è già stata registrata', duplicate_email: 'l\'Email è già stata registrata',
duplicate_username: 'L\'Username è stato già utilizzato' duplicate_username: 'L\'Username è stato già utilizzato',
sameaspassword: 'Le password devono essere identiche',
} }
}, },
}, },
@@ -36,7 +37,7 @@ const messages = {
email: 'Email', email: 'Email',
username : 'Username', username : 'Username',
password: 'Password', password: 'Password',
confirmpassword: 'Repeat password', repeatPassword: 'Repeat password',
terms: "Do you agree with the terms & conditions?", terms: "Do you agree with the terms & conditions?",
err: { err: {
required: 'is required', required: 'is required',
@@ -47,7 +48,8 @@ const messages = {
char: 'characters long', char: 'characters long',
terms: 'You need to agree with the terms & conditions.', terms: 'You need to agree with the terms & conditions.',
duplicate_email: 'Email was already registered', duplicate_email: 'Email was already registered',
duplicate_username: 'Username is already taken' duplicate_username: 'Username is already taken',
sameaspassword: 'Passwords must be identical',
} }
}, },
}, },