surya/freeplanet
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Prima del salvataggio USER

Browse Source
This commit is contained in:
paolo
2018-10-14 22:10:00 +02:00
parent 43f2484e54
commit 01d5f3cec1
9 changed files with 217 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
.env
View File

@@ -1,5 +1,16 @@
VUE_APP_URL = "PROVA ENV! FUNZIONA"
PROVA_PAOLO = "PROVA ENV FUNZIONA!"
## SVILUPPO !!!
PAO_APP_ID = ''
MASTER_KEY = ''
VUE_APP_URL = "prova SVILUPPO!"
PROVA_PAOLO = "PROVA SVILUPPO"
MONGODB_HOST = 'http://localhost:3000'
PAO_APP_ID = 'KKPPAA5KJK435J3KSS9F9D8S9F8SD98F9SDF'
MASTER_KEY = 'KKPPSS5KJK435J3KSS9F9D8S9F8SD3CR3T'
LOGO_REG = quasar-logo-full.svg
TEST_EMAIL=paolo@prova.com
TEST_USERNAME = paoloar77
TEST_PASSWORD = mypassword

5
.env.development
View File

@@ -1,5 +0,0 @@
VUE_APP_URL = "prova SVILUPPO!"
PROVA_PAOLO = "PROVA SVILUPPO"
PAO_APP_ID = 'KKPPAA5KJK435J3KSS9F9D8S9F8SD98F9SDF'
MASTER_KEY = 'KKPPSS5KJK435J3KSS9F9D8S9F8SD3CR3T'

13
.env.production Normal file
View File

@@ -0,0 +1,13 @@
VUE_APP_URL = "PROVA ENV! FUNZIONA"
PROVA_PAOLO = "PROVA ENV FUNZIONA!"
PAO_APP_ID = ''
MASTER_KEY = ''
MONGODB_HOST = 'http://localhost:3000'
LOGO_REG = 'quasar-logo-full.svg'
TEST_EMAIL=
TEST_USERNAME =
TEST_PASSWORD =

1
quasar.conf.js
View File

@@ -80,6 +80,7 @@ module.exports = function (ctx) {
'QChip',
'QCollapsible',
'QInput',
'QCheckbox',
],
directives: [

164
src/components/views/login/signup.vue
View File

@@ -1,76 +1,168 @@
<template>
<div>
<!--Prova URL : {{envHelper('PROVA_PAOLO')}}-->
<q-page padding class="">
<div class="text-center">
<p>
<!--<img src="../../../assets/quasar-logo-full.svg">-->
<img :src="`../../../assets/`+`${env('LOGO_REG')}`">
</p>
</div>
<q-input
v-model="email"
@blur="$v.form.email.$touch"
:error="$v.form.email.$error"
:float-label="getFormSignup.email"
/>
<q-input
v-model="form.password"
@blur="$v.form.password.$touch"
:error="$v.form.password.$error"
float-label="Password"
/>
<!--Prova URL : {{env('PROVA_PAOLO')}}-->
<q-btn color="primary" @click="submit">Submit</q-btn>
<q-field
:helper="$t('reg.richiesto')"
:error="$v.form.email.$error"
:error-label="$t('reg.email') + ` ${errorMsg($v.form.email)}`"
>
<q-input
v-model="form.email"
:before="[{icon: 'mail', handler () {}}]"
@blur="$v.form.email.$touch"
:error="$v.form.email.$error"
:float-label="$t('reg.email')"
/>
</q-field>
<q-field
:helper="$t('reg.richiesto')"
:error="$v.form.username.$error"
:error-label="$t('reg.username') + ` ${errorMsg($v.form.username)}`"
>
<q-input
v-model="form.username"
:before="[{icon: 'person', handler () {}}]"
@blur="$v.form.username.$touch"
:error="$v.form.username.$error"
:float-label="$t('reg.username')"
/>
</q-field>
<q-field
:helper="$t('reg.richiesto')"
:error="$v.form.password.$error"
:error-label="$t('reg.password') + ` ${errorMsg($v.form.password)}`"
>
<q-input
v-model="form.password"
:before="[{icon: 'vpn_key', handler () {}}]"
@blur="$v.form.password.$touch"
:error="$v.form.password.$error"
:float-label="$t('reg.password')"
/>
</q-field>
<q-field
:helper="$t('reg.richiesto')"
:error="$v.form.confirmpassword.$error"
:error-label="$t('reg.password') + ` ${errorMsg($v.form.confirmpassword)}`"
>
<q-input
v-model="form.confirmpassword"
:before="[{icon: 'vpn_key', handler () {}}]"
@blur="$v.form.confirmpassword.$touch"
:error="$v.form.confirmpassword.$error"
:float-label="$t('reg.confirmpassword')"
/>
</q-field>
<q-field
:helper="$t('reg.richiesto')"
:error="$v.form.terms.$error"
:error-label="$t('reg.terms') + ` ${errorMsg($v.form.terms)}`"
>
<q-checkbox
v-model="form.terms"
:before="[{icon: 'vpn_key', handler () {}}]"
color="secondary"
@blur="$v.form.terms.$touch"
:error="$v.form.terms.$error"
:float-label="$t('reg.terms')"
:label="$t('reg.terms')"
/>
</q-field>
<q-btn color="primary" @click="submit">Submit</q-btn>
</q-page>
</div>
</template>
<script>
import {required, email} from 'vuelidate/lib/validators'
import {
required,
email,
numeric,
minValue,
minLength,
maxLength,
sameAs,
requiredUnless
} from 'vuelidate/lib/validators'
import {mapGetters} from 'vuex'
import {mapGetters, mapActions} from 'vuex'
import * as types from '../../../store/mutation-types'
export default {
data() {
return {
url: process.env.VUE_APP_URL,
form: {
email: '',
username: '',
email: process.env.TEST_EMAIL,
username: process.env.TEST_USERNAME,
password: process.env.TEST_PASSWORD,
confirmpassword: process.env.TEST_PASSWORD,
dateOfBirth: '',
password: '',
terms: false,
terms: true,
}
}
},
computed:{
computed: {
...mapGetters("glob", [
'getUsername',
'getPassword',
'getEmail',
'getDateOfBirth',
]),
envHelper(){
env() {
return env
}
},
validations: {
form: {
email: {required, email},
password: {required, minLen: minLength(6)},
confirmPassword: {
sameAs: sameAs(vm => {
return vm.password
})
},
terms: {
required: requiredUnless(vm => {
return vm.country === 'germany'
})
password: {required, minLength: minLength(8), maxLength: maxLength(20)},
username: {required, minLength: minLength(6), maxLength: maxLength(20)},
confirmpassword: {
sameAsPassword: sameAs('password')
},
terms: { required },
}
},
methods: {
...mapActions("user", {
signup: types.USER_SIGNUP,
}),
errorMsg(item) {
if (!item.$error) return '';
if (item.$params.email && !item.email) return this.$t('reg.err.email');
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 '';
},
submit() {
this.$v.form.$touch();
if (!this.form.terms) {
this.$q.notify(this.$t('reg.err.terms'));
return
}
if (this.$v.form.$error) {
this.$q.notify('Please review fields again.')
this.$q.notify(this.$t('reg.err.errore_generico'));
return
}
@@ -81,12 +173,12 @@
dateOfBirth: this.dateOfBirth,
confirmPassword: this.confirmPassword,
terms: this.terms,
}
};
console.log(formData);
this.$store.dispatch('signup', formData)
this.signup(formData);
// ...
}
}
},
}
</script>

53
src/i18n.js
View File

@@ -1,19 +1,52 @@
const messages = {
enUs: {
msg: {
hello: 'Hello!',
myAppName: 'FreePlanet',
myDescriz: 'The first Free app for Everyone'
}
},
it: {
msg: {
hello: 'Buongiorno!',
myAppName: 'FreePlanet',
myDescriz: 'La prima App Libera e per Tutti'
}
}
},
reg: {
richiesto: '* Richiesto',
email: 'Email',
username : 'Nome Utente',
password: 'Password',
confirmpassword: 'Ripeti password',
terms: "Accetti i termini e le condizioni?",
err: {
required: 'è richiesto',
email: 'dev\'essere una email valida',
errore_generico: 'Si prega di compilare correttamente i campi',
atleast: 'dev\'essere lungo almeno di',
notmore: 'non dev\'essere lungo più di',
char: 'caratteri',
terms: 'Devi accettare le condizioni, per continuare.'
}
},
},
enUs: {
msg: {
hello: 'Hello!',
myAppName: 'FreePlanet',
myDescriz: 'The first Free app for Everyone'
},
reg: {
richiesto: '* Required',
email: 'Email',
username : 'Username',
password: 'Password',
confirmpassword: 'Repeat password',
terms: "Do you agree with the terms & conditions?",
err: {
required: 'is required',
email: 'must be a valid email',
errore_generico: 'Please review fields again',
atleast: 'must be at least',
notmore: 'must not be more than',
char: 'characters long',
terms: 'You need to agree with the terms & conditions.'
}
},
},
};
export default messages;

2
src/store/index.js
View File

@@ -3,6 +3,7 @@ import Vuex from 'vuex'
import example from './module-example/index'
import glob from './modules/glob';
import user from './modules/user';
import types from './mutation-types'
Vue.use(Vuex);
@@ -16,6 +17,7 @@ Vue.filter('time', timestamp => {
export default new Vuex.Store({
modules: {
glob,
user,
example
},

2
src/store/mutation-types.js
View File

@@ -14,6 +14,8 @@ export const USER_EMAIL = 'email';
export const USER_PASSWORD = 'password';
export const USER_DATEOFBIRTH = 'dateofbirth';
export const USER_SIGNUP = 'signup';

13
tools/tools.js Normal file
View File

@@ -0,0 +1,13 @@
var sendRequest = function (url, method, body)
{
const options = {
method: method,
mode: 'no-cors',
headers: new Headers({'content-type': 'application/json'}),
mode: 'no-cors'
};
options.body = JSON.stringify(body);
return fetch(url, options);
}();