阻塞消息。

src/views/modules/runTest/run-test.vue

@@ -234,6 +234,16 @@ const wsClient = useWebSocket(import.meta.env.VITE_WEBSOCKET_URL as string, {
 });
 
 const handleWSMessage = () => {
+  // wsClient.data.value = JSON.stringify({
+  //   msgtype: 5,
+  //   data: {
+  //     title: "这个是标题", //标题
+  //     content: "I控大概发给看哦K歌发K歌发", //内容
+  //     mode: "阻塞", //阻塞/非阻塞
+  //     // mode: "非阻塞", //阻塞/非阻塞
+  //     displayTime: "", //显示时间（s)，<=0标识一直显示,人工关闭（对非阻塞式弹窗有效）
+  //   },
+  // });
   if (wsClient.data.value && JSON.parse(wsClient.data.value)) {
     let megData = JSON.parse(wsClient.data.value);
     // let megData = {
@@ -284,6 +294,12 @@ const handleWSMessage = () => {
     } else if (msgType == 4) {
       isTesting.value = false;
       ElMessage.success("测试结束");
+    } else if (msgType == 5) {
+      let obj = megData?.data;
+      if (obj) {
+        msgType5Objcet.value = obj;
+        handleMsgType5Data();
+      }
     }
   }
 };
@@ -322,6 +338,46 @@ const checkStartEnable = (): boolean => {
 
   return enable;
 };
+
+// 收到msgtype为5的阻塞消息需要交互
+interface MsgType5Model {
+  title: string; //标题
+  content: string; //内容
+  mode: string; //阻塞/非阻塞
+  displayTime: string; //显示时间（s)，<=0标识一直显示,人工关闭（对非阻塞式弹窗有效）
+}
+
+const msgType5DVisiable = ref(false);
+const msgType5Objcet = ref<MsgType5Model>({
+  title: "", //标题
+  content: "", //内容
+  mode: "", //阻塞/非阻塞
+  displayTime: "", //显示时间（s)，<=0标识一直显示,人工关闭（对非阻塞式弹窗有效）
+});
+const handleMsgType5Data = (data: any) => {
+  msgType5DVisiable.value = true;
+  console.log("收到msgtype为5的阻塞消息", data);
+};
+const confirmMsgType5 = () => {
+  let p = {
+    msgtype: 5,
+    data: {
+      info: "continue", //continue/discontinue
+    },
+  };
+  wsClient.send(JSON.stringify(p));
+  msgType5DVisiable.value = false;
+};
+const cancelMsgType5 = () => {
+  let p = {
+    msgtype: 5,
+    data: {
+      info: "discontinue", //continue/discontinue
+    },
+  };
+  wsClient.send(JSON.stringify(p));
+  msgType5DVisiable.value = false;
+};
 </script>
 
 <template>
@@ -599,6 +655,22 @@ const checkStartEnable = (): boolean => {
         @close="configDrawerVisible = false"
       />
     </el-drawer>
+
+    <!--    阻塞消息弹窗-->
+    <el-dialog
+      v-model="msgType5DVisiable"
+      :title="msgType5Objcet.title"
+      width="500"
+    >
+      <div>{{ msgType5Objcet.content }}</div>
+      <template #footer v-if="msgType5Objcet.mode == '阻塞'">
+        <div class="dialog-footer">
+          <el-button @click="cancelMsgType5">取消</el-button>
+          <el-button type="primary" @click="confirmMsgType5"> 确定 </el-button>
+        </div>
+      </template>
+      <div v-text="msgType5Objcet.displayTime"></div>
+    </el-dialog>
   </div>
 </template>