update:分包、对接个人练习

src/pages/first-try.vue

@@ -15,19 +15,18 @@ import BubbleTip from "@/components/BubbleTip.vue";
 import audioManager from "@/audioManager";
 import {
   createPractiseAPI,
-  startPractiseAPI,
-  endPractiseAPI,
   getPractiseAPI,
   laserAimAPI,
   laserCloseAPI,
 } from "@/apis";
+import { connectMatchWebSocket, closeMatchWebSocket } from "@/matchWebsocket";
 import { sharePractiseData } from "@/canvas";
 import { wxShare, debounce } from "@/util";
 import { MESSAGETYPESV2 } from "@/constants";
 import useStore from "@/store";
 import { storeToRefs } from "pinia";
 const store = useStore();
-const { user } = storeToRefs(store);
+const { user, device } = storeToRefs(store);
 const scores = ref([]);
 const isSvip = ref(false);
 const step = ref(0);
@@ -50,6 +49,7 @@ const showGuide = ref(false);
 const laserActive = ref(false);
 const guideSwiperIndex = ref(0);
 const sharing = ref(false);
+const RESULT_TIP_CDN = "https://static.shelingxingqiu.com/shootmini/static";
 
 const guideImages = [
   "https://static.shelingxingqiu.com/shootmini/static/target.png",
@@ -104,21 +104,42 @@ const closeCalibrationLaser = async () => {
 };
 
 const createPractise = async (arrows) => {
-  const result = await createPractiseAPI(arrows, 1);
+  closeMatchWebSocket({ reason: "practice-recreate" });
+  const result = await createPractiseAPI(
+    arrows,
+    120,
+    1,
+    device.value.deviceId
+  );
   if (result) practiseId.value = result.id;
+  if (!result?.serverAddr) {
+    uni.showToast({
+      title: "练习连接信息异常，请重试",
+      icon: "none",
+    });
+    return null;
+  }
+  connectMatchWebSocket({
+    serverAddr: result.serverAddr,
+    matchId: result.id,
+    userId: user.value.id,
+  });
+  return result;
 };
 
-const onOver = async () => {
-  practiseResult.value = await getPractiseAPI(practiseId.value);
+const onOver = async (message) => {
+  practiseResult.value = Array.isArray(message?.details)
+    ? message
+    : await getPractiseAPI(practiseId.value);
   start.value = false;
 };
 
 async function onReceiveMessage(msg) {
   if (msg.type === MESSAGETYPESV2.ShootResult) {
     isSvip.value = msg.sVip === true;
-    scores.value = msg.details;
+    scores.value = Array.isArray(msg.details) ? msg.details : scores.value;
   } else if (msg.type === MESSAGETYPESV2.BattleEnd) {
-    setTimeout(onOver, 1500);
+    setTimeout(() => onOver(msg), 1500);
   } else if (msg.type === MESSAGETYPESV2.TestDistance && step.value === 3) {
     if (msg.shootData.distance / 100 >= 5) {
       audioManager.play("距离合格");
@@ -173,7 +194,7 @@ onBeforeUnmount(async () => {
   uni.$off("share-image", onClickShare);
   await closeCalibrationLaser();
   audioManager.stopAll();
-  endPractiseAPI();
+  closeMatchWebSocket({ reason: "practice-leave" });
 });
 
 const nextStep = async () => {
@@ -196,15 +217,18 @@ const nextStep = async () => {
     btnDisabled.value = true;
     step.value = 3;
     title.value = "-感知距离";
-    const result = await createPractiseAPI(total, 120);
-    if (result) practiseId.value = result.id;
+    const result = await createPractise(total);
+    if (!result) {
+      btnDisabled.value = false;
+      step.value = 2;
+      return;
+    }
   } else if (step.value === 3) {
     showGuide.value = false;
     step.value = 4;
     title.value = "-小试牛刀";
   } else if (step.value === 4) {
     title.value = "小试牛刀";
-    await startPractiseAPI();
     scores.value = [];
     isSvip.value = false;
     step.value = 5;
@@ -235,10 +259,16 @@ const onClose = async () => {
     scores.value = [];
     isSvip.value = false;
     step.value = 4;
-    const result = await createPractiseAPI(total, 120);
-    if (result) practiseId.value = result.id;
+    await createPractise(total);
   }
 };
+
+const getResultTipSrc = (result = {}) => {
+  const validCount = (result.details || []).filter(
+    (arrow) => arrow.x !== -30 && arrow.y !== -30
+  ).length;
+  return `${RESULT_TIP_CDN}/${validCount < total ? "un" : ""}finish-tip.png`;
+};
 </script>
 
 <template>
@@ -361,13 +391,7 @@ const onClose = async () => {
         :total="total"
         :onClose="onClose"
         :result="practiseResult"
-        :tipSrc="`../static/${
-          practiseResult.details.filter(
-            (arrow) => arrow.x !== -30 && arrow.y !== -30
-          ).length < total
-            ? 'un'
-            : ''
-        }finish-tip.png`"
+        :tipSrc="getResultTipSrc(practiseResult)"
       />
       <canvas class="share-canvas" id="shareCanvas" type="2d"></canvas>
     </view>