import Vue from "vue";
import Router from "vue-router";
import setting from "@/settings.js";

const pageInfos = setting.pageInfos;

Vue.use(Router);

/* Layout */
import Layout from "@/layout";
import View from "@/layout/view";

/**
 * Note: sub-menu only appear when route children.length >= 1
 * Detail see: https://panjiachen.github.io/vue-element-admin-site/guide/essentials/router-and-nav.html
 *
 * hidden: true                   if set true, item will not show in the sidebar(default is false)
 * alwaysShow: true               if set true, will always show the root menu
 *                                if not set alwaysShow, when item has more than one children route,
 *                                it will becomes nested mode, otherwise not show the root menu
 * redirect: noRedirect           if set noRedirect will no redirect in the breadcrumb
 * name:'router-name'             the name is used by <keep-alive> (must set!!!)
 * meta : {
    roles: ['admin','editor']    control the page roles (you can set multiple roles)
    title: 'title'               the name show in sidebar and breadcrumb (recommend set)
    icon: 'svg-name'             the icon show in the sidebar
    breadcrumb: false            if set false, the item will hidden in breadcrumb(default is true)
    activeMenu: '/example/list'  if set path, the sidebar will highlight the path you set
  }
 */

const newRules = [];

const recursion = (obj, parent) => {
  return obj.children.map((ele) => {
    let res = {};
    if (ele.children && ele.children.length > 0) {
      res.path = ele.path;
      res.component = View;
      res.redirect = `/${obj.path}/${ele.path}/${ele.children[0].path}`;
      res.children = recursion(ele, `/${obj.path}`);
    } else {
      let t = {
        path: `${parent ? parent : ""}/${obj.path}/${ele.path}`,
        component: () => import(`@/views/${ele.vue}`),
        meta: {
          title: ele.title,
          icon: ele.icon,
          keepAlive: ele.keepAlive || false,
        },
        hidden: ele.hidden || false,
      };
      if (ele.name) res.name = ele.name;
      if (ele.redirect) res.redirect = ele.redirect;
      res = Object.assign(res, t);
    }
    return res;
  });
};

pageInfos.forEach((item) => {
  let routeObj = {
    path: `/${item.path}`,
    component: Layout,
    hidden: item.hidden || false,
  };

  if (item.redirect) routeObj.redirect = item.redirect;

  if (item.children && item.children.length > 0) {
    routeObj.redirect = `/${item.path}/${item.children[0].path}`;
    routeObj.children = recursion(item);
  } else {
    routeObj.children = [
      {
        path: `/${item.path}`,
        name: item.name,
        component: () => import(`@/views/${item.vue}`),
        meta: {
          title: item.title,
          icon: item.icon,
          keepAlive: item.keepAlive || false,
        },
      },
    ];
  }

  newRules.push(routeObj);
});

/**
 * constantRoutes
 * a base page that does not have permission requirements
 * all roles can be accessed
 */
export const constantRoutes = [
  {
    path: "/login",
    component: () => import("@/views/login/index"),
    hidden: true,
  },
  {
    path: "/register",
    component: () => import("@/views/login/register"),
    hidden: true,
  },
  {
    path: '/',
    redirect: '/404',
    component: Layout,
    children: [{
      path: '404',
      name: 'Page404',
      component: () => import('@/views/error-pages/404'),
      meta: { title: '404', icon: 'home' }
    }]
  },
  {
    path: '/',
    redirect: '/403',
    component: Layout,
    children: [{
      path: '403',
      name: 'Page403',
      component: () => import('@/views/error-pages/403'),
      meta: { title: '403', icon: 'home' }
    }]
  },
  ...newRules,

  { path: "/", redirect: "/home", hidden: true },

  // 404 page must be placed at the end !!!
  { path: "*", redirect: "/404", hidden: true },
];

const createRouter = () =>
  new Router({
    // mode: 'history', // require service support, 后台部署在/static 目录
    // base: "/static", // 应用的基础路径: 默认为'/',修改为'/static'
    scrollBehavior: () => ({ y: 0 }),
    routes: constantRoutes,
  });

const router = createRouter();

// Detail see: https://github.com/vuejs/vue-router/issues/1234#issuecomment-357941465
export function resetRouter() {
  const newRouter = createRouter();
  router.matcher = newRouter.matcher; // reset router
}

export default router;