Browse Source

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

冷冷 6 years ago
parent
commit
49c66649b6
1 changed files with 77 additions and 75 deletions
  1. 77 75
      src/page/index/index.vue

+ 77 - 75
src/page/index/index.vue

@@ -3,108 +3,110 @@
        :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>
-    <!-- <el-footer class="avue-footer">
-      <img src="/svg/logo.svg"
-           alt=""
-           class="logo">
-      <p class="copyright">© 2018 Avue designed by smallwei</p>
-    </el-footer> -->
     <div class="avue-shade"
          @click="showCollapse"></div>
   </div>
 </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";
-export default {
-  components: {
-    top,
-    tags,
-    sidebar
-  },
-  name: "index",
-  data() {
-    return {
-      //刷新token锁
-      refreshLock: false,
-      //刷新token的时间
-      refreshTime: ""
-    };
-  },
-  created() {
-    //实时检测刷新token
-    this.refreshToken();
-  },
-  mounted() {
-    this.init();
-  },
-  computed: mapGetters(["isLock", "isCollapse", "website"]),
-  props: [],
-  methods: {
-    showCollapse() {
-      this.$store.commit("SET_COLLAPSE");
+  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',
+    data() {
+      return {
+        //刷新token锁
+        refreshLock: false,
+        //刷新token的时间
+        refreshTime: '',
+      }
+    },
+    created() {
+      //实时检测刷新token
+      this.refreshToken()
     },
-    // 屏幕检测
-    init() {
-      this.$store.commit("SET_SCREEN", admin.getScreen());
-      window.onresize = () => {
-        setTimeout(() => {
-          this.$store.commit("SET_SCREEN", admin.getScreen());
-        }, 0);
-      };
+    destroyed() {
+      console.log("销毁")
+      console.log(this.refreshTime)
+      clearInterval(this.refreshTime)
     },
-    // 10分钟检测一次token
-    refreshToken() {
-      this.refreshTime = setInterval(() => {
-        const token = getStore({
-          name: "token",
-          debug: 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("RefreshToken")
-            .then(() => {
-              this.refreshLock = false;
-            })
-            .catch(() => {
-              this.refreshLock = false;
-            });
+    mounted() {
+      this.init()
+    },
+    computed: mapGetters(['isLock', 'isCollapse', 'website', 'expires_in']),
+    props: [],
+    methods: {
+      showCollapse() {
+        this.$store.commit("SET_COLLAPSE")
+      },
+      // 屏幕检测
+      init() {
+        this.$store.commit('SET_SCREEN', admin.getScreen())
+        window.onresize = () => {
+          setTimeout(() => {
+            this.$store.commit('SET_SCREEN', admin.getScreen())
+          }, 0);
         }
-      }, 10000);
+      },
+      // 实时检测刷新token
+      refreshToken() {
+        this.refreshTime = setInterval(() => {
+          const token = getStore({
+            name: 'access_token',
+            debug: true,
+          });
+
+          if (validatenull(token)) {
+            return;
+          }
+
+          if (this.expires_in <= 1000 && !this.refreshLock) {
+            this.refreshLock = true
+            this.$store
+              .dispatch('RefeshToken')
+              .catch(() => {
+                clearInterval(this.refreshTime)
+              });
+            this.refreshLock = false
+          }
+          this.$store.commit("SET_EXPIRES_IN",this.expires_in - 10);
+        }, 10000);
+      },
     }
   }
-};
 </script>