在主界面使用混入（mixins）
export default {
data() {
return {
logoutCount: 0
}
},
computed: {
// 系统设置的待机时间
outTime() {
return this.$store.state.settings.outTime
}
},
mounted() {
// 监听鼠标
document.onmousemove = event => {
this.logoutCount = 0
}
// 监听键盘
document.onkeydown = () => {
this.logoutCount = 0
}
// 监听Scroll
document.onscroll = () => {
this.logoutCount = 0
}
this.setTimer()
},
// 清除定时器
beforeDestroy() {
this.clearTimer()
},
methods: {
clearTimer() {
clearInterval(window.logoutTimer)
window.logoutTimer = null
},
setTimer() {
this.logoutCount = 0
if (!window.logoutTimer) {
window.logoutTimer = window.setInterval(this.logout, 1000)
}
},
async logout() {
const outTime = this.outTime * 60
// 判断用户N分钟无操作就自动登出
this.logoutCount++
if (outTime - this.logoutCount < 10 && outTime - this.logoutCount > 0) { // 锁定钱包倒计时
this.$message.closeAll()
this.$message({
message: `系统已经${this.outTime}分钟无操作，将在${outTime - this.logoutCount}秒后锁定钱包，如不想锁定钱包，请任意操作鼠标键盘`,
type: 'error'
})
} else if (this.logoutCount > outTime) { // 锁定钱包
this.$message.closeAll()
this.$message({
message: `系统已经${this.outTime}分钟无操作，钱包自动锁定`,
type: 'error',
duration: 15000
})
await this.$store.dispatch('user/logout')
this.$router.push(`/login?redirect=${this.$route.path}`)
}
}
}
}
