前端监听页面是否鼠标移动 超过一定的静止时间自动跳转到登录页面

import { CreateBuriedPoints } from '@/api/Statistics';
export const DurationStay = {
    data(){
      return {
        currentTime:"",
        DurationOfStay: 5*60*1000,   //自定义的无操作时长5分钟  
        intervalTime:0
      }
    },
    mounted(){
     //   console.log('test 鼠标');
      this.currentTime = new Date().getTime();
      this.checkouttime();
      document.addEventListener("keydown",this.resetStartTime);
      document.addEventListener('mousemove',this.resetStartTime);
    },
  
    beforeDestroy(){
     //离开页面要销毁事件，否则会影响跳转的下个页面
      document.removeEventListener("keydown",this.resetStartTime);
      document.removeEventListener("mousemove",this.resetStartTime);
      if(this.intervalTime){
        clearInterval(this.intervalTime);
      }
    },
    methods:{
      resetStartTime(){
        console.log('鼠标操作，重置当前时间');
        this.currentTime = new Date().getTime();
      },
      checkouttime(){
        this.intervalTime= setInterval(()=>{
          let nowtime = new Date().getTime();
          if(nowtime - this.currentTime > this.DurationOfStay){
            // alert("页面停留太长，点击“刷新一下”获取最新价格和库存。")
            // 主动跳转到登录页面
            this.$store.dispatch('group/setPreShowEquipment', []);
            this.$store.dispatch('group/setReviewEquipment', []);
            this.$store.dispatch('settings/changeTripartitleModule_picked', []);
            CreateBuriedPoints('RCM', '切换用户', '', 'L_CLICK', '', 'Y', 'N');
            setTimeout(() => {
              this.$store.dispatch('user/resetToken').then(() => {
                if (this.electron.status) {
                  this.electron.KVMService.destroyAll(); // 销毁所有KVM
                  this.electron.closeAllChildWindow();
                  this.electron.resizeWindow(800, 500);
                  this.electron.resizable(false);
                  this.$router.replace('/login');
                  // 关闭聊天窗体；
                  if (this.electron.centUserToChatWin) {
                    this.electron.centUserToChatWin('execClose');
                  }
                } else {
                  location.reload();
                }
              });
            }, 100);
            return false;
          }
        },10000);
      }
    }
  }
  

封装js组件，

使用租价 全局混入

导入 组件 

import { DurationStay } from '@/utils/DurationStay'

 

通过混入使用组件：

 mixins: [commonMixins,DurationStay],