ws 重连

src/stores/dictionary.ts

@@ -47,7 +47,6 @@ export const useDictionaryStore = defineStore('dictionary', {
 						this[dictionaryDefine[type]?.[2]] = objMap
 						resolve(res.data)
 					}).catch((e: any) => {
-						console.log('e: ', e);
 						reject('获取'+dictionaryDefine[type][0]+'字典错误')
 					})
 				} else {

src/views/web/list/index.vue

@@ -259,10 +259,13 @@ const state: any = reactive({
     indexConfig: {}
   },
   ws: {
+    instance: null,
     count: () => {},
     list: () => {},
     detail: () => {},
-    countPercent: 100
+    countPercent: 100,
+    loading: null,
+    loadingTimer: null
   },
   tableParams: {
     model: 'list',
@@ -277,6 +280,7 @@ const state: any = reactive({
     show: false
   }
 })
+const loadingBg = 'rgba(0, 0, 0, 0.4)'
 const ref_area = ref()
 const isSelectAllCpt = computed(() => {
   return WebStore.searchAreaIndexTotal === state.cascaderParams.value.length
@@ -408,230 +412,235 @@ watch(() => state.resultParams.activeIndex, (n) => {
     getIndexConfig()
   }
 })
-onMounted(() => {
-  initDictionary()
-  const {text, index} = route.query
-  if (!text) {
-    router.replace({
-      name: '71305311-abcc-4d13-8531-f966b49839c5'
-    })
-  } else {
-    state.searchText = text
-    if (index) {
-      state.cascaderParams.value = index.split(',').map(v => Number(v))
-    }
-    let loading = null
-    let loadingTimer = null
-    const ws: any = new WebSocket('/ws-api/smart-ws?userId=1388061846031220738')
-    ws.onerror = () => {
-      loading = ElLoading.service({
-          lock: true,
-          text: '智搜服务连接失败……',
-          background: 'rgba(0, 0, 0, 0.7)',
-      })
-    }
-    let sessionId = ''
-    let lastCountParams = ''
-    let lastCountStep = 0
-    let lastCountStep_ = 0
-    let lastListParams = ''
-    let lastDetailParams = ''
-    ws.onopen = (e) => {
-      state.ws.count = () => {
-        state.ws.countPercent = 0
-        // 如果有的话，终止上一次请求
-        if (lastCountParams) {
-          const p = JSON.parse(lastCountParams)
-          p.flag = 'stop'
-          ws.send(JSON.stringify(p))
-        }
-        // 如果有的话，终止上一次请求
-        if (lastListParams) {
-          const p = JSON.parse(lastListParams)
-          p.flag = 'stop'
-          ws.send(JSON.stringify(p))
-          lastListParams = ''
-        }
-        // 执行新的请求
-        let step = 0
-        const builder = state.resultParams.tree.map(tag => ({
-          tagCode: tag.treeId,
-          datas: tag.children.map(type => {
-            step++
-            return {
-              typeCode: type.treeId,
-              datas: type.children.map(index => ({
-                indexCode: index.treeId,
-              }))
-            }
-          })
-        }))
-        lastCountStep = step
-        lastCountStep_ = step
-        const params = {
-          builder: builder,
-          keyData: state.searchParams.text,
-          type: 'count',
-          sessionId: sessionId,
-          timestamp: new Date().getTime(),
-          flag: 'run',
-          orderBy: {}
-        }
-        lastCountParams = JSON.stringify(params)
-        ws.send(lastCountParams)
+const initWS = () => {
+  const ws: any = new WebSocket('/ws-api/smart-ws?userId=1388061846031220738')
+  let sessionId = ''
+  let lastCountParams = ''
+  let lastCountStep = 0
+  let lastCountStep_ = 0
+  let lastListParams = ''
+  let lastDetailParams = ''
+  ws.onopen = (e) => {
+    state.ws.loading?.close()
+    state.ws.loading = null
+    state.ws.count = () => {
+      state.ws.countPercent = 0
+      // 如果有的话，终止上一次请求
+      if (lastCountParams) {
+        const p = JSON.parse(lastCountParams)
+        p.flag = 'stop'
+        ws.send(JSON.stringify(p))
       }
-      state.ws.list = (init = true) => {
-        // 如果有的话，终止上一次请求
-        if (lastListParams) {
-          const p = JSON.parse(lastListParams)
-          p.flag = 'stop'
-          ws.send(JSON.stringify(p))
-          lastListParams = ''
-        }
-        if (init) {
-          state.tableParams = {
-            model: state.tableParams.model,
-            pageNum: 1,
-            pageSize: 10,
-            total: 0,
-            data: [],
-            loading: true
-          }
-        }
-        const params = {
-          keyData: state.searchParams.text,
-          pageNumber: state.tableParams.pageNum,
-          pageSize: state.tableParams.pageSize,
-          indexCode: state.resultParams.activeIndex,
-          type: 'list',
-          sessionId: sessionId,
-          timestamp: new Date().getTime(),
-          flag: 'run',
-          orderBy: {}
-        }
-        lastListParams = JSON.stringify(params)
-        ws.send(lastListParams)
+      // 如果有的话，终止上一次请求
+      if (lastListParams) {
+        const p = JSON.parse(lastListParams)
+        p.flag = 'stop'
+        ws.send(JSON.stringify(p))
+        lastListParams = ''
       }
-      state.ws.detail = (esId) => {
-        const params = {
-          indexCode: state.resultParams.activeIndex,
-          id: esId,
-          type: 'detail',
-          sessionId: sessionId,
-          timestamp: new Date().getTime(),
-          flag: 'run',
-          orderBy: {}
-        }
-        lastDetailParams = JSON.stringify(params)
-        ws.send(lastDetailParams)
-        loading = ElLoading.service({
-          lock: true,
-          text: '详情信息获取中……',
-          background: 'rgba(0, 0, 0, 0.7)',
+      // 执行新的请求
+      let step = 0
+      const builder = state.resultParams.tree.map(tag => ({
+        tagCode: tag.treeId,
+        datas: tag.children.map(type => {
+          step++
+          return {
+            typeCode: type.treeId,
+            datas: type.children.map(index => ({
+              indexCode: index.treeId,
+            }))
+          }
         })
-        if (loadingTimer) {
-          clearTimeout(loadingTimer)
+      }))
+      lastCountStep = step
+      lastCountStep_ = step
+      const params = {
+        builder: builder,
+        keyData: state.searchParams.text,
+        type: 'count',
+        sessionId: sessionId,
+        timestamp: new Date().getTime(),
+        flag: 'run',
+        orderBy: {}
+      }
+      lastCountParams = JSON.stringify(params)
+      ws.send(lastCountParams)
+    }
+    state.ws.list = (init = true) => {
+      // 如果有的话，终止上一次请求
+      if (lastListParams) {
+        const p = JSON.parse(lastListParams)
+        p.flag = 'stop'
+        ws.send(JSON.stringify(p))
+        lastListParams = ''
+      }
+      if (init) {
+        state.tableParams = {
+          model: state.tableParams.model,
+          pageNum: 1,
+          pageSize: 10,
+          total: 0,
+          data: [],
+          loading: true
         }
-        loadingTimer = setTimeout(() => {
-          const errorParams = JSON.parse(JSON.stringify(lastDetailParams))
-          errorParams.flag = 'stop'
-          ws.send(errorParams)
-          lastDetailParams = ''
-          ElMessage.error('详情信息获取失败！')
-          loading?.close()
-          loadingTimer = null
-        }, 10000)
       }
+      const params = {
+        keyData: state.searchParams.text,
+        pageNumber: state.tableParams.pageNum,
+        pageSize: state.tableParams.pageSize,
+        indexCode: state.resultParams.activeIndex,
+        type: 'list',
+        sessionId: sessionId,
+        timestamp: new Date().getTime(),
+        flag: 'run',
+        orderBy: {}
+      }
+      lastListParams = JSON.stringify(params)
+      ws.send(lastListParams)
+    }
+    state.ws.detail = (esId) => {
+      const params = {
+        indexCode: state.resultParams.activeIndex,
+        id: esId,
+        type: 'detail',
+        sessionId: sessionId,
+        timestamp: new Date().getTime(),
+        flag: 'run',
+        orderBy: {}
+      }
+      lastDetailParams = JSON.stringify(params)
+      ws.send(lastDetailParams)
+      state.ws.loading = ElLoading.service({
+        lock: true,
+        text: '详情信息获取中……',
+        background: loadingBg,
+      })
+      if (state.ws.loadingTimer) {
+        clearTimeout(state.ws.loadingTimer)
+      }
+      state.ws.loadingTimer = setTimeout(() => {
+        const errorParams = JSON.parse(JSON.stringify(lastDetailParams))
+        errorParams.flag = 'stop'
+        ws.send(errorParams)
+        lastDetailParams = ''
+        ElMessage.error('详情信息获取失败！')
+        state.ws.loading?.close()
+        state.ws.loadingTimer = null
+      }, 10000)
     }
-    ws.onmessage = (e) => {
-      try {
-        const json = JSON.parse(e.data)
-        if (json.type === 'session') {
-          sessionId = json.sessionId
+  }
+  ws.onmessage = (e) => {
+    try {
+      const json = JSON.parse(e.data)
+      if (json.type === 'session') {
+        sessionId = json.sessionId
+        if (state.cascaderParams.options.length === 0) {
           initArea()
-        } else {
-          switch (json.type) {
-            case 'count': {
-              const p = JSON.parse(lastCountParams)
-              // 返回为最新批次的
-              if (json.timestamp == p.timestamp) {
-                const resTag = json.datas
-                const resType = resTag.datas[0]
-                state.resultParams.tree.forEach(tag => {
-                  if (tag.treeId == resTag.tagCode) {
-                    tag.children.forEach(type => {
-                      if (type.treeId == resType.typeCode) {
-                        resType.datas.forEach((index, indexI) => {
-                          type.children[indexI].__count = index.data
-                          type.__count = type.__count ? (type.__count + index.data) : index.data
-                          tag.__count = tag.__count ? (tag.__count + index.data) : index.data
-                        })
-                      }
-                    })
-                  }
-                })
-                for (let tagI = 0; tagI < state.resultParams.tree.length; tagI++) {
-                  const tag = state.resultParams.tree[tagI]
-                  if (tag.__count > 0 && !state.resultParams.activeTab) {
-                    state.resultParams.activeTab = tag.treeId
-                    for (let typeI = 0; typeI < tag.children.length; typeI++) {
-                      const type = tag.children[typeI]
-                      if (type.__count > 0) {
-                        type.__expend = true
-                        for (let indexI = 0; indexI < type.children.length; indexI++) {
-                          const index = type.children[indexI]
-                          if (index.__count > 0 && !state.resultParams.activeIndex) {
-                            state.resultParams.activeIndex = index.treeId
-                            break
-                          }
+        }
+      } else {
+        switch (json.type) {
+          case 'count': {
+            const p = JSON.parse(lastCountParams)
+            // 返回为最新批次的
+            if (json.timestamp == p.timestamp) {
+              const resTag = json.datas
+              const resType = resTag.datas[0]
+              state.resultParams.tree.forEach(tag => {
+                if (tag.treeId == resTag.tagCode) {
+                  tag.children.forEach(type => {
+                    if (type.treeId == resType.typeCode) {
+                      resType.datas.forEach((index, indexI) => {
+                        type.children[indexI].__count = index.data
+                        type.__count = type.__count ? (type.__count + index.data) : index.data
+                        tag.__count = tag.__count ? (tag.__count + index.data) : index.data
+                      })
+                    }
+                  })
+                }
+              })
+              for (let tagI = 0; tagI < state.resultParams.tree.length; tagI++) {
+                const tag = state.resultParams.tree[tagI]
+                if (tag.__count > 0 && !state.resultParams.activeTab) {
+                  state.resultParams.activeTab = tag.treeId
+                  for (let typeI = 0; typeI < tag.children.length; typeI++) {
+                    const type = tag.children[typeI]
+                    if (type.__count > 0) {
+                      type.__expend = true
+                      for (let indexI = 0; indexI < type.children.length; indexI++) {
+                        const index = type.children[indexI]
+                        if (index.__count > 0 && !state.resultParams.activeIndex) {
+                          state.resultParams.activeIndex = index.treeId
+                          break
                         }
-                        break
                       }
+                      break
                     }
-                    break
                   }
-                }
-                lastCountStep--
-                state.ws.countPercent = ((lastCountStep_ - lastCountStep) / lastCountStep_ * 100).toFixed(0)
-                if (lastCountStep === 0) {
-                  lastCountParams = ''
+                  break
                 }
               }
-            } break
-            case 'list': {
-              const p = JSON.parse(lastListParams)
-              // 返回为最新批次的
-              if (json.timestamp == p.timestamp) {
-                state.tableParams.total = json.records
-                state.tableParams.data = json.datas
-                state.tableParams.loading = false
-                lastListParams = ''
+              lastCountStep--
+              state.ws.countPercent = ((lastCountStep_ - lastCountStep) / lastCountStep_ * 100).toFixed(0)
+              if (lastCountStep === 0) {
+                lastCountParams = ''
               }
-            } break
-            case 'detail': {
-              const p = JSON.parse(lastDetailParams)
-              // 返回为最新批次的
-              if (json.timestamp == p.timestamp) {
-
-                clearTimeout(loadingTimer)
-                loadingTimer = null
-                loading?.close()
-                lastDetailParams = ''
-                state.detail.transfer = {
-                  indexName: currentIndexCpt.value.treeName,
-                  row: json.datas?.[0],
-                  config: tableConfigCpt.value.detailConfig
-                }
-                state.detail.show = true
+            }
+          } break
+          case 'list': {
+            const p = JSON.parse(lastListParams)
+            // 返回为最新批次的
+            if (json.timestamp == p.timestamp) {
+              state.tableParams.total = json.records
+              state.tableParams.data = json.datas
+              state.tableParams.loading = false
+              lastListParams = ''
+            }
+          } break
+          case 'detail': {
+            const p = JSON.parse(lastDetailParams)
+            // 返回为最新批次的
+            if (json.timestamp == p.timestamp) {
+              clearTimeout(state.ws.loadingTimer)
+              state.ws.loadingTimer = null
+              state.ws.loading?.close()
+              lastDetailParams = ''
+              state.detail.transfer = {
+                indexName: currentIndexCpt.value.treeName,
+                row: json.datas?.[0],
+                config: tableConfigCpt.value.detailConfig
               }
-            } break
-          }
+              state.detail.show = true
+            }
+          } break
         }
-      } catch (e) {
-
       }
+    } catch (e) {
+
+    }
+  }
+  ws.onclose = function (){
+    state.ws.loading = ElLoading.service({
+      lock: true,
+      text: '智搜服务重新连接中……',
+      background: loadingBg,
+    })
+    setTimeout(initWS, 5000);
+  }
+  state.ws.instance = ws
+}
+onMounted(() => {
+  initDictionary()
+  const {text, index} = route.query
+  if (!text) {
+    router.replace({
+      name: '71305311-abcc-4d13-8531-f966b49839c5'
+    })
+  } else {
+    state.searchText = text
+    if (index) {
+      state.cascaderParams.value = index.split(',').map(v => Number(v))
     }
-    state.ws = ws
+    initWS()
   }
 })
 </script>