配置路由守卫导航重定向

zuozhengqing

2023-12-13 fe87d39adb4e995ccf96a45b142ae026c3cf5eae

配置路由守卫导航重定向

 src/components/layout/components/appsidebar/index.vue

@@ -16,7 +16,8 @@
        text-color="#bfcbd9"
        active-text-color="#fff"
      >
        <el-submenu v-for="item in menus" :key="item.id" :index="item.id">

        <el-submenu  v-for="item in menus" :key="item.id" :index="item.id.toString()">
          <template slot="title">
            <i class="el-icon-s-grid icon"></i>
            <span>{{ item.title }}</span>

 src/router/index.js

@@ -6,6 +6,7 @@
import operateRouter from "./operate/index.js" // 操作
import warehouseManageRouter from "./warehouseManage/index.js" // 仓库管理
import reportRouter from "./report/index.js" // 报表
import {getMenuTreeByRole} from "@/api/menus/index"

Vue.use(Router)
const login = (resolve) => require(["@/views/other/login/index"], resolve)
@@ -19,8 +20,8 @@
export const routes = [
  // 无权限数据页面
  {
    path: "/",
    name: "NoData",
    path: "noData",
    name: "noData",
    meta: {
      title: "",
      auth: true,
@@ -118,9 +119,48 @@
  })

const router = createRouter()
 
let isSkip = false;
async function hasPermission(routePath) {
  isSkip = false;
  try {
    const res = await getMenuTreeByRole();
    const newPath = {
      path: "/noData"
    };
    const foundObject = res.data.list.find(obj => obj.systemType === 3);
    if (foundObject) {
      foundObject.menus.forEach(item => {
        const nextPath = item.children.find(obj => obj.path === routePath);
        if (nextPath) {
          newPath.path = nextPath.path;
          isSkip = true;
        }
      });
    } else {
      newPath.path = '/noData';
    }
    return newPath; 
  } catch (error) {
    return { path: "/noData" }; 
  }
}
router.beforeEach(async (to, from, next) => {
  try {
    const result = await hasPermission(to.path);
    console.log(result,"result")
    next();
    if (!isSkip) {
      next('/noData')
    }
  } catch (error) {
    console.error('Error in navigation guard:', error);
    next(); 
  }
});


router.afterEach((to, from, next) => {
  console.log(to, "to")
  if ((to.path === "/overview/overviewList" || to.path === "/productManage/productList") && to.params.name) {
    console.log(from, next)
    to.meta.title = to.params.name

 vue.config.js

@@ -14,14 +14,14 @@
  devServer: {
    proxy: {
      "/api-s": {
        // target: "http://192.168.20.119:8005", // 
        target:"http://fai365.com:9083",  // 
        target: "http://192.168.20.119:8005", // 
        // target:"http://fai365.com:9083",  // 
        ws: true,
        changeOrigin: true
      },
      "/api-wms": {
        // target: "http://192.168.20.119:8005",
        target:"http://fai365.com:9083",
        target: "http://192.168.20.119:8005",
        // target:"http://fai365.com:9083",
        ws: true,
        changeOrigin: true
      },