From 59a00a994a797fc7ec9d12ff8ed8771921d1d1cc Mon Sep 17 00:00:00 2001
From: lenghui <h280650@163.com>
Date: Sat, 30 Nov 2024 11:21:54 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B0=83=E6=95=B4=E6=95=B0=E6=8D=AE=E6=A0=BC?=
 =?UTF-8?q?=E5=BC=8F=EF=BC=8C=E8=AE=A1=E7=AE=97=E6=97=A5=E6=9C=9F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 vueHomilyLink/src/views/LiveView.vue | 81 ++++++++++++++++++++++--------------
 1 file changed, 50 insertions(+), 31 deletions(-)

diff --git a/vueHomilyLink/src/views/LiveView.vue b/vueHomilyLink/src/views/LiveView.vue
index 0e82959..24d4104 100644
--- a/vueHomilyLink/src/views/LiveView.vue
+++ b/vueHomilyLink/src/views/LiveView.vue
@@ -10,8 +10,8 @@
                     即将开播</div>
                 <div 
                     v-if="live.status == 1"
-                    style="position:absolute; z-index:2;text-align:center;top:60%;left:50%;transform:translate(-50%,-50%);color:#ffffffaf;font-size:15px;">
-                    明天{{ live.startTime.slice(11, 16)}}开播</div>
+                    style="position:absolute; z-index:2;text-align:center;top:60%;left:50%;transform:translate(-50%,-50%);color:#ffffffaf;font-size:15px;width: 120px;">
+                    {{getDateDay(live.startTime)}}  {{ live.startTime.slice(11, 16)}}开播</div>
             </div>
             <div class="card-content">
                 <div class="card-title">{{ live.liveName }}</div>
@@ -22,7 +22,7 @@
                     <!-- 用户昵称，与头像同行显示 -->
                     <div class="card-info">{{ live.user.userName }}</div>
                     <!-- 预约按钮,如果预约过了，按钮变灰色，文字变灰色，按钮文字为“已预约” -->
-                    <a v-if="!isBooking(live.id)" href="#" class="card-button" @click="booking(live.id, live.user.userId)">预约</a>
+                    <a v-if="live.reservation == 0" href="#" class="card-button" @click="booking(live.id, live.user.userId)">预约</a>
                     <a v-else href="#" class="card-button" style="background-color: #ccc;">已预约</a>
                 </div>
             </div>
@@ -51,8 +51,9 @@ function getLive() {
                 avatar: "src/assets/live.jpg"
             },
             liveName: "猎庄之顶级波段",
-            startTime: "2023-05-01 09:55",
-            status: 0
+            startTime: "2024-12-01 09:55",
+            reservation: 1, //0表示未预约，1表示已预约
+            status: 1 //0表示未开播，1表示已开播
         },
         {
             id: 2,
@@ -63,8 +64,9 @@ function getLive() {
                 avatar: "src/assets/live.jpg"
             },
             liveName: "猎庄之顶级波段",
-            startTime: "2023-05-01 09:55",
-            status: 0
+            startTime: "2024-12-01 09:55",
+            reservation: 1, //0表示未预约，1表示已预约
+            status: 1
         },
         {
             id: 3,
@@ -75,7 +77,8 @@ function getLive() {
                 avatar: "src/assets/live.jpg"
             },
             liveName: "猎庄之顶级波段",
-            startTime: "2023-05-01 09:55",
+            startTime: "2024-11-30 12:55",
+            reservation: 1, //0表示未预约，1表示已预约
             status: 1
         },
         {
@@ -87,7 +90,8 @@ function getLive() {
                 avatar: "src/assets/live.jpg"
             },
             liveName: "猎庄之顶级波段",
-            startTime: "2023-05-01 09:55",
+            startTime: "2024-12-30 12:55",
+            reservation: 0, //0表示未预约，1表示已预约
             status: 1
         },
         {
@@ -99,37 +103,52 @@ function getLive() {
                 avatar: "src/assets/live.jpg"
             },
             liveName: "猎庄之顶级波段",
-            startTime: "2023-05-01 09:55",
-            status: 1
+            startTime: "2024-12-30 12:55",
+            reservation: 0, //0表示未预约，1表示已预约
+            status: 1,
         }
     ]
 }
 getLive();
 
-//获取用户信息
-const userInfo = ref([]);
-function getUserInfo() {
-    userInfo.value = {
-        userId: 1,
-        userName: "冷辉老师",
-        avatar: "src/assets/live.jpg",
-        //预约信息
-        reservationList: [1,2,3]
+// 判断开播日期与当前时间的关系（今天、明天、其他）
+function getDateDay(startTime) {
+    const now = new Date();
+    const start = new Date(startTime);
+    const oneDay = 24 * 60 * 60 * 1000; // 一天的毫秒数
+    if (now.toDateString() == start.toDateString()) {
+        return "今天";
+    } else if (now.getTime() + oneDay >= start.getTime()) {
+        return "明天";
+    } else {
+        return startTime.slice(5, 10);
     }
 }
-getUserInfo();
 
-console.log(userInfo.value);
+// //获取用户信息
+// const userInfo = ref([]);
+// function getUserInfo() {
+//     userInfo.value = {
+//         userId: 1,
+//         userName: "冷辉老师",
+//         avatar: "src/assets/live.jpg",
+//         //预约信息
+//         reservationList: [1,2,3]
+//     }
+// }
+// getUserInfo();
 
-/* 判断预约状态 */
-function isBooking(liveId) {
-    for (let i = 0; i < userInfo.value.reservationList.length; i++) {
-        if (userInfo.value.reservationList[i] == liveId) {
-            return true;
-        }
-    }
-    return false;
-}
+// console.log(userInfo.value);
+
+// /* 判断预约状态 */
+// function isBooking(liveId) {
+//     for (let i = 0; i < userInfo.value.reservationList.length; i++) {
+//         if (userInfo.value.reservationList[i] == liveId) {
+//             return true;
+//         }
+//     }
+//     return false;
+// }