SteelfurnitureWeb/src/router/index.ts

import Vue from "vue";
import VueRouter, { RouteConfig } from "vue-router";
import layout from "@/layout/index.vue";
import user from "@/store/modules/user";
import { Loading } from "element-ui";
import { Message } from "@/utils/message";
import { login } from "@/utils/cookies";
import { setPageTitle } from "@/utils";
Vue.use(VueRouter);
export const nav: RouteConfig[] = [
  {
    path: "/home",
    component: () => import("../views/home/index.vue"),
    meta: { title: "home" }
  },
  {
    path: "/mall/:q?",
    props: true,
    component: () => import("../views/mall/index.vue"),
    meta: { title: "mall" }
  },
  {
    path: "/shops/:kw?",
    props: true,
    component: () => import("../views/shops/index.vue"),
    meta: { title: "shops" }
  },
  {
    path: "/info/:index?",
    component: () => import("../views/info/index.vue"),
    props: true,
    meta: { title: "info" }
  }
];
const router = new VueRouter({
  mode: process.env.NODE_ENV !== "development" ? "hash" : "history",
  base: process.env.BASE_URL,
  scrollBehavior(to, from, savedPosition) {
    if (savedPosition) {
      return savedPosition;
    } else {
      return { x: 0, y: 0 };
    }
  },
  routes: [
    {
      path: "/",
      component: layout,
      redirect: "/home",
      children: [
        ...nav,
        {
          path: "/login",
          component: () => import("../views/account/login.vue"),
          meta: { title: "login", NoHeader: true }
        },
        {
          path: "/register",
          component: () => import("../views/account/register.vue"),
          meta: { title: "register", NoHeader: true }
        },
        {
          path: "/findPassword",
          component: () => import("../views/account/findPassword.vue"),
          meta: { title: "findPassword", NoHeader: true }
        },
        {
          path: "/user/:index?",
          component: () => import("../views/account/user/index.vue"),
          props: true,
          meta: { title: "user", auth: true }
        },
        {
          path: "/editPassword",
          component: () => import("../views/account/user/editPassword.vue"),
          meta: { title: "editPassword", auth: true }
        },
        {
          path: "/shop/:sid",
          component: () => import("../views/shops/details/index.vue"),
          redirect: "/shop/:sid/products",
          props: true,
          meta: { NoHeader: true },
          children: [
            {
              path: "products",
              component: () => import("../views/shops/details/products.vue"),
              meta: { title: "shopDetails" }
            },
            {
              path: "honor",
              component: () => import("../views/shops/details/honor.vue"),
              meta: { title: "shopHonor" }
            },
            {
              path: "profile",
              component: () => import("../views/shops/details/profile.vue"),
              meta: { title: "shopProfile" }
            },
            {
              path: ":pid",
              props: true,
              component: () => import("../views/shops/details/product.vue"),
              meta: { title: "productDetails" }
            }
          ]
        },
        {
          path: "/shopEnter",
          component: () => import("../views/shops/enter/index.vue"),
          meta: { title: "shopEnter" }
        },
        {
          path: "/shopEnter/add",
          component: () => import("../views/shops/enter/add.vue"),
          meta: { title: "shopEnterAdd" }
        },
        {
          path: "/info/buy/:id",
          component: () => import("../views/info/details/buy.vue"),
          props: true,
          meta: { title: "infoBuy" }
        },
        {
          path: "/info/sell/:id",
          component: () => import("../views/info/details/sell.vue"),
          props: true,
          meta: { title: "infoSell" }
        },
        {
          path: "/info/add",
          component: () => import("../views/info/add.vue"),
          meta: { title: "infoAdd", auth: true }
        },
        {
          path: "/news/:index?",
          component: () => import("../views/news/index.vue"),
          props: true,
          meta: { title: "news" }
        },
        {
          path: "/newsDetail/:noticeId",
          component: () => import("../views/news/details.vue"),
          props: true,
          meta: { title: "newsDetail" }
        }
      ]
    },
    {
      path: "/error/:code",
      component: () => import("../views/errorPage/index.vue")
    }
  ]
});

let loading: any;
router.beforeEach(async (to, from, next) => {
  loading = Loading.service({
    fullscreen: true,
    text: "跳转中..."
  });
  setTimeout(() => loading.close(), 3e3);
  if (user.Token && !user.UserInfo) {
    await user.getUserInfo();
  }
  if (!to.matched.length && process.env.NODE_ENV !== "development")
    return next({
      path: `/error/404`,
      replace: true
    });
  if (to.meta.auth && !user.UserInfo) return next("/login");
  setPageTitle(to.meta.title);
  next();
});
router.afterEach(() => loading.close());
export default router;