chore: OXC Formatter

app/citizen-frontend/src/pages/index.vue

@@ -7,12 +7,16 @@
           <v-row class="mt-4" no-gutters>
             <v-col cols="8">
               <v-card-title> {{ store.userProfile.name }} 先生 </v-card-title>
-              <v-card-subtitle> 資料更新於 {{ todayTimeString }} </v-card-subtitle>
+              <v-card-subtitle>
+                資料更新於 {{ todayTimeString }}
+              </v-card-subtitle>
             </v-col>
 
             <v-col class="d-flex justify-center" cols="4">
               <!-- 健康力分數大圓盤 -->
-              <div class="score-disk d-flex flex-column justify-center align-center">
+              <div
+                class="score-disk d-flex flex-column justify-center align-center"
+              >
                 <span class="score-val">{{ displayedHealthScore }}</span>
                 <span class="score-unit">分</span>
               </div>
@@ -56,7 +60,11 @@
 
           <!-- 課程建議入口 -->
 
-          <v-list-item append-icon="mdi-chevron-right" class="bg-primary py-4" to="/course">
+          <v-list-item
+            append-icon="mdi-chevron-right"
+            class="bg-primary py-4"
+            to="/course"
+          >
             <v-list-item-title class="font-weight-bold">
               <v-icon icon="mdi-notebook-check-outline" size="16" />
               課程建議
@@ -158,10 +166,17 @@
             </v-btn>
 
             <div class="d-flex align-center mt-4">
-              <v-icon class="mr-3" color="primary" icon="mdi-lock-outline" size="28" />
+              <v-icon
+                class="mr-3"
+                color="primary"
+                icon="mdi-lock-outline"
+                size="28"
+              />
 
               <div>
-                <div class="font-weight-bold text-grey-darken-4">登入後可使用完整功能</div>
+                <div class="font-weight-bold text-grey-darken-4">
+                  登入後可使用完整功能
+                </div>
 
                 <div class="text-title-small text-grey">
                   普測預約、現場報到、量測紀錄與運動處方。
@@ -184,70 +199,70 @@
 </template>
 
 <script setup lang="ts">
-import { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue'
-import BrandAvatar from '@/components/BrandAvatar.vue'
-import HealthRadarChart from '@/components/HealthRadarChart.vue'
-import Layout from '@/components/layout/DefaultLayout.vue'
-import ModuleRouterCard from '@/components/ModuleRouterCard.vue'
-import { useAppStore } from '@/stores/app'
+import { computed, onBeforeUnmount, onMounted, ref, watch } from "vue";
+import BrandAvatar from "@/components/BrandAvatar.vue";
+import HealthRadarChart from "@/components/HealthRadarChart.vue";
+import Layout from "@/components/layout/DefaultLayout.vue";
+import ModuleRouterCard from "@/components/ModuleRouterCard.vue";
+import { useAppStore } from "@/stores/app";
 
-const store = useAppStore()
-const displayedHealthScore = ref(1)
-let healthScoreTimer: number | undefined
+const store = useAppStore();
+const displayedHealthScore = ref(1);
+let healthScoreTimer: number | undefined;
 
-function animateHealthScore (targetScore: number) {
+function animateHealthScore(targetScore: number) {
   if (healthScoreTimer !== undefined) {
-    window.clearInterval(healthScoreTimer)
+    window.clearInterval(healthScoreTimer);
   }
 
   if (targetScore <= 1) {
-    displayedHealthScore.value = targetScore
-    return
+    displayedHealthScore.value = targetScore;
+    return;
   }
 
-  displayedHealthScore.value = 1
+  displayedHealthScore.value = 1;
 
-  const duration = 900
-  const stepDuration = Math.max(12, Math.floor(duration / targetScore))
+  const duration = 900;
+  const stepDuration = Math.max(12, Math.floor(duration / targetScore));
 
   healthScoreTimer = window.setInterval(() => {
     if (displayedHealthScore.value >= targetScore) {
-      window.clearInterval(healthScoreTimer)
-      healthScoreTimer = undefined
-      return
+      window.clearInterval(healthScoreTimer);
+      healthScoreTimer = undefined;
+      return;
     }
 
-    displayedHealthScore.value += 1
-  }, stepDuration)
+    displayedHealthScore.value += 1;
+  }, stepDuration);
 }
 
 onMounted(() => {
-  animateHealthScore(store.healthScore)
-})
+  animateHealthScore(store.healthScore);
+});
 
 onBeforeUnmount(() => {
   if (healthScoreTimer !== undefined) {
-    window.clearInterval(healthScoreTimer)
+    window.clearInterval(healthScoreTimer);
   }
-})
+});
 
 watch(
   () => store.healthScore,
-  score => {
-    animateHealthScore(score)
+  (score) => {
+    animateHealthScore(score);
   },
-)
+);
 
 const todayTimeString = computed(() => {
-  const now = new Date()
+  const now = new Date();
   const date = [
-    String(now.getMonth() + 1).padStart(2, '0'),
-    String(now.getDate()).padStart(2, '0'),
-  ].join('/')
-  const time = `${String(now.getHours()).padStart(2, '0')}:${String(now.getMinutes()).padStart(2, '0')}`
+    String(now.getMonth() + 1).padStart(2, "0"),
+    String(now.getDate()).padStart(2, "0"),
+  ].join("/");
+  const time = `${String(now.getHours()).padStart(2, "0")}:${String(now.getMinutes()).padStart(2, "0")}`;
 
-  return `${date} ${time}`
-})
+  return `${date} ${time}`;
+});
 </script>
 
 <style scoped>