From 013b122a969d82749c6b024c6ab03d19232c7178 Mon Sep 17 00:00:00 2001
From: dzl <786316265@qq.com>
Date: Fri, 5 Sep 2025 16:31:16 +0800
Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0=E5=85=AC=E5=91=8A=E5=AE=8C?=
 =?UTF-8?q?=E5=96=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/MainPage.vue | 55 ++++++++++++++++++++++++++++++++++++------
 1 file changed, 47 insertions(+), 8 deletions(-)

diff --git a/src/views/MainPage.vue b/src/views/MainPage.vue
index 47b9769..e998578 100644
--- a/src/views/MainPage.vue
+++ b/src/views/MainPage.vue
@@ -79,6 +79,7 @@
       :show-close="true"
       :close-on-click-modal="true"
       :close-on-press-escape="true"
+      @close="closeWelcomeDialog"
       center
       class="welcome-dialog"
     >
@@ -86,10 +87,10 @@
         <div class="welcome-icon">🎉</div>
         <h3>融汇通更新</h3>
         <div class="welcome-features">
-          <div class="announcements-container" v-if="announcements.length > 0">
+          <div class="announcements-container" v-if="unreadAnnouncements.length > 0">
             <div 
               class="announcement-item" 
-              v-for="announcement in announcements" 
+              v-for="announcement in unreadAnnouncements" 
               :key="announcement.id"
             >
               <div class="announcement-header">
@@ -104,13 +105,13 @@
             </div>
           </div>
           <div v-else class="no-announcements">
-            <span>暂无更新信息</span>
+            <span>暂无未读更新信息</span>
           </div>
         </div>
       </div>
       <template #footer>
         <span class="dialog-footer">
-          <el-button @click="showWelcomeDialog = false">关闭</el-button>
+          <el-button @click="closeWelcomeDialog">已读</el-button>
         </span>
       </template>
     </el-dialog>
@@ -197,6 +198,16 @@ export default {
       }
     };
 
+    // 计算未读公告
+    const unreadAnnouncements = computed(() => {
+      return announcements.value.filter(announcement => !announcement.is_read);
+    });
+
+    // 计算是否应该显示弹窗
+    const shouldShowDialog = computed(() => {
+      return unreadAnnouncements.value.length > 0;
+    });
+
     const getUpdateNotice = async () => {
       try {
         const response = await api.get('/announcements');
@@ -217,17 +228,19 @@ export default {
     // 定时刷新积分
     let refreshInterval;
 
-    onMounted(() => {
+    onMounted(async () => {
       getUserPoints();
 
-      getUpdateNotice();
+      await getUpdateNotice();
 
       // 每5分钟刷新一次积分（可根据需求调整时间）
       refreshInterval = setInterval(getUserPoints, 5 * 60 * 1000);
       
-      // 显示欢迎弹窗
+      // 根据是否有未读公告决定是否显示欢迎弹窗
       setTimeout(() => {
-        showWelcomeDialog.value = true;
+        if (shouldShowDialog.value) {
+          showWelcomeDialog.value = true;
+        }
       }, 500); // 延迟500ms显示，让页面先加载完成
     });
 
@@ -247,6 +260,28 @@ export default {
       });
     };
 
+    // 标记公告为已读
+    const markAnnouncementAsRead = async (announcementId) => {
+      try {
+        await api.post(`/announcements/${announcementId}/read`);
+        console.log(`公告 ${announcementId} 已标记为已读`);
+      } catch (error) {
+        console.error('标记公告已读失败:', error);
+        ElMessage.error('标记公告已读失败，请稍后重试');
+      }
+    };
+
+    // 关闭欢迎弹窗并标记所有未读公告为已读
+    const closeWelcomeDialog = async () => {
+      await markAllAnnouncementsAsRead();
+      showWelcomeDialog.value = false;
+    };
+
+    // 点击已读按钮
+    const handleReadClick = () => {
+      showWelcomeDialog.value = false;
+    };
+
     return {
       modules: [Autoplay, Pagination],
       userPoints,
@@ -257,8 +292,12 @@ export default {
       showWelcomeDialog,
       updateNotice,
       announcements,
+      unreadAnnouncements,
+      shouldShowDialog,
       formatDate,
       getUserPoints, // 如果需要外部调用可以暴露
+      closeWelcomeDialog,
+      handleReadClick,
     };
   },
 };