diff --git a/ruoyi-ui/src/views/index.vue b/ruoyi-ui/src/views/index.vue index 7f5a289..249d9c9 100644 --- a/ruoyi-ui/src/views/index.vue +++ b/ruoyi-ui/src/views/index.vue @@ -156,22 +156,100 @@ export default { documentList: [], executingTasks: [], pendingTasks: [], - timer: null + timer: null, + isCurrentPageActive: true // 当前页面是否激活 } }, created() { this.getListData() - this.timer = setInterval(() => { - this.getListData() - }, 30000) + this.startTimer() }, + mounted() { + // 监听页面可见性变化 + document.addEventListener('visibilitychange', this.handleVisibilityChange) + // 监听窗口焦点变化 + window.addEventListener('focus', this.handleWindowFocus) + window.addEventListener('blur', this.handleWindowBlur) + // 初始检查页面状态 + this.checkPageStatus() + }, + activated() { + // 当组件被激活时(如从keep-alive缓存中恢复) + this.checkPageStatus() + }, + deactivated() { + // 当组件被停用时(如被keep-alive缓存) + this.stopTimer() + }, beforeDestroy() { - if (this.timer) { - clearInterval(this.timer) - this.timer = null + this.stopTimer() + // 移除事件监听器 + document.removeEventListener('visibilitychange', this.handleVisibilityChange) + window.removeEventListener('focus', this.handleWindowFocus) + window.removeEventListener('blur', this.handleWindowBlur) + }, + // 监听路由变化 + watch: { + '$route'(to, from) { + // 当路由变化时,检查是否为首页 + this.checkPageStatus() } }, methods: { + // 启动定时器 + startTimer() { + if (!this.timer && this.isCurrentPageActive) { + this.timer = setInterval(() => { + if (this.isCurrentPageActive) { + this.getListData() + } + }, 8000) + } + }, + // 停止定时器 + stopTimer() { + if (this.timer) { + clearInterval(this.timer) + this.timer = null + } + }, + // 检查页面状态 + checkPageStatus() { + // 检查当前路由是否为首页 + const isHomePage = this.$route.path === '/' || this.$route.name === 'Index' + // 检查页面是否可见 + const isPageVisible = !document.hidden + // 检查窗口是否有焦点 + const isWindowFocused = document.hasFocus() + + const shouldBeActive = isHomePage && isPageVisible && isWindowFocused + + if (shouldBeActive !== this.isCurrentPageActive) { + this.isCurrentPageActive = shouldBeActive + + if (this.isCurrentPageActive) { + console.log('首页激活,启动定时器') + this.startTimer() + // 立即刷新一次数据 + this.getListData() + } else { + console.log('首页非激活状态,停止定时器') + this.stopTimer() + } + } + }, + // 处理页面可见性变化 + handleVisibilityChange() { + this.checkPageStatus() + }, + // 处理窗口获得焦点 + handleWindowFocus() { + this.checkPageStatus() + }, + // 处理窗口失去焦点 + handleWindowBlur() { + this.checkPageStatus() + }, getListData() { // 所有单据数量 finishCount().then(response => {