update route

src/router/index.ts

@@ -463,6 +463,49 @@ const routes: RouteRecordRaw[] = [
   },
 ]
 
+// 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 createRoute = (route: RouteRecordRaw[]): RouteRecordRaw[] => {
   var newRoute: RouteRecordRaw[] = []
 
@@ -470,8 +513,7 @@ const createRoute = (route: RouteRecordRaw[]): RouteRecordRaw[] => {
     route.forEach((r) => {
       if (r.children) {
         if (r.component) {
-          var fullPath = `${parent.replace('/', '')}/${r.path.replace('/', '')}`
+          const fullPath = `${parent.replace('/', '')}/${r.path.replace('/', '')}`
-          fullPath = hasMoreThanTwoSlashes(fullPath) ? removeExtraSlashes(fullPath) : fullPath
           newRoute.push({
             path: fullPath,
             name: r.name,
@@ -480,12 +522,12 @@ const createRoute = (route: RouteRecordRaw[]): RouteRecordRaw[] => {
         }
         getRoute(r.children, `${parent}/${r.path}`)
       } else {
-        var fullPath = `${parent.replace('/', '')}/${r.path.replace('/', '')}`
+        const 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('-'),
+              path: fullPath === '/home/' ? '' : fullPath.includes('/home/') ? fullPath.replace('/home/', '') : fullPath,
               name: r.name,
               component: r.component
             } as RouteRecordRaw]
@@ -501,15 +543,20 @@ const createRoute = (route: RouteRecordRaw[]): RouteRecordRaw[] => {
     })
   }
   getRoute(route)
-  console.log(newRoute);
 
-  return newRoute
+  // remove duplicate route path and sort by path length
+  const uniqueRoute = newRoute.filter((nr, index, self) => self.findIndex((n) => n.path === nr.path) === index).sort((a, b) => b.path.length - a.path.length)
+
+  return uniqueRoute
 }
+
 const router = createRouter({
-  history: createWebHistory(import.meta.env.VITE_BASE_DIRECTORY),
+  history: createWebHistory(),
   linkActiveClass: 'active',
   routes: createRoute(routes)
 })
+console.log(router.getRoutes());
+
 
 router.beforeEach((to, from, next) => {
   // redirect to login page if not logged in and trying to access a restricted page

src/utils/route.ts

@@ -30,11 +30,31 @@ const convertToDashedString = (input: string): string => {
     return `/${parts.join('-')}`;
 }
 
+// export const convertRouteToMenu = (data: RouteRecordRaw[], basePath: string = '/home', iconIndex: number = 0): MenuItemModel[] => {
+//     return data.filter((i) => i.path !== '').map((item) => {
+//         const convertedItem: MenuItemModel = {
+//             name: item.name?.toString() || '',
+//             path: convertToDashedString(`${basePath}/${item.path}`).replace('/home-', '/home/'),
+//             expanded: false,
+//             icon: undefined,
+//             children: [],
+//         };
+
+//         if (item.children) {
+//             convertedItem.icon = navigationIcon[iconIndex];
+//             iconIndex = (iconIndex + 1) % navigationIcon.length;
+//             convertedItem.children = convertRouteToMenu(item.children, `${basePath}/${item.path}`, iconIndex);
+//         }
+
+//         return convertedItem
+//     })
+// }
+
 export const convertRouteToMenu = (data: RouteRecordRaw[], basePath: string = '/home', iconIndex: number = 0): MenuItemModel[] => {
     return data.filter((i) => i.path !== '').map((item) => {
         const convertedItem: MenuItemModel = {
             name: item.name?.toString() || '',
-            path: convertToDashedString(`${basePath}/${item.path}`).replace('/home-', '/home/'),
+            path: `${basePath}/${item.path}`,
             expanded: false,
             icon: undefined,
             children: [],