import { AppRouteModule } from '/@/router/types' import type { Menu, AppRouteRecordRaw } from '/@/router/types' import { findPath, treeMap } from '/@/utils/helper/treeHelper' import { cloneDeep } from 'lodash-es' import { isUrl } from '/@/utils/is' import { RouteParams } from 'vue-router' import { toRaw } from 'vue' export function getAllParentPath(treeData: T[], path: string) { const menuList = findPath(treeData, (n) => n.path === path) as Menu[] return (menuList || []).map((item) => item.path) } function joinParentPath(menus: Menu[], parentPath = '') { for (let index = 0; index < menus.length; index++) { const menu = menus[index] // https://next.router.vuejs.org/guide/essentials/nested-routes.html // Note that nested paths that start with / will be treated as a root path. // This allows you to leverage the component nesting without having to use a nested URL. if (!(menu.path.startsWith('/') || isUrl(menu.path))) { // path doesn't start with /, nor is it a url, join parent path menu.path = `${parentPath}/${menu.path}` } if (menu?.children?.length) { joinParentPath(menu.children, menu.meta?.hidePathForChildren ? parentPath : menu.path) } } } // Parsing the menu module export function transformMenuModule(menuModule: any[]): Menu { const menuList = menuModule joinParentPath(menuList) return menuList[0] } export function initRouteRedirect(routeModList: AppRouteModule[]) { const cloneRouteModList = cloneDeep(routeModList) joinParentPath(cloneRouteModList) const list = treeMap(cloneRouteModList, { conversion: (node: AppRouteRecordRaw) => { const { redirect } = node if (!redirect) { if (node.children && node.children.length > 0) { node['redirect'] = node?.children?.[0]?.path } } return node }, }) return cloneDeep(list) } export function transformRouteToMenu(routeModList: AppRouteModule[], routerMapping = false) { const cloneRouteModList = cloneDeep(routeModList) const routeList: AppRouteRecordRaw[] = [] cloneRouteModList.forEach((item) => { if (routerMapping && item.meta.hideChildrenInMenu && typeof item.redirect === 'string') { item.path = item.redirect } if (item.meta?.single) { const realItem = item?.children?.[0] realItem && routeList.push(realItem) } else { routeList.push(item) } }) const list = treeMap(routeList, { conversion: (node: AppRouteRecordRaw) => { const { meta: { title, hideMenu = false } = {} } = node return { ...(node.meta || {}), meta: node.meta, name: title, hideMenu, path: node.path, ...(node.redirect ? { redirect: node.redirect } : {}), } }, }) joinParentPath(list) return cloneDeep(list) } /** * config menu with given params */ const menuParamRegex = /(?::)([\s\S]+?)((?=\/)|$)/g export function configureDynamicParamsMenu(menu: Menu, params: RouteParams) { const { path, paramPath } = toRaw(menu) let realPath = paramPath ? paramPath : path const matchArr = realPath.match(menuParamRegex) matchArr?.forEach((it) => { const realIt = it.substr(1) if (params[realIt]) { realPath = realPath.replace(`:${realIt}`, params[realIt] as string) } }) // save original param path. if (!paramPath && matchArr && matchArr.length > 0) { menu.paramPath = path } menu.path = realPath // children menu.children?.forEach((item) => configureDynamicParamsMenu(item, params)) }