fix: 修改Promise连接时间

src/utils/websocket.ts

@@ -195,19 +195,30 @@ class Im {
     options: InitOptions,
     msgfunc?: MessageCallback,
     openfunc?: OpenCallback,
-  ): void {
-    const { account, factoryNo } = options
-    const socket_connect = localStorage.getItem('socket_connect')
-    if (socket_connect === 'online') return
+  ): Promise<void> {
+    return new Promise((resolve, reject) => {
+      const { account, factoryNo } = options
+      const socket_connect = localStorage.getItem('socket_connect')
+      if (socket_connect === 'online') {
+        resolve()
+        return
+      }
 
-    if (!window.WebSocket) return
+      if (!window.WebSocket) {
+        reject(new Error('WebSocket is not supported'))
+        return
+      }
 
-    this._onMessageCallback = msgfunc
-    this._onOpenCallback = openfunc
+      this._onMessageCallback = msgfunc
+      this._onOpenCallback = () => {
+        openfunc?.()
+        resolve()
+      }
 
-    this._destroyWebSocket()
-    this._wsUrl = `${getWsUrl()}/ws/websocket/${factoryNo}/${account}`
-    this._createWebSocket()
+      this._destroyWebSocket()
+      this._wsUrl = `${getWsUrl()}/ws/websocket/${factoryNo}/${account}`
+      this._createWebSocket()
+    })
   }
 
   send(options: WebSocketMessage): void {

src/views/Home.vue

@@ -9,52 +9,6 @@
 </template>
 <script setup lang="ts">
 import NavMenu from '@/components/NavMenu.vue'
-import { onMounted } from 'vue'
-import socket from '@/utils/websocket'
-import { ElMessageBox } from 'element-plus'
-import useUserStore from '@/store/user'
-import useOrderStore from '@/store/order'
-import type { WebSocketMessage } from '@/utils/websocket'
-onMounted(() => {
-  console.log('onMounted')
-  const user = useUserStore().user
-  if (!user) {
-    ElMessageBox.alert('请先登录')
-    return
-  }
-  socket.init(
-    { account: user.account.toString(), factoryNo: user.factoryId.toString() },
-    messageChange,
-  )
-})
-const messageChange = (data: WebSocketMessage) => {
-  if (!data) return
-  const { code, ...more } = data
-
-  if (code === 'POD_PRINT_ORDER') {
-    try {
-      if (typeof more.txt === 'string') {
-        console.log(
-          '%conWebSocketMessage',
-          'font-size: 20px; color: red;',
-          JSON.parse(more.txt),
-        )
-      }
-    } catch (e) {
-      console.error(e)
-    }
-    setPodBoxList(more)
-  }
-}
-const setPodBoxList = (data: WebSocketMessage) => {
-  const obj = data.txt
-  if (obj && typeof obj === 'string') {
-    console.log('obj', obj)
-    const parsedData = JSON.parse(obj)
-    console.log('parsedData', parsedData)
-    useOrderStore().setPodBoxList(parsedData)
-  }
-}
 </script>
 <style lang="scss" scoped>
 .home {

src/views/order/podUs/PodMakeOrder.vue

@@ -190,6 +190,7 @@
 import { computed, nextTick, ref, watch } from 'vue'
 import useLodop from '@/utils/hooks/useLodop'
 import TableView from '@/components/TableView.vue'
+import type { WebSocketMessage } from '@/utils/websocket'
 import {
   OrderData,
   PodMakeOrderData,
@@ -289,15 +290,26 @@ const podBoxList = computed(() => orderStore.podBoxList)
 const coverImage = ref<string>('')
 let currentCode = ''
 const tableRef = ref()
-watch(visible, (value: boolean) => {
+watch(visible, async (value: boolean) => {
   if (value) {
     podOrderDetailsData.value = {}
     currentCode = ''
     if (userStore.user?.factory.id) {
-      socket.send({
-        code: 'STARTORDER',
-        factoryNo: userStore.user?.factory.id,
-      })
+      try {
+        await socket.init(
+          {
+            account: userStore.user?.account.toString(),
+            factoryNo: userStore.user?.factory.id.toString(),
+          },
+          messageChange,
+        )
+        socket.send({
+          code: 'STARTORDER',
+          factoryNo: userStore.user?.factory.id,
+        })
+      } catch (error) {
+        console.error(error)
+      }
     }
     initOrderDetailBox()
     initPrintDevice()
@@ -307,6 +319,7 @@ watch(visible, (value: boolean) => {
         code: 'ENDORDER',
         factoryNo: userStore.user?.factory.id,
       })
+      socket.close()
     }
   }
 })
@@ -385,7 +398,34 @@ const renderItemBox = (bool: boolean) => {
   }
   renderLock.value = false
 }
+const messageChange = (data: WebSocketMessage) => {
+  if (!data) return
+  const { code, ...more } = data
 
+  if (code === 'POD_PRINT_ORDER') {
+    try {
+      if (typeof more.txt === 'string') {
+        console.log(
+          '%conWebSocketMessage',
+          'font-size: 20px; color: red;',
+          JSON.parse(more.txt),
+        )
+      }
+    } catch (e) {
+      console.error(e)
+    }
+    setPodBoxList(more)
+  }
+}
+const setPodBoxList = (data: WebSocketMessage) => {
+  const obj = data.txt
+  if (obj && typeof obj === 'string') {
+    console.log('obj', obj)
+    const parsedData = JSON.parse(obj)
+    console.log('parsedData', parsedData)
+    useOrderStore().setPodBoxList(parsedData)
+  }
+}
 const initPrintDevice = () => {
   const lodop = getCLodop(null, null)
   if (!lodop) return