RouterWithGuardsAndchildRoutes

generator/index.js

@@ -26,11 +26,6 @@ module.exports = (api, options) => {
         ...options,
     });
 
-    if (options.useTemplateLoader) {
-        api.render('./templates/TemplateLoader', {
-            ...options,
-        });
-    }
     if (options.useAuthorisation) {
         api.render('./templates/Authorisation', {
             ...options,

generator/templates/Authorisation/src/guards/AuthorisationGuard

@@ -0,0 +1,9 @@
+import Vue from 'vue';
+
+export default function (to, from, next) {
+    if (!Vue.prototype.$store.getters['Authorization/isLoggedIn']) {
+        next({name: 'login'});
+        return;
+    }
+    next();
+}

generator/templates/Default/src/App.vue

@@ -1,62 +1,17 @@
 <template>
-    <div id="app">
-        <v-app id="inspire" v-if="$store.getters['Authorization/isLoggedIn']">
-            <v-navigation-drawer
-                app
-                fixed
-                v-model="menu"
-            >
-                <img :src="require('../assets/logo.png')" @click="$router.push({name: 'home'})" class="logo">
-                <v-divider class="mt-10"/>
-                <main-menu/>
-            </v-navigation-drawer>
-            <v-toolbar app color="primary" dark mfixed>
-                <v-toolbar-side-icon @click.stop="menu = !menu"></v-toolbar-side-icon>
-                <v-toolbar-title>Beheer</v-toolbar-title>
-                <v-spacer/>
-                <profile-menu></profile-menu>
-            </v-toolbar>
-            <v-content>
-                <router-view/>
-            </v-content>
-            <v-footer app color="primary" inset>
-                <span class="white--text pl-6">Created by Kings Code</span>
-            </v-footer>
-        </v-app>
+    <div>
+        <router-view></router-view>
     </div>
 </template>
 
 <script>
-    import ProfileMenu from './components/ProfileMenu.vue';
-    import MainMenu from './components/MainMenu.vue';
 
     export default {
-        name: 'template-default',
-        components: {ProfileMenu, MainMenu},
+        name: 'app',
         data() {
             return {
-                menu: true,
+
             };
         },
-        beforeCreate() {
-            if (!this.$store.getters['Authorization/isLoggedIn']) {
-                this.$router.push({name: 'login'});
-            }
-        },
     };
 </script>
-
-<style scoped lang="scss">
-
-    .logo {
-        display: block;
-        margin: 30px auto;
-        width: 50%;
-        cursor: pointer;
-    }
-</style>
-<style lang="scss">
-    .v-dialog--fullscreen > .v-card.v-sheet.theme--light {
-        background: rgb(248, 249, 250);
-    }
-</style>

generator/templates/Default/src/newmain.js

@@ -14,6 +14,9 @@ import './registerServiceWorker'
 
 Vue.prototype.$http = API;
 window.$http = API;
+<%_ if (options.useAuthorisation) { _%>
+Vue.prototype.$store = store;
+<%_ } _%>
 <%_ if (options.useCrud) { _%>
 Vue.use(VuetifyResource);
 <%_ } _%>

generator/templates/Default/src/router.js

@@ -1,5 +1,8 @@
 import Vue from 'vue';
 import Router from 'vue-router';
+<%_ if (options.useAuthorisation) { _%>
+import AuthorisationGuard from './guards/AuthorisationGuard';
+<%_ } _%>
 
 Vue.use(Router);
 
@@ -8,77 +11,80 @@ export default new Router({
     base: process.env.BASE_URL,
     routes: [
         {
-            path: '/',
-            name: 'home',
-            component: () => import('@/views/Home'),
-        },
-        {
-            path: '/403',
-            name: '403',
-            component: () => import('./views/PageForbidden.vue'),
+            path: '',
+            redirect: {name: 'home'},
         },
         <%_ if (options.useAuthorisation) { _%>
         {
-            path: '/login',
-            name: 'login',
-            component: () => import('@/views/Login'),
-            <%_ if (options.useTemplateLoader) { _%>
-            meta: {
-                template: () => import('./templates/Authorisation.vue'),
-            },
-            <%_ } _%>
-        },
-        {
-            path: '/password/forgotten',
-            name: 'password.forgotten',
-            component: () => import('./views/PasswordForgotten.vue'),
-            <%_ if (options.useTemplateLoader) { _%>
-            meta: {
-                template: () => import('./templates/Authorisation.vue'),
-            },
-            <%_ } _%>
+            path: '',
+            component: () => import('@/templates/Authorisation'),
+            children: [
+                {
+                    path: '/login',
+                    name: 'login',
+                    component: () => import('@/views/Login'),
+                },
+                {
+                    path: '/password/forgotten',
+                    name: 'password.forgotten',
+                    component: () => import('./views/PasswordForgotten.vue'),
+                },
+                {
+                    path: '/password/reset/:token',
+                    name: 'password.reset',
+                    component: () => import('./views/PasswordReset.vue'),
+                },
+                {
+                    path: '/invitation/accept/:token',
+                    name: 'invitation.accept',
+                    component: () => import('./views/InvitationAccept.vue'),
+                },
+            ]
         },
+         <%_ } _%>
         {
-            path: '/password/reset/:token',
-            name: 'password.reset',
-            component: () => import('./views/PasswordReset.vue'),
-            <%_ if (options.useTemplateLoader) { _%>
-            meta: {
-                template: () => import('./templates/Authorisation.vue'),
-            },
+            path: '',
+            <%_ if (options.useAuthorisation) { _%>
+            beforeEnter: AuthorisationGuard,
             <%_ } _%>
+            component: () => import('@/templates/Default'),
+            children: [
+                {
+                    path: '/',
+                    name: 'home',
+                    component: () => import('@/views/Home'),
+                },
+                <%_ if (options.useAuthorisation) { _%>
+                {
+                    path: '/profile',
+                    name: 'profile',
+                    component: () => import('./views/Profile.vue')
+                },
+                 <%_ } _%>
+                 <%_ if (options.useCrud) { _%>
+                {
+                    path: '/users',
+                    name: 'users',
+                    component: () => import('./views/UserResource.vue')
+                },
+                  <%_ } _%>
+                {
+                    path: '/404',
+                    name: '404',
+                    component: () => import('./views/PageNotFound.vue'),
+                },
+                {
+                    path: '/403',
+                    name: '403',
+                    component: () => import('./views/PageForbidden.vue'),
+                },
+                {
+                    path: '*',
+                    redirect: '/404'
+                },
+            ],
         },
-        {
-            path: '/invitation/accept/:token',
-            name: 'invitation.accept',
-            component: () => import('./views/InvitationAccept.vue'),
-            <%_ if (options.useTemplateLoader) { _%>
-            meta: {
-                template: () => import('./templates/Authorisation.vue'),
-            },
-            <%_ } _%>
-        },
-        {
-            path: '/profile',
-            name: 'profile',
-            component: () => import('./views/Profile.vue')
-        },
-        <%_ } _%>
-        <%_ if (options.useCrud) { _%>
-        {
-            path: '/users',
-            name: 'users',
-            component: () => import('./views/UserResource.vue')
-        },
-        <%_ } _%>
-        {
-            path: '/404',
-            name: '404',
-            component: () => import('./views/PageNotFound.vue'),
-        },
-        {
-            path: '*',
-            redirect: '/404'
-        },
+
+
     ],
 });

prompts.js

@@ -9,12 +9,6 @@ module.exports = [
         message: 'Do you want to use a crud system?',
         default: true,
     },
-    {
-        name: 'useTemplateLoader',
-        type: 'confirm',
-        message: 'Do you want to use a template loader (multiple templates configuration in the router)',
-        default: true,
-    },
     {
         name: 'useAuthorisation',
         type: 'confirm',
@@ -39,4 +33,4 @@ module.exports = [
         message: 'What is the root API url? (you can change this later)',
         default: '//example.local/api',
     }
-];
+];