聊天室断线重连功能

src/apps/mobile/views/monitoring-center-bank/chat-room/chat-room.vue

@@ -183,6 +183,16 @@
                 </div>
             </div>
         </div>
+        <el-dialog title="提示" :visible.sync="chatRoomClosed"
+        :before-close="chatRoomCloseFun"
+        width="15%"
+        :close-on-click-modal="false"
+        :close-on-press-escape="false">
+            <span>聊天室以断开，请尝试重连!</span>
+            <div slot="footer" class="dialog-footer">
+                <el-button type="primary" @click="webSocketRestart()">重连</el-button>
+            </div>
+        </el-dialog>
     </div>
 </template>
 <script>
@@ -226,7 +236,7 @@ export default {
             $ws: null,
             timer: '',
             isShowHistory: true,
-            isAutoCloseWs: false
+            chatRoomClosed: true,
         };
     },
     created() {
@@ -249,6 +259,12 @@ export default {
       clearInterval(this.timer);
     },
     methods: {
+        webSocketRestart(){
+            this.initWebSocket();
+        },
+        chatRoomCloseFun(){
+            this.chatRoomClosed = false;
+        },
         imgOpen(item) {
             window.open(item);
         },
@@ -276,6 +292,7 @@ export default {
                 this.$ws.onclose = this.wsClose;
                 this.$ws.onmessage = this.wsMessage;
                 this.$ws.onerror = this.wsError;
+                this.chatRoomClosed = false;
             } else {
                 this.$message.warning('浏览器暂不支持WebSocket服务');
             }
@@ -288,12 +305,13 @@ export default {
         },
         wsClose: function(e) {
             console.log('WebSocket连接关闭...........');
+            this.chatRoomClosed = true;
             clearInterval(this.timer);
-            if(!this.isAutoCloseWs){
-                setTimeout(() => {
-                    this.initWebSocket();
-                }, 3000);
-            }
+            // if(!this.isAutoCloseWs){
+            //     setTimeout(() => {
+            //         this.initWebSocket();
+            //     }, 3000);
+            // }
         },
         wsError: function(e) {
             console.log('WebSocket连接出现错误............');
@@ -359,6 +377,9 @@ export default {
             this.$ws.send(JSON.stringify(obj));
         },
         sendMessage() {
+            if(this.$ws.readyState===3){
+                this.chatRoomClosed = true;
+            }
             if (!window.WebSocket) {
                 return;
             }
@@ -526,7 +547,6 @@ export default {
     },
     destroyed() {
         this.$ws.onclose();
-        this.isAutoCloseWs = true;
     },
 };
 </script>