群消息已读反馈，消息状态组件抽离

pages/im/group/chat.vue

@@ -74,8 +74,17 @@
                     })
                 }
             })
+            // 群已读回执
             uni.$on('onReceiptResponse', (msg) => {
-                console.log('远端消息已读，本地获取有几个人读了', msg);
+                if (msg.targetId == this.targetId) {
+                    this.messages = this.messages.map(item => {
+                        if (msg.messageId == item.messageId) {
+                            return msg
+                        } else {
+                            return item
+                        }
+                    })
+                }
             })
             // 清理聊天记录
             uni.$once('cleanGroupMessage', this.getMessageList)
@@ -127,9 +136,17 @@
                     true,
                     (messages) => {
                         console.log('获取消息列表', messages);
-                        RongIMLib.sendReadReceiptResponse(3, this.targetId, messages, (res) => {
-                            console.error('发送群聊已读回执成功', res);
-                        })
+                        const msgs = messages.filter(item => item.receivedStatus == 0)
+                        console.log('未读消息', msgs);
+                        if (msgs.length) {
+                            RongIMLib.sendReadReceiptResponse(3, this.targetId, msgs, (res) => {
+                                console.error('发送群聊已读回执成功', res);
+                                msgs.map(item => {
+                                    RongIMLib.setMessageReceivedStatus(item.messageId, 1)
+                                })
+                            })
+                        }
+
                         this.messages = messages
                         this.scrollBottom()
                     })
@@ -144,10 +161,10 @@
                     im.setNotifyBadge()
                 }
             }
-        },
-        onHide() {
-            // console.log(JSON.stringify(this.$refs))
-            this.$refs.voice.stopPlay()
+        },
+        onHide() {
+            // console.log(JSON.stringify(this.$refs))
+            this.$refs.voice.stopPlay()
         }
     }
 </script>