x

src/ajax/index.js

@@ -28,7 +28,8 @@ switch (envs) {
 }
 
 
-export const http = (method, url, param) => {
+export const http = (method, url, param,loading) => {
+  //loading 默认加载loading  传1 不加载
   param = param && typeof param === 'object' ? param : {};
   let token = Util.getCookie('token') || '';
   const config = {
@@ -39,7 +40,8 @@ export const http = (method, url, param) => {
     }],
     headers: {
       'Authorization': 'Bearer ' + token
-    }
+    },
+    loading:(loading?false:true)
   };
   
   // post请求时需要设定Content-Type

src/ajax/loading.js

+
+import Vue from 'vue';
+import { Loading } from 'element-ui';
+Vue.use(Loading)
+let loadingCount = 0;
+let loading;
+
+const startLoading = () => {
+  loading = Loading.service({
+    lock: true,
+    // text: '加载中……',
+    background: 'rgba(255, 255, 255, 0)'
+  });
+};
+
+const endLoading = () => {
+  loading.close();
+};
+
+export const showLoading = () => {
+  if (loadingCount === 0) {
+    startLoading();
+  }
+  loadingCount += 1;
+};
+
+export const hideLoading = () => {
+  if (loadingCount <= 0) {
+    return;
+  }
+  loadingCount -= 1;
+  if (loadingCount === 0) {
+    endLoading();
+  }
+};
\ No newline at end of file

src/main.js

@@ -3,9 +3,10 @@ import App from "./App.vue";
 import router from "./router";
 import filters from './filters'
 import directive from './directive'
-import {http} from './ajax/index.js';
+import { http } from './ajax/index.js';
 import axios from 'axios'
-import {Message} from 'element-ui';
+import { Message } from 'element-ui';
+import { showLoading, hideLoading } from './ajax/loading';
 import Util from "./tool";
 
 //本地环境开启提示信息
@@ -24,7 +25,7 @@ Vue.use(directive);
 
 //处理顶部导航TAB
 router.afterEach((to, from, next) => {
-  if (to.path == "/"||to.path == "/login") {
+  if (to.path == "/" || to.path == "/login") {
     return
   }
   let tabOldArr = sessionStorage.getItem('tabs');
@@ -38,13 +39,13 @@ router.afterEach((to, from, next) => {
     if (tabNewJson.indexOf(JSON.stringify({
       path: to.path,
       title: to.meta.title,
-      query:to.query
+      query: to.query
     })) == -1) {
       console.log(tabOldJson)
       tabOldJson.push({
         path: to.path,
         title: to.meta.title,
-        query:to.query
+        query: to.query
       })
     }
   } else {
@@ -52,7 +53,7 @@ router.afterEach((to, from, next) => {
       {
         path: to.path,
         title: to.meta.title,
-        query:to.query
+        query: to.query
       }
     ]
 
@@ -63,10 +64,24 @@ router.afterEach((to, from, next) => {
   }
 });
 
+
+axios.interceptors.request.use((config) => {
+  if(config.loading){
+    showLoading();
+  }
+  
+  return config;
+}, (err) => {
+  return Promise.reject(err)
+
+})
+
 axios.interceptors.response.use(res => {
+  hideLoading();
   return res.data;
 }, error => {
   // Message('网络出现问题,请检查网络');
+  hideLoading();
   return Promise.reject(new Error(error))
 })