46dbc9d4 by xiaomiao
2 parents 295c4118 e2e6a126
...@@ -7,7 +7,7 @@ export function loginIn(username, password) { ...@@ -7,7 +7,7 @@ export function loginIn(username, password) {
7 method: "post", 7 method: "post",
8 }); 8 });
9 } 9 }
10 export function loginOut() { 10 export function logout() {
11 return request({ 11 return request({
12 url: `${SERVER.MANAGEMENTAPI}/logout`, 12 url: `${SERVER.MANAGEMENTAPI}/logout`,
13 method: "post", 13 method: "post",
......
...@@ -22,7 +22,7 @@ ...@@ -22,7 +22,7 @@
22 <script> 22 <script>
23 import sidebarLeft from "./Sidebar/sidebarLeft"; 23 import sidebarLeft from "./Sidebar/sidebarLeft";
24 import sidebarRight from "./Sidebar/sidebarRight"; 24 import sidebarRight from "./Sidebar/sidebarRight";
25 import { loginOut } from "@/api/login.js"; 25 import { logout } from "@/api/login.js";
26 import { mapGetters } from "vuex"; 26 import { mapGetters } from "vuex";
27 export default { 27 export default {
28 components: { 28 components: {
...@@ -34,10 +34,15 @@ export default { ...@@ -34,10 +34,15 @@ export default {
34 }, 34 },
35 methods: { 35 methods: {
36 onCancel() { 36 onCancel() {
37 loginOut() 37 logout()
38 .then((res) => { 38 .then((res) => {
39 sessionStorage.removeItem("token"); 39 sessionStorage.removeItem("token");
40 this.$router.push("/login"); 40 this.$router.replace({
41 path: "/login",
42 query: {
43 redirect: this.$route.fullPath,
44 },
45 });
41 }) 46 })
42 .catch((error) => { 47 .catch((error) => {
43 // console.dir(error); 48 // console.dir(error);
......
...@@ -11,6 +11,7 @@ router.beforeEach(async (to, from, next) => { ...@@ -11,6 +11,7 @@ router.beforeEach(async (to, from, next) => {
11 NProgress.start(); 11 NProgress.start();
12 document.title = getPageTitle(to.meta.title); 12 document.title = getPageTitle(to.meta.title);
13 let hasAddDict = store.state.dict.addDict; 13 let hasAddDict = store.state.dict.addDict;
14 let hasUser = store.state.user.hasUser;
14 let hasAddRoute = store.state.permission.addRoutes; 15 let hasAddRoute = store.state.permission.addRoutes;
15 if (to.path == "/login") { 16 if (to.path == "/login") {
16 sessionStorage.removeItem("token"); 17 sessionStorage.removeItem("token");
...@@ -19,6 +20,10 @@ router.beforeEach(async (to, from, next) => { ...@@ -19,6 +20,10 @@ router.beforeEach(async (to, from, next) => {
19 //判断token是否存在 20 //判断token是否存在
20 const hasToken = sessionStorage.getItem("token"); 21 const hasToken = sessionStorage.getItem("token");
21 if (hasToken) { 22 if (hasToken) {
23 //请求用户信息
24 if (!hasUser) {
25 store.dispatch("user/getUserInfo");
26 }
22 //加载字典 27 //加载字典
23 if (!hasAddDict) { 28 if (!hasAddDict) {
24 store.dispatch("dict/generateDic"); 29 store.dispatch("dict/generateDic");
...@@ -27,7 +32,7 @@ router.beforeEach(async (to, from, next) => { ...@@ -27,7 +32,7 @@ router.beforeEach(async (to, from, next) => {
27 next(); 32 next();
28 } else { 33 } else {
29 //请求菜单 34 //请求菜单
30 const { result: getMenuData } = await getMenuInfo() || []; 35 const { result: getMenuData } = (await getMenuInfo()) || [];
31 const accessRoutes = await store.dispatch( 36 const accessRoutes = await store.dispatch(
32 "permission/generateRoutes", 37 "permission/generateRoutes",
33 getMenuData 38 getMenuData
......
1 import { getUserInfo } from '@/api/user' 1 import { getUserInfo } from "@/api/user";
2 const state = { 2 const state = {
3 name: '', 3 hasUser: false,
4 avatar: 'https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png', 4 name: "",
5 } 5 avatar: "https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png",
6 userInfo: null,
7 };
6 const mutations = { 8 const mutations = {
7 SET_NAME: (state, data) => { 9 SET_USERINFO: (state, data) => {
8 state.name = data.loginName 10 state.hasUser = true;
9 } 11 state.userInfo = data;
10 } 12 state.name = data.loginName;
13 },
14 RESET_USER: (state) => {
15 state.hasUser = false;
16 },
17 };
11 18
12 const actions = { 19 const actions = {
13 getUserInfo ({ commit }) { 20 getUserInfo({ commit }) {
21 if (!state.hasUser) {
14 return new Promise(async (resolve) => { 22 return new Promise(async (resolve) => {
15 let { result: res } = await getUserInfo() 23 let { result: res } = await getUserInfo();
16 commit('SET_NAME', res) 24 commit("SET_USERINFO", res);
17 resolve(true) 25 resolve(true);
18 }) 26 });
19 }, 27 }else{
20 } 28 return
29 }
30 },
31 resetdict({ commit }) {
32 commit("RESET_USER");
33 },
34 };
21 export default { 35 export default {
22 namespaced: true, 36 namespaced: true,
23 state, 37 state,
24 mutations, 38 mutations,
25 actions 39 actions,
26 } 40 };
......
1 /** 1 /**
2 * 此文件主要创建 axios 实例,然后添加请求拦截器和响应拦截器 2 * 此文件主要创建 axios 实例,然后添加请求拦截器和响应拦截器
3 */ 3 */
4 import axios from 'axios' 4 import axios from "axios";
5 import { Message } from 'element-ui' 5 import { Message } from "element-ui";
6 import { endLoadingSubCount } from './requestLoading' 6 import { endLoadingSubCount } from "./requestLoading";
7 import router from "../router";
7 8
8 // create an axios instance 9 // create an axios instance
9 const service = axios.create({ 10 const service = axios.create({
10 baseURL: process.env.VUE_APP_BASE_API, 11 baseURL: process.env.VUE_APP_BASE_API,
11 withCredentials: true, //是否允许跨域 12 withCredentials: true, //是否允许跨域
12 headers: { 13 headers: {
13 'Content-Type': 'application/json; charset=utf-8' 14 "Content-Type": "application/json; charset=utf-8",
14 }, 15 },
15 timeout: 15000 16 timeout: 15000,
16 }) 17 });
17 18
18 // request interceptor 19 // request interceptor
19 service.interceptors.request.use( 20 service.interceptors.request.use(
20 config => { 21 (config) => {
21 //调用登录接口时无token,也不需要传token,其他接口都传入token 22 //调用登录接口时无token,也不需要传token,其他接口都传入token
22 config.headers.Authorization = sessionStorage.getItem("token") || ""; 23 config.headers.Authorization = sessionStorage.getItem("token") || "";
23 config.headers.Accept = 'application/json' 24 config.headers.Accept = "application/json";
24 return config 25 return config;
25 }, 26 },
26 error => { 27 (error) => {
27 Message.error('请求超时!'); 28 Message.error("请求超时!");
28 return Promise.reject(error) 29 return Promise.reject(error);
29 } 30 }
30 ) 31 );
31 32
32 // response interceptor 33 // response interceptor
33 service.interceptors.response.use( 34 service.interceptors.response.use(
34 response => { 35 (response) => {
35 /** 36 /**
36 * 对响应数据判断: 37 * 对响应数据判断:
37 * 如果成功返回数据,就通过return把数据返出去 38 * 如果成功返回数据,就通过return把数据返出去
38 * 如果请求不成功,就在拦截器这里统一处理(组件的代码就不用关注错误的情况了) 39 * 如果请求不成功,就在拦截器这里统一处理(组件的代码就不用关注错误的情况了)
39 */ 40 */
40 if (response.status == 200) { 41 if (response.status == 200) {
41 // if (response.data.code == 500) { 42 return response.data;
42 // Message({
43 // message: response.data.message,
44 // type: 'error',
45 // duration: 5 * 1000
46 // })
47 // }
48 return response.data;
49 } else {
50 handleErrorData(response.data);
51 }
52 return response;
53 },
54 error => {
55 endLoadingSubCount()
56 // 对响应错误做点什么
57 Message({
58 message: '服务器异常,请联系管理员',
59 type: 'error',
60 duration: 5 * 1000
61 })
62 return Promise.reject(error);
63 }
64 )
65 //对错误信息的处理函数
66 function handleErrorData (errMes) {
67 if (errMes.message) {
68 Message.error(errMes.message);
69 } else { 43 } else {
70 switch (errMes.code) { 44 // 对响应错误做点什么
71 case 401: 45 Message({
72 Message.error("由于长时间未操作,请重新登录!"); 46 message: "请求失败",
73 window.location.href = `http://${window.location.host}` 47 type: "error",
74 break; 48 duration: 5 * 1000,
75 case 403: 49 });
76 Message.error("拒绝访问");
77 break;
78 case 404:
79 Message.error("很抱歉,资源未找到!");
80 break;
81 case 500:
82 Message.error("服务器错误!");
83 break;
84 default:
85 Message.error("服务正在联调中,请稍后!");
86 break;
87 }
88 } 50 }
51 return response;
52 },
53 (error) => {
54 handleErrorData(error.response.status);
55 endLoadingSubCount();
56 return Promise.reject(error);
57 }
58 );
59 //对错误信息的处理函数
60 function handleErrorData(status) {
61 switch (status) {
62 case 401:
63 Message.error("由于长时间未操作,请重新登录!");
64 router.replace({
65 path: "/login",
66 query: {
67 redirect: router.history.current.fullPath,
68 },
69 });
70 break;
71 case 403:
72 Message.error("拒绝访问");
73 break;
74 case 404:
75 Message.error("很抱歉,资源未找到!");
76 break;
77 case 500:
78 Message.error("服务器错误!");
79 break;
80 default:
81 Message.error("服务正在联调中,请稍后!");
82 break;
83 }
89 } 84 }
90 export default service 85 export default service;
91
92
......
...@@ -2,6 +2,7 @@ ...@@ -2,6 +2,7 @@
2 <div class="bg"> 2 <div class="bg">
3 <div class="login-inner-bg login"> 3 <div class="login-inner-bg login">
4 <div class="user_style"> 4 <div class="user_style">
5 <h3>欢迎登录</h3>
5 <el-form 6 <el-form
6 :model="user" 7 :model="user"
7 :rules="rules" 8 :rules="rules"
...@@ -79,10 +80,12 @@ export default { ...@@ -79,10 +80,12 @@ export default {
79 loginIn(self.user.account, self.user.password) 80 loginIn(self.user.account, self.user.password)
80 .then((res) => { 81 .then((res) => {
81 if (res.status === 1) { 82 if (res.status === 1) {
83 //存储token
82 sessionStorage.setItem("token", `Bearer ${res.content}`); 84 sessionStorage.setItem("token", `Bearer ${res.content}`);
83 this.$router.push('/'); 85 //登录成功后需判断有无重定向,没有重定向则跳转首页
86 this.$router.replace(this.$route.query.redirect || "/");
84 } else { 87 } else {
85 alert(res.message); 88 //错误处理
86 } 89 }
87 }) 90 })
88 .catch((error) => { 91 .catch((error) => {
...@@ -95,25 +98,34 @@ export default { ...@@ -95,25 +98,34 @@ export default {
95 components: {}, 98 components: {},
96 }; 99 };
97 </script> 100 </script>
98 <style scoped> 101 <style scoped lang="scss">
99 .bg { 102 .bg {
100 width: 100%; 103 width: 100%;
101 height: 100%; 104 height: 100%;
102 background: url(../../image/bg.png) no-repeat; 105 background: url(../../image/loginBg.jpg) no-repeat;
103 background-size: 100% 100%; 106 background-size: 100% 100%;
104 overflow: hidden; 107 overflow: hidden;
105 } 108 }
106 109
107 .login-inner-bg { 110 .login-inner-bg {
108 background: url(../../image/loginInnerBg.png) no-repeat; 111 background: url(../../image/loginBoxBg.png) no-repeat;
109 width: 393px; 112 width: 400px;
110 height: 348px; 113 height: 350px;
111 margin: 35vh auto 0; 114 margin: 35vh auto;
112 overflow: hidden; 115 overflow: hidden;
116 background-size: 100% 100%;
117 box-sizing: border-box;
118 padding: 20px;
113 } 119 }
114 120
115 .login .user_style { 121 .login .user_style {
116 margin: 90px 20px 0; 122 margin: 40px 20px 0;
123 h3{
124 color: #fff;
125 font-weight: normal;
126 text-align: center;
127 margin-bottom: 20px;
128 }
117 } 129 }
118 130
119 .login .btn { 131 .login .btn {
...@@ -139,8 +151,6 @@ export default { ...@@ -139,8 +151,6 @@ export default {
139 cursor: pointer !important; 151 cursor: pointer !important;
140 background-color: #2d8cf0 !important; 152 background-color: #2d8cf0 !important;
141 } 153 }
142 </style>
143 <style>
144 .inputUser .ivu-input { 154 .inputUser .ivu-input {
145 padding: 6px 24px !important; 155 padding: 6px 24px !important;
146 border: 1px solid #9f9f9f !important; 156 border: 1px solid #9f9f9f !important;
...@@ -164,3 +174,5 @@ export default { ...@@ -164,3 +174,5 @@ export default {
164 color: #fff; 174 color: #fff;
165 } 175 }
166 </style> 176 </style>
177 <style>
178 </style>
......
...@@ -8,7 +8,16 @@ class data { ...@@ -8,7 +8,16 @@ class data {
8 { 8 {
9 prop: "state", 9 prop: "state",
10 label: "状态", 10 label: "状态",
11 width: '100', 11 width: '120',
12 render: (h, scope) => {
13 return (
14 <div>
15 <span class='adopt' v-show={scope.row.state == 3}>上报失败</span>
16 <span class='adopt' v-show={scope.row.state == 2}>上报成功</span>
17 <span class='warehousing' v-show={scope.row.state == 1}>接入上报异常</span>
18 </div>
19 )
20 }
12 }, 21 },
13 { 22 {
14 prop: "UPLOADTIME", 23 prop: "UPLOADTIME",
...@@ -23,7 +32,7 @@ class data { ...@@ -23,7 +32,7 @@ class data {
23 prop: "ACCESSDATE", 32 prop: "ACCESSDATE",
24 label: "日期", 33 label: "日期",
25 width: '150', 34 width: '150',
26 }, 35 },
27 { 36 {
28 prop: "type", 37 prop: "type",
29 label: "类别", 38 label: "类别",
......