added project views and implemented checks for them

frontend/src/components/Drawer.vue

@@ -34,9 +34,9 @@
 
     <v-list v-if="loggedIn" >
       <v-list-item
-        v-for="link in links"
+        v-for="link in getActiveLinks"
         :key="link.id"
-        :to="{name: link.dest}"
+        :to="getLink(link)"
         link
       >
         <v-list-item-icon>
@@ -56,11 +56,12 @@ import { mapGetters } from 'vuex'
 const uuidv4 = require("uuid/v4")
 
 class MenuItem {
-  constructor(text, icon, dest){
+  constructor(text, icon, dest, projectMenu=false){
     this.id = uuidv4();
     this.text = text;
     this.icon = icon;
     this.dest = dest;
+    this.projectMenu = projectMenu;
   }
 }
 
@@ -74,13 +75,71 @@ export default {
       'loggedIn'
     ]),
 
+    ...mapGetters([
+      'isProjectViewActive',
+      'getCurrentProject',
+
+    ]),
+
+    getActiveLinks () {
+      return this.links.filter((item) => {
+        return !item.projectMenu || (this.isProjectViewActive && item.projectMenu);
+      });
+    },
+
   },
+
   data: () => ({
     links: [
-      new MenuItem('Projects', 'mdi-inbox-arrow-down', 'projects'),
+      new MenuItem(
+        'My Projects',
+        'mdi-book-multiple',
+        'projects'),
+
+      new MenuItem(
+        'Project Info',
+        'mdi-cog',
+        'project',
+        true
+        ),
+
+      new MenuItem(
+        'Data',
+        'mdi-image-multiple',
+        'data',
+        true
+        ),
+
+      new MenuItem(
+        'Labels',
+        'mdi-label-multiple',
+        'labels',
+        true
+        ),
+
+      new MenuItem(
+        'Annotations',
+        'mdi-account-hard-hat',
+        'annotations',
+        true
+        ),
     ],
   }),
 
+
+  methods: {
+    getLink(link) {
+
+      if (link.projectMenu){
+
+        return {name: link.dest, params: {id: this.getCurrentProject}}
+
+      }
+      else
+        return {name: link.dest}
+    }
+  }
+
 }
 
 </script>

frontend/src/main.js

@@ -10,11 +10,23 @@ Vue.config.productionTip = false
 
 
 router.beforeEach((to, from, next) => {
-  if (to.matched.some(record => record.meta.public) || store.state.auth.loggedIn)
-    next()
 
-  if (!store.state.auth.loggedIn)
+  let isPublic = to.matched.some(record => record.meta.public);
+  let isLoggedIn = store.state.auth.loggedIn;
+
+  if (!isLoggedIn && !isPublic)
     next({ name: 'login' })
+
+  let isProjectView = to.matched.some(record => record.meta.projectView);
+
+  let currentProject = null;
+  console.log(to.path, isProjectView)
+  if (isProjectView)
+    currentProject = to.params.id;
+
+  store.commit('setCurrentProject', currentProject);
+
+  next()
 })
 
 Vue.use(Vuex);

frontend/src/routes.js

@@ -45,8 +45,30 @@ export default new VueRouter({
         },
         {
             path: '/project/:id',
-            name: 'show_project',
+            name: 'project',
             component: ShowProject,
+            meta: {
+              projectView: true,
+            },
+
+            children: [
+              {
+                path: 'labels',
+                name: 'labels',
+                component: ShowProject
+
+              },
+              {
+                path: 'data',
+                name: 'data',
+                component: ShowProject
+              },
+              {
+                path: 'annotations',
+                name: 'annotations',
+                component: ShowProject
+              },
+            ]
         },
         {
             path: '/logout',

frontend/src/store/index.js

@@ -7,7 +7,30 @@ import { data } from './data.module';
 Vue.use(Vuex);
 
 export default new Vuex.Store({
+  state: {
+    currentProject: null,
+  },
+
+  mutations: {
+    setCurrentProject(state, id){
+      state.currentProject = id;
+    }
+  },
+
+  getters: {
+
+    isProjectViewActive: state => {
+      return state.currentProject !== null;
+    },
+
+    getCurrentProject: state => {
+      return state.currentProject;
+    }
+
+  },
+
   modules: {
-    auth, data
+    auth,
+    data,
   }
 });

frontend/src/views/project/Create.vue

@@ -184,7 +184,7 @@
 
         DataService.createProject(this.project).then(
           (project) => {
-            this.$router.push({ name: 'show_project', params: { id: project.id}})
+            this.$router.push({ name: 'project', params: { id: project.id}})
         })
       }
     },

frontend/src/views/project/List.vue

@@ -20,7 +20,7 @@
         <v-card
           outlined elevation="2"
           max-width=450px class="mx-auto"
-          :to="{ name: 'show_project', params: { id: project.id }}"
+          :to="{ name: 'project', params: { id: project.id }}"
           >
           <v-card-title>Name: {{project.name}}</v-card-title>
           <v-card-text>