yanghao há 1 semana atrás
pai
commit
46275a6cb4
3 ficheiros alterados com 203 adições e 29 exclusões
  1. 14 0
      src/api/user.ts
  2. 2 0
      src/assets/style/main.css
  3. 187 29
      src/components/home/header.vue

+ 14 - 0
src/api/user.ts

@@ -184,6 +184,20 @@ export const markOAMessageAsRead = async (id) => {
   });
 };
 
+// SRM消息通知
+export const getSRMNotifyMessages = async (id) => {
+  return await request.get({
+    url: "/admin-api/portal/todo/srm/notice?workcode=" + id,
+  });
+};
+
+// SRM消息列表
+export const getSRMNotifyMessageList = async (id) => {
+  return await request.get({
+    url: "/admin-api/portal/todo/srm/notice/self?workcode=" + id,
+  });
+};
+
 // 首页公告
 export const getNotices = async (params) => {
   return await request.get({

+ 2 - 0
src/assets/style/main.css

@@ -10,6 +10,7 @@
   --bg-tab:#e4e7ed;
   --tab-text: #303133;
   --text-primary: #303133;
+  --text-primary-down: #dcdfe6;
   --text-secondary: #606266;
   --text-tertiary: #909399;
   --border-color: #dcdfe6;
@@ -37,6 +38,7 @@
   --bg-tab:#070e24;
   --tab-text: rgba(220, 229, 255, 0.78);
   --text-primary: #eaf1ff;
+  --text-primary-down: #303133;
   --text-secondary: #c7ced9;
   --text-tertiary: #869ac2;
   --border-color: #262360;

+ 187 - 29
src/components/home/header.vue

@@ -149,7 +149,7 @@
                               v-if="task.status === '0'"
                               class="inline-block h-2 w-2 bg-[#f56c6c] rounded-full"
                             ></span>
-                            <span class="text-white/90 pl-2">{{
+                            <span class="pl-2 text-var(--tab-text)!">{{
                               task.title
                             }}</span>
                           </p>
@@ -196,7 +196,56 @@
                           <p class="message-title flex items-center gap-5">
                             <span
                               v-if="item.status === '0'"
-                              class="w-2 h-2 bg-[#f56c6c] rounded-full"
+                              class="w-2 h-2 bg-[#f56c6c] rounded-full text-var(--tab-text)!"
+                            ></span
+                            >{{ item.contentMajor }}
+                          </p>
+                          <p class="message-desc">
+                            {{ timestampToDateTime(item.createTime) }}
+                          </p>
+                        </div>
+                      </div>
+                      <div v-if="!messages.length" class="no-messages">
+                        暂无新消息
+                      </div>
+                    </div>
+                  </el-tab-pane>
+
+                  <!-- SRM消息 -->
+                  <el-tab-pane label="SRM" name="srm">
+                    <template #label>
+                      <span class="custom-tabs-label">
+                        <span>SRM</span>
+                        <el-badge
+                          :value="unreadSRMCount"
+                          class="item ml-1"
+                          v-if="hasUnreadSRMCount"
+                        ></el-badge>
+                      </span>
+                    </template>
+                    <div class="tab-content">
+                      <!-- 消息中心内容 -->
+                      <div>
+                        <span
+                          v-if="hasUnreadSRMCount"
+                          class="cursor-pointer text-blue-500"
+                          @click="markAllAsRead"
+                          >全部标为已读</span
+                        >
+                      </div>
+                      <div
+                        class="message-item"
+                        v-for="(item, index) in srmMessageList"
+                        :key="index"
+                      >
+                        <div class="message-icon"></div>
+                        <div class="message-text">
+                          <!-- 未读就显示小红点 -->
+
+                          <p class="message-title flex items-center gap-5">
+                            <span
+                              v-if="item.status === '0'"
+                              class="w-2 h-2 bg-[#f56c6c] rounded-full text-var(--tab-text)!"
                             ></span
                             >{{ item.contentMajor }}
                           </p>
@@ -314,9 +363,9 @@
                           <p class="task-title">
                             <span
                               v-if="task.status === '0'"
-                              class="inline-block h-2 w-2 bg-[#f56c6c] rounded-full text-white/90!"
+                              class="inline-block h-2 w-2 bg-[#f56c6c] rounded-full text-var(--tab-text)!"
                             ></span>
-                            {{ task.title }}666
+                            {{ task.title }}
                           </p>
                           <p class="message-desc">
                             <span>{{ task.oaCreateTime }}</span>
@@ -361,7 +410,55 @@
                           <p class="message-title flex items-center gap-5">
                             <span
                               v-if="item.status === '0'"
-                              class="w-2 h-2 bg-[#f56c6c] rounded-full text-white/90"
+                              class="w-2 h-2 bg-[#f56c6c] rounded-full text-var(--tab-text)!"
+                            ></span
+                            >{{ item.contentMajor }}
+                          </p>
+                          <p class="message-desc">
+                            {{ timestampToDateTime(item.createTime) }}
+                          </p>
+                        </div>
+                      </div>
+                      <div v-if="!messages.length" class="no-messages">
+                        暂无新消息
+                      </div>
+                    </div>
+                  </el-tab-pane>
+
+                  <el-tab-pane label="SRM" name="srm">
+                    <template #label>
+                      <span class="custom-tabs-label">
+                        <span>SRM</span>
+                        <el-badge
+                          :value="unreadSRMCount"
+                          class="item ml-1"
+                          v-if="hasUnreadSRMCount"
+                        ></el-badge>
+                      </span>
+                    </template>
+                    <div class="tab-content">
+                      <!-- 消息中心内容 -->
+                      <div>
+                        <span
+                          v-if="hasUnreadSRMCount"
+                          class="cursor-pointer text-blue-500"
+                          @click="markAllAsRead"
+                          >全部标为已读</span
+                        >
+                      </div>
+                      <div
+                        class="message-item"
+                        v-for="(item, index) in srmMessageList"
+                        :key="index"
+                      >
+                        <div class="message-icon"></div>
+                        <div class="message-text">
+                          <!-- 未读就显示小红点 -->
+
+                          <p class="message-title flex items-center gap-5">
+                            <span
+                              v-if="item.status === '0'"
+                              class="w-2 h-2 bg-[#f56c6c] rounded-full text-var(--tab-text)!"
                             ></span
                             >{{ item.contentMajor }}
                           </p>
@@ -507,6 +604,8 @@ import {
   getOANotifyMessages,
   getOANotifyMessageList,
   markOAMessageAsRead,
+  getSRMNotifyMessages,
+  getSRMNotifyMessageList,
 } from "@api/user";
 
 import {
@@ -546,9 +645,20 @@ const unreadMessageCount = computed(() => {
 const oaUnreadCount = computed(() => {
   return oaMessagesList.value.filter((msg) => msg.status === "0").length;
 });
+
 // oa未读
 const oaMessagesList = ref([]);
+let srmMessageList = ref([]);
 
+// srm未读
+const unreadSRMCount = computed(() => {
+  return srmMessageList.value.filter((msg) => msg.status === "0").length;
+});
+
+// srm是否有未读消息
+const hasUnreadSRMCount = computed(() => {
+  return srmMessageList.value.some((msg) => msg.status === "0");
+});
 const unreadCount = ref(0); // 未读消息数量
 const getUnreadCount = async () => {
   if (!getAccessToken()) {
@@ -564,35 +674,79 @@ let unreadTimer: ReturnType<typeof setInterval> | undefined;
 onMounted(async () => {
   if (isLoggedIn.value) {
     getUnreadCount();
-    await getNotifyMessages(userStore.getUser.username);
-    const messageList = await getNotifyMessageList(userStore.getUser.username);
-    messages.value = messageList.filter((msg: any) => msg.status === "0");
+    try {
+      await getNotifyMessages(userStore.getUser.username);
+      const messageList = await getNotifyMessageList(
+        userStore.getUser.username,
+      );
+      messages.value = messageList.filter((msg) => msg.status === "0");
+    } catch (error) {
+      messages.value = [];
+    }
 
     // oa消息
-    await getOANotifyMessages(userStore.getUser.username);
-    const oaMessageList = await getOANotifyMessageList(
-      userStore.getUser.username,
-    );
-    oaMessagesList.value = oaMessageList.filter((msg) => msg.status === "0");
+    try {
+      await getOANotifyMessages(userStore.getUser.username);
+      const oaMessageList = await getOANotifyMessageList(
+        userStore.getUser.username,
+      );
+      oaMessagesList.value = oaMessageList.filter((msg) => msg.status === "0");
+    } catch (error) {
+      oaMessagesList.value = [];
+    }
+
+    try {
+      // srm消息
+      await getSRMNotifyMessages(userStore.getUser.username);
+      const srmMessageLists = await getSRMNotifyMessageList(
+        userStore.getUser.username,
+      );
+      srmMessageList.value = srmMessageLists.filter(
+        (msg) => msg.status === "0",
+      );
+    } catch (error) {
+      srmMessageList.value = [];
+    }
   }
 
   messageTimer = setInterval(
     async () => {
       if (isLoggedIn.value) {
-        await getNotifyMessages(userStore.getUser.username);
-        const messageList = await getNotifyMessageList(
-          userStore.getUser.username,
-        );
-        messages.value = messageList.filter((msg: any) => msg.status === "0");
+        try {
+          await getNotifyMessages(userStore.getUser.username);
+          const messageList = await getNotifyMessageList(
+            userStore.getUser.username,
+          );
+          messages.value = messageList.filter((msg: any) => msg.status === "0");
+        } catch (error) {
+          messages.value = [];
+        }
 
         // oa消息
-        await getOANotifyMessages(userStore.getUser.username);
-        const oaMessageList = await getOANotifyMessageList(
-          userStore.getUser.username,
-        );
-        oaMessagesList.value = oaMessageList.filter(
-          (msg: any) => msg.status === "0",
-        );
+        try {
+          await getOANotifyMessages(userStore.getUser.username);
+          const oaMessageList = await getOANotifyMessageList(
+            userStore.getUser.username,
+          );
+          oaMessagesList.value = oaMessageList.filter(
+            (msg: any) => msg.status === "0",
+          );
+        } catch (error) {
+          oaMessagesList.value = [];
+        }
+
+        // srm消息
+        try {
+          await getSRMNotifyMessages(userStore.getUser.username);
+          const srmMessageLists = await getSRMNotifyMessageList(
+            userStore.getUser.username,
+          );
+          srmMessageList.value = srmMessageLists.filter(
+            (msg: any) => msg.status === "0",
+          );
+        } catch (error) {
+          srmMessageList.value = [];
+        }
       }
     },
     1000 * 60 * 5,
@@ -741,6 +895,10 @@ const onUserCommand = async (command: string) => {
   }
 }
 
+.msg-title {
+  color: var(--text-primary-down) !important;
+}
+
 .notification-dropdown {
   width: 400px !important;
   max-height: 500px;
@@ -782,7 +940,7 @@ const onUserCommand = async (command: string) => {
 
 .message-title {
   font-weight: 500;
-  color: #303133;
+  /* color: #303133; */
   margin-bottom: 4px;
 }
 
@@ -824,7 +982,7 @@ const onUserCommand = async (command: string) => {
 
 .task-title {
   font-weight: 500;
-  color: #303133;
+  /* color: #303133; */
   margin-bottom: 4px;
 }
 
@@ -937,12 +1095,12 @@ const onUserCommand = async (command: string) => {
   max-height: 500px;
   overflow: hidden;
   border: 1px solid rgba(109, 137, 213, 0.18);
-  background: #081225;
+  background: var(--bg-card);
 }
 
 /* 修改 Tab 标签文字颜色 */
 :deep(.el-tabs__item) {
-  color: #b4bbcb !important; /* 强制设置为白色 */
+  color: var(--text-primary) !important; /* 强制设置为白色 */
 }
 
 /* 选中状态的标签文字颜色(保持白色或根据需要调整) */