简单架构

hongqi-admin

router/index.js

import Vue from "vue";
import VueRouter from "vue-router";
import Login from "@/views/login";
import Layout from "@/views/layout/layout";



const routesList = [
  {
    path: "/",
    redirect: "/login",
  },
  {
    path: "/login",
    name: "登录页面",
    component: Login,
  },
  {
    path: "/admin",
    name: "layout",
    component: Layout, //引入公共布局组件 (页头 侧边栏 页脚)
    redirect: "/admin/home",
    children: [
      {
        path: "/admin/home",
        name: "后台首页",
        component: () => import("@/views/admin/admin.vue"), //引入内部内容 管理页首页
      },
      {
        path: "/admin/productManager",
        name: "产品管理",
        component: () => import("@/views/productManager/index.vue"), //引入内部内容 系列管理
      },
      {
        path: "/admin/serieManager",
        name: "系列管理",
        component: () => import("@/views/serieManager/index.vue"), //引入内部内容 产品管理
      },
      {
        path: "/admin/sceneManager",
        name: "场景管理",
        component: () => import("@/views/sceneManager/index.vue"), //引入内部内容 产品管理
      },
      {
        path: "/admin/factoryManager",
        name: "厂家管理",
        component: () => import("@/views/factoryManager/index.vue"), //引入内部内容 产品管理
      },
    ],
  },
]

const router = new VueRouter({ routes });

// 获取登录 token
router.beforeEach((to, from, next) => {
  // 默认登录页不需要验证用户
  if (to.path === "/login" || to.path === "/") return next();

  // 获取登录token
  let loginToken = window.localStorage.getItem("loginToken");

  // 验证登录token
  if (!loginToken) {
    next("login");
  } else {
    next(); //报错???
  }
});


Vue.use(VueRouter);
export default router;