练习结果完善

src/components/BowTarget.vue

@@ -46,7 +46,9 @@ function calcRealY(num) {
     <view class="header">
       <text v-if="debug" class="header-tips">大人，请射箭</text>
       <text v-if="totalRound > 0" class="round-count">{{
-        currentRound + "/" + totalRound
+        (currentRound > totalRound ? totalRound : currentRound) +
+        "/" +
+        totalRound
       }}</text>
       <BowPower v-if="power > 0" :power="power" />
     </view>

src/components/ScoreResult.vue

@@ -20,9 +20,9 @@ const props = defineProps({
     type: Number,
     default: 0,
   },
-  scores: {
-    type: Array,
-    default: () => [],
+  result: {
+    type: Object,
+    default: () => ({}),
   },
 });
 const showPanel = ref(true);
@@ -39,14 +39,20 @@ setTimeout(() => {
 </script>
 
 <template>
-  <view class="container" :style="{ display: show ? 'block' : 'none' }">
+  <view
+    v-if="result.arrows && result.arrows.length > 0"
+    class="container"
+    :style="{ display: show ? 'block' : 'none' }"
+  >
     <view :class="['container-header', showPanel ? 'scale-in' : 'scale-out']">
       <image src="../static/finish-tip.png" mode="widthFix" />
       <image src="../static/finish-frame.png" mode="widthFix" />
       <text
         >完成<text class="gold-text">{{ total }}</text
         >箭，获得<text class="gold-text">{{
-          scores.reduce((last, next) => last + next, 0)
+          result.arrows
+            .map((a) => a.ring)
+            .reduce((last, next) => last + next, 0)
         }}</text
         >点经验</text
       >
@@ -58,7 +64,9 @@ setTimeout(() => {
       <view>
         <text
           >本剧成绩（共{{
-            scores.reduce((last, next) => last + next, 0)
+            result.arrows
+              .map((a) => a.ring)
+              .reduce((last, next) => last + next, 0)
           }}环）：</text
         >
         <button>
@@ -71,8 +79,8 @@ setTimeout(() => {
         </button>
       </view>
       <view :style="{ gridTemplateColumns: `repeat(${rowCount}, 1fr)` }">
-        <view v-for="(score, index) in scores" :key="index">
-          {{ score }}<text>环</text>
+        <view v-for="(score, index) in result.arrows" :key="index">
+          {{ score.ring }}<text>环</text>
         </view>
       </view>
       <view>
@@ -88,8 +96,7 @@ setTimeout(() => {
       </view>
     </view>
     <CoachComment :show="showComment" :onClose="() => (showComment = false)">
-      您本次练习取得了 环的成绩，所有箭支上靶后的平均点间距为 ，成绩优秀。
-      针对您本次的练习，我们建议您将设备的瞄准器向左侧调整。
+      {{ result.adjustmentHint }}
     </CoachComment>
   </view>
 </template>

src/constants.js

@@ -1,3 +1,4 @@
 export const MESSAGETYPES = {
   ShootSyncMeArrowID: parseInt("0x789b6b0d"),
+  ShootSyncMePracticeID: parseInt("0xD88AE05E"),
 };

src/pages/first-try.vue

@@ -27,11 +27,14 @@ const stepButtonTexts = [
   "",
   "退出新手试炼",
 ];
+const start = ref(false);
+const practiseResult = ref({});
+const power = ref(0);
 
 const onReady = async () => {
   const result = await createPractiseAPI(total);
   const token = uni.getStorageSync("token");
-
+  start.value = true;
   websocket.createWebSocket(token, (content) => {
     const messages = JSON.parse(content).data.updates || [];
     messages.forEach((msg) => {
@@ -39,9 +42,14 @@ const onReady = async () => {
         scores.value.push(msg.target);
         if (scores.value.length === total) {
           showScore.value = true;
-          websocket.closeWebSocket();
         }
       }
+      if (msg.constructor === MESSAGETYPES.ShootSyncMePracticeID) {
+        practiseResult.value = {
+          ...msg.practice,
+          arrows: JSON.parse(msg.practice.arrows),
+        };
+      }
     });
   });
 };
@@ -144,11 +152,11 @@ const onClose = () => {
       v-if="step === 4"
       tips="请开始连续射箭"
       :total="100"
-      :start="true"
+      :start="start"
     />
     <BowTarget
       :avatar="user.avatarUrl"
-      :power="45"
+      :power="power"
       :debug="step === 2"
       v-if="step === 2 || step === 4"
       :tips="step === 4 ? '' : '本次射程5.2米，已达到距离要求'"
@@ -166,7 +174,7 @@ const onClose = () => {
       :show="showScore"
       v-if="step === 4"
       :onClose="onClose"
-      :scores="scores.map((s) => s.ring)"
+      :result="practiseResult"
     />
     <SButton v-if="step !== 4" :onClick="nextStep">{{
       stepButtonTexts[step]

src/pages/practise-one.vue

@@ -14,6 +14,8 @@ const start = ref(false);
 const showScore = ref(false);
 const scores = ref([]);
 const total = 12;
+const practiseResult = ref({});
+const power = ref(0);
 
 const onReady = async () => {
   const result = await createPractiseAPI(total);
@@ -25,11 +27,17 @@ const onReady = async () => {
     messages.forEach((msg) => {
       if (msg.constructor === MESSAGETYPES.ShootSyncMeArrowID) {
         scores.value.push(msg.target);
+        power.value = msg.target.battery;
         if (scores.value.length === total) {
           showScore.value = true;
-          websocket.closeWebSocket();
         }
       }
+      if (msg.constructor === MESSAGETYPES.ShootSyncMePracticeID) {
+        practiseResult.value = {
+          ...msg.practice,
+          arrows: JSON.parse(msg.practice.arrows),
+        };
+      }
     });
   });
 };
@@ -58,7 +66,7 @@ onUnmounted(() => {
       :totalRound="total"
       :currentRound="scores.length + 1"
       avatar="../static/avatar.png"
-      :power="45"
+      :power="power"
       :scores="scores"
     />
     <ScorePanel2 v-if="start" :scores="scores.map((s) => s.ring)" />
@@ -67,7 +75,7 @@ onUnmounted(() => {
       :rowCount="6"
       :show="showScore"
       :onClose="() => (showScore = false)"
-      :scores="scores.map((s) => s.ring)"
+      :result="practiseResult"
     />
     <SButton v-if="!start" :onClick="onReady">准备好了，直接开始</SButton>
   </view>

src/pages/practise-two.vue

@@ -14,6 +14,8 @@ const start = ref(false);
 const showScore = ref(false);
 const scores = ref([]);
 const total = 36;
+const practiseResult = ref({});
+const power = ref(0);
 
 const onReady = async () => {
   const result = await createPractiseAPI(total);
@@ -27,9 +29,14 @@ const onReady = async () => {
         scores.value.push(msg.target);
         if (scores.value.length === total) {
           showScore.value = true;
-          websocket.closeWebSocket();
         }
       }
+      if (msg.constructor === MESSAGETYPES.ShootSyncMePracticeID) {
+        practiseResult.value = {
+          ...msg.practice,
+          arrows: JSON.parse(msg.practice.arrows),
+        };
+      }
     });
   });
 };
@@ -41,14 +48,14 @@ onUnmounted(() => {
 
 <template>
   <view class="container">
-    <AppBackground type="1" />
+    <AppBackground :type="1" />
     <Header title="个人耐力挑战" />
-    <ShootProgress :tips="`请连续射箭${total}支`" total="120" />
+    <ShootProgress :tips="`请连续射箭${total}支`" :total="120" />
     <BowTarget
       :totalRound="total"
       :currentRound="scores.length + 1"
       avatar="../static/avatar.png"
-      :power="45"
+      :power="power"
       :scores="scores"
     />
     <ScorePanel
@@ -62,7 +69,7 @@ onUnmounted(() => {
       :rowCount="9"
       :show="showScore"
       :onClose="() => (showScore = false)"
-      :scores="scores.map((s) => s.ring)"
+      :result="practiseResult"
     />
     <SButton v-if="!start" :onClick="onReady">准备好了，直接开始</SButton>
   </view>