From 3b6679388a69be03d5f07ae7a42c272925ffa1d0 Mon Sep 17 00:00:00 2001
From: mtruning <1262327911@qq.com>
Date: Sun, 20 Sep 2020 14:25:16 +0800
Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E5=8A=A8=E6=80=81=E6=97=B6?=
 =?UTF-8?q?=E9=97=B4=EF=BC=8C=E4=BF=AE=E6=94=B9=E5=85=A8=E5=B1=8F=E6=BB=9A?=
 =?UTF-8?q?=E5=8A=A8=E6=9D=A1bug=EF=BC=8C=E7=BF=BB=E9=A1=B5=E5=88=97?=
 =?UTF-8?q?=E8=A1=A8=E4=B8=BA=E8=A1=8C=E6=BB=9A=E5=8A=A8=EF=BC=88=E6=9C=89?=
 =?UTF-8?q?bug=EF=BC=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/scss/index.scss |  2 +-
 src/utils/index.js         | 28 ++++++++++++++++++++++++++++
 src/views/center.vue       | 21 ++++++++++++++-------
 src/views/index.vue        | 25 +++++++++++++++++++------
 4 files changed, 62 insertions(+), 14 deletions(-)

diff --git a/src/assets/scss/index.scss b/src/assets/scss/index.scss
index dfc52eb..8e4a33b 100644
--- a/src/assets/scss/index.scss
+++ b/src/assets/scss/index.scss
@@ -2,7 +2,7 @@
   color: #d3d6dd;
   background-color: #000000;
   width: 100%;
-  height: 100vh;
+  height: 100%;
 
   .bg {
     padding: 0.2rem 0.2rem 0 0.2rem;
diff --git a/src/utils/index.js b/src/utils/index.js
index 1fb622d..3d5a51a 100644
--- a/src/utils/index.js
+++ b/src/utils/index.js
@@ -32,3 +32,31 @@ export function debounce(func, wait, immediate) {
     return result;
   };
 }
+
+/**
+ * @param {date} time 需要转换的时间
+ * @param {String} fmt 需要转换的格式 如 yyyy-MM-dd、yyyy-MM-dd HH:mm:ss
+ */
+export function formatTime(time, fmt) {
+  if (!time) return ''
+  else {
+    const date = new Date(time)
+    const o = {
+      'M+': date.getMonth() + 1,
+      'd+': date.getDate(),
+      'H+': date.getHours(),
+      'm+': date.getMinutes(),
+      's+': date.getSeconds(),
+      'q+': Math.floor((date.getMonth() + 3) / 3),
+      'S': date.getMilliseconds()
+    }
+    if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length))
+    for (const k in o) {
+      if (new RegExp('(' + k + ')').test(fmt)) {
+        fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? (o[k]) : ((
+          '00' + o[k]).substr(('' + o[k]).length)))
+      }
+    }
+    return fmt
+  }
+}
diff --git a/src/views/center.vue b/src/views/center.vue
index 6d2d841..9283c7c 100644
--- a/src/views/center.vue
+++ b/src/views/center.vue
@@ -37,7 +37,7 @@
 import centerChart from "@/components/echart/center/centerChartRate";
 
 export default {
-  data() {
+  data () {
     return {
       titleItem: [
         {
@@ -112,20 +112,27 @@ export default {
             value: 80
           },
           {
-            name: "新乡",
+            name: "新乡2",
             value: 80
           },
           {
-            name: "新乡",
+            name: "新乡3",
             value: 80
           },
           {
-            name: "新乡",
+            name: "新乡4",
             value: 80
-          }
+          },
+          {
+            name: "新乡5",
+            value: 80
+          },
+          {
+            name: "新乡6",
+            value: 80
+          },
         ],
-        waitTime: 4000,
-        carousel: "page",
+        carousel: "single",
         unit: "份"
       },
       water: {
diff --git a/src/views/index.vue b/src/views/index.vue
index ea4113c..092f8e1 100644
--- a/src/views/index.vue
+++ b/src/views/index.vue
@@ -48,7 +48,7 @@
               style="width: 6.25rem; background-color: #0f1325; text-align: right;"
             >
               <span class="react-after"></span>
-              <span class="text">2020年03月16日 周一 12:00</span>
+              <span class="text">{{dateYear}} {{dateWeek}} {{dateDay}}</span>
             </div>
           </div>
         </div>
@@ -97,6 +97,7 @@
 </template>
 
 <script>
+import { formatTime } from '../utils/index.js'
 import centerLeft1 from "./centerLeft1";
 import centerLeft2 from "./centerLeft2";
 import centerRight1 from "./centerRight1";
@@ -105,9 +106,13 @@ import center from "./center";
 import bottomLeft from "./bottomLeft";
 import bottomRight from "./bottomRight";
 export default {
-  data() {
+  data () {
     return {
-      loading: true
+      loading: true,
+      dateDay: null,
+      dateYear: null,
+      dateWeek: null,
+      weekday: ["周日", "周一", "周二", "周三", "周四", "周五", "周六"],
     };
   },
   components: {
@@ -119,11 +124,19 @@ export default {
     bottomLeft,
     bottomRight
   },
-  mounted() {
+  mounted () {
+    this.timeFn();
     this.cancelLoading();
   },
   methods: {
-    cancelLoading() {
+    timeFn () {
+      setInterval(() => {
+        this.dateDay = formatTime(new Date(), 'HH: mm: ss');
+        this.dateYear = formatTime(new Date(), 'yyyy-MM-dd');
+        this.dateWeek = this.weekday[new Date().getDay()];
+      }, 1000)
+    },
+    cancelLoading () {
       setTimeout(() => {
         this.loading = false;
       }, 500);
@@ -133,5 +146,5 @@ export default {
 </script>
 
 <style lang="scss">
-@import "../assets/scss/index.scss";
+@import '../assets/scss/index.scss';
 </style>
\ No newline at end of file