From d6086fc72889031bbccd3db025843b4e07a9a988 Mon Sep 17 00:00:00 2001
From: xuhuajiao <13476289682@163.com>
Date: Fri, 16 Sep 2022 16:49:00 +0800
Subject: [PATCH] =?UTF-8?q?=E6=97=A5=E6=9C=9F/=E5=A4=A9=E6=B0=94=E9=A2=84?=
 =?UTF-8?q?=E6=8A=A5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/styles/index.scss |  3 ++-
 src/utils/index.js           | 12 ++++++++++++
 src/views/header/index.vue   | 13 +++++++++++--
 3 files changed, 25 insertions(+), 3 deletions(-)

diff --git a/src/assets/styles/index.scss b/src/assets/styles/index.scss
index 68b1cfc..de2f5c6 100644
--- a/src/assets/styles/index.scss
+++ b/src/assets/styles/index.scss
@@ -36,7 +36,8 @@
     top: 0.65rem;
   }
   .header-weather {
-    left: 1.25rem;
+    left: 1rem;
+    // top: 0.32rem;
   }
   .header-date {
     right: 0.375rem;
diff --git a/src/utils/index.js b/src/utils/index.js
index c7d190d..3356ab6 100644
--- a/src/utils/index.js
+++ b/src/utils/index.js
@@ -32,3 +32,15 @@ export function debounce(func, wait, immediate) {
     return result
   }
 }
+
+// 获取当前日期时间
+export function getCurrentTime() {
+  const yy = new Date().getFullYear()
+  const mm = new Date().getMonth() + 1
+  const dd = new Date().getDate()
+  const hh = new Date().getHours()
+  const mf = new Date().getMinutes() < 10 ? '0' + new Date().getMinutes() : new Date().getMinutes()
+  const ss = new Date().getSeconds() < 10 ? '0' + new Date().getSeconds() : new Date().getSeconds()
+  const time = yy + '年' + mm + '月' + dd + '日 ' + hh + ':' + mf + ':' + ss
+  return time
+}
diff --git a/src/views/header/index.vue b/src/views/header/index.vue
index 2a99eb4..4d989b0 100644
--- a/src/views/header/index.vue
+++ b/src/views/header/index.vue
@@ -1,19 +1,28 @@
 <template>
   <div class="header-container">
     <div class="header-title"><h2>东西湖区图书馆</h2></div>
-    <div class="header-text header-weather">晴 20℃~30℃</div>
-    <div class="header-text header-date">2022年9月21日 14:25:30</div>
+    <div class="header-text header-weather">
+      <!-- 天气api: https://www.tianqi.com/plugin -->
+      <iframe id="weather" width="210" scrolling="no" height="30" frameborder="0" allowtransparency="true" src="https://i.tianqi.com?c=code&id=34&color=%23FFFFFF&icon=1&py=wuhan&site=24" />
+    </div>
+    <div class="header-text header-date">{{ nowDate }}</div>
   </div>
+
 </template>
 
 <script>
+import { getCurrentTime } from '@/utils/index'
 export default {
   name: 'Header',
   data() {
     return {
+      nowDate: ''
     }
   },
   created() {
+    this.timer = setInterval(() => {
+      this.nowDate = getCurrentTime()
+    }, 1000)
   },
   mounted() {
   },