From ce1433f27628caa48d982b99aa6caead441687a0 Mon Sep 17 00:00:00 2001
From: Cho Chi Him <chochihim@gmail.com>
Date: Fri, 23 Aug 2019 16:14:05 +0800
Subject: [PATCH] use current date to calculate remaining time

---
 src/components/earnMDT/CountdownCard.vue | 25 +++++++++++++++++++++---
 1 file changed, 22 insertions(+), 3 deletions(-)

diff --git a/src/components/earnMDT/CountdownCard.vue b/src/components/earnMDT/CountdownCard.vue
index bc58934..1aacec3 100644
--- a/src/components/earnMDT/CountdownCard.vue
+++ b/src/components/earnMDT/CountdownCard.vue
@@ -55,8 +55,12 @@ export default {
     },
   },
   data() {
+    const now = new Date();
+    const initialRemainingTime =
+      this.initialRemainingTime > 0 ? this.initialRemainingTime : 0;
     return {
-      remainingTime: this.initialRemainingTime,
+      nowSeconds: Math.round(now.getTime() / 1000),
+      remainingTime: initialRemainingTime,
       intervalId: null,
     };
   },
@@ -96,7 +100,11 @@ export default {
   },
   watch: {
     initialRemainingTime: function(val) {
-      this.remainingTime = val;
+      if (val > 0) {
+        const now = new Date();
+        this.nowSeconds = Math.round(now.getTime() / 1000);
+        this.remainingTime = val;
+      }
     },
   },
   beforeDestroy() {
@@ -106,8 +114,19 @@ export default {
   },
   created() {
     this.intervalId = setInterval(() => {
+      const now = new Date();
+      const nowSeconds = Math.round(now.getTime() / 1000);
+
       if (this.remainingTime > 0) {
-        this.remainingTime -= 1;
+        const nextRemainingTime =
+          this.remainingTime - (nowSeconds - this.nowSeconds);
+
+        if (nextRemainingTime > 0) {
+          this.remainingTime = nextRemainingTime;
+        } else {
+          this.remainingTime = 0;
+        }
+        this.nowSeconds = nowSeconds;
       }
     }, 1000);
   },