fucking props!

resources/js/Layouts/BELayout.vue

@@ -1,7 +1,7 @@
 <template>
     <LoginLayout>
-        <MainNav />
+        <MainNav :route="props.route" />
-        <slot></slot>
+        <slot />
 
     </LoginLayout>
 </template>
@@ -9,4 +9,8 @@
 <script setup>
     import LoginLayout from '@/layouts/LoginLayout'
     import MainNav from '@/components/MainNav'
+
+    const props = defineProps({
+        route: String
+    })
 </script>

resources/js/components/MainNav.vue

@@ -4,7 +4,7 @@
 
 <script setup>
     import { Link } from '@inertiajs/vue3'
-    import { h, ref } from 'vue';
+    import { h, ref, defineProps } from 'vue';
     import { NIcon, NButton } from 'naive-ui'
     import {
         GroupsFilled as Users,
@@ -12,43 +12,45 @@
         LogOutFilled as Logout
     } from '@vicons/material'
 
-    const activeKey = ref(null)
+    const props = defineProps(['route'])
+
+    const activeKey = ref(props.route)
 
     const menuOptions = ref([
         {
             label: () =>
                 h(
                     Link, {
-                        href: "/Events",
+                        href: "/events",
                         methode: "get"
                     },
                     "Veranstaltungen"
                 ),
-                key: 'go-to-events',
+                key: '/events',
                 icon: renderIcon(Events)
         },
         {
             label: () =>
                 h(
                     Link, {
-                        href: "/Users",
+                        href: "/users",
                         method: "get"
                     },
                     "Benutzer"
                 ),
-                key: 'go-to-users',
+                key: '/users',
                 icon: renderIcon(Users)
         },
         {
             label: () =>
                 h(
                     Link, {
-                        href: "/Login",
+                        href: "/login",
                         method: "get"
                     },
                     "Abmelden"
                 ),
-                key: 'go-to-logout',
+                key: '/logout',
                 icon: renderIcon(Logout)
         }
     ])

resources/js/pages/Events/EventsList.vue

@@ -1,12 +1,31 @@
 <template>
-
+    <div>test</div>
+    <div>{{route}}</div>
 </template>
 
 <script setup>
-
 import BELayout from '@/layouts/BELayout.vue'
-import MainNav from '@/components/MainNav.vue'
 
-defineOptions({ layout: BELayout })
+//const props = defineProps(['route'])
+
+defineOptions({
+    layout: (h, page) => h(BELayout, {
+        props: {
+            route: route
+        }
+    }, [page]) 
+})
 
 </script>
+
+<script>
+import BELayout from '@/layouts/BELayout.vue'
+import { h } from 'vue'
+
+export default {
+    props: {
+        route: String
+    }
+}
+</script>
+

resources/js/pages/Login.vue

@@ -35,7 +35,7 @@
 
     function onClickLogin(){
         router.get(
-            '/Events'
+            '/events'
         )
     }
 </script>

resources/js/pages/Users/UsersList.vue

@@ -1,5 +1,5 @@
 <template>
-
+kajsdkjahsdkjhs
 </template>
 
 <script setup>

start/routes.ts

@@ -24,14 +24,15 @@ Route.get('/', async ({ inertia }) => {
   return inertia.render('Home')
 })
 
-Route.get('/Login', async({inertia}) =>{
+Route.get('/login', async({inertia}) =>{
   return inertia.render('Login')
 })
 
-Route.get('/Events', async({inertia})=> {
+Route.get('/events', async({ inertia, request }) => {
-  return inertia.render('Events/EventsList')
+  return inertia.render('Events/EventsList', {
+    route: request.url() })
 })
 
-Route.get('/Users', async({inertia}) => {
+Route.get('/users', async({inertia}) => {
   return inertia.render('Users/UsersList')
 })