update AdminBackendLog.vue

src/views/admin/backend/AdminBackendLog.vue

@@ -3,8 +3,8 @@
     <el-header height="220">
       <el-row style="margin-top: 10px">
         <span>
-          <span v-if="wsStatus" style="color: green">WebSocket 已连接</span>
-          <span v-if="!wsStatus" style="color: red">WebSocket 未连接</span>
+          <span v-if="wsConnectStatus" style="color: green">WebSocket 已连接</span>
+          <span v-if="!wsConnectStatus" style="color: red">WebSocket 未连接</span>
         </span>
         <el-select
           v-model="queryInfo.logType"
@@ -55,9 +55,9 @@ export default {
         timestamp: null,
         message: ''
       },
-      ws: null,
-      wsStatus: false,
-      reconnectLock: false
+      wsClient: null,
+      wsConnectStatus: false,
+      wsReconnectLock: false
     }
   },
   created() {
@@ -87,23 +87,21 @@ export default {
       if ('WebSocket' in window) {
         const wsUrl = 'ws://localhost:6007/logws/pull/runtime?app=tnb&host=localhost'
         const wsUrl1 = 'ws://localhost:6007/logws/pull/access?app=tnb&host=localhost'
-        this.ws = new WebSocket(wsUrl1)
+        this.wsClient = new WebSocket(wsUrl1)
         const that = this
-        this.ws.onopen = function() {
+        this.wsClient.onopen = function() {
           that.setOnline()
-          console.log('websocket connected...')
         }
-        this.ws.onclose = function() {
+        this.wsClient.onclose = function() {
           that.setOffline()
-          console.log('websocket connection closed...')
           that.reconnect()
         }
-        this.ws.onerror = function() {
+        this.wsClient.onerror = function() {
           that.setOffline()
           console.log('websocket connection error...')
           that.reconnect()
         }
-        this.ws.onmessage = function(evt) {
+        this.wsClient.onmessage = function(evt) {
           const message = JSON.parse(evt.data)
           that.processMessage(message)
         }
@@ -113,13 +111,23 @@ export default {
       }
     },
     setOnline() {
-      this.wsStatus = true
+      this.wsConnectStatus = true
     },
     setOffline() {
-      this.wsStatus = false
+      this.wsConnectStatus = false
+    },
+    reconnect() {
+      if (this.wsReconnectLock) return
+      this.wsReconnectLock = true
+      const that = this
+      setTimeout(function() {
+        console.log('websocket reconnecting...')
+        that.initWebSocket()
+        that.wsReconnectLock = false
+      }, 5000)
     },
     sendMessage(message) {
-      this.ws.send(message)
+      this.wsClient.send(message)
     },
     processMessage(message) {
       const requestId = message.requestId
@@ -136,17 +144,6 @@ export default {
         timestamp: requestTime,
         message: requestUrl
       })
-    },
-    reconnect() {
-      if (this.reconnectLock) return
-
-      this.reconnectLock = true
-      const that = this
-      setTimeout(function() {
-        console.log('websocket reconnecting...')
-        that.initWebSocket()
-        that.reconnectLock = false
-      }, 5000)
     }
   }
 }