From 720b770655dc5265ebfd1e8c38f3ad0430d3901a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bahad=C4=B1r=20Sofuo=C4=9Flu?= <bahadirsofuoglu@gmail.com>
Date: Mon, 7 Nov 2022 02:33:55 +0300
Subject: [PATCH] menu nestedrouteitems problem solved

---
 src/components/menu/ConfirmationDemo.vue | 12 ++++++++++++
 src/components/menu/PaymentDemo.vue      | 12 ++++++++++++
 src/components/menu/PersonalDemo.vue     | 12 ++++++++++++
 src/components/menu/SeatDemo.vue         | 12 ++++++++++++
 src/router/index.js                      | 21 +++++++++++++++++++--
 src/views/uikit/Menu.vue                 |  8 ++++----
 6 files changed, 71 insertions(+), 6 deletions(-)
 create mode 100644 src/components/menu/ConfirmationDemo.vue
 create mode 100644 src/components/menu/PaymentDemo.vue
 create mode 100644 src/components/menu/PersonalDemo.vue
 create mode 100644 src/components/menu/SeatDemo.vue

diff --git a/src/components/menu/ConfirmationDemo.vue b/src/components/menu/ConfirmationDemo.vue
new file mode 100644
index 0000000..7559b45
--- /dev/null
+++ b/src/components/menu/ConfirmationDemo.vue
@@ -0,0 +1,12 @@
+<template>
+    <div class="flex align-items-center py-5 px-3">
+        <i class="pi pi-fw pi-check mr-2 text-2xl" />
+        <p class="m-0 text-lg">Confirmation Component Content via Child Route</p>
+    </div>
+</template>
+
+<script>
+export default {
+
+}
+</script>
\ No newline at end of file
diff --git a/src/components/menu/PaymentDemo.vue b/src/components/menu/PaymentDemo.vue
new file mode 100644
index 0000000..5ec48c9
--- /dev/null
+++ b/src/components/menu/PaymentDemo.vue
@@ -0,0 +1,12 @@
+<template>
+    <div class="flex align-items-center py-5 px-3">
+        <i class="pi pi-fw pi-money-bill mr-2 text-2xl" />
+        <p class="m-0 text-lg">Payment Component Content via Child Route</p>
+    </div>
+</template>
+
+<script>
+export default {
+
+}
+</script>
\ No newline at end of file
diff --git a/src/components/menu/PersonalDemo.vue b/src/components/menu/PersonalDemo.vue
new file mode 100644
index 0000000..743605b
--- /dev/null
+++ b/src/components/menu/PersonalDemo.vue
@@ -0,0 +1,12 @@
+<template>
+    <div class="flex align-items-center py-5 px-3">
+        <i class="pi pi-fw pi-user mr-2 text-2xl" />
+        <p class="m-0 text-lg">Personal Component Content via Child Route</p>
+    </div>
+</template>
+
+<script>
+export default {
+
+}
+</script>
\ No newline at end of file
diff --git a/src/components/menu/SeatDemo.vue b/src/components/menu/SeatDemo.vue
new file mode 100644
index 0000000..86ea3bf
--- /dev/null
+++ b/src/components/menu/SeatDemo.vue
@@ -0,0 +1,12 @@
+<template>
+    <div class="flex align-items-center py-5 px-3">
+        <i class="pi pi-fw pi-ticket mr-2 text-2xl" />
+        <p class="m-0 text-lg">Seat Component Content via Child Route</p>
+    </div>
+</template>
+
+<script>
+export default {
+
+}
+</script>
\ No newline at end of file
diff --git a/src/router/index.js b/src/router/index.js
index f1f307f..791fc8f 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -71,8 +71,25 @@ const router = createRouter({
                 },
                 {
                     path: '/uikit/menu',
-                    name: 'menu',
-                    component: () => import('@/views/uikit/Menu.vue')
+                    component: () => import('@/views/uikit/Menu.vue'),
+                    children: [
+                        {
+                            path: '/uikit/menu',
+                            component: () => import('@/components/menu/PersonalDemo.vue')
+                        },
+                        {
+                            path: '/uikit/menu/seat',
+                            component: () => import('@/components/menu/SeatDemo.vue')
+                        },
+                        {
+                            path: '/uikit/menu/payment',
+                            component: () => import('@/components/menu/PaymentDemo.vue')
+                        },
+                        {
+                            path: '/uikit/menu/confirmation',
+                            component: () => import('@/components/menu/ConfirmationDemo.vue')
+                        }
+                    ]
                 },
                 {
                     path: '/uikit/message',
diff --git a/src/views/uikit/Menu.vue b/src/views/uikit/Menu.vue
index 5c2c4de..c7d888e 100644
--- a/src/views/uikit/Menu.vue
+++ b/src/views/uikit/Menu.vue
@@ -174,19 +174,19 @@ const breadcrumbItems = ref([{ label: 'Computer' }, { label: 'Notebook' }, { lab
 const nestedRouteItems = ref([
     {
         label: 'Personal',
-        to: '/menu'
+        to: '/uikit/menu'
     },
     {
         label: 'Seat',
-        to: '/menu/seat'
+        to: '/uikit/menu/seat'
     },
     {
         label: 'Payment',
-        to: '/menu/payment'
+        to: '/uikit/menu/payment'
     },
     {
         label: 'Confirmation',
-        to: '/menu/confirmation'
+        to: '/uikit/menu/confirmation'
     }
 ]);
 const tieredMenuItems = ref([