添加url拦截器

src/js/api.js

@@ -41,6 +41,7 @@ export default {
     ADD_AGENCY: '/api/greenChannel/agency/',
     GET_CURRENT_USER: '',
     GET_USER_IDENTITY: '',
+    GET_AUTH_URLS: '',
   },
   PAGE: {
     HOME_PAGE: '/api/common/index/',
@@ -49,5 +50,8 @@ export default {
     TASK_DETAIL_PAGE: '/api/page/taskDetail/{taskId}/',
     PROJECT_DETAIL_PAGE: '/api/project/{projectId}/',
     REPORT_DETAIL_PAGE: '/api/page/reportDetail/{reportId}/',
+  },
+  GENERAL: {
+    GET_ALL_ABILITIES: ''
   }
 }

src/js/http.js

@@ -5,8 +5,11 @@ axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded
 
 // // 请求拦截器
 // axios.interceptors.request.use(function (config) {
+//   console.log('正确拦截')
+//   console.log(config)
 //   return config
 // }, function (error) {
+//   console.log('错误拦截')
 //   return Promise.reject(error)
 // })
 // // 响应拦截器

src/js/index.js

@@ -119,3 +119,14 @@ export const endTaskRequest = () => {
 //查看报告
 
 //删除报告
+
+//获取所有测评能力
+export const getAllBilities = () => {
+  return Http.get(Apis.GENERAL.GET_ALL_ABILITIES)
+}
+
+//获取当前角色可访问的url
+export const getAuthUrls = () => {
+  return Http.get(Apis.USER.GET_AUTH_URLS)
+}
+

src/main.js

@@ -4,59 +4,114 @@ import Vue from 'vue'
 import App from './App'
 import router from './router'
 import 'font-awesome/css/font-awesome.css'
-import './style/main.scss';
-
-
+import './style/main.scss'
 import {
-  Carousel,Tag, Card, CarouselItem,Dialog, Row, Col, Table, TableColumn, Form, FormItem, Button, ButtonGroup,
-  Menu, Submenu, MenuItem, MenuItemGroup, Input, InputNumber, Radio, RadioGroup, RadioButton,
-  Checkbox, CheckboxButton, CheckboxGroup, DatePicker, TimeSelect, TimePicker, Switch, Select,
-  Option, Upload, Tabs, TabPane, Collapse, CollapseItem, MessageBox, Message, Notification,
+  Button,
+  ButtonGroup,
+  Card,
+  Carousel,
+  CarouselItem,
+  Checkbox,
+  CheckboxButton,
+  CheckboxGroup,
+  Col,
+  Collapse,
+  CollapseItem,
+  DatePicker,
+  Dialog,
+  Form,
+  FormItem,
+  Input,
+  InputNumber,
+  Menu,
+  MenuItem,
+  MenuItemGroup,
+  Message,
+  MessageBox,
+  Notification,
+  Option,
+  Radio,
+  RadioButton,
+  RadioGroup,
+  Row,
+  Select,
+  Submenu,
+  Switch,
+  Table,
+  TableColumn,
+  TabPane,
+  Tabs,
+  Tag,
+  TimePicker,
+  TimeSelect,
+  Upload,
 } from 'element-ui'
+
+router.beforeEach((to, from, next) => {
+  if (to.matched.some(record => record.meta.requireAuth)) { // 判断该路由是否需要登录权限
+    console.log('需要拦截')
+    if (sessionStorage.userName === '2') { // 判断缓存里面是否有 userName  //在登录的时候设置它的值
+      console.log('未拦截')
+      next()
+    } else {
+      console.log('拦截')
+      next({
+        path: '/',
+        query: {
+          redirect: to.fullPath
+        } // 将跳转的路由path作为参数，登录成功后跳转到该路由
+      })
+    }
+  } else {
+    console.log('不需要拦截')
+    next()
+  }
+})
+
 // require('./mock.js')
 Vue.use(Carousel)
 Vue.use(CarouselItem)
 Vue.use(Row)
 Vue.use(Col)
-Vue.use(Table);
-Vue.use(TableColumn);
-Vue.use(Form);
-Vue.use(FormItem);
-Vue.use(Button);
-Vue.use(ButtonGroup);
-Vue.use(Menu);
-Vue.use(Submenu);
-Vue.use(MenuItem);
-Vue.use(MenuItemGroup);
-Vue.use(Input);
-Vue.use(InputNumber);
-Vue.use(Radio);
-Vue.use(RadioGroup);
-Vue.use(RadioButton);
-Vue.use(Checkbox);
-Vue.use(CheckboxButton);
-Vue.use(CheckboxGroup);
-Vue.use(DatePicker);
-Vue.use(TimeSelect);
-Vue.use(TimePicker);
-Vue.use(Switch);
-Vue.use(Select);
-Vue.use(Option);
-Vue.use(Upload);
-Vue.use(Tabs);
-Vue.use(TabPane);
-Vue.use(Collapse);
-Vue.use(CollapseItem);
+Vue.use(Table)
+Vue.use(TableColumn)
+Vue.use(Form)
+Vue.use(FormItem)
+Vue.use(Button)
+Vue.use(ButtonGroup)
+Vue.use(Menu)
+Vue.use(Submenu)
+Vue.use(MenuItem)
+Vue.use(MenuItemGroup)
+Vue.use(Input)
+Vue.use(InputNumber)
+Vue.use(Radio)
+Vue.use(RadioGroup)
+Vue.use(RadioButton)
+Vue.use(Checkbox)
+Vue.use(CheckboxButton)
+Vue.use(CheckboxGroup)
+Vue.use(DatePicker)
+Vue.use(TimeSelect)
+Vue.use(TimePicker)
+Vue.use(Switch)
+Vue.use(Select)
+Vue.use(Option)
+Vue.use(Upload)
+Vue.use(Tabs)
+Vue.use(TabPane)
+Vue.use(Collapse)
+Vue.use(CollapseItem)
 Vue.use(Dialog)
 Vue.use(Card)
 Vue.use(Tag)
 
-Vue.prototype.$msgbox = MessageBox;
-Vue.prototype.$alert = MessageBox.alert;
-Vue.prototype.$confirm = MessageBox.confirm;
-Vue.prototype.$prompt = MessageBox.prompt;
-Vue.prototype.$notify = Notification;
-Vue.prototype.$message = Message;
+Vue.prototype.$msgbox = MessageBox
+Vue.prototype.$alert = MessageBox.alert
+Vue.prototype.$confirm = MessageBox.confirm
+Vue.prototype.$prompt = MessageBox.prompt
+Vue.prototype.$notify = Notification
+Vue.prototype.$message = Message
 
 Vue.config.productionTip = false
 
@@ -64,6 +119,6 @@ Vue.config.productionTip = false
 new Vue({
   el: '#app',
   router,
-  components: { App },
+  components: {App},
   template: '<App/>'
 })

src/router/index.js

@@ -24,72 +24,128 @@ export default new Router({
     {
       path: '/',
       name: 'Index',
-      component: Home
+      component: Home,
+      meta: {
+        title: '',
+        requireAuth: false,  // false表示不需要登录,true表示需要登录
+      },
     },
     {
       path: '/home',
       name: 'Home',
       component: resolve => require(['@/components/Home.vue'], resolve),
+      meta: {
+        title: '',
+        requireAuth: false,
+      },
     },
     {
       path: '/square',
       name: 'Square',
       component: resolve => require(['@/components/Square.vue'], resolve),
+      meta: {
+        title: '',
+        requireAuth: true,
+      },
     },
     {
       path: '/mine',
       name: 'Mine',
       component: resolve => require(['@/components/Mine.vue'], resolve),
+      meta: {
+        title: '',
+        requireAuth: true,
+      },
     },
     {
       path: '/project/create',
       name: 'ProjectCreate',
       component: resolve => require(['@/components/project/ProjectCreate.vue'], resolve),
+      meta: {
+        title: '',
+        requireAuth: true,
+      },
     },
     {
       path: '/project/:projectId',
       name: 'Project',
       component: resolve => require(['@/components/project/Project.vue'], resolve),
+      meta: {
+        title: '',
+        requireAuth: true,
+      },
     },
     {
       path: '/project/:projectId/task/create',
       name: 'TaskCreate',
       component: resolve => require(['@/components/task/TaskCreate.vue'], resolve),
+      meta: {
+        title: '',
+        requireAuth: true,
+      },
     },
     {
       path: '/project/:projectId/task/:taskId',
       name: 'Task',
       component: resolve => require(['@/components/task/Task.vue'], resolve),
+      meta: {
+        title: '',
+        requireAuth: false,
+      },
     },
     {
       path: '/project/:projectId/analyse',
       name: 'AnalyseDemand',
       component: resolve => require(['@/components/project/AnalyseDemand.vue'], resolve),
+      meta: {
+        title: '',
+        requireAuth: true,
+      },
     },
     {
       path: '/report/create',
       name: 'ReportCreate',
       component: resolve => require(['@/components/report/ReportCreate.vue'], resolve),
+      meta: {
+        title: '',
+        requireAuth: true,
+      },
     },
     {
       path: '/report/:reportId',
       name: 'Report',
       component: resolve => require(['@/components/report/Report.vue'], resolve),
+      meta: {
+        title: '',
+        requireAuth: true,
+      },
     },
     {
       path: '/addProject',
       name: 'ProjectAdd',
       component: resolve => require(['@/components/cheat/ProjectAdd.vue'], resolve),
+      meta: {
+        title: '',
+        requireAuth: true,
+      },
     },
     {
       path: '/addAgency',
       name: 'AgencyAdd',
       component: resolve => require(['@/components/cheat/AgencyAdd.vue'], resolve),
+      meta: {
+        title: '',
+        requireAuth: true,
+      },
     },
     {
       path: '/authentication',
       name: 'Authentication',
       component: resolve => require(['@/components/authen/Authentication.vue'], resolve),
+      meta: {
+        title: '',
+        requireAuth: true,
+      },
     },
   ]
 })