import Vue from 'vue'
import VueRouter from 'vue-router'
import Manage from '../views/Manage.vue'
import store from "@/store";
Vue.use(VueRouter)

const routes = [

  {
    path: '/about',
    name: 'about',
    // route level code-splitting
    // this generates a separate chunk (about.[hash].js) for this route
    // which is lazy-loaded when the route is visited.
    component: () => import(/* webpackChunkName: "about" */ '../views/AboutView.vue')
  }
  ,
  {
    path: '/login',
    name: 'login',
    // route level code-splitting
    // this generates a separate chunk (about.[hash].js) for this route
    // which is lazy-loaded when the route is visited.
    component: () => import(/* webpackChunkName: "about" */ '../views/Login.vue')
  },
  {
    path: '/register',
    name: 'Register',
    // route level code-splitting
    // this generates a separate chunk (about.[hash].js) for this route
    // which is lazy-loaded when the route is visited.
    component: () => import(/* webpackChunkName: "about" */ '../views/Register.vue')
  },
  {
    path: '/404',
    name: '404',
    // route level code-splitting
    // this generates a separate chunk (about.[hash].js) for this route
    // which is lazy-loaded when the route is visited.
    component: () => import(/* webpackChunkName: "about" */ '../views/404.vue')
  },
  {
    path: '/articleDetail',
    name: 'ArticleDetail',
    component: () => import('../views/ArticleDetail.vue')
  },
  {
    path: '/bidsDetail',
    name: 'BidsDetail',
    component: () => import('../views/BidsDetail.vue')
  },
  {
    path: '/register1',
    name: 'Register1',
    // route level code-splitting
    // this generates a separate chunk (about.[hash].js) for this route
    // which is lazy-loaded when the route is visited.
    component: () => import(/* webpackChunkName: "about" */ '../views/Register1.vue')
  },

]

const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  routes
})
// 提供一个重置路由的方法
export const resetRouter = () => {
  router.matcher = new VueRouter({
    mode: 'history',
    base: process.env.BASE_URL,
    routes
  })
}
//刷新页面会重置路由
export const setRoutes=()=>{
  const storeMenus=localStorage.getItem("menus");
  if(storeMenus){

    //获取当的路由对象名称数组
    const currentRoutesName=router.getRoutes().map(v=>v.name)
    if(!currentRoutesName.includes('Manage')){
      //拼装动态路由
      const manageRoute={path: '/', name:'Manage' ,component: () => import('../views/Manage.vue'), redirect:"/home", children:[
          {path: 'person', name: '个人信息', component: () => import('../views/Person.vue')},
          {path: 'password', name: '修改密码', component: () => import('../views/Password.vue')},
        ]
      }
      const menus=JSON.parse(storeMenus)
      menus.forEach(item=>{
        if(item.path){//当前仅当path不为空的时候才设置路由
          let itemMenu={path:item.path.replace("/",""),name:item.name,component:()=>import("../views/" + item.pagePath+".vue")}
          manageRoute.children.push(itemMenu)
        }else if(item.children.length){
          item.children.forEach(item=>{
            if(item.path){
              let itemMenu={path:item.path.replace("/",""),name:item.name,component:()=>import("../views/" + item.pagePath+".vue")}
              manageRoute.children.push(itemMenu)
            }

          })
        }
      })
      router.addRoute(manageRoute)
    }
    //动态添加到现在的路由对象
    }

}
//再次重置路由
setRoutes()

// 路由守卫
router.beforeEach((to, from, next) => {
  localStorage.setItem("currentPathName", to.name)  // 设置当前的路由名称，为了在Header组件中去使用
  store.commit("setPath")  // 触发store的数据更新
    // 没有找到路由的情况
  if(!to.matched.length){
    const storeMenus= localStorage.getItem("menus")
    if(storeMenus){
      next("/404")  // 放行路由
    }else {
      //跳回登录
      next("/login")
    }
  }
 next()

})
export default router
