- Update Menu User Account: Login/SignUp

.env.development

@@ -12,3 +12,4 @@ TEST_EMAIL='paolo.arena77@gmail.com'
 TEST_USERNAME='paoloar77'
 TEST_PASSWORD='mypassword@1A'
 PUBLICKEY_PUSH='BGxRrFWnPoa_ImUaWXmeEOFVI9VNKVKaAPsvsM1XY6wn24yxp9MyOQ4crNYCJKxSXV65Y1GblW5_VLoamedcZ1I'
+IN_CONSTRUCTION='0'

src/assets/i18n.js

@@ -68,6 +68,7 @@ const messages = {
       richiesto: 'Campo Richiesto',
       email: 'Email',
       username : 'Nome Utente',
+      username_login : 'Nome Utente o email',
       password: 'Password',
       repeatPassword: 'Ripeti password',
       terms: "Accetto i termini e le condizioni",
@@ -162,8 +163,8 @@ const messages = {
     },
     pages: {
       home: 'Principal',
-      SignUp: 'Registrarte',
+      SignUp: 'Nueva Cuenta',
-      SignIn: 'Login',
+      SignIn: 'Entrar',
       vreg: 'Verifica Reg',
       Test: 'Test',
       Category: 'Categorías',
@@ -205,6 +206,7 @@ const messages = {
       richiesto: 'Campo requerido',
       email: 'Email',
       username : 'Nombre usuario',
+      username_login : 'Nombre usuario o email',
       password: 'contraseña',
       repeatPassword: 'Repetir contraseña',
       terms: "Acepto los términos y condiciones",
@@ -229,8 +231,8 @@ const messages = {
     },
     login:{
       incorso: 'Login en curso',
-      enter: 'Login',
+      enter: 'Entrar',
-      errato: "Nombre de usuario o contraseña incorrectos. inténtelo de nuevo",
+      errato: "Nombre de usuario, correo o contraseña incorrectos. inténtelo de nuevo",
       completato: 'Login realizado!',
     },
     reset: {
@@ -341,6 +343,7 @@ const messages = {
       incorso: 'Registration please wait...',
       richiesto: 'Field Required',
       email: 'Email',
+      username_login : 'Username or email',
       username : 'Username',
       password: 'Password',
       repeatPassword: 'Repeat password',

src/layouts/drawer/drawer.ts

@@ -46,14 +46,14 @@ export default class Drawer extends Vue {
               routes2: listatodo
             },
             { route: '/category', faIcon: 'fa fa-list-alt', materialIcon: 'category', name: 'pages.Category' },
-            { route: '/signup', faIcon: 'fa fa-registered', materialIcon: 'home', name: 'pages.SignUp' },
+            // { route: '/signup', faIcon: 'fa fa-registered', materialIcon: 'home', name: 'pages.SignUp' },
             { route: '/admin/cfgserv', faIcon: 'fa fa-database', materialIcon: 'admin', name: 'pages.Admin' },
             { route: '/admin/testp1/par1', faIcon: 'fa fa-database', materialIcon: 'admin', name: 'pages.Test1' },
             { route: '/admin/testp1/par2', faIcon: 'fa fa-database', materialIcon: 'admin', name: 'pages.Test2' },
-            { route: '/signin', faIcon: 'fa fa-anchor', materialIcon: 'home', name: 'pages.SignIn' },
+            // { route: '/signin', faIcon: 'fa fa-anchor', materialIcon: 'home', name: 'pages.SignIn' },
             /* {route: '/vreg?idlink=aaa', faIcon: 'fa fa-login', materialIcon: 'login', name: 'pages.vreg'},*/
           ],
-          show: true,
+          show: true
         }
       }
     } else {
@@ -77,9 +77,9 @@ export default class Drawer extends Vue {
                 route: '/todo', faIcon: 'fa fa-list-alt', materialIcon: 'todo', name: 'pages.Todo',
                 routes2: listatodo
               },
-              { route: '/category', faIcon: 'fa fa-list-alt', materialIcon: 'category', name: 'pages.Category' },
+              { route: '/category', faIcon: 'fa fa-list-alt', materialIcon: 'category', name: 'pages.Category' }
-              { route: '/signup', faIcon: 'fa fa-registered', materialIcon: 'home', name: 'pages.SignUp' },
+              // { route: '/signup', faIcon: 'fa fa-registered', materialIcon: 'home', name: 'pages.SignUp' },
-              { route: '/signin', faIcon: 'fa fa-anchor', materialIcon: 'home', name: 'pages.SignIn' },
+              // { route: '/signin', faIcon: 'fa fa-anchor', materialIcon: 'home', name: 'pages.SignIn' },
               /* {route: '/vreg?idlink=aaa', faIcon: 'fa fa-login', materialIcon: 'login', name: 'pages.vreg'},*/
             ],
             show: true,
@@ -112,8 +112,16 @@ export default class Drawer extends Vue {
 
   logoutHandler() {
     UserStore.actions.logout()
-    this.$router.push('/signin')
+      .then(() => {
-    this.$q.notify(this.$t('logout.uscito'))
+        this.$router.replace('/logout')
+
+        const mythis = this
+        setTimeout(function () {
+          mythis.$router.replace('/')
+        }, 1000)
+
+        this.$q.notify(this.$t('logout.uscito'))
+      })
   }
 }
 

src/root/home/home.scss

@@ -40,7 +40,11 @@
 }
 
 .landing__hero {
-  min-height: 100vh
+  min-height: 90vh
+}
+
+.landing__header {
+  height: 18vh
 }
 
 .landing__arrow {
@@ -77,8 +81,8 @@
 .landing__footer {
   background: -webkit-gradient(linear, left top, left bottom, color-stop(65%, rgba(0, 0, 0, .1)), to(#000));
   background: linear-gradient(180deg, rgba(0, 0, 0, .1) 65%, #000);
-  padding-top: 72px !important;
+  //padding-top: 72px !important;
-  padding-bottom: 72px !important
+  //padding-bottom: 72px !important
 }
 
 .landing__footer .doc-link {
@@ -96,25 +100,27 @@
   background-image: url(https://cdn.quasar-framework.org/img/landing_first_section.png) !important
 }
 
-
 @media (max-width: 718px) {
   .landing__hero {
     text-align: center
   }
+  .landing__header {
+    height: 9vh
+  }
   .landing__hero .text-h1 {
     font-size: 3rem;
     line-height: 3.05rem;
-    margin-bottom: 24px
+    //margin-bottom: 24px
   }
   .landing > section.padding {
-    padding-top: 90px;
+    //padding-top: 90px;
-    padding-bottom: 90px
+    //padding-bottom: 90px
   }
   .landing .feature-item {
     text-align: center
   }
   .landing__hero-content {
-    padding-bottom: 180px
+    //padding-bottom: 180px
   }
   .landing__hero-btns {
     -webkit-box-pack: center;
@@ -131,7 +137,7 @@ body.mobile .landing:before {
   content: "";
   position: fixed;
   top: 0;
-  height: 100vh;
+  height: 90vh;
   left: 0;
   right: 0;
   bottom: 0;
@@ -167,6 +173,10 @@ body.mobile .landing:before {
   justify-content: space-between;
 }
 
+.btn-start {
+  margin: 5px;
+}
+
 .shadow {
   //color: white;
   text-shadow: 2px 2px 4px #000000;

src/root/home/home.ts

@@ -1,6 +1,6 @@
 import Vue from 'vue'
 import { Component } from 'vue-property-decorator'
-import { GlobalStore } from '@store'
+import { GlobalStore, UserStore } from '@store'
 
 import { Logo } from '../../components/logo'
 
@@ -30,6 +30,10 @@ export default class Home extends Vue {
     GlobalStore.actions.prova()
   }
 
+  get isLogged(){
+    return UserStore.state.isLogged
+  }
+
 
   meta() {
     return {
@@ -82,6 +86,10 @@ export default class Home extends Vue {
 
   }
 
+  get isInCostruction () {
+    return process.env.IN_CONSTRUCTION === '1'
+  }
+
   getPermission() {
     return Notification.permission
   }
@@ -90,6 +98,14 @@ export default class Home extends Vue {
     return (!('serviceWorker' in navigator))
   }
 
+  PagLogin () {
+    this.$router.replace('/signin')
+  }
+
+  PagReg () {
+    this.$router.replace('/signup')
+  }
+
   displayConfirmNotification() {
     let options = null
     if ('serviceWorker' in navigator) {

src/root/home/home.vue

@@ -3,7 +3,7 @@
         <div class="landing">
             <section>
                 <div class="landing__hero">
-                    <div style="height: 18vh;"></div>
+                    <div class="landing__header"></div>
                     <div class="landing__hero-content row justify-center q-gutter-xl">
                         <div class="row">
                             <logo></logo>
@@ -29,24 +29,34 @@
 
                                 </div>
 
-<!--
+                                <!--
-                                <q-btn>
+                                                                <q-btn>
 
-                                    Canale Telegram: <a href="https://t.me/freeplanet_channel" target="_blank"
+                                                                    Canale Telegram: <a href="https://t.me/freeplanet_channel" target="_blank"
-                                                        style="color: white;">
+                                                                                        style="color: white;">
-                                    <q-icon class="fab fa-telegram" size="2rem"/>
+                                                                    <q-icon class="fab fa-telegram" size="2rem"/>
-                                    </a>
+                                                                    </a>
-                                </q-btn>
+                                                                </q-btn>
--->
+                                -->
 
-                                <div style="margin: 5px;">
+                                <div v-if="isInCostruction" style="margin: 5px;">
                                     <q-alert
                                             type="info"
                                             class="q-mb-sm">
                                         {{$t('msg.underconstruction')}}
                                     </q-alert>
+                                    <br>
+                                </div>
+                                <div v-else>
+                                    <div v-if="!isLogged" style="margin: 5px; padding: 5px;" class="home">
+                                        <q-btn rounded size="lg" color="primary" @click="PagLogin" class="btn-start">
+                                            {{$t('login.enter')}}
+                                        </q-btn>
+                                        <q-btn rounded size="lg" color="secondary" @click="PagReg" class="btn-start">
+                                            {{$t('reg.submit')}}
+                                        </q-btn>
+                                    </div>
                                 </div>
-                                <br>
 
                                 <div>
                                     <q-field

src/store/Modules/UserStore.ts

@@ -487,6 +487,7 @@ namespace Actions {
     localStorage.removeItem(tools.localStorage.categorySel)
     localStorage.removeItem(tools.localStorage.wasAlreadySubOnDb)
 
+    state.isLogged = false
 
     await GlobalStore.actions.clearDataAfterLogout()
 

src/views/login/signin/signin.vue

@@ -21,7 +21,7 @@
                             :before="[{icon: 'person', handler () {}}]"
                             @blur="$v.signin.username.$touch"
                             :error="$v.signin.username.$error"
-                            :float-label="$t('reg.username')"></q-input>
+                            :float-label="$t('reg.username_login')"></q-input>
                 </q-field>
 
                 <q-field

src/views/login/signup/signup.scss

@@ -3,3 +3,10 @@
   margin: 0 auto;
   max-width: 450px;
 }
+
+
+.wrapper {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}

src/views/login/signup/signup.vue

@@ -79,8 +79,10 @@
 
         <br>
 
-        <q-btn rounded size="lg" color="primary" @click="submitOk" :disabled='!allowSubmit'>{{$t('reg.submit')}}
+        <div class="wrapper">
+        <q-btn rounded size="lg" color="secondary" @click="submitOk" :disabled='!allowSubmit'>{{$t('reg.submit')}}
         </q-btn>
+        </div>
 
         <!--