cbjsxt-front-master/src/utils/handleRoutes.js

import { templatePreviewKeepalive, querySqlPreviewKeepalive } from '@/config'

const ignoreField = [
  'activeTab',
  'alias',
  'id',
  'menuIcon',
  'pkVal',
  'sn',
  'sysMethods',
  'tabsStyle',
  'tenantId',
  'parentId',
]

// 需要实现keepalive的路由列表
const keepaliveRoutes = [
  {
    alias: 'myTask',
    name: 'MyTask',
  },
  {
    alias: 'startProcess',
    name: 'StartProcess',
  },
]

if (templatePreviewKeepalive) {
  keepaliveRoutes.push({
    alias: 'templatePreview',
    name: 'TemplatePreview',
  })
}

if (querySqlPreviewKeepalive) {
  keepaliveRoutes.push({
    alias: 'querySqlPreview',
    name: 'QuerySqlPreview',
  })
}

// 注册的路由name可能与组件的Name不一致，需要修改route的name与组件的name保持一致才能让keepalive生效
const keepaliveTransfer = (route) => {
  if (!route.alias) {
    return
  }
  const matchRoute = keepaliveRoutes.find((r) => r.alias == route.alias)
  if (matchRoute && matchRoute.name) {
    route.name = matchRoute.name
  }
}

// 路由对应的Component转换处理
const componentTransfer = (route) => {
  if (!route.component) {
    return
  }
  if (route.component === 'Layout') {
    route.component = (resolve) => require(['@/components/layouts'], resolve)
  } else if (route.component === 'EmptyLayout') {
    route.component = (resolve) =>
      require(['@/components/layouts/EmptyLayout'], resolve)
  } else if (route.component === 'DatavLayout') {
    route.component = (resolve) =>
      require(['@/components/datav/DatavDesignPreview.vue'], resolve)
  } else if (route.component === 'TemplateLayout') {
    // 注册为keepalive的路由
    templatePreviewKeepalive && registerKeepaliveRoute(route, 'TemplatePreview')
    route.component = (resolve) =>
      require(['@/components/dataTemplate/TemplatePreview.vue'], resolve)
  } else if (route.component === 'QuerySqlLayout') {
    // 注册为keepalive的路由
    querySqlPreviewKeepalive && registerKeepaliveRoute(route, 'QuerySqlPreview')
    route.component = (resolve) =>
      require(['@/components/querySql/QuerySqlPreview.vue'], resolve)
  } else if (route.component === 'indexLayout') {
    route.component = (resolve) => require(['@/views/home/index'], resolve)
  } else if (route.component === 'OnlineMenu') {
    route.component = (resolve) => require(['@/views/OnlineMenu'], resolve)
  } else if (route.component === 'MultilevelMenuLayout') {
    route.component = (resolve) =>
      require(['@/components/layouts/MultilevelMenuLayout'], resolve)
  } else {
    const index = route.component.indexOf('views')
    const path =
      index > 0 ? route.component.slice(index) : `views/${route.component}`
    route.component = (resolve) => require([`@/${path}`], resolve)
  }
}

/**
 * 注册需要keepalive的路由
 */
const registerKeepaliveRoute = (route, name) => {
  if (!route || !route.path) {
    return
  }
  route.name = name
}

/**
 * 后台传过来的路由需要转换
 * @param {*} asyncRoutes
 * @returns
 */
export function convertRouter(asyncRoutes) {
  let r = asyncRoutes
  let routePaths = []
  for (let i = r.length - 1; i >= 0; i--) {
    let route = r[i]
    // keepalive的路由处理
    keepaliveTransfer(route)
    let extend = (route.routeExtend && JSON.parse(route.routeExtend)) || {
      ...route,
      meta: { title: route.name, href: route.href, isChildren: true },
      component: 'OnlineMenu',
      path: `/onlineMenu/${getCurrentPath(route.path)}`,
    }
    !route.href && delete route.href
    delete route.routeExtend
    Object.keys(extend).forEach((key) => {
      route[key] = extend[key]
    })
    ignoreField.forEach((field) => {
      delete route[field]
    })
    //处理路由中的参数
    let path = route.path
    if (path.indexOf('?') !== -1) {
      const paths = path.split('?')
      if (paths.length > 1) {
        let routerParams = {}
        const params = paths[1].split('&')
        if (params.length > 0) {
          params.forEach((param) => {
            const paraValues = param.split('=')
            routerParams[paraValues[0]] = paraValues[1]
          })
        }
        route.path = paths[0]
        route.meta = { ...route.meta, ...routerParams }
      }
    }
    if (routePaths.includes(route.path)) {
      console.error(`存在相同的路由路径[${route.path}]`)
      r.splice(i, 1)
    } else {
      routePaths.push(route.path)
    }
    // 路由对应的Component的转换处理
    componentTransfer(route)
    if (route.children && route.children.length) {
      route.children = convertRouter(route.children)
    }
    if (route.children && route.children.length === 0) delete route.children
  }
  return r
}
function getCurrentPath(path) {
  const onlineMenuPath = path.split('.')
  return onlineMenuPath[onlineMenuPath.length - 2]
}

export const keepaliveIncludes = keepaliveRoutes.reduce((ary, cur) => {
  ary.push(cur.name)
  return ary
}, [])