perf: 优化 WebSocket 消息

resources/assets/js/pages/manage/approve/index.vue

@@ -341,7 +341,7 @@ export default {
         }
     },
     computed: {
-        ...mapState(['wsMsg', 'userInfo', 'userIsAdmin', 'windowWidth', 'formOptions']),
+        ...mapState(['userInfo', 'userIsAdmin', 'windowWidth', 'formOptions']),
         departmentList() {
             let departmentNames = (this.userInfo.department_name || '').split(',');
             return (this.userInfo.department || []).map((h, index) => {
@@ -358,24 +358,6 @@ export default {
                 this.init()
             }
         },
-        wsMsg: {
-            handler(info) {
-                const {type, action, mode, data} = info;
-                switch (type) {
-                    case 'approve':
-                        if (action == 'unread') {
-                            this.tabsClick();
-                        }
-                        break;
-                    case 'dialog':
-                        if (mode == 'add' && data?.msg?.text?.indexOf('open-approve-details') != -1) {
-                            this.tabsClick();
-                        }
-                        break;
-                }
-            },
-            deep: true,
-        },
         addShow(val) {
             if (!val) {
                 this.addData.other = ""
@@ -396,6 +378,10 @@ export default {
     mounted() {
         this.tabsValue = "unread"
         this.init()
+        emitter.on('websocketMsg', this.onWebsocketMsg)
+    },
+    beforeDestroy() {
+        emitter.off('websocketMsg', this.onWebsocketMsg)
     },
     methods: {
         init() {
@@ -409,6 +395,23 @@ export default {
             this.isShowIcon = this.windowWidth < 515
         },
 
+        // 收到websocket消息
+        onWebsocketMsg(info) {
+            const {type, action, mode, data} = info;
+            switch (type) {
+                case 'approve':
+                    if (action == 'unread') {
+                        this.tabsClick();
+                    }
+                    break;
+                case 'dialog':
+                    if (mode == 'add' && data?.msg?.text?.indexOf('open-approve-details') != -1) {
+                        this.tabsClick();
+                    }
+                    break;
+            }
+        },
+
         // 获取流程列表
         getProcdefList() {
             return new Promise((resolve, reject) => {

resources/assets/js/pages/manage/components/DialogWrapper.vue

@@ -821,13 +821,13 @@ export default {
     },
 
     mounted() {
-        this.subMsgListener()
+        emitter.on('websocketMsg', this.onWebsocketMsg);
         emitter.on('dialogMsgChange', this.onMsgChange);
     },
 
     beforeDestroy() {
         emitter.off('dialogMsgChange', this.onMsgChange);
-        this.subMsgListener(true)
+        emitter.off('websocketMsg', this.onWebsocketMsg);
         this.generateUnreadData(this.dialogId)
         //
         if (!this.isChildComponent) {
@@ -1522,29 +1522,6 @@ export default {
             this.waitUnreadData.set(dialog_id, $A.getLastSameElements(ids, ens))
         },
 
-        /**
-         * 订阅消息（用于独立窗口）
-         * @param unsubscribe
-         */
-        subMsgListener(unsubscribe = false) {
-            if (!$A.isSubElectron) {
-                return
-            }
-            if (unsubscribe) {
-                this.$store.dispatch('websocketMsgListener', 'DialogWrapper')
-            } else {
-                this.$store.dispatch('websocketMsgListener', {
-                    name: 'DialogWrapper',
-                    callback: (msgDetail) => {
-                        const {type, mode, data} = msgDetail;
-                        if (type === 'dialog' && mode === 'add') {
-                            this.tempMsgs.push(data)
-                        }
-                    }
-                })
-            }
-        },
-
         /**
          * 发送数据处理
          * @param data
@@ -1920,6 +1897,20 @@ export default {
             }
         },
 
+        /**
+         * 收到websocket消息
+         * @param msgDetail
+         */
+        onWebsocketMsg(msgDetail) {
+            if (!$A.isSubElectron) {
+                return
+            }
+            const {type, mode, data} = msgDetail;
+            if (type === 'dialog' && mode === 'add') {
+                this.tempMsgs.push(data)
+            }
+        },
+
         /**
          * 消息变化处理
          * @param data

resources/assets/js/pages/manage/components/FileContent.vue

@@ -125,9 +125,9 @@
 </template>
 
 <script>
-import {mapState} from "vuex";
 import FileHistory from "./FileHistory";
 import IFrame from "./IFrame";
+import emitter from "../../../store/events";
 
 const VMEditor = () => import('../../../components/VMEditor/index');
 const VMPreview = () => import('../../../components/VMEditor/preview');
@@ -185,6 +185,7 @@ export default {
         this.edit = !this.windowPortrait
         document.addEventListener('keydown', this.keySave)
         window.addEventListener('message', this.handleOfficeMessage)
+        emitter.on('websocketMsg', this.onWebsocketMsg)
         //
         if (this.$isSubElectron) {
             window.__onBeforeUnload = () => {
@@ -207,6 +208,7 @@ export default {
     beforeDestroy() {
         document.removeEventListener('keydown', this.keySave)
         window.removeEventListener('message', this.handleOfficeMessage)
+        emitter.off('websocketMsg', this.onWebsocketMsg)
     },
 
     watch: {
@@ -231,46 +233,9 @@ export default {
                 this.$refs.historyTip.updatePopper()
             }
         },
-
-        wsMsg: {
-            handler(info) {
-                const {type, action, data} = info;
-                switch (type) {
-                    case 'path':
-                        if (data.path == '/single/file/' + this.fileId) {
-                            this.editUser = data.userids;
-                        }
-                        break;
-
-                    case 'file':
-                        if (action == 'content') {
-                            if (this.value && data.id == this.fileId) {
-                                const contents = [
-                                    '团队成员「' + info.nickname + '」更新了内容，',
-                                    '更新时间：' + $A.dayjs(info.time).format("YYYY-MM-DD HH:mm:ss") + '。',
-                                    '',
-                                    '点击【确定】加载最新内容。'
-                                ]
-                                $A.modalConfirm({
-                                    language: false,
-                                    title: this.$L("更新提示"),
-                                    content: contents.map(item => `<p>${item ? this.$L(item) : '&nbsp;'}</p>`).join(''),
-                                    onOk: () => {
-                                        this.getContent();
-                                    }
-                                });
-                            }
-                        }
-                        break;
-                }
-            },
-            deep: true,
-        },
     },
 
     computed: {
-        ...mapState(['wsMsg']),
-
         fileId() {
             return this.file.id || 0
         },
@@ -335,6 +300,38 @@ export default {
             }
         },
 
+        onWebsocketMsg(info) {
+            const {type, action, data} = info;
+            switch (type) {
+                case 'path':
+                    if (data.path == '/single/file/' + this.fileId) {
+                        this.editUser = data.userids;
+                    }
+                    break;
+
+                case 'file':
+                    if (action == 'content') {
+                        if (this.value && data.id == this.fileId) {
+                            const contents = [
+                                '团队成员「' + info.nickname + '」更新了内容，',
+                                '更新时间：' + $A.dayjs(info.time).format("YYYY-MM-DD HH:mm:ss") + '。',
+                                '',
+                                '点击【确定】加载最新内容。'
+                            ]
+                            $A.modalConfirm({
+                                language: false,
+                                title: this.$L("更新提示"),
+                                content: contents.map(item => `<p>${item ? this.$L(item) : '&nbsp;'}</p>`).join(''),
+                                onOk: () => {
+                                    this.getContent();
+                                }
+                            });
+                        }
+                    }
+                    break;
+            }
+        },
+
         onFrameLoad() {
             this.loadPreview = false;
         },

resources/assets/js/store/actions.js

@@ -1882,7 +1882,7 @@ export default {
         const index = state.dialogMsgs.findIndex(m => m.id == data.id)
         if (index !== -1) {
             const newData = $A.cloneJSON(state.dialogMsgs[index])
-            newData.reply_num--
+            newData.reply_num++
             commit("message/splice", {index, data: newData})
         }
     },
@@ -3979,16 +3979,10 @@ export default {
 
                 default:
                     msgId && dispatch("websocketSend", {type: 'receipt', msgId}).catch(_ => {});
-                    state.wsMsg = msgDetail;
+                    emitter.emit('websocketMsg', msgDetail);
-                    Object.values(state.wsListener).forEach((call) => {
+                    if ($A.isSubElectron) {
-                        if (typeof call === "function") {
+                        return
-                            try {
+                    }
-                                call(msgDetail);
-                            } catch (err) {
-                                wgLog && console.log("[WS] Callerr", err);
-                            }
-                        }
-                    });
                     switch (type) {
                         /**
                          * 聊天会话消息
@@ -4293,24 +4287,6 @@ export default {
         }, 1000);
     },
 
-    /**
-     * 监听消息
-     * @param state
-     * @param params {name, callback}
-     */
-    websocketMsgListener({state}, params) {
-        if (typeof params === "string") {
-            state.wsListener[params] && delete state.wsListener[params];
-            return;
-        }
-        const {name, callback} = params;
-        if (typeof callback === "function") {
-            state.wsListener[name] = callback;
-        } else {
-            state.wsListener[name] && delete state.wsListener[name];
-        }
-    },
-
     /**
      * 关闭 websocket
      * @param state

resources/assets/js/store/state.js

@@ -99,12 +99,10 @@ export default {
 
     // Websocket
     ws: null,
-    wsMsg: {},
     wsCall: {},
     wsTimeout: null,
     wsRandom: 0,
     wsOpenNum: 0,
-    wsListener: {},
 
     // 会员信息
     userInfo: {},