@ecip/ecip-web/src/permission.js

A magical vue admin. An out-of-box UI solution for enterprise applications. Newest development stack of vue. Lots of awesome features

import router from "@/router";
import store from "@/store";
import { Message, MessageBox } from "element-ui";
import NProgress from "nprogress"; // progress bar
import "nprogress/nprogress.css"; // progress bar style
import { getToken } from "@/utils/auth"; // get token from cookie
import getPageTitle from "ecip-web/utils/get-page-title";
import {
  whiteList,
  stat,
  getPageTitle as getPageTitleFromSetting,
} from "@/settings";
// 配置eventBUs
NProgress.configure({ showSpinner: false }); // NProgress Configuration

// const _whiteList = whiteList || ['/login', '/auth-redirect', '/change-pwd'] // no redirect whitelist
const _whiteList = whiteList || [
  "/login",
  "/zlt-auth",
  "/auth-redirect",
  "/center-auth",
]; // no redirect whitelist

// 递归处理多余的 layout : <router-view>，让需要访问的组件保持在第一层 layout 层。
// 因为 `keep-alive` 只能缓存二级路由
// 默认初始化时就执行
export function keepAliveSplice(to) {
  // console.log(to)
  if (to.matched && to.matched.length > 1) {
    to.matched.map((v, k) => {
      if (v.components.default instanceof Function) {
        v.components.default().then((components) => {
          if (components.default.name === "AppMain") {
            to.matched.splice(k, 1);
            router.push({ path: to.path, query: to.query });
            keepAliveSplice(to);
          }
        });
      } else {
        if (v.components.default.name === "AppMain") {
          to.matched.splice(k, 1);
          keepAliveSplice(to);
        }
      }
    });
  }
}

router.beforeEach(async (to, from, next) => {
  // console.log(to)
  keepAliveSplice(to);
  // start progress bar
  NProgress.start();

  // set page title
  if (getPageTitleFromSetting) {
    document.title = getPageTitleFromSetting(to.meta);
  } else {
    document.title = getPageTitle(to.meta);
  }

  // determine whether the user has logged in
  const hasToken = getToken();

  if (hasToken) {
    if (to.path === "/login") {
      // if is logged in, redirect to the home page
      next({ path: "/" });
      NProgress.done();
    } else {
      // determine whether the user has obtained his permission roles through getInfo
      const hasRoles = store.getters.roles && store.getters.roles.length > 0;
      if (hasRoles) {
        /*if (to.path !== '/change-pwd' && store.getters.toChangePwd) {
          next({ path: '/change-pwd', query: { redirect: to.path, ...to.query }})
          return
        }*/
        next();
      } else {
        try {
          // get user info
          // note: roles must be a object array! such as: ['admin'] or ,['developer','editor']

          const { roles } = await store.dispatch("user/getInfo");

          // generate accessible routes map based on roles
          const accessRoutes = await store.dispatch(
            "permission/generateRoutes",
            roles
          );

          // console.log(accessRoutes)

          // dynamically add accessible routes
          router.addRoutes(accessRoutes);

          // hack method to ensure that addRoutes is complete
          // set the replace: true, so the navigation will not leave a history record
          next({ ...to, replace: true });
        } catch (error) {
          // remove token and go to login page to re-login
          await store.dispatch("user/resetToken");
          if (window._CONFIG["cas"]) {
            await store.dispatch("user/toCasLogin");
          } else if (window._CONFIG["oauth"]) {
            await store.dispatch("user/toOauthLogin");
          } else {
            Message.error(error || "Has Error");
            next({ path: "/login", query: { redirect: to.path, ...to.query } });
            NProgress.done();
          }
        }
      }
    }
  } else {
    /* has no token*/
    if (
      (window._CONFIG["zltAuthEnabled"] &&
        !window._CONFIG["zltAuthLoginOnly"] &&
        localStorage.getItem("isLoginFromZlt") === "true" &&
        to.path === "/login") ||
      (window._CONFIG["zltAuthEnabled"] &&
        window._CONFIG["zltAuthLoginOnly"] &&
        to.path === "/login")
    ) {
      next({ path: "/zlt-auth" });
      NProgress.done();
    }

    /**
     * 如果开启中央授权服务，则拦截登录页面跳转至中央授权服务登录页面
     */
    if (window._CONFIG["centerAuthEnabled"] && to.path === "/login") {
      return;
    }

    if (_whiteList.indexOf(to.path) !== -1) {
      // in the free login whitelist, go directly
      try {
        MessageBox.close();
        // eslint-disable-next-line no-empty
      } catch (e) {}
      next();
    } else {
      // other pages that do not have permission to access are redirected to the login page.
      if (window._CONFIG["cas"]) {
        await store.dispatch("user/toCasLogin");
      } else if (window._CONFIG["oauth"]) {
        await store.dispatch("user/toOauthLogin");
      } else if (window._CONFIG["centerAuthEnabled"]) {
        next({
          path: "/center-auth",
          query: { redirect: to.path, ...to.query },
        });
        NProgress.done();
      } else {
        next({ path: "/login", query: { redirect: to.path, ...to.query } });
        NProgress.done();
      }
    }
  }
});

router.afterEach((to, from, next) => {
  // finish progress bar
  NProgress.done();
  const userInfo = store.getters.userInfo;
  const rsrcMeta = to.meta;
  const rsrcId = rsrcMeta && rsrcMeta.id;
  const rsrcName = rsrcMeta && rsrcMeta.title;
  const rsrcTopParentId = rsrcMeta && rsrcMeta.topParentId;
  const data = {
    name: to.meta.title,
    url: window.location.href,
    fromUrl: from && from.fullPath,
    userId: userInfo && userInfo.id,
    resourceId: rsrcId,
    resourceName: rsrcName,
    topParentId: rsrcTopParentId,
  };
  if (stat !== false) {
    // console.log(data)
    store.dispatch("user/visitStat", data);
  }
});