From 14f9b9720d2baa93bd8f94ecc84b1b29504f1023 Mon Sep 17 00:00:00 2001
From: huangxianjun <xianjun.huang@ecarx.com.cn>
Date: Fri, 19 Mar 2021 12:10:29 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B7=AF=E7=94=B1=E6=B3=A8=E5=86=8Cmap?=
 =?UTF-8?q?=E6=94=B9=E4=B8=BAfunction=E8=BF=94=E5=9B=9E=E9=98=B2=E6=AD=A2?=
 =?UTF-8?q?=E5=86=85=E5=AE=B9=E7=AF=A1=E6=94=B9;=20=E5=BC=82=E6=AD=A5?=
 =?UTF-8?q?=E8=B7=AF=E7=94=B1=E6=97=B6=E8=87=AA=E5=8A=A8=E5=B0=86/?=
 =?UTF-8?q?=E9=87=8D=E5=AE=9A=E5=90=91=E5=88=B0=E7=AC=AC=E4=B8=80=E4=B8=AA?=
 =?UTF-8?q?=E5=AD=90=E8=B7=AF=E7=94=B1=E4=BD=9C=E4=B8=BA=E9=A6=96=E9=A1=B5?=
 =?UTF-8?q?;=20=E5=A2=9E=E5=8A=A0initRouter=E6=96=B9=E6=B3=95=E5=B9=B6?=
 =?UTF-8?q?=E8=B0=83=E6=95=B4login=E6=88=90=E5=8A=9F=E6=97=B6=E8=B7=AF?=
 =?UTF-8?q?=E7=94=B1=E5=8A=A0=E8=BD=BD;=20=E5=BD=93=E8=B7=AF=E7=94=B1?=
 =?UTF-8?q?=E7=BC=93=E5=AD=98=E6=84=8F=E5=A4=96=E8=A2=AB=E6=B8=85=E7=90=86?=
 =?UTF-8?q?=E6=97=B6=E8=87=AA=E5=8A=A8=E9=87=8D=E6=96=B0=E5=8A=A0=E8=BD=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/login/Login.vue      |  11 +-
 src/router/async/router.map.js | 291 +++++++++++++++++----------------
 src/utils/routerUtil.js        |  50 +++++-
 3 files changed, 197 insertions(+), 155 deletions(-)

diff --git a/src/pages/login/Login.vue b/src/pages/login/Login.vue
index 888665d..58166b2 100644
--- a/src/pages/login/Login.vue
+++ b/src/pages/login/Login.vue
@@ -75,9 +75,9 @@
 
 <script>
 import CommonLayout from '@/layouts/CommonLayout'
-import {login, getRoutesConfig} from '@/services/user'
+import {login, logout} from '@/services/user'
 import {setAuthorization} from '@/utils/request'
-import {loadRoutes} from '@/utils/routerUtil'
+import {initRoutes} from '@/utils/routerUtil'
 import {mapMutations} from 'vuex'
 
 export default {
@@ -104,6 +104,7 @@ export default {
           this.logging = true
           const name = this.form.getFieldValue('name')
           const password = this.form.getFieldValue('password')
+          logout()
           login(name, password).then(this.afterLogin)
         }
       })
@@ -118,10 +119,8 @@ export default {
         this.setRoles(roles)
         setAuthorization({token: loginRes.data.token, expireAt: new Date(loginRes.data.expireAt)})
         // 获取路由配置
-        getRoutesConfig().then(result => {
-          const routesConfig = result.data.data
-          loadRoutes(routesConfig)
-          this.$router.push('/dashboard/workplace')
+        initRoutes(() => {
+          this.$router.push('/')
           this.$message.success(loginRes.message, 3)
         })
       } else {
diff --git a/src/router/async/router.map.js b/src/router/async/router.map.js
index ebf3684..17369d5 100644
--- a/src/router/async/router.map.js
+++ b/src/router/async/router.map.js
@@ -5,150 +5,155 @@ const view = {
   page: () => import('@/layouts/PageView')
 }
 
-// 路由组件注册
-const routerMap = {
-  login: {
-    authority: '*',
-    path: '/login',
-    component: () => import('@/pages/login')
-  },
-  root: {
-    path: '/',
-    name: '首页',
-    redirect: '/login',
-    component: view.tabs
-  },
-  dashboard: {
-    name: 'Dashboard',
-    component: view.blank
-  },
-  workplace: {
-    name: '工作台',
-    component: () => import('@/pages/dashboard/workplace')
-  },
-  analysis: {
-    name: '分析页',
-    component: () => import('@/pages/dashboard/analysis')
-  },
-  form: {
-    name: '表单页',
-    icon: 'form',
-    component: view.page
-  },
-  basicForm: {
-    path: 'basic',
-    name: '基础表单',
-    component: () => import('@/pages/form/basic')
-  },
-  stepForm: {
-    path: 'step',
-    name: '分步表单',
-    component: () => import('@/pages/form/step')
-  },
-  advanceForm: {
-    path: 'advance',
-    name: '高级表单',
-    component: () => import('@/pages/form/advance')
-  },
-  list: {
-    name: '列表页',
-    icon: 'table',
-    component: view.page
-  },
-  queryList: {
-    path: 'query',
-    name: '查询表格',
-    component: () => import('@/pages/list/QueryList')
-  },
-  primaryList: {
-    path: 'primary',
-    name: '标准列表',
-    component: () => import('@/pages/list/StandardList')
-  },
-  cardList: {
-    path: 'card',
-    name: '卡片列表',
-    component: () => import('@/pages/list/CardList')
-  },
-  searchList: {
-    path: 'search',
-    name: '搜索列表',
-    component: () => import('@/pages/list/search/SearchLayout')
-  },
-  article: {
-    name: '文章',
-    component: () => import('@/pages/list/search/ArticleList')
-  },
-  application: {
-    name: '应用',
-    component: () => import('@/pages/list/search/ApplicationList')
-  },
-  project: {
-    name: '项目',
-    component: () => import('@/pages/list/search/ProjectList')
-  },
-  details: {
-    name: '详情页',
-    icon: 'profile',
-    component: view.blank
-  },
-  basicDetails: {
-    path: 'basic',
-    name: '基础详情页',
-    component: () => import('@/pages/detail/BasicDetail')
-  },
-  advanceDetails: {
-    path: 'advance',
-    name: '高级详情页',
-    component: () => import('@/pages/detail/AdvancedDetail')
-  },
-  result: {
-    name: '结果页',
-    icon: 'check-circle-o',
-    component: view.page
-  },
-  success: {
-    name: '成功',
-    component: () => import('@/pages/result/Success')
-  },
-  error: {
-    name: '失败',
-    component: () => import('@/pages/result/Error')
-  },
-  exception: {
-    name: '异常页',
-    icon: 'warning',
-    component: view.blank
-  },
-  exp403: {
-    authority: '*',
-    name: 'exp403',
-    path: '403',
-    component: () => import('@/pages/exception/403')
-  },
-  exp404: {
-    name: 'exp404',
-    path: '404',
-    component: () => import('@/pages/exception/404')
-  },
-  exp500: {
-    name: 'exp500',
-    path: '500',
-    component: () => import('@/pages/exception/500')
-  },
-  components: {
-    name: '小组件',
-    icon: 'appstore-o',
-    component: view.page
-  },
-  taskCard: {
-    name: '任务卡片',
-    component: () => import('@/pages/components/TaskCard')
-  },
-  palette: {
-    name: '颜色复选框',
-    component: () => import('@/pages/components/Palette')
+export const initRouterMap = () => {
+  return {
+    login: {
+      authority: '*',
+      path: '/login',
+      component: () => import('@/pages/login')
+    },
+    root: {
+      path: '/',
+      name: '首页',
+      redirect: '/login',
+      component: view.tabs
+    },
+    dashboard: {
+      name: 'Dashboard',
+      component: view.blank
+    },
+    workplace: {
+      name: '工作台',
+      component: () => import('@/pages/dashboard/workplace')
+    },
+    analysis: {
+      name: '分析页',
+      component: () => import('@/pages/dashboard/analysis')
+    },
+    form: {
+      name: '表单页',
+      icon: 'form',
+      component: view.page
+    },
+    basicForm: {
+      path: 'basic',
+      name: '基础表单',
+      component: () => import('@/pages/form/basic')
+    },
+    stepForm: {
+      path: 'step',
+      name: '分步表单',
+      component: () => import('@/pages/form/step')
+    },
+    advanceForm: {
+      path: 'advance',
+      name: '高级表单',
+      component: () => import('@/pages/form/advance')
+    },
+    list: {
+      name: '列表页',
+      icon: 'table',
+      component: view.page
+    },
+    queryList: {
+      path: 'query',
+      name: '查询表格',
+      component: () => import('@/pages/list/QueryList')
+    },
+    primaryList: {
+      path: 'primary',
+      name: '标准列表',
+      component: () => import('@/pages/list/StandardList')
+    },
+    cardList: {
+      path: 'card',
+      name: '卡片列表',
+      component: () => import('@/pages/list/CardList')
+    },
+    searchList: {
+      path: 'search',
+      name: '搜索列表',
+      component: () => import('@/pages/list/search/SearchLayout')
+    },
+    article: {
+      name: '文章',
+      component: () => import('@/pages/list/search/ArticleList')
+    },
+    application: {
+      name: '应用',
+      component: () => import('@/pages/list/search/ApplicationList')
+    },
+    project: {
+      name: '项目',
+      component: () => import('@/pages/list/search/ProjectList')
+    },
+    details: {
+      name: '详情页',
+      icon: 'profile',
+      component: view.blank
+    },
+    basicDetails: {
+      path: 'basic',
+      name: '基础详情页',
+      component: () => import('@/pages/detail/BasicDetail')
+    },
+    advanceDetails: {
+      path: 'advance',
+      name: '高级详情页',
+      component: () => import('@/pages/detail/AdvancedDetail')
+    },
+    result: {
+      name: '结果页',
+      icon: 'check-circle-o',
+      component: view.page
+    },
+    success: {
+      name: '成功',
+      component: () => import('@/pages/result/Success')
+    },
+    error: {
+      name: '失败',
+      component: () => import('@/pages/result/Error')
+    },
+    exception: {
+      name: '异常页',
+      icon: 'warning',
+      component: view.blank
+    },
+    exp403: {
+      authority: '*',
+      name: 'exp403',
+      path: '403',
+      component: () => import('@/pages/exception/403')
+    },
+    exp404: {
+      name: 'exp404',
+      path: '404',
+      component: () => import('@/pages/exception/404')
+    },
+    exp500: {
+      name: 'exp500',
+      path: '500',
+      component: () => import('@/pages/exception/500')
+    },
+    components: {
+      name: '小组件',
+      icon: 'appstore-o',
+      component: view.page
+    },
+    taskCard: {
+      name: '任务卡片',
+      component: () => import('@/pages/components/TaskCard')
+    },
+    palette: {
+      name: '颜色复选框',
+      component: () => import('@/pages/components/Palette')
+    }
   }
 }
+
+// 路由组件注册
+const routerMap = initRouterMap()
+
 export default routerMap
 
diff --git a/src/utils/routerUtil.js b/src/utils/routerUtil.js
index 037cb10..a6cc920 100644
--- a/src/utils/routerUtil.js
+++ b/src/utils/routerUtil.js
@@ -1,8 +1,10 @@
-import routerMap from '@/router/async/router.map'
+import {initRouterMap} from '@/router/async/router.map'
 import {mergeI18nFromRoutes} from '@/utils/i18n'
 import Router from 'vue-router'
 import deepMerge from 'deepmerge'
 import basicOptions from '@/router/async/config.async'
+import {getRoutesConfig} from '@/services/user'
+import {checkAuthorization} from '@/utils/request'
 
 //应用配置
 let appOptions = {
@@ -67,6 +69,24 @@ function parseRoutes(routesConfig, routerMap) {
   return routes
 }
 
+/**
+ * 初始化路由
+ * @param func function 回调方法
+ */
+function initRoutes(func) {
+  if (!checkAuthorization()) {
+    return
+  }
+  getRoutesConfig().then(result => {
+    if (result.data.data && result.data.data.length > 0) {
+      loadRoutes(result.data.data)
+      if (func){
+        func(result)
+      }
+    }
+  })
+}
+
 /**
  * 加载路由
  * @param routesConfig {RouteConfig[]} 路由配置
@@ -87,17 +107,35 @@ function loadRoutes(routesConfig) {
   // 应用配置
   const {router, store, i18n} = appOptions
 
-  // 如果 routesConfig 有值，则更新到本地，否则从本地获取
+  // 如果 routesConfig 不存在则重新加载
+  if (!routesConfig || routesConfig.length <= 0) {
+    routesConfig = store.getters['account/routesConfig']
+    if (!routesConfig || routesConfig.length <= 0){
+      initRoutes()
+    }
+  }
+  // 如果 routesConfig 有值，则更新到本地
   if (routesConfig) {
     store.commit('account/setRoutesConfig', routesConfig)
-  } else {
-    routesConfig = store.getters['account/routesConfig']
   }
   // 如果开启了异步路由，则加载异步路由配置
   const asyncRoutes = store.state.setting.asyncRoutes
   if (asyncRoutes) {
     if (routesConfig && routesConfig.length > 0) {
-      const routes = parseRoutes(routesConfig, routerMap)
+      const routes = parseRoutes(routesConfig, initRouterMap())
+      // 解决动态路由初始化时找不到首页
+      if (routes && routes.length > 0) {
+        const getFirstChild = (routes) => {
+          const route = routes[0]
+          let path = route.path
+          if (!route.children || route.children.length === 0) {
+            return path
+          }
+          return !(path) || path === '/' ? '/' + getFirstChild(route.children) : path + '/'+ getFirstChild(route.children)
+        }
+        const redirect =  getFirstChild(routes)
+        routes[0].redirect = redirect
+      }
       const finalRoutes = mergeRoutes(basicOptions.routes, routes)
       formatRoutes(finalRoutes)
       router.options = {...router.options, routes: finalRoutes}
@@ -248,4 +286,4 @@ function loadGuards(guards, options) {
   })
 }
 
-export {parseRoutes, loadRoutes, formatAuthority, getI18nKey, loadGuards, deepMergeRoutes, formatRoutes, setAppOptions}
+export {parseRoutes, loadRoutes, initRoutes, formatAuthority, getI18nKey, loadGuards, deepMergeRoutes, formatRoutes, setAppOptions}