From 5a4d00a7883b0822e824c6ceeb8115286a754a73 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=A9=99=E5=AD=90?= <454313500@qq.com>
Date: Wed, 7 Aug 2024 00:03:07 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E8=A1=A5=E5=85=85=E5=89=8D=E7=AB=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 Yi.Bbs.Vue3/src/hubs/bbsNoticeHub.js |  4 +-
 Yi.Bbs.Vue3/src/layout/AppHeader.vue | 74 +++++++++++++++++-----------
 2 files changed, 47 insertions(+), 31 deletions(-)

diff --git a/Yi.Bbs.Vue3/src/hubs/bbsNoticeHub.js b/Yi.Bbs.Vue3/src/hubs/bbsNoticeHub.js
index 88d06097..f266a69b 100644
--- a/Yi.Bbs.Vue3/src/hubs/bbsNoticeHub.js
+++ b/Yi.Bbs.Vue3/src/hubs/bbsNoticeHub.js
@@ -4,11 +4,11 @@ import { dayjs } from 'element-plus'
 const receiveMsg=(connection)=> {
 
   const noticeStore = useNoticeStore();
-    connection.on("Personal", (message) => {
+    connection.on("Personal", (message,creationTime) => {
       noticeStore.addNotice({
         message:message,
         isRead:false,
-       creationTime:dayjs().format()
+       creationTime
       });
       });
   };
diff --git a/Yi.Bbs.Vue3/src/layout/AppHeader.vue b/Yi.Bbs.Vue3/src/layout/AppHeader.vue
index 79fb90af..6b0edc98 100644
--- a/Yi.Bbs.Vue3/src/layout/AppHeader.vue
+++ b/Yi.Bbs.Vue3/src/layout/AppHeader.vue
@@ -11,9 +11,7 @@
         <el-menu-item index="1" @click="enterIndex">主页</el-menu-item>
 
         <el-menu-item index="2" @click="enterStart"
-        style="color: red;font-weight: bolder;font-size: large;"
-        
-        >开始</el-menu-item>
+          style="color: red;font-weight: bolder;font-size: large;">开始</el-menu-item>
 
         <el-sub-menu index="3">
           <template #title>学习</template>
@@ -61,7 +59,7 @@
 
       <div class="notice">
         <el-dropdown trigger="click" :max-height="500">
-          <el-badge v-if="noticeStore.noticeForNoReadCount>0" :value="noticeStore.noticeForNoReadCount">
+          <el-badge v-if="noticeStore.noticeForNoReadCount > 0" :value="noticeStore.noticeForNoReadCount">
             <el-button type="primary">
               <el-icon :size="15">
                 <Bell />
@@ -69,11 +67,11 @@
             </el-button>
           </el-badge>
 
-         <el-button v-else="noticeStore.noticeForNoReadCount" type="primary">
-              <el-icon :size="15">
-                <Bell />
-              </el-icon>
-            </el-button>
+          <el-button v-else="noticeStore.noticeForNoReadCount" type="primary">
+            <el-icon :size="15">
+              <Bell />
+            </el-icon>
+          </el-button>
 
 
           <template #dropdown>
@@ -85,19 +83,27 @@
               </el-dropdown-item>
 
 
-              <el-dropdown-item v-for="(item, index) in noticeList" :key="index">
-                <div v-if="item.isRead" class="notice-msg" v-html="item.message"></div>
+              <el-dropdown-item class="notice-item" v-for="(item, index) in noticeList" :key="index">
+
+
+
+                <div v-if="item.isRead" class="notice-msg" style="background-color: #f7f7f7;">
+                  <span class="notice-time">[已读]通知时间： {{ dayjs(item.creationTime).format('YYYY年M月D日 HH时mm分ss秒') }}</span>
+                  <div v-html="item.message"></div>
+                </div>
 
                 <el-badge is-dot v-else >
+
+                  <span class="notice-time">[未读]通知时间： {{ dayjs(item.creationTime).format('YYYY年M月D日 HH时mm分ss秒') }}</span>
                   <div class="notice-msg" v-html="item.message"></div>
                 </el-badge>
-         
-           
+
+
               </el-dropdown-item>
 
 
 
-     
+
             </el-dropdown-menu>
           </template>
 
@@ -118,6 +124,7 @@
   </div>
 </template>
 <script setup>
+import { dayjs } from 'element-plus'
 import { Bell } from '@element-plus/icons-vue'
 import AvatarInfo from "@/components/AvatarInfo.vue";
 import { computed, onMounted, ref } from "vue";
@@ -141,15 +148,15 @@ const userStore = useUserStore();
 const { money } = storeToRefs(userStore)
 const activeIndex = ref("1");
 const searchText = ref("");
-const noticeForNoReadCount=computed(()=>{
- return noticeList.value.filter(x => x.isRead ==false).length;
+const noticeForNoReadCount = computed(() => {
+  return noticeList.value.filter(x => x.isRead == false).length;
 })
 //加载初始化离线消息
 onMounted(async () => {
   await fetchNoticeData();
 })
 const fetchNoticeData = async () => {
-  const { data } = await getNoticeList({maxResultCount:20});
+  const { data } = await getNoticeList({ maxResultCount: 20 });
   noticeStore.setNotices(data.items);
 }
 
@@ -200,18 +207,18 @@ const handleGithubClick = () => {
   window.open("https://github.com/ccnetcore/Yi.Abp.Admin");
 };
 ///一键已读
-const hanldeReadClick=async ()=>{
+const hanldeReadClick = async () => {
 
- await noticeRead();
- await fetchNoticeData();
+  await noticeRead();
+  await fetchNoticeData();
 
- ElMessage({
-        message: `全部已读`,
-        type: "success",
-      });
+  ElMessage({
+    message: `全部已读`,
+    type: "success",
+  });
 }
 
-const enterStart=()=>{
+const enterStart = () => {
   router.push("/start");
 }
 
@@ -219,6 +226,13 @@ const enterStart=()=>{
 
 
 <style scoped lang="scss">
+.notice-item{
+  padding: 10px 0px 30px 20px;
+  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
+}
+.notice-time{
+  font-size: larger;
+}
 .money {
 
   font-size: small;
@@ -302,11 +316,13 @@ const enterStart=()=>{
 
 .notice {
   margin: 0 5px;
+
   &-oper {
-display: flex;
-justify-content: space-between;
-width: 100%;
-}
+    display: flex;
+    justify-content: space-between;
+    width: 100%;
+  }
+
   &-msg {
     white-space: wrap !important;
     width: 400px;