Merge pull request #9 from paoloar77/developing

Developing

config/envparser.js

@@ -12,7 +12,7 @@ switch (process.env.NODE_ENV) {
     path = `.env`
 }
 
-console.log("PATH", path)
+// console.log("PATH", path)
 const parsedEnv = DotEnv.config({ path }).parsed;
 
 module.exports = function () {

package-lock.json

@@ -10537,6 +10537,19 @@
       "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.1.15.tgz",
       "integrity": "sha512-6uHUhOPEBgQ24HM+r6b/QwWfZq+yiFcipKFrOFiBEnWdy5sdzYoi+pJeQaPI5qOLRFqWmAXUPQNsielzdLoecA=="
     },
+    "graphql": {
+      "version": "0.13.2",
+      "resolved": "http://registry.npmjs.org/graphql/-/graphql-0.13.2.tgz",
+      "integrity": "sha512-QZ5BL8ZO/B20VA8APauGBg3GyEgZ19eduvpLWoq5x7gMmWnHoy8rlQWPLmWgFvo1yNgjSEFMesmS4R6pPr7xog==",
+      "requires": {
+        "iterall": "1.2.2"
+      }
+    },
+    "graphql-tag": {
+      "version": "2.10.0",
+      "resolved": "https://registry.npmjs.org/graphql-tag/-/graphql-tag-2.10.0.tgz",
+      "integrity": "sha512-9FD6cw976TLLf9WYIUPCaaTpniawIjHWZSwIRZSjrfufJamcXbVVYfN2TWvJYbw0Xf2JjYbl1/f2+wDnBVw3/w=="
+    },
     "growly": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/growly/-/growly-1.3.0.tgz",
@@ -11883,6 +11896,11 @@
         "handlebars": "4.0.12"
       }
     },
+    "iterall": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/iterall/-/iterall-1.2.2.tgz",
+      "integrity": "sha512-yynBb1g+RFUPY64fTrFv7nsjRrENBQJaX2UL+2Szc9REFrSNm1rpSXHGzhmAy7a9uv3vlvgBlXnf9RqmPH1/DA=="
+    },
     "javascript-stringify": {
       "version": "1.6.0",
       "resolved": "https://registry.npmjs.org/javascript-stringify/-/javascript-stringify-1.6.0.tgz",

src/i18n.js

@@ -12,12 +12,23 @@ const messages = {
       home: 'Principale',
       SignUp: 'Registrazione',
       SignIn: 'Login',
+      vreg: 'Verifica Reg',
       Test: 'Test',
     },
     components: {
       authentication:{
         login: {
           facebook: 'Facebook'
+        },
+        email_verification: {
+          title: 'Inizia la tua registrazione',
+          introduce_email: 'inserisci la tua email',
+          email: 'Email',
+          invalid_email: 'La tua email è invalida',
+          verify_email: 'Verifica la tua email',
+          go_login: 'Torna al Login',
+          incorrect_input: 'Inserimento incorretto.',
+          link_sent: 'Per confermare la Registrazione, leggi la tua casella di posta e Clicca su "Verifica Email".\nSe non la trovi, cerca nella cartella Spam.'
         }
       }
     },
@@ -85,12 +96,23 @@ const messages = {
       home: 'Dashboard One',
       SignUp: 'SignUp',
       SignIn: 'SignIn',
+      vreg: 'Verify Reg',
       Test: 'Test',
     },
     components: {
       authentication:{
         login: {
           facebook: 'Facebook'
+        },
+        email_verification: {
+          title: 'Begin your registration',
+          introduce_email: 'Enter your email',
+          email: 'Email',
+          invalid_email: 'Your email is invalid',
+          verify_email: 'Verify your email',
+          go_login: 'Back to Login',
+          incorrect_input: 'Incorrect input.',
+          link_sent: 'To confirm the Registration, read your mailbox and click on "Verify email".\nIf you can not find it check your junk mail or spam.'
         }
       }
     },

src/layouts/drawer/drawer.vue

@@ -1,6 +1,5 @@
 <template>
     <div>
-        User: {{ Username}}
         <div id="profile" v-if="Username">
             <img :src="photo" style='height: 80px' class="inline-block">
             <img src="../img/avatar-1.svg" id="avatar" class="inline-block">
@@ -50,7 +49,6 @@
       console.log('Drawer created...')
     }
 
-
     photo = ''
     user = null
     links = {
@@ -59,6 +57,7 @@
           {route: '/', faIcon: 'fa fa-home', materialIcon: 'home', name: 'pages.home'},
           {route: '/signup', faIcon: 'fa fa-signup', materialIcon: 'login', name: 'pages.SignUp'},
           {route: '/signin', faIcon: 'fa fa-login', materialIcon: 'login', name: 'pages.SignIn'},
+          /* {route: '/vreg?idlink=aaa', faIcon: 'fa fa-login', materialIcon: 'login', name: 'pages.vreg'},*/
           ],
         show: true
       },

src/model/other.ts

@@ -5,7 +5,7 @@ export interface IToken {
 
 
 export interface ILinkReg {
-  idLink: string
+  idlink: string
 }
 
 export interface IIdToken {

src/pages/dashboard/home.vue

@@ -0,0 +1,10 @@
+<template>
+  <q-page>Prova pagina</q-page>
+</template>
+
+<script>
+
+export default {
+  // name: 'PageName',
+}
+</script>

src/plugins/guard.js

@@ -0,0 +1,50 @@
+// import something here
+
+// leave the export, even if you don't use it
+export default ({ app, router, store, Vue }) => {
+  // something to do
+
+  // ******************************************
+  // *** Per non permettere di accedere alle pagine in cui è necessario essere Loggati ! ***
+  // ******************************************
+
+  /*
+  router.beforeEach((to, from, next) => {
+    var accessToken = store.state.session.userSession.accessToken
+    // ESTANDO LOGEADO
+    if (accessToken) {
+      // SE PERMITE IR DE AREA PUBLICA A PRIVADA
+      if (!from.matched.some(record => record.meta.requiresAuth) && to.matched.some(record => record.meta.requiresAuth)) {
+        next()
+      }
+      // SE PERMITE IR DE UNA AREA PRIVADA A OTRA PRIVADA
+      if (from.matched.some(record => record.meta.requiresAuth) && to.matched.some(record => record.meta.requiresAuth)) {
+        next()
+      }
+      // NO SE PERMITE IR A UN AREA PUBLICA DESDE UN AREA PRIVADA
+      if (from.matched.some(record => record.meta.requiresAuth) && !to.matched.some(record => record.meta.requiresAuth)) {
+        next(false)
+      }
+      // SE REDIRIJE AL PANEL
+      if (!from.matched.some(record => record.meta.requiresAuth) && !to.matched.some(record => record.meta.requiresAuth)) {
+        next('/Panel')
+      }
+      // NO ESTA LOGEADO
+    } else {
+      // SE PERMITE IR DE UNA AREA PUBLICA A OTRA PUBLICA
+      if (!from.matched.some(record => record.meta.requiresAuth) && !to.matched.some(record => record.meta.requiresAuth)) {
+        next()
+      }
+      // SE PERMITE IR DE UNA AREA PRIVADA A UNA PUBLICA (LOGOUT)
+      if (from.matched.some(record => record.meta.requiresAuth) && !to.matched.some(record => record.meta.requiresAuth)) {
+        next()
+      }
+      // NO SE PERMITE IR DE UNA AREA PUBLICA A UNA PRIVADA
+      if (!from.matched.some(record => record.meta.requiresAuth) && to.matched.some(record => record.meta.requiresAuth)) {
+        // REDIRIGIR A LOGIN
+        next('/')
+      }
+    }
+  })
+  */
+}

src/root/home/home.ts

@@ -12,6 +12,7 @@ export default class Home extends Vue {
   visibile: boolean = false
   cardvisible: string = 'hidden'
   displaycard: string = 'block'
+  $t: any
 
   public $q
 

src/router/route-config.ts

@@ -2,7 +2,6 @@ import { RouteConfig as VueRouteConfig } from 'vue-router'
 
 import { RouteNames } from './route-names'
 
-
 export const RouteConfig: VueRouteConfig[] = [
   {
     component: () => import('@/root/home/home.vue'),
@@ -10,11 +9,27 @@ export const RouteConfig: VueRouteConfig[] = [
     path: '/',
     meta: { name: 'Home' }
   },
-   { path: '/test', component: () => import('@/views/login/test.vue'), meta: { name: 'Test' } },
+  {
-  { path: '/signup', component: () => import('@/views/login/signup/signup.vue'), meta: { name: 'Registration' } },
+    path: '/test',
-  { path: '/signin', component: () => import('@/views/login/signin/signin.vue'), meta: { name: 'Login' } }
+    component: () => import('@/views/login/test.vue'),
+    meta: { name: 'Test' }
+  },
+  {
+    path: '/signup',
+    component: () => import('@/views/login/signup/signup.vue'),
+    meta: { name: 'Registration' }
+  },
+  {
+    path: '/signin',
+    component: () => import('@/views/login/signin/signin.vue'),
+    meta: { name: 'Login' }
+  },
+  {
+    path: '/vreg',
+    component: () => import('@/views/login/vreg/vreg.vue'),
+    meta: { name: 'Verify Reg' }
+  }
   /*
-  { path: '/vreg', component: () => import('@/views/login/vreg.vue'), meta: { name: 'Verify Reg' } },
   {
     path: '/requestresetpwd',
     component: () => import('@/views/login/requestresetpwd.vue'),
@@ -24,7 +39,9 @@ export const RouteConfig: VueRouteConfig[] = [
     path: '/updatepwd',
     component: () => import('@/views/login/updatepassword.vue'),
     meta: { name: 'Update your Password' }
-  },
+  }
+
+
   {
     path: '/simpleform',
     component: () => import('@/views/form/simpleForm/simpleForm.vue'),

src/store/Modules/UserStore.ts

@@ -6,6 +6,7 @@ import router from '@router'
 
 import { serv_constants } from '../Modules/serv_constants'
 import { rescodes } from '../Modules/rescodes'
+import { UserStore } from "@store"
 
 const bcrypt = require('bcryptjs')
 
@@ -85,6 +86,7 @@ namespace Mutations {
 
   function setlang(state: IUserState, newstr: string) {
     state.lang = newstr
+    localStorage.setItem('lang', state.lang)
   }
 
   function UpdatePwd(state: IUserState, data: IIdToken) {
@@ -108,6 +110,14 @@ namespace Mutations {
   }
 
   function autologin (state: IUserState) {
+    // INIT
+    UserStore.mutations.setlang(process.env.LANG_DEFAULT)
+    // ++Todo: Estrai la Lang dal Localstorage
+    const lang = localStorage.getItem('lang')
+    if (lang) {
+      UserStore.mutations.setlang(lang)
+    }
+
     const token = localStorage.getItem('token')
     if (!token) {
       return
@@ -245,7 +255,7 @@ namespace Actions {
     let usertosend = {
       keyappid: process.env.PAO_APP_ID,
       idapp: process.env.APP_ID,
-      idLink: paramquery.idLink
+      idlink: paramquery.idlink
     }
     console.log(usertosend)
 
@@ -253,7 +263,7 @@ namespace Actions {
 
     let myres
 
-    return Api.SendReq(call, state.lang, Getters.getters.tok, 'POST', usertosend)
+    return await Api.SendReq(call, state.lang, Getters.getters.tok, 'POST', usertosend)
       .then((res) => {
         console.log(res)
         myres = res

src/store/mutation-types.ts

@@ -1,24 +1,9 @@
-export const SET_VALUE = 'SET_VALUE'
-export const SET_DEFFERED_PROMPT = 'defprompt'
 export const SET_LOGIN_PAGE = 'setloginpage'
 export const SET_LAYOUT_NEEDED = 'setlayneeded'
-export const SET_MOBILE_MODE = 'setmobilemode'
-export const SET_MENU_COLLAPSED = 'setmenucoll'
 export const SET_POSTS = 'setposts'
-export const SET_FORM_SIGNUP = 'formsignup'
 
 // USER:
-export const USER_REC = 'user_rec'
-export const USER_USERNAME = 'username'
-export const USER_EMAIL = 'email'
-export const USER_LANG = 'lang'
-export const USER_PASSWORD = 'password'
-export const USER_DATEOFBIRTH = 'dateofbirth'
 
-export const USER_SIGNUP = 'signup'
-export const USER_SIGNIN = 'signin'
-export const USER_AUTOLOGIN = 'autologin'
-export const USER_LOGOUT = 'logout'
 export const USER_VREG = 'vreg'
 export const USER_REQUESTRESETPWD = 'requestpwd'
 export const USER_UPDATEPWD = 'resetpwd'

src/views/login/login.vue

@@ -1,116 +0,0 @@
-<template>
-    <div>
-        <div class="card text-white text-center width-3of4 bg-width-2of5 gt-bg-width-1of4 sm-auto " id="login">
-            <div class="card-title" :class="finalBgColor">
-                <svg id="logo" viewBox="0 0 483 483"
-             style="enable-background:new 0 0 460 460;"
-             xml:space="preserve" width="128px" height="128px"
-             v-html="logoMethod">
-        </svg>
-                <h4>{{logo}}</h4>
-            </div>
-            <div class="card-content bg-white ">
-                <div class="stacked-label">
-                    <input required class="full-width" type="email" v-model="email">
-                    <label>Email</label>
-                </div>
-                <div class="stacked-label">
-                    <input required class="full-width" type="password" v-model="password">
-                    <label>Password</label>
-                </div>
-            </div>
-            <div class="card-actions inline-block vertical-middle">
-                <button class="push" @click="login()">Login</button>
-                <button class="red fit" :class="buttonClass" @click="login()">Login Google</button>
-                <button class="blue fit" :class="buttonClass" @click="login()">Login Facebook</button>
-            </div>
-        </div>
-    </div>
-</template>
-
-
-<script type="text/javascript">
-  /* eslint-disable */
-  import {mapActions} from 'vuex'
-  import * as types from '../../store/mutation-types'
-  import Vivus from 'vivus'
-  import logoData from './logoData'
-  import { Platform } from 'quasar'
-  export default {
-    mounted () {
-      this.setLayoutNeeded(false);
-      this.setIsLoginPage(true);
-      this.startAnimation()
-    },
-    beforeDestroy () {
-      this.setLayoutNeeded(true);
-      this.setIsLoginPage(false);
-    },
-    computed: {
-      heightSize (){
-        if (Platform.is.desktop) {
-          return 'items-center'
-        }
-        return ''
-      },
-      finalBgColor () {
-        return `bg-${this.bgColor}-${this.toneColor}`
-      },
-      logoMethod () {
-        return logoData[this.logo]
-      }
-    },
-    data () {
-      return {
-        logos: Object.keys(logoData),
-        logo: 'Digitalizer',
-        email: 'quasar@admin.com',
-        password: '123456',
-        bgColor: 'purple',
-        toneColor: 10,
-        colors: ['purple', 'blue', 'red', 'green', 'amber'],
-        colorTones: ['2', '4', '6', '8', '10'],
-        buttonClasses: ['normal','outline', 'clear', 'push', 'bordered', 'round'],
-        buttonClass: 'normal',
-        vivus: ''
-      }
-    },
-    methods: {
-      ...mapActions("glob", {
-        'setLayoutNeeded': types.SET_LAYOUT_NEEDED,
-        'setIsLoginPage': types.SET_LOGIN_PAGE
-      }),
-      login () {
-        this.setLayoutNeeded(true)
-        this.setIsLoginPage(false)
-        this.$router.push('/')
-      },
-      startAnimation () {
-        this.vivus = new Vivus('logo', {
-            duration: 400,
-            forceRender: false
-          }, function(element) {
-            for (let item of element.el.children[0].children) {
-              item.setAttribute('style', 'fill:white')
-              item.setAttribute('style', 'fill:white')
-            }
-          }
-        )
-      }
-    }
-  }
-</script>
-<style scoped>
-    .card {
-        margin-bottom: 0px;
-    }
-    .card-content {
-        min-height: 160px;
-    }
-    button {
-        margin-bottom: 4%;
-    }
-    h4 {
-        font-weight: 300;
-    }
-</style>

src/views/login/signin/signin.ts

@@ -11,6 +11,7 @@ import { validations, TSignin } from './signin-validate'
 import { validationMixin } from 'vuelidate'
 
 import './signin.scss'
+import router from '@router'
 
 // import {Loading, QSpinnerFacebook, QSpinnerGears} from 'quasar'
 
@@ -116,6 +117,9 @@ export default class Signin extends Vue {
     console.log(this.signin)
     UserStore.actions.signin(this.signin)
       .then((riscode) => {
+        if (riscode === rescodes.OK) {
+          router.push('/signin')
+        }
         this.checkErrors(riscode)
         this.$q.loading.hide()
       }).catch(error => {

src/views/login/signup/signup.ts

@@ -91,10 +91,11 @@ export default class Signup extends Vue {
     return process.env
   }
 
-  showNotif(msg: any) {
+  showNotif(params: any) {
-    this.$q.notify(msg)
+    this.$q.notify(params)
   }
 
+
   public errorMsg(cosa: string, item: any) {
     try {
       if (!item.$error) return ''
@@ -132,7 +133,8 @@ export default class Signup extends Vue {
     } else if (riscode === rescodes.DUPLICATE_USERNAME_ID) {
       this.showNotif(this.$t('reg.err.duplicate_username'))
     } else if (riscode === rescodes.OK) {
-      this.$router.push('/')
+      this.$router.push('/signin')
+      this.showNotif({type: 'warning', textColor: 'black', message: this.$t('components.authentication.email_verification.link_sent')})
     } else {
       this.showNotif('Errore num ' + riscode)
     }

src/views/login/signup/signup.vue

@@ -43,6 +43,7 @@
         >
             <q-input
                     v-model="signup.password"
+                    type="password"
                     :before="[{icon: 'vpn_key', handler () {}}]"
                     @blur="$v.signup.password.$touch"
                     :error="$v.signup.password.$error"
@@ -55,6 +56,7 @@
         >
             <q-input
                     v-model="signup.repeatPassword"
+                    type="password"
                     :before="[{icon: 'vpn_key', handler () {}}]"
                     @blur="$v.signup.repeatPassword.$touch"
                     :error="$v.signup.repeatPassword.$error"

src/views/login/vreg.vue

@@ -1,91 +0,0 @@
-<template>
-    <div class="mypanel">
-        <q-alert color="primary q-title" style="text-align: center;">
-            {{ $t('reg.title_verif_reg')}}
-        </q-alert>
-         <br>
-
-        <transition
-                enter-active-class="animated flipInX"
-                leave-active-class="animated flipOutX"
-                appear
-        >
-            <q-alert
-                    v-if="giaverificato"
-                    type="warning"
-            >
-                {{ risultato}}
-            </q-alert>
-            <q-alert
-                    v-if="verificatook"
-                    type="positive"
-            >
-                {{ risultato}}
-            </q-alert>
-        </transition>
-
-
-    </div>
-</template>
-
-<script>
-
-  import {mapActions} from 'vuex'
-  import * as types from '../../store/mutation-types'
-  import { rescodes } from '../../../store/Modules/rescodes'
-
-  import {serv_constants} from '../../store/Modules/serv_constants';
-
-
-  export default {
-    data() {
-      return {
-        risultato : '',
-        riscode: 0
-      }
-    },
-    created() {
-      this.load();
-    },
-    computed:{
-      giaverificato: function() {
-        return this.riscode !== serv_constants.RIS_CODE_EMAIL_VERIFIED
-      },
-      verificatook: function() {
-        return this.riscode === serv_constants.RIS_CODE_EMAIL_VERIFIED
-      },
-    },
-    methods: {
-      ...mapActions("user", {
-        verifreg: types.USER_VREG,
-      }),
-      load: function () {
-        this.verifreg(this.$route.query).then((ris) => {
-          this.riscode = ris.code;
-          this.risultato = ris.msg;
-          console.log("RIS = ");
-          console.log(ris);
-
-          if (this.verificatook) {
-            setTimeout(() => {
-              this.$router.replace('/');
-            }, 3000)
-          }
-
-        }).catch((err) => {
-          console.log("ERR = " + err);
-        });
-      }
-    },
-
-  }
-
-</script>
-
-<style scoped>
-    .mypanel {
-        padding:10px;
-        margin: 10px;
-
-    }
-</style>

src/views/login/vreg/vreg.css

@@ -0,0 +1,5 @@
+.mypanel {
+    padding:10px;
+    margin: 10px;
+
+}

src/views/login/vreg/vreg.ts

@@ -0,0 +1,62 @@
+import Vue from 'vue'
+import { Component } from 'vue-property-decorator'  // Questo va messo SEMPRE ! (ed anche $t ....) altrimenti non carica !
+
+import { UserStore } from '@store'
+
+import { serv_constants } from '../../../store/Modules/serv_constants'
+
+import './vreg.css'
+import { ILinkReg } from '../../../model/other'
+
+@Component({
+
+})
+export default class Vreg extends Vue {
+  public risultato: string = '---'
+  public riscode: number = 0
+  $t: any
+
+  constructor() {
+    super()
+    console.log('Vreg constructor...')
+  }
+
+  created() {
+    console.log('vreg created')
+    this.load()
+  }
+
+  get myrisultato() {
+    return this.risultato
+  }
+
+  get giaverificato() {
+    return this.riscode !== serv_constants.RIS_CODE_EMAIL_VERIFIED
+  }
+
+  get verificatook() {
+    return this.riscode === serv_constants.RIS_CODE_EMAIL_VERIFIED
+  }
+
+  load() {
+    console.log('load')
+    let param: ILinkReg
+    param = { idlink: this.$route.query.idlink.toString() }
+    console.log('idlink = ', param)
+    UserStore.actions.vreg(param).then((ris) => {
+      this.riscode = ris.code
+      this.risultato = ris.msg
+      console.log('RIS = ')
+      console.log(ris)
+
+      if (this.verificatook) {
+        setTimeout(() => {
+          this.$router.replace('/')
+        }, 3000)
+      }
+
+    }).catch((err) => {
+      console.log('ERR = ' + err)
+    })
+  }
+}

src/views/login/vreg/vreg.vue

@@ -0,0 +1,36 @@
+<template>
+    <q-page padding class="vreg">
+        <div class="mypanel">
+            <q-alert color="primary q-title" style="text-align: center;">
+                {{ $t('reg.title_verif_reg')}}
+            </q-alert>
+            <br>
+
+            <transition
+                    enter-active-class="animated flipInX"
+                    leave-active-class="animated flipOutX"
+                    appear
+            >
+            <span>
+                <q-alert
+                        v-if="giaverificato"
+                        type="warning"
+                >
+                    {{ myrisultato}}
+                </q-alert>
+                <q-alert
+                        v-if="verificatook"
+                        type="positive"
+                >
+                    {{ myrisultato}}
+                </q-alert>
+            </span>
+            </transition>
+
+
+        </div>
+    </q-page>
+</template>
+
+<script lang="ts" src="./vreg.ts">
+</script>