自助查询30分无操作，自动退出

src/App.vue

@@ -1,12 +1,55 @@
 <template>
-  <div id="app">
+  <div id="app" @click="handleClick">
     <router-view />
   </div>
 </template>
 
 <script>
+import { getToken, setToken } from '@/utils/auth';
 export default {
   name: 'App',
+  data() {
+    return {
+      lastTime: null,
+      currentTime: null,
+      timeOut: 1 * 60 * 1000,
+      token: '',
+      timer: '',
+    };
+  },
+  mounted() {
+    this.lastTime = new Date().getTime();
+    this.token = getToken();
+    setTimeout(() => {
+      this.handleClick();
+    }, 1000);
+  },
+  methods: {
+    handleClick() {
+      if (this.$route.path.includes('/hospital')) {
+        this.timer = setInterval(this.isTimeOut, 10000);
+      } else {
+        clearInterval(this.timer);
+        this.lastTime = new Date().getTime();
+      }
+    },
+    isTimeOut() {
+      this.currentTime = new Date().getTime();
+      // 判断上次最后一次点击的时间和这次点击的时间间隔是否大于30分钟
+      if (this.currentTime - this.lastTime > this.timeOut) {
+        if (null != this.token) {
+          // 是否是登录状态
+          this.$message.info('30分钟内无操作，请重新登录。');
+          setToken('');
+          sessionStorage.removeItem('route');
+          this.$router.push(`/login`);
+          clearInterval(this.timer);
+        } else {
+          this.lastTime = new Date().getTime();
+        }
+      }
+    },
+  },
 };
 </script>
 
@@ -153,7 +196,7 @@ export default {
   justify-content: space-between;
   margin: 10px 0px;
 }
-.dashboard-container{
+.dashboard-container {
   padding: 0;
   margin: 16px !important;
 }

src/views/searchSystem/index.vue

@@ -12,6 +12,9 @@
           <DoctorOrderSearchVue />
         </el-tab-pane>
       </el-tabs>
+      <el-button class="layout-btn" @click="onLayout">
+        退出
+      </el-button>
     </div>
   </div>
 </template>
@@ -20,7 +23,7 @@
 import BLSearchVue from './components/BLSearch.vue';
 import CaseHomeSearchVue from './components/CaseHomeSearch.vue';
 import DoctorOrderSearchVue from './components/DoctorOrderSearch.vue';
-
+import { setToken } from '@/utils/auth';
 export default {
   components: {
     BLSearchVue,
@@ -36,6 +39,11 @@ export default {
     handleClick(tab, event) {
       console.log(tab, event);
     },
+    onLayout() {
+      setToken('');
+      sessionStorage.removeItem("route")
+      this.$router.push(`/login`);
+    },
   },
 };
 </script>
@@ -53,6 +61,13 @@ export default {
     padding: 16px;
     background: #fff;
     border-radius: 5px;
+    position: relative;
+  }
+  .layout-btn {
+    position: absolute;
+    --size: 16px;
+    top: var(--size);
+    right: var(--size);
   }
 }
 </style>