tmp-jn/src/router/index.ts

import { createRouter, createWebHashHistory, RouteRecordRaw } from 'vue-router';
import { app_ready, app_routes } from '~/store/app';
import { RouteRecordDetailRaw } from './routes.d';

// import localRoutes, { title } from './routes/xdjx';
import localRoutes, { title } from './routes/xdjy';
// import localRoutes, { title } from './routes/xdhq';

document.title = title

// !auto switch routes way 1:
// !build error
// const localRoutes = (await import(`./routes/${import.meta.env.MODE}.ts`))['default'] as RouteRecordDetailRaw[]

// const currentRouteModule = import.meta.glob(`./routes/*.ts`, { eager: true })[`./routes/${import.meta.env.MODE}.ts`] as { title: string, default: RouteRecordDetailRaw[] }
// document.title = currentRouteModule['title']
// const localRoutes = currentRouteModule['default']

console.log('localRoutes :>> ', localRoutes);

const router = createRouter({
  history: createWebHashHistory(),
  routes: [
    {
      path: '/',
      component: () => import("~/layout/loading/index.vue")
    },
    {
      path: '/routes',
      name: '-ROUTES',
      props: true,
      meta: {
        hidden: false,
        sort: -1,
        title: "组织机构与权限"
      },
      component: () => import("~/router/routes.vue")
    },
    {
      path: '/xxzx',
      name: 'xxzx',
      props: true,
      meta: {
        hidden: true,
        sort: -1,
        title: "消息中心"
      },
      component: () => import("~/pages/[...]/xxzx/index.vue")
    }
  ]
})
export default router

const debug = localStorage.getItem("debug");
const whiteList = ['/xxzx']

async function handleFilterRoutes<R extends RouteRecordDetailRaw[]>(routes: R): Promise<Partial<R>> {
  console.log(' handleFilterRoutes ');
  function getAppRoutes(routes: any[]) {
    if (debug === '1') { return routes }
    else {
      const hash = location.hash
      // '#/dddx/ddrwfk' => '/dddx'
      const first = '/' + hash.split('/')[1]
      console.log('getAppRoutes :>> ', first, routes.filter(route => route.path === first));
      return routes.filter(route => route.path === first || whiteList.includes(route.path))
    }
  }
  // await new Promise((resolve) => {
  //   setTimeout(() => {
  //     resolve(getAppRoutes(routes))
  //   }, 0);
  // })
  return getAppRoutes(routes) as Partial<R>
}

const routes = await handleFilterRoutes(localRoutes)
sessionStorage.setItem('routes', JSON.stringify(routes.concat([
  // {
  //   path: '/routes',
  //   name: '-ROUTES',
  //   meta: {
  //     hidden: false,
  //     sort: -1,
  //     title: "组织机构与权限"
  //   },
  //   component: () => import("~/router/routes.vue")
  // }
])))
routes.forEach(filteredRoute => router.addRoute(filteredRoute as RouteRecordRaw))
app_ready.value = true
app_routes.value = (routes as RouteRecordDetailRaw[])

router.beforeEach((to, from) => {
  console.groupCollapsed(`%c${from.name?.toString()} => ${to.name?.toString()}`, 'color:#0ff');
  console.log(`%c${from.meta.title} => ${to.meta.title}`, 'color:#0cc');
  console.groupEnd();
})