diff --git a/src/views/healthConsultation/HealthConsultationIndex.vue b/src/views/healthConsultation/HealthConsultationIndex.vue index d9389d1..4a09e84 100644 --- a/src/views/healthConsultation/HealthConsultationIndex.vue +++ b/src/views/healthConsultation/HealthConsultationIndex.vue @@ -33,7 +33,7 @@ import healthContentBottomItem2 from './components/healthContentBottomItem2.vue'; import healthContentBottomItem3 from './components/healthContentBottomItem3.vue'; import healthContentBottomItem4 from './components/healthContentBottomItem4.vue'; - import { ref, onMounted, watch } from 'vue'; + import { ref, onMounted, watch, onUnmounted } from 'vue'; import dayjs from 'dayjs'; import { startTime } from '/@/utils/utils.ts'; @@ -44,6 +44,7 @@ const dateInfo = ref({}); const rightDate = ref(''); const initDate = ref(startTime); + const timer = ref(null); const getTime = () => { dateInfo.value = { @@ -51,17 +52,41 @@ times: dayjs().format('HH:mm:ss'), }; }; + + // 启动定时器,每秒更新时间 + const startTimer = () => { + if (timer.value) { + clearInterval(timer.value); + } + timer.value = window.setInterval(() => { + getTime(); + updateRightDate(); + }, 1000); + }; + + const updateRightDate = () => { + rightDate.value = '累计运行时间:' + (dayjs().diff(dayjs(initDate.value), 'days') + 1) + ' 天'; + }; + onMounted(() => { getTime(); - rightDate.value = '累计运行时间:' + (dayjs().diff(dayjs(initDate.value), 'days') + 1) + ' 天'; + updateRightDate(); + startTimer(); // 启动定时器 }); watch( () => dateInfo.value.day, () => { - rightDate.value = '累计运行时间:' + (dayjs().diff(dayjs(initDate.value), 'days') + 1) + ' 天'; + updateRightDate(); } ); + + // 组件卸载时清理定时器 + onUnmounted(() => { + if (timer.value) { + clearInterval(timer.value); + } + });