Merge branch 'leng_dev' of https://gitee.wang/pigx/pigx-ui into leng_dev

src/api/login.js

@@ -32,7 +32,7 @@ export const loginByUsername = (username, password, code, randomStr) => {
   })
 }
 
-export const refeshToken = (refresh_token) => {
+export const refreshToken = (refresh_token) => {
   const grant_type = 'refresh_token'
   return request({
     url: '/auth/oauth/token',

src/page/index/index.vue

@@ -3,27 +3,26 @@
        :class="{'avue--collapse':isCollapse}">
     <div class="avue-header">
       <!-- 顶部导航栏 -->
-      <top/>
+      <top />
     </div>
 
     <div class="avue-layout">
       <div class="avue-left">
         <!-- 左侧导航栏 -->
-        <sidebar/>
+        <sidebar />
       </div>
       <div class="avue-main">
         <!-- 顶部标签卡 -->
-        <tags/>
+        <tags />
         <!-- 主体视图层 -->
         <el-scrollbar style="height:100%">
           <keep-alive>
             <router-view class="avue-view"
-                         v-if="$route.meta.$keepAlive"/>
+                         v-if="$route.meta.keepAlive" />
           </keep-alive>
           <router-view class="avue-view"
-                       v-if="!$route.meta.$keepAlive"/>
+                       v-if="!$route.meta.keepAlive" />
         </el-scrollbar>
-
       </div>
     </div>
     <div class="avue-shade"
@@ -32,81 +31,73 @@
 </template>
 
 <script>
-  import {mapGetters} from 'vuex'
-  import tags from './tags'
-  import top from './top/'
-  import sidebar from './sidebar/'
-  import admin from '@/util/admin';
-  import {validatenull} from '@/util/validate';
-  import {calcDate} from '@/util/date.js';
-  import {getStore} from '@/util/store.js';
-
+  import { mapGetters } from "vuex";
+  import tags from "./tags";
+  import top from "./top/";
+  import sidebar from "./sidebar/";
+  import admin from "@/util/admin";
+  import { validatenull } from "@/util/validate";
+  import { calcDate } from "@/util/date.js";
+  import { getStore } from "@/util/store.js";
   export default {
     components: {
       top,
       tags,
       sidebar
     },
-    name: 'index',
+    name: "index",
     data() {
       return {
         //刷新token锁
         refreshLock: false,
         //刷新token的时间
-        refreshTime: '',
-      }
+        refreshTime: ""
+      };
     },
     created() {
       //实时检测刷新token
-      this.refreshToken()
-    },
-    destroyed() {
-      console.log("销毁")
-      console.log(this.refreshTime)
-      clearInterval(this.refreshTime)
+      this.refreshToken();
     },
     mounted() {
-      this.init()
+      this.init();
     },
-    computed: mapGetters(['isLock', 'isCollapse', 'website', 'expires_in']),
+    computed: mapGetters(["isLock", "isCollapse", "website"]),
     props: [],
     methods: {
       showCollapse() {
-        this.$store.commit("SET_COLLAPSE")
+        this.$store.commit("SET_COLLAPSE");
       },
       // 屏幕检测
       init() {
-        this.$store.commit('SET_SCREEN', admin.getScreen())
+        this.$store.commit("SET_SCREEN", admin.getScreen());
         window.onresize = () => {
           setTimeout(() => {
-            this.$store.commit('SET_SCREEN', admin.getScreen())
+            this.$store.commit("SET_SCREEN", admin.getScreen());
           }, 0);
-        }
+        };
       },
-      // 实时检测刷新token
+      // 10分钟检测一次token
       refreshToken() {
         this.refreshTime = setInterval(() => {
           const token = getStore({
-            name: 'access_token',
-            debug: true,
+            name: "token",
+            debug: true
           });
-
-          if (validatenull(token)) {
-            return;
-          }
-
-          if (this.expires_in <= 1000 && !this.refreshLock) {
-            this.refreshLock = true
+          const date = calcDate(token.datetime, new Date().getTime());
+          if (validatenull(date)) return;
+          if (!(date.seconds >= this.website.tokenTime) && !this.refreshLock) {
+            this.refreshLock = true;
             this.$store
-              .dispatch('RefeshToken')
+              .dispatch("RefreshToken")
+              .then(() => {
+                this.refreshLock = false;
+              })
               .catch(() => {
-                clearInterval(this.refreshTime)
+                this.refreshLock = false;
               });
-            this.refreshLock = false
           }
-          this.$store.commit("SET_EXPIRES_IN",this.expires_in - 10);
         }, 10000);
-      },
+      }
     }
-  }
+  };
 </script>

src/store/modules/user.js

@@ -1,6 +1,6 @@
 import {getStore, setStore} from '@/util/store'
 import {isURL} from '@/util/validate'
-import {getUserInfo, loginByMobile, loginBySocial, loginByUsername, logout, refeshToken} from '@/api/login'
+import {getUserInfo, loginByMobile, loginBySocial, loginByUsername, logout, refreshToken} from '@/api/login'
 import {deepClone, encryption} from '@/util/util'
 import webiste from '@/const/website'
 import {GetMenu} from '@/api/admin/menu'
@@ -110,9 +110,9 @@ const user = {
       })
     },
     // 刷新token
-    RefeshToken({commit, state}) {
+    RefreshToken({commit, state}) {
       return new Promise((resolve, reject) => {
-        refeshToken(state.refresh_token).then(response => {
+        refreshToken(state.refresh_token).then(response => {
           const data = response.data
           commit('SET_ACCESS_TOKEN', data.access_token)
           commit('SET_REFRESH_TOKEN', data.refresh_token)