Vue路由递归加载菜单 ,单点登录

1.概述

背景 目前参与项目共有三个平台,每个平台都有工作台,工作台都有快速应用栏,用户登录其中一个平台,另外的平台都可以进入。(单点登录)

在这里插入图片描述

设计应用的菜单加载(递归加载菜单)

在这里插入图片描述

设计平台:企业管理中心,包括我的应用,模型管理,事件模型、工作流模型,数据池管理,定时任务管理,系统设置,个人页 应用中台 :用户权限管理、定时任务管理、运维管理、系统日志、个人页 应用:设计平台设计的应用 解决方案: 1、根据后端返回的数据,递归加载菜单 2、单点登录 3、token的区分,设计平台token名Access-Token,应用中台和应用token名Access-Token_+ corpid。

2.代码

1.后端返回菜单数据结构(父子结构,children包含权限集合,应用页面根据这个控制页面组件权限)

{
    "code": "0",
    "msg": "操作成功!",
    "data": [
    {
        "key": 93869045776384,
        "pid": 0,
        "title": "基础模块",
        "tag":
        {
            "deleted": false,
            "creatorId": 999,
            "creator": "优倍自动化",
            "createTime": 1591061049825,
            "modifierId": 999,
            "modifier": "优倍自动化",
            "modifyTime": 1597048554763,
            "compares": null,
            "id": 93869045776384,
            "appId": 8,
            "pageId": 0,
            "menuName": "基础模块",
            "parentId": 0,
            "iconUrl": "/default/2020-06-02/%E5%9F%BA%E7%A1%80%E4%BF%A1%E6%81%AF-%E6%AD%A3%E5%B8%B8.png?versionId=4lNzGAG0cYv5kOGsa14EXCC4vx6aQe1",
            "orderIndex": 1,
            "show": true,
            "pageType": null,
            "jumpMode": null,
            "routeUrl": null,
            "userId": 0,
            "keepAlive": true,
            "pagePermissionList": []
        },
        "leaf": false,
        "children": [
        {
            "key": 105314246524930,
            "pid": 93869045776384,
            "title": "系统参数",
            "tag":
            {
                "deleted": false,
                "creatorId": 999,
                "creator": "优倍自动化",
                "createTime": 1596518614597,
                "modifierId": 999,
                "modifier": "优倍自动化",
                "modifyTime": 1597305393445,
                "compares": null,
                "id": 105314246524930,
                "appId": 8,
                "pageId": 103906784903168,
                "menuName": "系统参数",
                "parentId": 93869045776384,
                "iconUrl": null,
                "orderIndex": 1,
                "show": true,
                "pageType": null,
                "jumpMode": null,
                "routeUrl": null,
                "userId": 0,
                "keepAlive": true,
                "pagePermissionList": [
                {
                    "deleted": false,
                    "creatorId": 0,
                    "creator": "sys",
                    "createTime": 1572415773372,
                    "modifierId": 0,
                    "modifier": "sys",
                    "modifyTime": 1572415773372,
                    "compares": null,
                    "id": 444,
                    "permissionCode": "view",
                    "permissionName": "查看",
                    "description": "",
                    "isSystem": true
                },
                {
                    "deleted": true,
                    "creatorId": 999,
                    "creator": "优倍自动化",
                    "createTime": 1597062329667,
                    "modifierId": 999,
                    "modifier": "优倍自动化",
                    "modifyTime": 1597062329667,
                    "compares": null,
                    "id": 106454216409093,
                    "permissionCode": "edit",
                    "permissionName": "编辑",
                    "description": null,
                    "isSystem": false
                }]
            },
            "leaf": true,
            "children": []
        },
        {
            "key": 107834297614338,
            "pid": 93869045776384,
            "title": "在线人员",
            "tag":
            {
                "deleted": false,
                "creatorId": 999,
                "creator": "优倍自动化",
                "createTime": 1597720268855,
                "modifierId": 999,
                "modifier": "优倍自动化",
                "modifyTime": 1597720268855,
                "compares": null,
                "id": 107834297614338,
                "appId": 8,
                "pageId": 107834297614336,
                "menuName": "在线人员",
                "parentId": 93869045776384,
                "iconUrl": null,
                "orderIndex": 14,
                "show": true,
                "pageType": null,
                "jumpMode": null,
                "routeUrl": null,
                "userId": 0,
                "keepAlive": true,
                "pagePermissionList": [
                {
                    "deleted": false,
                    "creatorId": 0,
                    "creator": "sys",
                    "createTime": 1572415773372,
                    "modifierId": 0,
                    "modifier": "sys",
                    "modifyTime": 1572415773372,
                    "compares": null,
                    "id": 444,
                    "permissionCode": "view",
                    "permissionName": "查看",
                    "description": "",
                    "isSystem": true
                }]
            },
            "leaf": true,
            "children": []
        }]
    }]
}

2.菜单递归代码,区分不同平台

import {
  asyncRouterMap,
  constantRouterMap,
  asyncRouterMapApp,
  asyncRouterMapAppReset,
  dynamicRoutes,
  lastWithoutPermissionRoutes,
  lastWithoutPermissionRoutesForDesignedApp,
} from '@/config/router.config'
import { PageView, RouteView } from '@/layouts'
import router from '../../router/index'
import { workplace } from '@/core/icons'

/**
 * 过滤账户是否拥有某一个权限,并将菜单从加载列表移除
 *
 * @param permission
 * @param route
 * @returns {boolean}
 */
function hasPermission(permission, route) {
  if (route.meta && route.meta.permission) {
    let flag = false
    for (let i = 0, len = permission.length; i < len; i++) {
      flag = route.meta.permission.includes(permission[i])
      if (flag) {
        return true
      }
    }
    return false
  }
  return true
}

/**
 * 单账户多角色时,使用该方法可过滤角色不存在的菜单
 *
 * @param roles
 * @param route
 * @returns {*}
 */
// eslint-disable-next-line
function hasRole(roles, route) {
  if (route.meta && route.meta.roles) {
    return route.meta.roles.includes(roles.id)
  } else {
    return true
  }
}

function filterAsyncRouter(routerMap, roles) {
  const accessedRouters = routerMap.filter((route) => {
    if (hasPermission(roles.permissionList, route)) {
      if (route.children && route.children.length) {
        route.children = filterAsyncRouter(route.children, roles)
      }
      return true
    }
    return false
  })
  return accessedRouters
}

function loadAsyncRouter(routerMap, roles) {
  let platformType = 0
  let corpid = router.currentRoute.meta.corpid
  let appcode = router.currentRoute.meta.appcode
  if (!corpid && router.history && router.history.pending.meta && router.history.pending.meta.corpid) {
    corpid = router.history.pending.meta.corpid
  }
  if (!appcode && router.history && router.history.pending.meta && router.history.pending.meta.appcode) {
    appcode = router.history.pending.meta.appcode
  }
  if (!corpid) {
    platformType = 0
  } else if (!appcode) {
    platformType = 1
  } else {
    platformType = 2
  }
  if (platformType == 0) {
    //设计平台
    return asyncRouterMap
  } else if (platformType == 2) {
    // 设计器设计应用
    const accessedRouters = recursionRouterForDesignedApp(roles, -1)

    var New_asyncRouterMapApp = changeRoute(asyncRouterMapApp, {
      corpid: corpid,
      appcode: appcode,
    })

    New_asyncRouterMapApp[0].children = New_asyncRouterMapApp[0].children.concat(accessedRouters)
    console.log('New_asyncRouterMapApp1: ', New_asyncRouterMapApp)
    let New_lastWithoutPermissionRoutes = changeRoute(lastWithoutPermissionRoutesForDesignedApp, {
      corpid: corpid,
      appcode: appcode,
    })
    New_lastWithoutPermissionRoutes.forEach((element) => {
      New_asyncRouterMapApp[0].children.push(element)
    })
    New_asyncRouterMapApp.push({
      path: '*',
      redirect: '/404',
      hidden: true,
      params: {
        corpid: corpid,
        appcode: appcode,
      },
    })
    console.log('New_asyncRouterMapApp2: ', New_asyncRouterMapApp)
    return New_asyncRouterMapApp
  } else {
    //应用中台
    const accessedRouters = recursionRouter(roles, dynamicRoutes)
    var New_asyncRouterMapAppReset = changeRoute(asyncRouterMapAppReset, {
      corpid: corpid,
    })
    var New_accessedRouters = changeRoute(accessedRouters, {
      corpid: corpid,
    })
    New_asyncRouterMapAppReset[0].children = New_asyncRouterMapAppReset[0].children.concat(New_accessedRouters)
    console.log('New_asyncRouterMapAppReset1: ', New_asyncRouterMapAppReset)
    let New_lastWithoutPermissionRoutes = changeRoute(lastWithoutPermissionRoutes, {
      corpid: corpid,
    })
    New_lastWithoutPermissionRoutes.forEach((element) => {
      New_asyncRouterMapAppReset[0].children.push(element)
    })
    console.log('New_asyncRouterMapAppReset2: ', New_asyncRouterMapAppReset)
    return New_asyncRouterMapAppReset
  }
}

function changeRoute(userRouter, params) {
  //递归筛选出有权限的菜单
  var realRoutes = []
  var permissions = []
  userRouter.forEach((item, index) => {
    item.params = params
    item.meta.corpid = params.corpid
    item.meta.appcode = params.appcode
    if (item.children && item.children.length > 0) {
      item.children = changeRoute(item.children, params)
    } else if (item.meta.appcode) {
      item.path = item.path + '/' + item.meta.corpid + '/' + item.meta.appcode
    } else {
      item.path = item.path + '/' + item.meta.corpid
    }
    realRoutes.push(item)
  })
  return realRoutes
}

function deleteChild(item) {
  if (item.children && item.children.length > 0) {
    item.forEach((e) => {
      if (e.children && e.children.length == 0) {
        deleteChild(e)
      }
      delete e.children
    })
  } else {
    delete item[0].children
  }
}
/**
 *
 * @param  {Array} userRouter 后台返回的用户权限json
 * @param  {Array} allRouter  前端配置好的所有动态路由的集合
 * @return {Array} realRoutes 过滤后的路由
 */

function recursionRouter(userRouter, allRouter) {
  //递归筛选出有权限的菜单
  var realRoutes = []
  allRouter.forEach((v, i) => {
    userRouter.forEach((item, index) => {
      if (item.obj.menuName === v.meta.title) {
        if (item.obj.permissionList != undefined && item.obj.permissionList.length > 0) {
          const permissions = []
          const permissionList = item.obj.permissionList
          permissionList.forEach((per) => {
            permissions.push(per.permissionCode)
          })
          v.meta.permission = v.meta.permission.concat(permissions)
        }
        v.meta.corpid = router.currentRoute.meta.corpid
        if (item.children && item.children.length > 0) {
          v.children = recursionRouter(item.children, v.children)
        } else {
        }
        if (item.children && item.children.length === 0 && v.children && v.children.length > 0) {
          v.children = []
        }
        realRoutes.push(v)
      }
    })
  })
  console.log('realRoutes', realRoutes)
  return realRoutes
}

function recursionRouterForDesignedApp(userRouter, deep) {
  console.log(11111, userRouter)
  //递归筛选出有权限的菜单
  var realRoutes = []
  var permissions = []
  let corpid = router.currentRoute.meta.corpid
    ? router.currentRoute.meta.corpid
    : router.currentRoute.params.corpid
    ? router.currentRoute.params.corpid
    : router.history.pending.meta.corpid
    ? router.history.pending.meta.corpid
    : null

  let appcode = router.currentRoute.meta.appcode
    ? router.currentRoute.meta.appcode
    : router.currentRoute.params.appcode
    ? router.currentRoute.params.appcode
    : router.history.pending.meta.appcode
    ? router.history.pending.meta.appcode
    : null
  userRouter.forEach((item, index) => {
    console.log('item: ', item)
    let keep = true
    if (item.obj && item.obj.keepAlive != undefined) {
      keep = item.obj.keepAlive
    }
    let menus = {
      path: '',
      name: '',
      meta: {
        title: '', // 菜单text
        keepAlive: keep,
        icon: '',
        permission: [], //获取权限集合
        corpid: corpid,
        appcode: appcode,
      },
      params: {},
    }
    if (item.obj.permissionList && item.obj.permissionList.length > 0) {
      item.obj.permissionList.forEach((permission) => {
        permissions.push(permission.permissionCode)
      })
    }
    menus.meta.title = item.text
    menus.meta.permission = permissions

    if (item.type === '0') {
      menus.name = 'page_' + item.id
      menus.path = '/npages_' + item.id
      if (deep < 0) {
        menus.component = PageView
      } else {
        menus.component = RouteView
      }
      menus.meta.icon = item.obj.iconUrl === null ? workplace : item.obj.iconUrl
      var newdeep = deep + 1
      menus.children = recursionRouterForDesignedApp(item.children, newdeep)
      realRoutes.push(menus)
    } else {
      menus.name = 'view_' + item.id

      menus.meta.query = {
        pageId: item.id,
        tag: item,
      }
      menus.meta.corpid = corpid
      menus.meta.appcode = appcode
      menus.path = '/npages/view' + '/' + menus.meta.corpid + '/' + menus.meta.appcode + '?pageId=' + item.id

      menus.component = () => import('@/views/npages/view')
      realRoutes.push(menus)
    }
  })
  return realRoutes
}

const permission = {
  state: {
    routers: constantRouterMap,
    addRouters: [],
  },
  mutations: {
    SET_ROUTERS: (state, routers) => {
      state.addRouters = routers
      state.routers = constantRouterMap.concat(routers)
    },
  },
  actions: {
    GenerateRoutes({ commit }, data) {
      return new Promise((resolve) => {
        const { roles } = data
        const accessedRouters = loadAsyncRouter(asyncRouterMap, roles)
        console.info('accessedRouters', accessedRouters)
        commit('SET_ROUTERS', accessedRouters)
        resolve()
      })
    },
  },
}

export default permission

3.单点登录,针对应用的跳转

import Vue from 'vue'
import {
  login,
  appPrivilege,
  getInfo,
  logout,
  appLogin,
  getCorp,
  phoneLoginCode,
  getMenuForDesignedApp,
  getMenuForDesignedAppByUser
} from '@/api/login'
import {
  ACCESS_TOKEN,
  CorpId,
  Platform_Type,
  State_Info,
  Appcode
} from '@/store/mutation-types'
import {
  welcome,
  getUserInfo,
  getToken,
  State_Info_Name,
  ACCESS_TOKEN_Name,
  REMOVE_ACCESS_TOKEN_Name
} from '@/utils/util'
import router from '../../router/index'
const user = {
  state: {
    token: '',
    name: '',
    welcome: '',
    imageUrl: '',
    roles: [],
    info: {},
    platformType: '', //0:设计平台 1:应用平台
    wsSocket: {}
  },

  mutations: {
    SET_TOKEN: (state, token) => {
      state.token = token
    },
    SET_NAME: (state, {
      name,
      welcome
    }) => {
      state.name = name
      state.welcome = welcome
    },
    // SET_IMAGEURL: (state, { imageUrl, welcome }) => {
    //   state.imageUrl = imageUrl
    //   state.welcome = welcome
    // },
    SET_NICK: (state, name) => {
      state.name = name
      const stateInfoId = getUserInfo()
      stateInfoId.name = name
      Vue.ls.set(State_Info_Name(), stateInfoId)
    },
    SET_CORPNAME: (state, name) => {
      state.name = name
      const stateInfoId = getUserInfo()
      stateInfoId.corpName = name
      stateInfoId.name = name
      Vue.ls.set(State_Info_Name(), stateInfoId)
    },
    SET_AVAURL: (state, imageUrl) => {
      console.info('SET_AVAURL')
      state.imageUrl = imageUrl
      const stateInfoId = getUserInfo()
      stateInfoId.imageUrl = imageUrl
      Vue.ls.set(State_Info_Name(), stateInfoId)
    },
    SET_ROLES: (state, roles) => {
      state.roles = roles
    },
    SET_INFO: (state, info) => {
      state.info = info
      Vue.ls.set(State_Info_Name(), info)
    },
    SET_PLATFORMTYPE: (state, platformType) => {
      state.platformType = platformType
    },
    SET_WSSOCKET: (state, wsSocket) => {
      state.wsSocket = wsSocket
    }
  },

  actions: {
    Login({
      commit
    }, userInfo) {
      if (userInfo.verifyCode !== undefined && userInfo.verifyCode && userInfo.verifyCode !== '') {
        return new Promise((resolve, reject) => {
          const verifyparams = {
            appCode: userInfo.appCode,
            areaCode: userInfo.areaCode,
            clientCode: userInfo.clientCode,
            phoneNo: userInfo.phoneNo,
            verifyCode: userInfo.verifyCode
          }
          phoneLoginCode(verifyparams)
            .then(res => {
              if (res.code === '0') {
                const result = res.data
                Vue.ls.set(ACCESS_TOKEN, result.token, 7 * 24 * 60 * 60 * 1000)
                Vue.ls.set(CorpId, result.corp.id, 7 * 24 * 60 * 60 * 1000)
                Vue.ls.set(State_Info, result.corp)
                Vue.ls.set(Platform_Type, 0)
                commit('SET_TOKEN', result.token)
                commit('SET_INFO', result.corp)
                commit('SET_PLATFORMTYPE', 0)
                //commit('SET_IMAGEURL', '@assets/login/man.png')
                resolve()
              } else {
                this.$notification['warn']({
                  message: '提示',
                  description: '验证码校验失败',
                  duration: 8
                })
              }
            })
            .catch(error => {
              console.info('login.result.error', error)
              reject(error)
            })
        })
      } else {
        return new Promise((resolve, reject) => {
          login(userInfo)
            .then(response => {
              if (response.code === '0') {
                let result = response.data
                if (!result) {
                  result = response.result
                }
                Vue.ls.set(ACCESS_TOKEN, result.token, 7 * 24 * 60 * 60 * 1000)
                Vue.ls.set(CorpId, result.corp.id, 7 * 24 * 60 * 60 * 1000)
                Vue.ls.set(State_Info, result.corp)
                Vue.ls.set(Platform_Type, 0)
                commit('SET_TOKEN', result.token)
                commit('SET_INFO', result.corp)
                commit('SET_PLATFORMTYPE', 0)
                commit('SET_IMAGEURL', '@assets/login/man.png')
                // console.info('校验成功')
                resolve()
              } else {
                reject(response.msg)
              }
            })
            .catch(error => {
              console.info('login.result.error', error)
              reject(error)
            })
        })
      }
    },

    AppLogin({
      commit
    }, userInfo) {
      return new Promise((resolve, reject) => {
        appLogin(userInfo)
          .then(response => {
            if (response.code === '0') {
              let result = response.data
              if (!result) {
                result = response.result
              }
              Vue.ls.set(ACCESS_TOKEN_Name(), result.token, 7 * 24 * 60 * 60 * 1000)
              commit('SET_TOKEN', result.token)
              commit('SET_INFO', result.sysUser)
              Vue.ls.set(State_Info_Name(), result.sysUser)
              Vue.ls.set(Platform_Type, 1)
              commit('SET_PLATFORMTYPE', 1)
              resolve()
            } else {
              reject(response.msg)
            }
          })
          .catch(error => {
            reject(error)
          })
      })
    },
    DesignAppLogin({
      commit
    }, userInfo) {
      return new Promise((resolve, reject) => {
        appLogin(userInfo)
          .then(response => {
            if (response.code === '0') {
              let result = response.data
              if (!result) {
                result = response.result
              }
              let corpid = router.currentRoute.meta.corpid ?
                router.currentRoute.meta.corpid :
                router.currentRoute.params.corpid ?
                router.currentRoute.params.corpid :
                router.history.pending.meta.corpid ?
                router.history.pending.meta.corpid :
                null
              Vue.ls.set(ACCESS_TOKEN_Name(), result.token, 7 * 24 * 60 * 60 * 1000)
              commit('SET_TOKEN', result.token)
              commit('SET_INFO', result.sysUser)
              Vue.ls.set(State_Info_Name(), result.sysUser)
              Vue.ls.set(Platform_Type, 2)
              commit('SET_PLATFORMTYPE', 2)
              resolve()
            } else {
              reject(response.msg)
            }
          })
          .catch(error => {
            reject(error)
          })
      })
    },

    // 获取用户信息
    GetInfo({
      commit,
      state
    }) {
      return new Promise((resolve, reject) => {
        let platformType = 0
        let corpid = router.currentRoute.meta.corpid ?
          router.currentRoute.meta.corpid :
          router.currentRoute.params.corpid ?
          router.currentRoute.params.corpid :
          router.history.pending.meta.corpid ?
          router.history.pending.meta.corpid :
          null

        let appcode = router.currentRoute.meta.appcode ?
          router.currentRoute.meta.appcode :
          router.currentRoute.params.appcode ?
          router.currentRoute.params.appcode :
          router.history.pending.meta.appcode ?
          router.history.pending.meta.appcode :
          null
        let stateInfoId
        if (!corpid) {
          platformType = 0
          stateInfoId = Vue.ls.get(State_Info_Name())
        } else if (!appcode) {
          platformType = 1
          stateInfoId = Vue.ls.get(State_Info_Name())
        } else {
          platformType = 2
          stateInfoId = Vue.ls.get(State_Info_Name())
        }
        //const platformType = Vue.ls.get(Platform_Type)
        // const stateInfoId = Vue.ls.get(State_Info)

        console.log('getInfo', stateInfoId)
        if (platformType === 1) {
          //获取菜单及权限信息
          appPrivilege(stateInfoId.id)
            .then(res => {
              const resResult = res.data
              commit('SET_ROLES', {})
              commit('SET_NAME', {
                name: stateInfoId.name,
                welcome: welcome()
              })
              // commit('SET_IMAGEURL', {
              //   imageUrl: stateInfoId.imageUrl,
              //   welcome: welcome(),
              // })
              //SET_AVAURL
              commit('SET_AVAURL', stateInfoId.imageUrl)
              console.log(stateInfoId.imageUrl)
              commit('SET_PLATFORMTYPE', 1)
              resolve(resResult)
            })
            .catch(error => {
              reject(error)
            })
        } else if (platformType === 2) {
          //获取菜单及权限信息
          getMenuForDesignedAppByUser({
              appCode: appcode,
              userId: stateInfoId.id
            })
            .then(res => {
              let resResult = []
              initTreeNode(resResult, res.data)
              commit('SET_ROLES', {})
              commit('SET_NAME', {
                name: stateInfoId.name,
                welcome: welcome()
              })
              // commit('SET_IMAGEURL', {
              //   imageUrl: stateInfoId.imageUrl,
              //   welcome: welcome(),
              // })
              commit('SET_PLATFORMTYPE', 2)
              resolve(resResult)
            })
            .catch(error => {
              reject(error)
            })
        } else {
          getInfo()
            .then(response => {
              const result = response.result
              if (result.role && result.role.permissions.length > 0) {
                const role = result.role
                role.permissions = result.role.permissions
                role.permissions.map(per => {
                  if (per.actionEntitySet != null && per.actionEntitySet.length > 0) {
                    const action = per.actionEntitySet.map(action => {
                      return action.action
                    })
                    per.actionList = action
                  }
                })
                role.permissionList = role.permissions.map(permission => {
                  return permission.permissionId
                })
                commit('SET_ROLES', result.role)
              } else {
                reject(new Error('getInfo: roles must be a non-null array !'))
              }
              //commit('SET_IMAGEURL', '@/assets/login/man.png')
              commit('SET_PLATFORMTYPE', 0)
              commit('SET_NAME', {
                name: stateInfoId.corpName,
                welcome: welcome()
              })
              resolve(response)
            })
            .catch(error => {
              reject(error)
            })
        }
      })
    },

    // 登出
    Logout({
      commit,
      state
    }) {
      return new Promise(resolve => {
        console.log('NPpageRouter---Logout-router', router)
        commit('SET_TOKEN', '')
        commit('SET_ROLES', [])
        let corpid = getCorpId()
        Vue.ls.remove(REMOVE_ACCESS_TOKEN_Name(corpid))
        logout(state.token)
          .then(() => {
            resolve()
          })
          .catch(() => {
            resolve()
          })
      })
    },

    SetAvaurl({
      commit
    }, url) {
      console.info('SetAvaurl', url)
      commit('SET_AVAURL', url)
    },
    SetName({
      commit
    }, val) {
      commit('SET_NICK', val)
    },
    modifyCorpName({
      commit
    }, val) {
      commit('SET_CORPNAME', val)
    }
  }
}

function getCorpId() {
  if (router.currentRoute) {
    let meta = router.currentRoute.meta
    if (meta && meta.corpid != undefined && meta.corpid != null) {
      return meta.corpid
    } else if (router.currentRoute.params) {
      let pCpId = router.currentRoute.params.corpid
      if (pCpId != undefined && pCpId != null) {
        return pCpId
      }
    }
  }
  if (router.history && router.history.pending && router.history.pending.meta) {
    let cpId = router.history.pending.meta.corpid
    if (cpId != undefined && cpId != null) {
      return cpId
    }
  }
}

function initTreeNode(menuPage, res) {
  res.forEach((element) => {
    //let children = []
    let menu = {
      id: element.key,
      text: element.title,
      type: element.leaf ? '1' : '0',
      obj: element.tag,
      children: []
    }
    if (element.children && element.children.length > 0) {
      initTreeNode(menu.children, element.children)
    }
    menuPage.push(menu)
  })
}

export default user

辅助工具方法

export function getUserInfo() {
  let corpId, user
  if (router.currentRoute.meta.corpid) {
    corpId = router.currentRoute.meta.corpid
  } else if (router.history.pending && router.history.pending.meta && router.history.pending.meta.corpid) {
    corpId = router.history.pending.meta.corpid
  } else {
    // corpId = Vue.ls.get(CorpId)
  }
  if (corpId == null && router.currentRoute.meta.appcode == null) {
    user = Vue.ls.get(State_Info)
  } else {
    if (corpId) {
      user = Vue.ls.get(State_Info + '_' + corpId)
    } else {
      user = Vue.ls.get(State_Info)
    }
  }

  return user
}

export function State_Info_Name() {
  let corpId, user
  if (router.currentRoute.meta.corpid) {
    corpId = router.currentRoute.meta.corpid
  } else if (router.history.pending && router.history.pending.meta && router.history.pending.meta.corpid) {
    corpId = router.history.pending.meta.corpid
  } else {
    //corpId = Vue.ls.get(CorpId)
  }
  if (corpId) {
    return State_Info + '_' + corpId
  } else {
    return State_Info
  }
}

export function ACCESS_TOKEN_Name() {
  let corpId, user
  console.log(123, corpId)
  if (router.currentRoute.meta.corpid) {
    corpId = router.currentRoute.meta.corpid
  } else if (router.history.pending && router.history.pending.meta && router.history.pending.meta.corpid) {
    corpId = router.history.pending.meta.corpid
  } else {
    //corpId = Vue.ls.get(CorpId)
  }
  if (corpId) {
    return ACCESS_TOKEN + '_' + corpId
  } else {
    return ACCESS_TOKEN
  }
}

export function REMOVE_ACCESS_TOKEN_Name(corpId) {
  if (corpId) {
    return ACCESS_TOKEN + '_' + corpId
  } else {
    return ACCESS_TOKEN
  }
}

export function getToken() {
  let corpId, token
  if (router.currentRoute.meta.corpid) {
    corpId = router.currentRoute.meta.corpid
  } else if (router.history.pending && router.history.pending.meta && router.history.pending.meta.corpid) {
    corpId = router.history.pending.meta.corpid
  } else {
    //corpId = Vue.ls.get(CorpId)
  }
  if (corpId) {
    token = Vue.ls.get(ACCESS_TOKEN + '_' + corpId)
  } else {
    token = Vue.ls.get(ACCESS_TOKEN)
  }
  return token
}

3.总结

  1. 递归加载菜单
  2. 单点登录,根据corpid设置token名,登录过应用中台,可以直接跳转到对应的应用。
  3. 路由跳转
  4. 登录,登出,点击应用跳转
  5. 路由懒加载
 component: () => import('@/views/dashboard/DesignWorkplace')  vue异步组件实现懒加载
 component: resolve=>(require(["@/components/HelloWorld"],resolve)) ES 提出的import方法,最常用
  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值