up

src/api/user.js

@@ -12,7 +12,8 @@ export function loginOss(data) {
   return request({
     url: '/api/admin/auth/oss-login',
     method: 'post',
-    data
+    data,
+    noloading: true
   })
 }
 
@@ -22,7 +23,9 @@ export function getInfo(token) {
   return request({
     url: '/api/admin/auth/me',
     method: 'post',
-    params: { token }
+    params: {
+      token
+    }
   })
 }
 
@@ -37,6 +40,8 @@ export function getAuthMenu(token) {
   return request({
     url: '/api/admin/auth/permissions',
     method: 'get',
-    params: { token }
+    params: {
+      token
+    }
   })
 }

src/utils/request.js

@@ -1,7 +1,13 @@
 import axios from 'axios'
-import { MessageBox, Message ,Loading} from 'element-ui'
+import {
+  MessageBox,
+  Message,
+  Loading
+} from 'element-ui'
 import store from '@/store'
-import { getToken } from '@/utils/auth'
+import {
+  getToken
+} from '@/utils/auth'
 let loading;
 
 // create an axios instance
@@ -14,19 +20,22 @@ const service = axios.create({
 // request interceptor
 service.interceptors.request.use(
   config => {
+
+    if (!config.noloading) {
       // do something before request is sent
       loading = Loading.service({
-     lock:true,
+        lock: true,
-     background:"rgba(0,0,0,0.4)",
+        background: "rgba(0,0,0,0.4)",
-     text:"正在加载中..."
+        text: "正在加载中..."
       })
+    }
     if (store.getters.token) {
       // let each request carry token
       // ['X-Token'] is a custom headers key
       // please modify it according to the actual situation
       //config.headers['X-Token'] = getToken();
 
-      config.headers['Authorization'] ="Bearer "+getToken()
+      config.headers['Authorization'] = "Bearer " + getToken()
     }
     return config
   },
@@ -50,7 +59,9 @@ service.interceptors.response.use(
    * You can also judge the status by HTTP Status Code
    */
   response => {
+    if (loading) {
       loading.close()
+    }
     const res = response.data
 
     // if the custom code is not 20000, it is judged as an error.
@@ -64,7 +75,8 @@ service.interceptors.response.use(
       // 50008: Illegal token; 50012: Other clients logged in; 50014: Token expired;
       if (res.errcode === 50008 || res.errcode === 50012 || res.errcode === 50014) {
         // to re-login
-        MessageBox.confirm('You have been logged out, you can cancel to stay on this page, or log in again', 'Confirm logout', {
+        MessageBox.confirm('You have been logged out, you can cancel to stay on this page, or log in again',
+          'Confirm logout', {
             confirmButtonText: 'Re-Login',
             cancelButtonText: 'Cancel',
             type: 'warning'
@@ -80,7 +92,9 @@ service.interceptors.response.use(
     }
   },
   error => {
+    if (loading) {
       loading.close()
+    }
     console.log('err' + error) // for debug
     Message({
       message: error.message,

src/views/login/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="login-container">
+  <div class="login-container" v-if="showLogin">
     <el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form" auto-complete="on"
       label-position="left">
 
@@ -31,6 +31,7 @@
 
     </el-form>
   </div>
+  <div v-else class="login-container-w"></div>
 </template>
 
 <script>
@@ -56,6 +57,7 @@
         }
       }
       return {
+        showLogin: false,
         loginForm: {
           username: '',
           password: ''
@@ -76,9 +78,17 @@
         passwordType: 'password',
         redirect: undefined
       }
+    },
+    beforeCreate() {
+
     },
     created() {
       var query = this.$route.query;
+      if (query.tp) {
+        this.showLogin = false;
+      } else {
+        this.showLogin = true;
+      }
       if (query.token && query.userid && query.tp) {
         this.loading = true
         this.$store.dispatch('user/loginskip', {
@@ -189,6 +199,13 @@
   $dark_gray:#889aa4;
   $light_gray:#eee;
 
+  .login-container-w {
+    min-height: 100%;
+    width: 100%;
+    background-color: #ffffff;
+    overflow: hidden;
+  }
+
   .login-container {
     min-height: 100%;
     width: 100%;