长时间不对页面进行操作就 推出登录

<template>

  <div id="app" @mousemove="moveEvent" @click="moveEvent">

    <router-view />

  </div>

</template>

<script>

export default {

  name: "App",

  data() {

    return {

      timmer: null,

    };

  },

  created() {

  },

  methods: {

    moveEvent: function () {

      let path = ["/login"];

      if (!path.includes(this.$route.path)) {

        clearTimeout(this.timmer);

        this.init();

      }

    },

    init: function () {

    

      this.timmer = setTimeout(() => {

        sessionStorage.clear();

        this.clearAllCookie();

        // this.$router.go(0)

        // this.$router.push({

        //   path: '/login'

        // })

          // 1000*60*30

      },    1000*60*10);

    },

    clearAllCookie() {

      var keys = document.cookie.match(/[^ =;]+(?=\=)/g);

      if (keys) {

        this.logout();

      }

    },

    logout() {

      console.log("logout");

      let that = this;

      //处理vueX

      that.$store.state.isLogin = false;

      that.$store.state.cookie = "";

      that.$store.state.userinfo = {};

      that.$store.state.userName = "";

      that.$store.state.cookie = "";

      $.ajax({

        //备用请求 和下面的vue-jsop实际效果是一样的  只不过这个是jq

        url: "https://sso.chci.cn/jsonLogout.do",

        type: "GET",

        dataType: "jsonp",

        jsonp: "mycallback",

        xhrFields: {

          withCredentials: true, //解决跨服务传递时不传递cookie的问题，允许携带证书

        },

        crossDomain: true, //允许跨域

        timeout: 5000,

        success: function (data) {

          that.$cookies

            .keys()

            .forEach((cookie) => that.$cookies.remove(cookie));

          that.$cookies.remove("SSOID", "/", ".chci.cn");

          that.$cookies.remove("JSESSIONID", "/", ".chci.cn");

          that.isLogin = false; //当前页登录状态改为 未登录

          let returnUrl = encodeURIComponent(window.location.href);

          window.location.href =

            "https://sso.chci.cn/login.do?method=get&returnURL=" + returnUrl;

        },

      });

    },

  },

};

</script>

<style>

* {

  margin: 0;

  padding: 0;

}

html,

body,

#app {

  width: 100%;

  height: 100%;

}

a {

  text-decoration: none;

}

.block {

  margin-top: 10px;

}

.el-scrollbar__wrap {

  overflow-x: hidden;

}

.el-autocomplete-suggestion .el-scrollbar__wrap {

  overflow: scroll;

}

.el-menu-item-group__title {

  padding: 0 0 0 20px;

}

.el-icon-s-fold:before {

  font-size: 26px;

  font-weight: normal;

}

.el-icon-close {

  margin: -13px 20px 0 0;

  font-size: 20px;

}

.el-input__inner,

.el-cascader {

  height: 35px;

}

/* 搜索通用样式 */

.toplist {

  margin: 0 0 10px;

}

.toplist h6 {

  float: left;

  margin-right: 10px;

  font-weight: normal;

}

.toplist h6 .el-button {

  line-height: 35px;

  padding-top: 0;

  padding-bottom: 0;

  margin-left: 0;

  vertical-align: top;

}

.toplist h6 .el-button .el-icon-search {

  margin-top: 13px;

}

.toplist h6 input,

.toplist h6 button {

  height: 35px !important;

}

.toplist h6 input {

  padding-right: 0 !important;

  /* padding-left: 5px !important; */

}

.toplist h6 .el-input-group__append {

  padding-left: 0;

}

.el-cascader {

  line-height: 35px;

  margin-top: -1px;

  width: 300px;

}

.clear {

  clear: both;

}

.clearfix:after {

  content: "";

  display: block;

  height: 0;

  clear: both;

  visibility: hidden;

}

.el-form--label-top .el-form-item__label {

  padding: 0;

}

table td div button.el-button--small {

  padding: 0;

}

.toplist h6 input.el-range-input {

  background-color: transparent !important;

}

.el-select-dropdown__list {

  padding: 6px 0 18px 0;

}

.el-table--border::after,

.el-table--group::after,

.el-table::before {

  height: 0;

}

.el-icon-circle-close:before {

  color: #fff !important;

}

/* 解决dialog与message同时使用 遮罩z-index问题  message会出现在灰色遮罩下面  this.$message 添加customClass:'mzindex'引入这个class就可解决*/

.mzindex {

  z-index: 3000 !important;

}

</style>