不同权限的用户显示不同的用户菜单和限制其所能进入的页面，效果实现不了

问题遇到的现象和发生背景

使用vue+element-ui+vuex+vue-router+axios+echart进行前端开发实现不同用户登录显示不同页面，通过 token 获取用户的 role ，动态根据用户的 role 算出其对应有权限的路由，再通过router.addRoutes动态挂载路由，实现不同权限的用户显示不同的用户菜单和限制其所能进入的页面，效果实现不了

问题相关代码，请勿粘贴截图

做的是一个前后端分离的校园疫情防控系统，但是不同的用户登陆进去没有跳转到不同的页面，显示效果都是一样的

运行结果及报错内容

我的解答思路和尝试过的方法

在csdn上找了几篇文档，但是还是没有效果

我想要达到的结果

在登录的时候获取身份类型，然后this.$route.push不同链接