From d7a35cdf72a0cc2112057d671d589b4dd0d14fe9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=B7=84=E5=8D=9A=E9=BD=90=E7=9B=9B=E9=AB=98=E7=BA=A7?=
 =?UTF-8?q?=E4=B8=AD=E5=AD=A6=20-=20=E9=9D=9E=E5=AE=98=E6=96=B9?=
 <qsgz2023ji5ban@edicdn.eu.org>
Date: Fri, 23 Aug 2024 10:22:25 +0800
Subject: [PATCH] =?UTF-8?q?add:=20=E7=82=B9=E5=87=BB=E6=97=B6=E9=97=B4?=
 =?UTF-8?q?=E6=9B=B4=E6=8D=A2=E6=98=BE=E7=A4=BA=E5=A4=A7=E5=B0=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/renderer/src/components/Clock.vue | 15 +++++++++++----
 1 file changed, 11 insertions(+), 4 deletions(-)

diff --git a/src/renderer/src/components/Clock.vue b/src/renderer/src/components/Clock.vue
index bec4779..c11f8c6 100644
--- a/src/renderer/src/components/Clock.vue
+++ b/src/renderer/src/components/Clock.vue
@@ -1,7 +1,7 @@
 <template>
-  <v-card class="mx-auto" max-width="600">
+  <v-card class="mx-auto" max-width="750">
     <v-card-text class="text-center">
-      <div class="display-1 font-weight-bold">
+      <div class="display-1 font-weight-bold" @click="cycleFontSize">
         {{ formattedTime }}
       </div>
     </v-card-text>
@@ -15,13 +15,15 @@ import moment from 'moment';
 
 // 使用ref来存储当前时间
 const formattedTime = ref('');
+const fontSizeIndex = ref(2); // 默认字体大小为7rem
+const fontSizes = ['3rem', '5rem', '7rem'];//不同分辨率适合使用不同大小的字体
 
 // 在页面加载完成后初始化时间
 onMounted(() => {
   updateTime();
 });
 
-const formatDateTime = (isoString) => moment(isoString).format('HH:mm:ss');
+const formatDateTime = (isoString: moment.MomentInput) => moment(isoString).format('HH:mm:ss');
 
 // 更新时间的函数
 function updateTime() {
@@ -31,10 +33,15 @@ function updateTime() {
 
 // 每隔一分钟更新一次时间
 useIntervalFn(updateTime, 250);
+
+// 切换字体大小的函数
+function cycleFontSize() {
+  fontSizeIndex.value = (fontSizeIndex.value + 1) % fontSizes.length;
+}
 </script>
 
 <style scoped>
 .display-1 {
-  font-size: 5rem; /* 调整字号以适应大屏幕 */
+  font-size: v-bind(fontSizes[fontSizeIndex]); /* 动态绑定字体大小 */
 }
 </style>