Create Empty Dashboard Layout

Author: thecodeholic

Diff for: backend/src/components/AppLayout.vue

@@ -0,0 +1,20 @@
+<template>
+  <div class="min-h-full flex items-center justify-center py-12 px-4 sm:px-6 lg:px-8">
+    <div class="max-w-md w-full space-y-8">
+      <div>
+        Part of the layout
+      </div>
+      <router-view></router-view>
+    </div>
+  </div>
+</template>
+
+<script setup>
+  const {title} = defineProps({
+    title: String
+  })
+</script>
+
+<style scoped>
+
+</style>

Diff for: backend/src/router/index.js

@@ -1,14 +1,22 @@
 import {createRouter, createWebHistory} from "vue-router";
+import AppLayout from '../components/AppLayout.vue'
 import Login from "../views/Login.vue";
 import Dashboard from "../views/Dashboard.vue";
 import RequestPassword from "../views/RequestPassword.vue";
 import ResetPassword from "../views/ResetPassword.vue";
 
 const routes = [
   {
-    path: '/',
-    name: 'dashboard',
-    component: Dashboard
+    path: '/app',
+    name: 'app',
+    component: AppLayout,
+    children: [
+      {
+        path: 'dashboard',
+        name: 'app.dashboard',
+        component: Dashboard
+      }
+    ]
   },
   {
     path: '/login',