update

src/components/WindowQingXiCheAndQv/WindowTime.vue

@@ -7,10 +7,67 @@ import { WindowEvent } from "../WindowQingXiCheAndQv/js/WindowEvent.js";
 
 WindowEvent.find().ComStore["WindowTimeStore"] = WindowTimeStore;
 
-onMounted(() => {
+/**
+ * 将秒换算成 01小时01分钟01秒 这样的格式
+ */
+const formatSeconds = (seconds) => {
+    let hours = Math.floor(seconds / 3600)
+    let minutes = Math.floor((seconds % 3600) / 60)
+    let secs = seconds % 60
+
+    if (("" + hours).indexOf(".") >= 0) {
+        hours = ("" + hours).split(".")[0]
+    }
+
+    if (("" + minutes).indexOf(".") >= 0) {
+        minutes = ("" + minutes).split(".")[0]
+    }
+
+    if (("" + secs).indexOf(".") >= 0) {
+        secs = ("" + secs).split(".")[0]
+    }
+
+    // 使用 padStart 方法确保每个部分都是两位数
+    // 先换算成 01:01:01 这样的格式
+    let newVal = [hours, minutes, secs]
+        .map(num => String(num).padStart(2, '0'))
+        .join(':')
+
+    return newVal;
+}
+
+// 当前换算出显示的结果
+let countdownEventVal = ref("00:00:00")
+
+
+/**
+ * 倒计时逻辑
+ */
+const countdownEvent = () => {
+
+    let code = "countdownEvent";
+    let time = 60 * 60 * 1;
+    
+    ComVal.find().fpsEventDel(code);
+    ComVal.find().fpsEventAdd(code, null, (1000), function(fpsEventAddRet) {
+        
+        time -= 1;
+        if (time <= 0) {
+            ComVal.find().fpsEventDel(fpsEventAddRet.code);
+            time = 0;
+        }
+        countdownEventVal.value = formatSeconds(time);
+
+    });
     
+}
+
+
+onMounted(() => {
+    countdownEvent();
 });
 
+
 </script>
 
 <template>
@@ -21,7 +78,7 @@ onMounted(() => {
         </div> -->
 
         <div class="main">
-
+            {{ countdownEventVal }}
         </div>
         
     </div>
@@ -69,8 +126,16 @@ onMounted(() => {
         background-position: center;
         background-size: 100% 100%;
         
+        /* 水平垂直居中,支持文字自动换行 */
+        overflow: hidden;
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        align-items: center;
 
-        
+        font-weight: 700;
+        font-size: 1.8rem;
+        color: #FFFFFF;
     }
     
 }