Initial Nuxt frontend import

- Complete GGZ Ecademy Nuxt.js user portal
- Learning products browser and management
- Member management interface
- User authentication and roles
- Multi-language support (NL/EN)
- Vuex store for state management
- Component-based architecture

layouts/GgzAdmin.vue

@@ -0,0 +1,135 @@
+<template>
+  <v-app>
+    <v-navigation-drawer
+      app
+      overflow
+      temporary
+      v-model="primaryDrawer.model"
+      width="330"
+    >
+      <left-menu @close-left-menu="primaryDrawer.model = false"></left-menu>
+    </v-navigation-drawer>
+
+    <v-app-bar app tile flat height="90" color="primary" style="z-index: 999;">
+      <v-icon @click.stop="primaryDrawer.model = !primaryDrawer.model"
+        >icon-menu</v-icon
+      >
+
+      <router-link :to="localePath('/manager')">
+        <app-logo width="180" class="ml-10" />
+      </router-link>
+
+      <v-spacer />
+      <search-bar />
+      <v-spacer />
+      
+      <div class="mr-4">
+        <dark-mode-switch />
+        <fullscreen />
+        <listener/>
+      </div>
+      <div
+        @click.stop="
+          $store.commit('navigation/SWITCH_RIGHT_DRAWER', {
+            component: 'Notifications',
+          })
+        "
+        :style="{ cursor: 'pointer' }"
+      >
+        <chip-user-logged v-if="$auth.loggedIn" />
+      </div>
+    </v-app-bar>
+
+    <v-main class="secondary">
+        <v-overlay :value="overlay" />
+      <v-container class="py-10">
+        <nuxt />
+      </v-container>
+    </v-main>
+
+    <v-navigation-drawer
+      app
+      right
+      overflow
+      temporary
+      disable-route-watcher
+      v-model="drawer"
+      width="480px"
+    >
+      <div class="d-flex flex-column justify-space-between fill-height">
+        <!-- Dynamic Component -->
+        <component :is="componentDrawer" />
+        <!-- <userMenu v-if="!isLearningProductPage" /> -->
+        <userMenu />
+      </div>
+    </v-navigation-drawer>
+
+    <footer-app />
+    <global-snackbar />
+  </v-app>
+</template>
+
+<script>
+import AppLogo from '~/components/Logo'
+import LeftMenu from '~/components/Admin/LeftMenu'
+import FooterApp from '~/components/Admin/ggz/Footer/Footer'
+import searchBar from '~/components/UI/SearchBar/SearchBar'
+import fullscreen from '~/components/UI/FullScreen/FullScreen'
+import darkModeSwitch from '~/components/UI/DarkModeSwitch/DarkModeSwitch'
+import chipUserLogged from '~/components/UI/ChipUserLogged/ChipUserLogged'
+import globalSnackbar from '~/components/UI/GlobalSnackbar/GlobalSnackbar'
+import userMenu from '~/components/RightMenu/UserMenu'
+import listener from '~/components/Listener/Listener'
+
+export default {
+  middleware: ['auth'],
+  components: {
+    AppLogo,
+    LeftMenu,
+    FooterApp,
+    searchBar,
+    darkModeSwitch,
+    fullscreen,
+    chipUserLogged,
+    globalSnackbar,
+    userMenu,
+    listener,
+    // localeSwitch,
+  },
+  computed: {
+    drawer: {
+      get() {
+        return this.$store.getters.rightDrawer.display
+      },
+      set(v) {
+        return this.$store.commit('navigation/SWITCH_RIGHT_DRAWER', v)
+      },
+    },
+    overlay() {
+      return this.$store.getters.searchOverlay
+    },
+    componentDrawer() {
+      return this.$store.getters.rightDrawer.component
+        ? () =>
+            import(
+              `@/components/RightMenu/${this.$store.getters.rightDrawer.component}`
+            )
+        : null
+    },
+    // isLearningProductPage() {
+    //   return this.$route.name === 'manager-learning___nl'
+    // },
+  },
+  data() {
+    return {
+      primaryDrawer: {
+        model: null,
+        type: 'default (no property)',
+        clipped: false,
+        floating: false,
+        mini: false,
+      },
+    }
+  },
+}
+</script>