http

src/main.js

@@ -3,10 +3,13 @@ import App from './App.vue';
 import router from './router';
 import store from './store';
 import './plugins/element.js';
+import http from './plugins/http';
 import MetaInfo from 'vue-meta-info';
 
 Vue.use(MetaInfo);
 
+Vue.use(http);
+
 Vue.config.productionTip = false;
 const observerMap = new Map();
 Vue.directive('change', {

src/plugins/http.js

@@ -0,0 +1,108 @@
+import axios from 'axios';
+import router from '../router';
+import qs from 'qs';
+/* eslint-disable */
+let baseUrl = 'http://localhost:8080';
+switch (process.env.NODE_ENV) {
+    case 'development':
+        baseUrl = 'http://localhost:8080';
+        break;
+    case 'test':
+        baseUrl = 'http://localhost:8080';
+        break;
+    case 'production':
+        baseUrl = '../../';
+        break;
+}
+const axiosInstance = axios.create({
+    baseURL: baseUrl
+});
+
+axiosInstance.interceptors.request.use(
+    function (config) {
+        config.headers = config.headers || {};
+        let token = window.localStorage.getItem('imtPCtoken');
+        if (token) {
+            config.headers['Authorization'] = 'Bearer ' + token;
+        }
+        return config;
+    },
+    function (error) {
+        return Promise.reject(error);
+    }
+);
+
+axiosInstance.interceptors.response.use(
+    function (response) {
+        return response;
+    },
+    function (error) {
+        let errorData = {};
+        if (!error.response) {
+            errorData = {
+                error: '网络错误，请检查网络链接'
+            };
+            router.replace({
+                name: '502'
+            });
+            // router.replace('/502')
+        } else {
+            errorData = error.response.data;
+            if (401 === error.response.status) {
+                if (router.currentRoute.meta.needLogin) {
+                    // store.commit('updateShowLogin', true);
+                }
+            }
+        }
+        return Promise.reject(errorData);
+    }
+);
+
+const http = {
+    get(url, params) {
+        params = params || {};
+        return new Promise((resolve, reject) => {
+            axiosInstance
+                .get(
+                    url,
+                    {
+                        params: params
+                    },
+                    { withCredentials: true }
+                )
+                .then(res => {
+                    resolve(res.data);
+                })
+                .catch(e => {
+                    reject(e);
+                });
+        });
+    },
+    post(url, body, options) {
+        options = options || {};
+        body = body || {};
+        if (!(body instanceof FormData)) {
+            if (options.body !== 'json') {
+                body = qs.stringify(body);
+            }
+        }
+        return new Promise((resolve, reject) => {
+            axiosInstance
+                .post(url, body, { withCredentials: true })
+                .then(res => {
+                    resolve(res.data);
+                })
+                .catch(e => {
+                    reject(e);
+                });
+        });
+    }
+};
+export default {
+    axios: http,
+    install(_Vue, options) {
+        _Vue.prototype.$baseUrl = baseUrl;
+        _Vue.prototype.$axios = axiosInstance;
+        _Vue.prototype.$http = http;
+    }
+};

src/views/Home.vue

@@ -9,3 +9,9 @@ export default {
     name: 'Home'
 };
 </script>
+
+<style lang="less" scoped>
+.home {
+    background-color: #fff;
+}
+</style>

src/views/Index.vue

@@ -39,5 +39,16 @@ export default {
 .main {
     height: 1000px;
     padding: 0;
+    .flex-col();
+}
+
+.main > div {
+    flex-shrink: 0;
+}
+
+.appContainer {
+    background-color: @bg;
+    padding: 60px 0;
+    flex-grow: 1;
 }
 </style>