.env.production file eliminated ! (-> .env)

.env.production worked in local
added myconfig
messagepopup working (but not ready yet)
added Graphql (only module)

src/layouts/drawer/drawer.vue

@@ -18,8 +18,7 @@
             </div>
         </div>
 
-        <menu-one v-if="MenuCollapse" :links="links"></menu-one>
-        <menu-two v-else :links="links"></menu-two>
+        <menu-one :links="links"></menu-one>
 
         <div class="fixed-bottom text-center light text-italic">
             Powered by Perseo
@@ -30,7 +29,6 @@
 
 <script lang="ts">
   import menuOne from './menuOne.vue'
-  import menuTwo from './menuTwo.vue'
 
   import Vue from 'vue'
   import { Component, Watch, Prop } from 'vue-property-decorator'
@@ -42,42 +40,34 @@
   @Component({
     components: {
       menuOne,
-      menuTwo
     }
   })
   export default class Drawer extends Vue {
     public $q
-    $t: any
+    $t: any;
+
+    created () {
+      console.log('Drawer created...')
+    }
+
 
     photo = ''
     user = null
     links = {
       Dashboard: {
         routes: [
-          {route: '/', faIcon: 'fa fa-home', materialIcon: 'home', name: 'Dashboard One'},
-          {route: '/signup', faIcon: 'fa fa-signup', materialIcon: 'login', name: 'SignUp'},
-          {route: '/signin', faIcon: 'fa fa-login', materialIcon: 'login', name: 'Login'},
+          {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'},
           ],
         show: true
       },
       Forms: {
         routes: [
-          {route: '/prec', faIcon: 'fa fa-search', materialIcon: 'search', name: 'Prec'},
-          {route: '/simpleform', faIcon: 'fa fa-search', materialIcon: 'search', name: 'Simpleform'},
-          {route: '/embeeded', faIcon: 'fa fa-check', materialIcon: 'check', name: 'Embeeded validations'},
-          //{ route: '/advanced-form-one', faIcon: 'fa fa-hdd-o', materialIcon: 'filter_1', name: 'Adv. Form One' }
+          {route: '/prec', faIcon: 'fa fa-search', materialIcon: 'search', name: 'pages.Test'},
           ],
         show: false
       },
-      Pages: {
-        routes: [
-          {route: '/login', faIcon: 'fa fa-unlock-alt', materialIcon: 'lock_open', name: 'Login'},
-          //{ route: '/pricing', faIcon: 'fa fa-money', materialIcon: 'attach_money', name: 'Pricing' },
-          //{ route: '/drag-and-drop', faIcon: 'fa fa-arrows', materialIcon: 'move_to_inbox', name: 'Drag and Drop' },
-          //{ route: '/server-side-data-table', faIcon: 'fa fa-list-alt', materialIcon: 'list_compact', name: 'Server Side Data Table' }
-          ],
-        show: false
-      }
     }
 
     get MenuCollapse () {

src/layouts/drawer/menuOne.vue

@@ -11,7 +11,7 @@
                         <div v-show="parent.show">
                                 <q-item link :to="child.route" exact class="item item-link drawer-closer cursor-pointer">
                                     <i :class="child.faIcon" class="item-primary"></i>
-                                    <div class="item-content">{{child.name}}</div>
+                                    <div class="item-content">{{$t(child.name)}}</div>
                                 </q-item>
                         </div>
                     </transition>

src/layouts/drawer/menuTwo.vue

@@ -1,7 +0,0 @@
-<template>
-</template>
-
-<script>
-</script>
-<style scoped>
-</style>

src/layouts/toolbar/messagePopover.vue

@@ -1,84 +0,0 @@
-<template>
-  <button class="relative-position animate-bounce">
-    <i class="fa fa-2x fa-envelope-o"></i>
-    <span class="floating label bg-dark">5</span>
-    <q-popover self="top right" >
-      <div class="list striped">
-        <p class="caption no-margin text-center text-white bg-teal">Messages from people</p>
-        <div class="item item-link two-lines item-delimiter no-margin"
-             v-for="post in filteredPosts"
-        >
-          <img class="item-primary" :src="randomAvatarUrl()">
-          <div class="item-content has-secondary">
-            <div>{{post.title}}</div>
-            <div>{{randomDate()}}</div>
-          </div>
-          <span class="label bg-red text-white item-secondary no-margin">
-            <i class="left-detail"></i> New
-          </span>
-        </div>
-      </div>
-    </q-popover>
-  </button>
-</template>
-<script>
-  import { mapGetters, mapActions } from 'vuex'
-  import * as types from '../../store/mutation-types'
-  export default {
-    mounted () {
-      if (this.getPosts.length < 1) {
-        this.requestPosts()
-      }
-    },
-    computed: {
-      ...mapGetters("glob", ['getPosts']),
-      filteredPosts () {
-        return this.getPosts.slice(0, 5)
-      }
-    },
-    methods: {
-      ...mapActions("glob", {
-        'setPosts': types.SET_POSTS,
-      }),
-      randomDate () {
-        return new Date((new Date()) - Math.floor(Math.random() * 10000000000))
-      },
-      randomAvatarUrl () {
-        return `https://api.adorable.io/avatars/face/${this.randomEye()}/${this.randomNose()}/${this.randomMouth()}/${this.randomHexColor()}`
-      },
-      randomHexColor () {
-        return Math.random().toString(16).slice(2, 8)
-      },
-      randomEye () {
-        return this.randomArrayElement(['eyes1', 'eyes10', 'eyes2', 'eyes3', 'eyes4', 'eyes5', 'eyes6', 'eyes7', 'eyes9'])
-      },
-      randomNose () {
-        return this.randomArrayElement(['nose2', 'nose3', 'nose4', 'nose5', 'nose6', 'nose7', 'nose8', 'nose9'])
-      },
-      randomMouth () {
-        return this.randomArrayElement(['mouth1', 'mouth10', 'mouth11', 'mouth3', 'mouth5', 'mouth6', 'mouth7', 'mouth9'])
-      },
-      randomArrayElement (array) {
-        return array[Math.floor((Math.random() * array.length))]
-      },
-      requestPosts () {
-      }
-    }
-  }
-</script>
-<style scoped>
-  .list{
-    max-width: 400px;
-  }
-  .item > img.item-primary:not(.thumbnail) {
-    border-radius: 10px !important;
-  }
-  .item > img.item-primary {
-    width: 48px;
-    height: 46px;
-  }
-  .item > .item-secondary {
-    width: 57px;
-    font-size: 13px;
-  }
-</style>

src/layouts/toolbar/messagePopover/messagePopover.scss

@@ -0,0 +1,17 @@
+.list {
+  max-width: 400px;
+}
+
+.item > img.item-primary:not(.thumbnail) {
+  border-radius: 10px !important;
+}
+
+.item > img.item-primary {
+  width: 48px;
+  height: 46px;
+}
+
+.item > .item-secondary {
+  width: 57px;
+  font-size: 13px;
+}

src/layouts/toolbar/messagePopover/messagePopover.ts

@@ -0,0 +1,70 @@
+import Vue from 'vue'
+import { Component, Prop } from 'vue-property-decorator'
+
+import { GlobalStore } from '@store'
+import { IPost } from '../../../model/index'
+
+import './messagePopover.scss'
+
+@Component({
+})
+export default class MessagePopover extends Vue {
+  posts: IPost[] = []
+
+  created() {
+    if (GlobalStore.state.posts.length < 1) {
+      this.requestPosts()
+    }
+  }
+
+  get filteredPosts() {
+    if (this.posts.length >= 1)
+      return this.posts.slice(0, 5)
+    else
+      return []
+  }
+
+
+  public randomDate(): Date {
+    let myval = Math.floor(Math.random() * 10000000000)
+    return new Date(new Date().valueOf() - myval)
+  }
+
+  public randomAvatarUrl() {
+    return `https://api.adorable.io/avatars/face/${this.randomEye()}/${this.randomNose()}/${this.randomMouth()}/${this.randomHexColor()}`
+  }
+
+  public randomHexColor() {
+    return Math.random().toString(16).slice(2, 8)
+  }
+
+  public randomEye() {
+    return this.randomArrayElement(['eyes1', 'eyes10', 'eyes2', 'eyes3', 'eyes4', 'eyes5', 'eyes6', 'eyes7', 'eyes9'])
+  }
+
+  public randomNose() {
+    return this.randomArrayElement(['nose2', 'nose3', 'nose4', 'nose5', 'nose6', 'nose7', 'nose8', 'nose9'])
+  }
+
+  public randomMouth() {
+    return this.randomArrayElement(['mouth1', 'mouth10', 'mouth11', 'mouth3', 'mouth5', 'mouth6', 'mouth7', 'mouth9'])
+  }
+
+  public randomArrayElement(array) {
+    return array[Math.floor((Math.random() * array.length))]
+  }
+
+  public requestPosts_old() {
+    /*this.$http.jsonplaceholder
+      .get('posts')
+      .then(response => { this.setPosts(response.data) })
+      */
+  }
+
+  public requestPosts() {
+    // console.log('requestPosts...')
+    let prova = [{ title: 'primo' }, { title: 'Secondo' }]
+    this.posts.push(...prova)
+
+  }
+}

src/layouts/toolbar/messagePopover/messagePopover.vue

@@ -0,0 +1,26 @@
+<template>
+    <button class="relative-position animate-bounce">
+        <i class="fa fa-2x fa-envelope-o"></i>
+        <span class="floating label bg-dark">5</span>
+        <q-popover self="top right">
+            <div class="list striped">
+                <p class="caption no-margin text-center text-white bg-teal">Messages from people</p>
+                <div class="item item-link two-lines item-delimiter no-margin"
+                     v-for="post in filteredPosts"
+                >
+                    <img class="item-primary" :src="randomAvatarUrl()">
+                    <div class="item-content has-secondary">
+                        <div>{{post.title}}</div>
+                        <div>{{randomDate()}}</div>
+                    </div>
+                    <span class="label bg-red text-white item-secondary no-margin">
+            <i class="left-detail"></i> New
+          </span>
+                </div>
+            </div>
+        </q-popover>
+    </button>
+</template>
+
+<script lang="ts" src="./messagePopover.ts">
+</script>