init

src/router/elegant/imports.ts

@@ -0,0 +1,26 @@
+/* eslint-disable */
+/* prettier-ignore */
+// Generated by elegant-router
+// Read more: https://github.com/soybeanjs/elegant-router
+
+import type { RouteComponent } from "vue-router";
+import type { LastLevelRouteKey, RouteLayout } from "@elegant-router/types";
+
+import BaseLayout from "@/layouts/base-layout/index.vue";
+import BlankLayout from "@/layouts/blank-layout/index.vue";
+
+export const layouts: Record<RouteLayout, RouteComponent | (() => Promise<RouteComponent>)> = {
+  base: BaseLayout,
+  blank: BlankLayout,
+};
+
+export const views: Record<LastLevelRouteKey, RouteComponent | (() => Promise<RouteComponent>)> = {
+  403: () => import("@/views/_builtin/403/index.vue"),
+  404: () => import("@/views/_builtin/404/index.vue"),
+  500: () => import("@/views/_builtin/500/index.vue"),
+  "iframe-page": () => import("@/views/_builtin/iframe-page/[url].vue"),
+  login: () => import("@/views/_builtin/login/index.vue"),
+  deposit_fiat: () => import("@/views/deposit/fiat/index.vue"),
+  home: () => import("@/views/home/index.vue"),
+  withdraw_fiat: () => import("@/views/withdraw/fiat/index.vue"),
+};

src/router/elegant/routes.ts

@@ -0,0 +1,120 @@
+/* eslint-disable */
+/* prettier-ignore */
+// Generated by elegant-router
+// Read more: https://github.com/soybeanjs/elegant-router
+
+import type { GeneratedRoute } from '@elegant-router/types';
+
+export const generatedRoutes: GeneratedRoute[] = [
+  {
+    name: '403',
+    path: '/403',
+    component: 'layout.blank$view.403',
+    meta: {
+      title: '403',
+      i18nKey: 'route.403',
+      constant: true,
+      hideInMenu: true
+    }
+  },
+  {
+    name: '404',
+    path: '/404',
+    component: 'layout.blank$view.404',
+    meta: {
+      title: '404',
+      i18nKey: 'route.404',
+      constant: true,
+      hideInMenu: true
+    }
+  },
+  {
+    name: '500',
+    path: '/500',
+    component: 'layout.blank$view.500',
+    meta: {
+      title: '500',
+      i18nKey: 'route.500',
+      constant: true,
+      hideInMenu: true
+    }
+  },
+  {
+    name: 'deposit',
+    path: '/deposit',
+    component: 'layout.base',
+    meta: {
+      title: 'deposit',
+      i18nKey: 'route.deposit',
+      order: 2
+    },
+    children: [
+      {
+        name: 'deposit_fiat',
+        path: '/deposit/fiat',
+        component: 'view.deposit_fiat',
+        meta: {
+          title: 'deposit_fiat',
+          i18nKey: 'route.deposit_fiat'
+        }
+      }
+    ]
+  },
+  {
+    name: 'home',
+    path: '/home',
+    component: 'layout.base$view.home',
+    meta: {
+      title: 'home',
+      i18nKey: 'route.home',
+      icon: 'mdi:monitor-dashboard',
+      order: 1
+    }
+  },
+  {
+    name: 'iframe-page',
+    path: '/iframe-page/:url',
+    component: 'layout.base$view.iframe-page',
+    props: true,
+    meta: {
+      title: 'iframe-page',
+      i18nKey: 'route.iframe-page',
+      constant: true,
+      hideInMenu: true,
+      keepAlive: true
+    }
+  },
+  {
+    name: 'login',
+    path: '/login/:module(pwd-login|code-login|register|reset-pwd|bind-wechat)?',
+    component: 'layout.blank$view.login',
+    props: true,
+    meta: {
+      title: 'login',
+      i18nKey: 'route.login',
+      constant: true,
+      hideInMenu: true
+    }
+  },
+  {
+    name: 'withdraw',
+    path: '/withdraw',
+    component: 'layout.base',
+    meta: {
+      title: 'withdraw',
+      i18nKey: 'route.withdraw',
+      order: 3
+    },
+    children: [
+      {
+        name: 'withdraw_fiat',
+        path: '/withdraw/fiat',
+        component: 'view.withdraw_fiat',
+        meta: {
+          title: 'withdraw_fiat',
+          i18nKey: 'route.withdraw_fiat'
+        }
+      }
+    ]
+  }
+];

src/router/elegant/transform.ts

@@ -0,0 +1,196 @@
+/* eslint-disable */
+/* prettier-ignore */
+// Generated by elegant-router
+// Read more: https://github.com/soybeanjs/elegant-router
+
+import type { RouteRecordRaw, RouteComponent } from 'vue-router';
+import type { ElegantConstRoute } from '@elegant-router/vue';
+import type { RouteMap, RouteKey, RoutePath } from '@elegant-router/types';
+
+/**
+ * transform elegant const routes to vue routes
+ * @param routes elegant const routes
+ * @param layouts layout components
+ * @param views view components
+ */
+export function transformElegantRoutesToVueRoutes(
+  routes: ElegantConstRoute[],
+  layouts: Record<string, RouteComponent | (() => Promise<RouteComponent>)>,
+  views: Record<string, RouteComponent | (() => Promise<RouteComponent>)>
+) {
+  return routes.flatMap(route => transformElegantRouteToVueRoute(route, layouts, views));
+}
+
+/**
+ * transform elegant route to vue route
+ * @param route elegant const route
+ * @param layouts layout components
+ * @param views view components
+ */
+function transformElegantRouteToVueRoute(
+  route: ElegantConstRoute,
+  layouts: Record<string, RouteComponent | (() => Promise<RouteComponent>)>,
+  views: Record<string, RouteComponent | (() => Promise<RouteComponent>)>
+) {
+  const LAYOUT_PREFIX = 'layout.';
+  const VIEW_PREFIX = 'view.';
+  const ROUTE_DEGREE_SPLITTER = '_';
+  const FIRST_LEVEL_ROUTE_COMPONENT_SPLIT = '$';
+
+  function isLayout(component: string) {
+    return component.startsWith(LAYOUT_PREFIX);
+  }
+
+  function getLayoutName(component: string) {
+    const layout = component.replace(LAYOUT_PREFIX, '');
+
+    if(!layouts[layout]) {
+      throw new Error(`Layout component "${layout}" not found`);
+    }
+
+    return layout;
+  }
+
+  function isView(component: string) {
+    return component.startsWith(VIEW_PREFIX);
+  }
+
+  function getViewName(component: string) {
+    const view = component.replace(VIEW_PREFIX, '');
+
+    if(!views[view]) {
+      throw new Error(`View component "${view}" not found`);
+    }
+
+    return view;
+  }
+
+  function isFirstLevelRoute(item: ElegantConstRoute) {
+    return !item.name.includes(ROUTE_DEGREE_SPLITTER);
+  }
+
+  function isSingleLevelRoute(item: ElegantConstRoute) {
+    return isFirstLevelRoute(item) && !item.children?.length;
+  }
+
+  function getSingleLevelRouteComponent(component: string) {
+    const [layout, view] = component.split(FIRST_LEVEL_ROUTE_COMPONENT_SPLIT);
+
+    return {
+      layout: getLayoutName(layout),
+      view: getViewName(view)
+    };
+  }
+
+  const vueRoutes: RouteRecordRaw[] = [];
+
+  // add props: true to route
+  if (route.path.includes(':') && !route.props) {
+    route.props = true;
+  }
+
+  const { name, path, component, children, ...rest } = route;
+
+  const vueRoute = { name, path, ...rest } as RouteRecordRaw;
+
+  try {
+    if (component) {
+      if (isSingleLevelRoute(route)) {
+        const { layout, view } = getSingleLevelRouteComponent(component);
+
+        const singleLevelRoute: RouteRecordRaw = {
+          path,
+          component: layouts[layout],
+          meta: {
+            title: route.meta?.title || ''
+          },
+          children: [
+            {
+              name,
+              path: '',
+              component: views[view],
+              ...rest
+            } as RouteRecordRaw
+          ]
+        };
+
+        return [singleLevelRoute];
+      }
+
+      if (isLayout(component)) {
+        const layoutName = getLayoutName(component);
+
+        vueRoute.component = layouts[layoutName];
+      }
+
+      if (isView(component)) {
+        const viewName = getViewName(component);
+
+        vueRoute.component = views[viewName];
+      }
+
+    }
+  } catch (error: any) {
+    console.error(`Error transforming route "${route.name}": ${error.toString()}`);
+    return [];
+  }
+
+  // add redirect to child
+  if (children?.length && !vueRoute.redirect) {
+    vueRoute.redirect = {
+      name: children[0].name
+    };
+  }
+
+  if (children?.length) {
+    const childRoutes = children.flatMap(child => transformElegantRouteToVueRoute(child, layouts, views));
+
+    if(isFirstLevelRoute(route)) {
+      vueRoute.children = childRoutes;
+    } else {
+      vueRoutes.push(...childRoutes);
+    }
+  }
+
+  vueRoutes.unshift(vueRoute);
+
+  return vueRoutes;
+}
+
+/**
+ * map of route name and route path
+ */
+const routeMap: RouteMap = {
+  "root": "/",
+  "not-found": "/:pathMatch(.*)*",
+  "403": "/403",
+  "404": "/404",
+  "500": "/500",
+  "deposit": "/deposit",
+  "deposit_fiat": "/deposit/fiat",
+  "home": "/home",
+  "iframe-page": "/iframe-page/:url",
+  "login": "/login/:module(pwd-login|code-login|register|reset-pwd|bind-wechat)?",
+  "withdraw": "/withdraw",
+  "withdraw_fiat": "/withdraw/fiat"
+};
+
+/**
+ * get route path by route name
+ * @param name route name
+ */
+export function getRoutePath<T extends RouteKey>(name: T) {
+  return routeMap[name];
+}
+
+/**
+ * get route name by route path
+ * @param path route path
+ */
+export function getRouteName(path: RoutePath) {
+  const routeEntries = Object.entries(routeMap) as [RouteKey, RoutePath][];
+
+  const routeName: RouteKey | null = routeEntries.find(([, routePath]) => routePath === path)?.[0] || null;
+
+  return routeName;
+}