update

src/components/app-header/components/system-notify/index.vue

@@ -47,7 +47,7 @@
         <div class="pxline"></div>
         <div class="flex_right_pain_body">
           <message-card
-            v-for="message in messageList.filter(m => m.status === messageStatus)"
+            v-for="message in (messageStatus === 1 ? messageList : hisMessageList)"
             :key="message.id"
             :message="message"
             @mark-read="markMessageAsReaded"
@@ -58,7 +58,7 @@
           v-if="messageStatus === 1"
         >
           <el-button
-            v-if="messageList.filter(m => m.status === 2).length"
+            v-if="hisMessageList.length"
             class="bottom-button"
             @click.stop="messageStatus = 2"
           >查看历史通知</el-button>
@@ -93,6 +93,7 @@ export default {
       companyId: sessionStorage.companyId,
       panelVisible: false,
       messageList: [],
+      hisMessageList: [],
       messageStatus: 1,
       tickIns: null,
     };
@@ -100,7 +101,8 @@ export default {
   mounted() {
     // const userInfo = await getUserInfo(this.$store.state.accountId);
     // this.user = userInfo;
-    this.getMessageList();
+    this.getMessageList(1);
+    this.getMessageList(2);
   },
   destroyed() {
     if (this.tickIns) {
@@ -115,6 +117,11 @@ export default {
         document.body.removeChild(mask);
       }
     },
+    messageStatus(v) {
+      if(v === 2) {
+        this.getMessageList(2);
+      }
+    },
     yiyunAnimated(val) {
       if (val) {
         let mask = document.querySelector(".notify-mask");
@@ -131,18 +138,20 @@ export default {
     closePanel() {
       this.panelVisible = false;
     },
-    async getMessageList() {
+    async getMessageList(status = 1) {
       const res = await this.$fetchApi(
         "lockingmsg/queryLockingMsgListByFilter",
-        { userId: this.userId }
+        { userId: this.userId, status }
       );
       wrapErrorHint(res);
       if (res.Code === 0) {
         const messageList = (res.Data || []).map(firstCharToLowerCase);
-        this.messageList = messageList;
+        // this.messageList = messageList;
+        this[status === 1 ? 'messageList' : 'hisMessageList'] = messageList;
+      }
+      if(status === 1) {
+        this.tickIns = setTimeout(this.getMessageList, 30000);
       }
-
-      this.tickIns = setTimeout(this.getMessageList, 30000);
     },
     async markMessageAsReaded(message) {
       message.status = 2;