练习流程修改

src/components/ShootProgress.vue

@@ -38,6 +38,10 @@ const props = defineProps({
     type: Boolean,
     default: false,
   },
+  onStop: {
+    type: Function,
+    default: () => {},
+  },
 });
 
 const barColor = ref("#fed847");
@@ -75,34 +79,25 @@ watch(
   }
 );
 
-watch(
-  () => props.tips,
-  (newVal) => {
-    if (newVal.includes("红队")) barColor.value = "#FF6060";
-    if (newVal.includes("蓝队")) barColor.value = "#5FADFF";
-    if (newVal.includes("红队") || newVal.includes("蓝队")) {
-      if (timer.value) clearInterval(timer.value);
-      remain.value = props.total;
-      timer.value = setInterval(() => {
-        if (remain.value > 0) remain.value--;
-      }, 1000);
-    }
-  },
-  {
-    immediate: true,
+const resetTimer = (count) => {
+  if (timer.value) clearInterval(timer.value);
+  remain.value = Math.round(count);
+  if (remain.value > 0) {
+    timer.value = setInterval(() => {
+      if (remain.value === 0) {
+        clearInterval(timer.value);
+        props.onStop();
+      }
+      if (remain.value > 0) remain.value--;
+    }, 1000);
   }
-);
+};
 
 watch(
   () => props.start,
   (newVal) => {
-    if (timer.value) clearInterval(timer.value);
-    if (newVal) {
-      remain.value = props.total;
-      timer.value = setInterval(() => {
-        if (remain.value > 0) remain.value--;
-      }, 1000);
-    }
+    if (newVal) resetTimer(props.total);
+    else if (timer.value) clearInterval(timer.value);
   },
   {
     immediate: true,
@@ -116,16 +111,6 @@ const tipContent = computed(() => {
   return props.start && remain.value === 0 ? "时间到！" : props.tips;
 });
 
-const updateRemain = (value) => {
-  if (timer.value) clearInterval(timer.value);
-  remain.value = Math.round(value);
-  if (remain.value > 0) {
-    timer.value = setInterval(() => {
-      if (remain.value > 0) remain.value--;
-    }, 1000);
-  }
-};
-
 const updateSound = () => {
   sound.value = !sound.value;
   audioManager.setMuted(!sound.value);
@@ -194,13 +179,13 @@ const playSound = (key) => {
 };
 
 onMounted(() => {
-  uni.$on("update-ramain", updateRemain);
+  uni.$on("update-ramain", resetTimer);
   uni.$on("socket-inbox", onReceiveMessage);
   uni.$on("play-sound", playSound);
 });
 
 onBeforeUnmount(() => {
-  uni.$off("update-ramain", updateRemain);
+  uni.$off("update-ramain", resetTimer);
   uni.$off("socket-inbox", onReceiveMessage);
   uni.$off("play-sound", playSound);
   if (timer.value) clearInterval(timer.value);

src/pages/practise-one.vue

@@ -12,13 +12,16 @@ import BowPower from "@/components/BowPower.vue";
 import TestDistance from "@/components/TestDistance.vue";
 import BubbleTip from "@/components/BubbleTip.vue";
 import audioManager from "@/audioManager";
-import { createPractiseAPI } from "@/apis";
+
+import { createPractiseAPI, getPractiseAPI } from "@/apis";
 import { generateCanvasImage, wxShare, debounce } from "@/util";
 import { MESSAGETYPES, roundsName } from "@/constants";
+
 import useStore from "@/store";
 import { storeToRefs } from "pinia";
 const store = useStore();
 const { user } = storeToRefs(store);
+
 const start = ref(false);
 const scores = ref([]);
 const total = 12;
@@ -27,8 +30,6 @@ const practiseResult = ref({});
 const practiseId = ref("");
 const showGuide = ref(false);
 const tips = ref("");
-const wait = ref(0);
-const timer = ref(null);
 
 const onReady = async () => {
   const result = await createPractiseAPI(total, 2);
@@ -39,6 +40,11 @@ const onReady = async () => {
   audioManager.play("练习开始");
 };
 
+const onOver = async () => {
+  start.value = false;
+  practiseResult.value = await getPractiseAPI(practiseId.value);
+};
+
 async function onReceiveMessage(messages = []) {
   messages.forEach((msg) => {
     if (msg.constructor === MESSAGETYPES.ShootSyncMeArrowID) {
@@ -54,43 +60,8 @@ async function onReceiveMessage(messages = []) {
             showGuide.value = false;
           }, 3000);
         }
-      }
-    } else if (msg.constructor === MESSAGETYPES.ShootSyncMePracticeID) {
-      if (practiseId.value && practiseId.value === msg.practice.id) {
-        if (timer.value) {
-          clearInterval(timer.value);
-          timer.value = null;
-        }
-        setTimeout(() => {
-          start.value = false;
-          practiseResult.value = {
-            ...msg.practice,
-            arrows: JSON.parse(msg.practice.arrows),
-            lvl: msg.lvl,
-          };
-        }, 1500);
-      }
-    } else if (msg.constructor === MESSAGETYPES.HalfTimeOver) {
-      wait.value = msg.wait;
-      if (msg.wait === 20) {
-        uni.$emit("update-ramain", 0);
-        for (let i = 0; i < 6; i++) {
-          if (!scores.value[i]) scores.value[i] = { x: -30, y: -30, ring: 0 };
-        }
-      }
-      if (msg.wait === 0) {
-        let count = 60;
-        uni.$emit("update-ramain", count);
-        audioManager.play("练习开始");
-        if (!timer.value) {
-          timer.value = setInterval(() => {
-            count -= 1;
-            if (count === 30) {
-              audioManager.play("最后30秒");
-              clearInterval(timer.value);
-              timer.value = null;
-            }
-          }, 1000);
+        if (scores.value.length === total) {
+          setTimeout(onOver, 1500);
         }
       }
     }
@@ -154,7 +125,7 @@ onBeforeUnmount(() => {
                 }轮`
           }`"
           :start="start"
-          :total="60"
+          :onStop="onOver"
         />
         <view class="user-row">
           <Avatar :src="user.avatar" :size="35" />
@@ -168,7 +139,6 @@ onBeforeUnmount(() => {
           :totalRound="start ? total / 4 : 0"
           :currentRound="currentRound"
           :scores="scores"
-          :stop="wait > 0"
         />
         <ScorePanel2 :scores="scores.map((s) => s.ring)" />
         <ScoreResult

src/pages/practise-two.vue

@@ -11,13 +11,16 @@ import BowPower from "@/components/BowPower.vue";
 import TestDistance from "@/components/TestDistance.vue";
 import BubbleTip from "@/components/BubbleTip.vue";
 import audioManager from "@/audioManager";
-import { createPractiseAPI } from "@/apis";
+
+import { createPractiseAPI, getPractiseAPI } from "@/apis";
 import { generateCanvasImage, wxShare, debounce } from "@/util";
 import { MESSAGETYPES } from "@/constants";
+
 import useStore from "@/store";
 import { storeToRefs } from "pinia";
 const store = useStore();
 const { user } = storeToRefs(store);
+
 const start = ref(false);
 const scores = ref([]);
 const total = 36;
@@ -35,6 +38,11 @@ const onReady = async () => {
   }, 300);
 };
 
+const onOver = async () => {
+  start.value = false;
+  practiseResult.value = await getPractiseAPI(practiseId.value);
+};
+
 async function onReceiveMessage(messages = []) {
   messages.forEach((msg) => {
     if (msg.constructor === MESSAGETYPES.ShootSyncMeArrowID) {
@@ -46,18 +54,9 @@ async function onReceiveMessage(messages = []) {
             showGuide.value = false;
           }, 3000);
         }
-      }
-    }
-    if (msg.constructor === MESSAGETYPES.ShootSyncMePracticeID) {
-      if (practiseId.value && practiseId.value === msg.practice.id) {
-        setTimeout(() => {
-          start.value = false;
-          practiseResult.value = {
-            ...msg.practice,
-            arrows: JSON.parse(msg.practice.arrows),
-            lvl: msg.lvl,
-          };
-        }, 1500);
+        if (scores.value.length === total) {
+          setTimeout(onOver, 1500);
+        }
       }
     }
   });
@@ -106,7 +105,12 @@ onBeforeUnmount(() => {
     <view>
       <TestDistance v-if="!practiseId" />
       <block v-if="practiseId">
-        <ShootProgress :start="start" :tips="`请连续射${total}支箭`" />
+        <ShootProgress
+          :tips="`请连续射${total}支箭`"
+          :start="start"
+          :total="360"
+          :onStop="onOver"
+        />
         <view class="user-row">
           <Avatar :src="user.avatar" :size="35" />
           <BubbleTip v-if="showGuide" type="normal2">