update route methods

src/router/index.ts

@@ -1,13 +1,14 @@
 
-import { createRouter, createWebHistory } from 'vue-router'
+import { createRouter, createWebHistory, type RouteRecordRaw } from 'vue-router'
 import { useAuthStore } from '@/stores/auth'
 import HomeView from '@/views/HomeView.vue'
 import LoginView from '@/views/LoginView.vue'
 import NotFoundView from '@/views/NotFoundView.vue'
 import EmptyPage from '@/components/Pages/HomeEmpty.vue'
 import TestPage from '@/components/Pages/TestPage.vue'
+import { hasMoreThanTwoSlashes, removeExtraSlashes } from '@/utils/route'
 
-export const routes = [
+const routes: RouteRecordRaw[] = [
   {
     path: '/home',
     name: 'Home',
@@ -23,7 +24,7 @@ export const routes = [
         name: 'Gangguan',
         children: [
           {
-            path: '1',
+            path: 'a',
             name: 'Daftar',
             children: [
               {
@@ -64,7 +65,7 @@ export const routes = [
             ],
           },
           {
-            path: '2',
+            path: 'b',
             name: 'Rekapitulasi',
             children: [
               {
@@ -74,12 +75,12 @@ export const routes = [
               },
               {
                 path: '2',
-                name: 'Rekapitulasi Gangguan Per Jenis Gangguan',
+                name: 'Rekapitulasi Gangguan/Jenis Gangguan',
                 component: TestPage,
               },
               {
                 path: '3',
-                name: 'Rekapitulasi Gangguan Per Jenis Gangguan SE 004',
+                name: 'Rekapitulasi Gangguan/Jenis Gangguan SE 004',
                 component: TestPage,
               },
               {
@@ -146,7 +147,7 @@ export const routes = [
         name: 'Keluhan',
         children: [
           {
-            path: '1',
+            path: 'a',
             name: 'Daftar',
             children: [
               {
@@ -187,7 +188,7 @@ export const routes = [
             ],
           },
           {
-            path: '2',
+            path: 'b',
             name: 'Rekapitulasi',
             children: [
               {
@@ -239,11 +240,11 @@ export const routes = [
         name: 'Monalisa',
         children: [
           {
-            path: '1',
+            path: 'a',
             name: 'Gangguan',
             children: [
               {
-                path: '1',
+                path: 'a',
                 name: 'Rekapitulasi',
                 children: [
                   {
@@ -286,11 +287,11 @@ export const routes = [
             ],
           },
           {
-            path: '2',
+            path: 'b',
             name: 'Keluhan',
             children: [
               {
-                path: '1',
+                path: 'a',
                 name: 'Rekapitulasi',
                 children: [
                   {
@@ -328,11 +329,11 @@ export const routes = [
             ],
           },
           {
-            path: '3',
+            path: 'c',
             name: 'Laporan KPI',
             children: [
               {
-                path: '1',
+                path: 'a',
                 name: 'Bulanan',
                 children: [
                   {
@@ -392,7 +393,7 @@ export const routes = [
         name: 'Check In OutCheck In Dan Check Out',
         children: [
           {
-            path: '1',
+            path: 'a',
             name: 'Laporan Check In /Check Out (CICO)',
             children: [
               {
@@ -409,7 +410,7 @@ export const routes = [
         name: 'Anomali Penangan Pengaduan',
         children: [
           {
-            path: '1',
+            path: 'a',
             name: 'Gangguan',
             children: [
               {
@@ -425,7 +426,7 @@ export const routes = [
             ],
           },
           {
-            path: '2',
+            path: 'b',
             name: 'Keluhan',
             children: [
               {
@@ -461,10 +462,53 @@ export const routes = [
     component: NotFoundView
   },
 ]
+
+const createRoute = (route: RouteRecordRaw[]): RouteRecordRaw[] => {
+  var newRoute: RouteRecordRaw[] = []
+
+  const getRoute = (route: RouteRecordRaw[], parent: string = '') => {
+    route.forEach((r) => {
+      if (r.children) {
+        if (r.component) {
+          var fullPath = `${parent.replace('/', '')}/${r.path.replace('/', '')}`
+          fullPath = hasMoreThanTwoSlashes(fullPath) ? removeExtraSlashes(fullPath) : fullPath
+          newRoute.push({
+            path: fullPath,
+            name: r.name,
+            component: r.component
+          } as RouteRecordRaw)
+        }
+        getRoute(r.children, `${parent}/${r.path}`)
+      } else {
+        var fullPath = `${parent.replace('/', '')}/${r.path.replace('/', '')}`
+        if (newRoute.find((nr) => nr.path !== '/' && nr.path === '/home' && fullPath.includes(nr.path))) {
+          const index = newRoute.findIndex((nr) => nr.path !== '/' && fullPath.includes(nr.path))
+          newRoute[index] = {
+            ...newRoute[index], children: [...newRoute[index].children ?? [], {
+              path: fullPath === '/home/' ? '' : fullPath.includes('/home/') ? fullPath.replace('/home/', '').split('/').join('-') : fullPath.split('/').join('-'),
+              name: r.name,
+              component: r.component
+            } as RouteRecordRaw]
+          }
+        } else {
+          newRoute.push({
+            path: fullPath,
+            name: r.name,
+            component: r.component
+          } as RouteRecordRaw)
+        }
+      }
+    })
+  }
+  getRoute(route)
+  console.log(newRoute);
+
+  return newRoute
+}
 const router = createRouter({
-  history: createWebHistory(import.meta.env.BASE_URL),
+  history: createWebHistory(import.meta.env.VITE_BASE_DIRECTORY),
   linkActiveClass: 'active',
-  routes: routes
+  routes: createRoute(routes)
 })
 
 router.beforeEach((to, from, next) => {
@@ -500,7 +544,9 @@ router.beforeEach((to, from, next) => {
       }
     }
   }
-
 })
 
 export default router
+export {
+  routes
+}