index.js

import Vue from 'vue'

import Nprogress from 'nprogress'
import 'nprogress/nprogress.css'
import { getToken } from '@/utils/auth'
import { isEmpty } from '@/utils'
import VueRouter from 'vue-router'
// import Router from 'vue-router'
import store from '@/store'
// store
import Article from '@/components/Article'
import Login from '@/components/Login'
import Register from '@/components/Register'
import Onlinewebsocket from '@/components/Onlinewebsocket'
import Home from '@/components/Home'
import Bilicom from '@/components/Bilicom'
import Mavoneditor from '@/components/Mavoneditor'
import Loading from '@/components/Loading'

import GrilShow from '@/components/GrilShow'
import Csslearn from '@/components/Csslearn'

Vue.use(VueRouter)
const defaultRoutes = [
  {
    path: '/',
    name: 'Article',
    component: Article
  },
  {
    path: '/login',
    name: 'Login',
    component: Login
  },
  {
    path: '/register',
    name: 'Register',
    component: Register
  },
  {
    path: '/home',
    name: 'Home',
    component: Home
  },
  {
    path: '/onlinewebsocket',
    name: 'Onlinewebsocket',
    component: Onlinewebsocket
  },
  {
    path: '/bilicom',
    name: 'Bilicom',
    component: Bilicom
  },
  {
    path: '/mavoneditor',
    name: 'Mavoneditor',
    component: Mavoneditor
  },
  {
    path: '/loading',
    name: 'loading',
    component: Loading
  },
  {
    path: '/gril',
    name: 'grilshow',
    component: GrilShow
  },
  {
    path: '/css',
    name: 'css',
    component: Csslearn
  }
  // {
  //     path: '/register',
  //     name: 'Register',
  //     component: () =>
  //         import ('../components/Register.vue')
  // },
  // {
  //     path: '/home',
  //     name: 'Home',
  //     component: () =>
  //         import ('../components/Home.vue')
  // },
  // {
  //     path: '/onlinewebsocket',
  //     name: 'Onlinewebsocket',
  //     component: () =>
  //         import ('../components/Onlinewebsocket.vue')
  // },
  // {
  //     path: '/mavoneditor',
  //     name: 'Mavoneditor',
  //     component: () =>
  //         import ('../components/Mavoneditor.vue')
  // },
  // {
  //     path: '/bilicom',
  //     name: 'Bilicom',
  //     component: () =>
  //         import ('../components/Bilicom.vue')
  // }
]

let routes = [
  ...defaultRoutes
  // ...modulesRoutes,
  // ...errorRoutes,
  // ...dashboardRouters
]
const originalPush = VueRouter.prototype.push
VueRouter.prototype.push = function push (location) {
  return originalPush.call(this, location).catch((err) => err)
}
const router = new VueRouter({
  routes
})

const whiteList = ['/login']

router.beforeEach(async (to, from, next) => {
  // Nprogress.start()
  // next()
  // let hasToken = getToken()
  next()
  console.log('localStorage', localStorage)
  let name = localStorage.getItem('yma16siteUserInfoName')
  let pwd = localStorage.getItem('yma16siteUserInfoPwd')
  let hasToken = {
    name: name,
    password: pwd
  }
  console.log('hasToken', hasToken)
  console.log('store.state 初始化', store.state)
  if (hasToken.name && hasToken.password) {
    console.log('store.state.user 存在', store.state.user)
    if (isEmpty(store.state.user.userInfo)) {
      // 空的 modules下的user
      console.log('路由的登录认证')
      // 用户自主登录
      await store.dispatch('user/loginUserInfo', hasToken)
      // await store.dispatch('user/loginUserInfo', hasToken)
      next()
    } else {
      next()
    }
  } else {
    if (whiteList.indexOf(to.path) !== -1) {
      console.log('store.state', store.state)
      next()
    } else {
      console.log('store.state 通过', store.state)
      next()
      // next({ path: '/login' }) // 否则全部重定向到登录页
      // Nprogress.done();
    }
  }
})

router.afterEach((to, from) => {
  Nprogress.done()
})

export default router