qiaobi/src/router/index.js

import Vue from 'vue'
import VueRouter from 'vue-router'
import Store from '../store'
import Cookies from 'js-cookie'
Vue.use(VueRouter)

const originalPush = VueRouter.prototype.push
VueRouter.prototype.push = function push(location) {
  return originalPush.call(this, location).catch(err => err)
}
const routes = [
  {
    path: "/",
    component: () => import('@/views/index'),
  },

  {
    path: '/register',
    name: 'Register',
    meta: {
      title: '注册'
    },
    component: () => import("@/views/register/index.vue")
  },
  {
    path: "",
    component: () => import('@/views/layout/index.vue'),
    children: [
      {
        path: '/home',
        name: 'Home',
        meta: {
          // title: '首页',
          sign: 'home',
          belong: 'home'
        },
        component: () => import('@/views/home/index.vue'),
      },
    ]
  }

]
/* 后台管理系统Layout */
import administrator_layout from '@/views/backStageManage/layout/Layout.vue'
export const backStageManageRouterItem = [
  {
    path: '/administrator',
    component: administrator_layout,
    redirect: '/administrator/home',
    meta: { title: '首页', icon: 'home' },
    children: [
      {
        path: 'home',
        name: 'Administrator_home',
        component: () => import('@/views/backStageManage/home/index.vue'),
        meta: { title: '首页', icon: 'home' }
      },
    ]
  },
  {
    path: '/administrator',
    name: 'Administrator_organization',
    component: administrator_layout,
    redirect: '/administrator/personnel',
    meta: { title: '人员组织管理', icon: 'application' },
    children: [
      {
        path: 'personnel',
        name: 'Administrator_personnel',
        component: () => import('@/views/backStageManage/organization/personnel/index.vue'),
        meta: {title: '人员清单'},
      },
      {
        path: 'personnel2',
        name: 'Administrator_personnel2',
        component: () => import('@/views/backStageManage/organization/personnel/index.vue'),
        meta: {title: '人员清单2'},
      },
    ]
  },

  {
    path: '/administrator',
    name: 'Administrator_application',
    component: administrator_layout,
    redirect: '/administrator/apply',
    meta: { title: '应用管理', icon: 'application' },
    children: [
      {
        path: 'addApply',
        name: 'Administrator_addApply',
        component: () => import('@/views/backStageManage/application/apply/components/addApply.vue'),
        meta: {title: '添加应用功能', icon: 'apply', keepAlive:true},
        hidden:true
      },
      {
        path: 'apply',
        name: 'Administrator_apply',
        component: () => import('@/views/backStageManage/application/apply/index.vue'),
        meta: { title: '应用功能清单', icon: 'apply' }
      },
      {
        path: 'vision',
        name: 'Administrator_vision',
        component: () => import('@/views/backStageManage/application/vision/index.vue'),
        meta: { title: '应用版本清单', icon: 'vision' }
      },
      {
        path: 'addVersion',
        name: 'Administrator_addVersion',
        component: () => import('@/views/backStageManage/application/vision/addVersion.vue'),
        meta: {title: '添加应用版本', icon: 'addVision'},
        hidden:true
      },
      {
        path: 'editVersion',
        name: 'Administrator_editVersion',
        component: () => import('@/views/backStageManage/application/vision/editVersion.vue'),
        meta: {title: '编辑应用版本', icon: 'editVision'},
        hidden:true
      },
      {
        path: 'vip',
        name: 'Administrator_vip',
        component: () => import('@/views/backStageManage/application/vip/index.vue'),
        meta: {title: '应用会员清单', icon: 'vip'}
      },
      {
        path: 'addVip',
        name: 'Administrator_addVip',
        component: () => import('@/views/backStageManage/application/vip/components/addVipForm.vue'),
        meta: {title: '添加应用会员', icon: 'addVip'},
        hidden:true
      },
      {
        path: 'editVip',
        name: 'Administrator_editVip',
        component: () => import('@/views/backStageManage/application/vip/components/editVipForm.vue'),
        meta: {title: '编辑应用会员', icon: 'editVip'},
        hidden:true
      },
    ]
  },
]
export const backStageManage = [
  {
    path: '/administrator',
    name: 'Administrator',
    component: { render(c) { return c('router-view') } },
    redirect: '/administrator',
    children: [
      {
        path: '/',
        name: 'Administrator_Index',
        meta: {
          title: '后台管理',
        },
        component: () => import('@/views/backStageManage/index/index.vue'),
      },
      {
        path: 'login',
        name: 'Administrator_login',
        meta: {
          title: '后台管理-登录',
        },
        component: () => import('@/views/backStageManage/login/index.vue'),
      },
      ...backStageManageRouterItem
    ]
  }
]

const router = new VueRouter({
  mode: 'history',
  base: '/',
  routes: process.env.NODE_ENV !== 'production' ? [...routes, ...backStageManage] : routes
})

router.beforeEach((to, from, next) => {
  if (to.meta.title) {
    document.title = to.meta.title;
  }
  if (to.path == '/administrator/login'|| routeExists(routes,to.path) || to.meta.notLogin) {
    Cookies.remove("token")
    localStorage.removeItem('vuex')
    next()
  }
  else {
    const tokenStr = Cookies.get('token')
    switch (tokenStr) {
      case undefined:
        if (to.meta.title) {
          document.title = to.meta.title;
        }
        next({ name: 'Administrator_login' })
        break;
      default:
        if (to.meta.title) {
          document.title = to.meta.title;
        }
        next()
        break;

    }
  }
})

function routeExists(array, path, parentPath) {
  for (var i = 0; i < array.length; i++) {
    var item = array[i]
    var nowPath = item.path
    if (item.path.indexOf('/') != 0) {
      nowPath = parentPath + '/' + nowPath
    }
    if (!item.children || item.children.length == 0) {
      if (path == nowPath) {
        return true
      }
    } else {
      var data = item.children
      var sign = routeExists(data, path, nowPath)
      if (sign) {
        return true
      }
    }
  }
  return false
}
// 在你的路由配置文件中
router.afterEach((to, from) => {
  var sign = routeExists(backStageManageRouterItem, to.path)
  if (!sign) {
    return
  }
  var obj = {
    name: to.meta.title,
    path: to.path,
    route: {
      name: to.name,
      path: to.path,
      query: to.query,
      params: to.params
    }
  }
  Store.commit('addHistory', obj);
  Store.commit('addHistoryPath', to.path);
});

export default router