添加练习超时，重新挑战

src/components/BowTarget.vue

@@ -63,9 +63,7 @@ const timer = ref(null);
 watch(
   () => props.start,
   (newVal) => {
-    if (newVal) {
-      startCount.value = true;
-    }
+    startCount.value = newVal;
   },
   {
     immediate: true,

src/components/ScoreResult.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { ref } from "vue";
+import { ref, onMounted } from "vue";
 import IconButton from "@/components/IconButton.vue";
 import SButton from "@/components/SButton.vue";
 import ScreenHint from "@/components/ScreenHint.vue";
@@ -10,6 +10,10 @@ const props = defineProps({
     type: Function,
     default: () => {},
   },
+  total: {
+    type: Number,
+    default: 0,
+  },
   rowCount: {
     type: Number,
     default: 0,
@@ -26,15 +30,20 @@ const props = defineProps({
 const showPanel = ref(true);
 const showComment = ref(false);
 const showBowData = ref(false);
+const finished = ref(false);
 const closePanel = () => {
   showPanel.value = false;
   setTimeout(() => {
     props.onClose();
   }, 300);
 };
-setTimeout(() => {
-  showPanel.value = true;
-}, 300);
+onMounted(() => {
+  finished.value =
+    props.result.arrows && props.result.arrows.length === props.total;
+});
+// setTimeout(() => {
+//   showPanel.value = true;
+// }, 300);
 </script>
 
 <template>
@@ -73,13 +82,24 @@ setTimeout(() => {
         </view>
       </view>
       <view>
-        <IconButton name="分享" src="../static/share.png" :onClick="wxShare" />
-        <IconButton
-          name="教练点评"
-          src="../static/review.png"
-          :onClick="() => (showComment = true)"
-        />
-        <SButton width="70vw" :rounded="30" :onClick="closePanel">完成</SButton>
+        <block v-if="finished">
+          <IconButton
+            name="分享"
+            src="../static/share.png"
+            :onClick="wxShare"
+          />
+          <IconButton
+            name="教练点评"
+            src="../static/review.png"
+            :onClick="() => (showComment = true)"
+          />
+        </block>
+        <SButton
+          :width="finished ? '70vw' : 'calc(100vw - 20px)'"
+          :rounded="30"
+          :onClick="closePanel"
+          >{{ finished ? "完成" : "重新挑战" }}</SButton
+        >
       </view>
     </view>
     <ScreenHint :show="showComment" :onClose="() => (showComment = false)">

src/components/ShootProgress.vue

@@ -56,6 +56,7 @@ watch(
   (newVal, oldVal) => {
     if (newVal === false) {
       if (timer.value) clearInterval(timer.value);
+      remain.value = props.total;
     }
     if (!oldVal && newVal === true) {
       setTimeout(() => {
@@ -86,7 +87,7 @@ onUnmounted(() => {
   <view class="container">
     <view>
       <image src="../static/shooter.png" mode="widthFix" />
-      <text>{{ remain === 0 ? "射箭时间到！" : tips }}</text>
+      <text>{{ start && remain === 0 ? "射箭时间到！" : tips }}</text>
       <button hover-class="none" @click="() => (sound = !sound)">
         <image
           :src="`../static/sound${sound ? '' : '-off'}-yellow.png`"

src/components/StartCountdown.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { ref, watch, onUnmounted } from "vue";
+import { ref, watch, onMounted, onUnmounted } from "vue";
 const props = defineProps({
   start: {
     type: Boolean,
@@ -9,11 +9,13 @@ const props = defineProps({
 
 const count = ref(4);
 const timer = ref(null);
+const isIos = ref(true);
 watch(
   () => props.start,
   (newVal) => {
     if (newVal) {
       if (timer.value) clearInterval(timer.value);
+      count.value = 4;
       timer.value = setInterval(() => {
         if (count.value <= 1) {
           clearInterval(timer.value);
@@ -26,13 +28,17 @@ watch(
     immediate: true,
   }
 );
+onMounted(() => {
+  const deviceInfo = uni.getDeviceInfo();
+  isIos.value = deviceInfo.osName === "ios";
+});
 onUnmounted(() => {
   if (timer.value) clearInterval(timer.value);
 });
 </script>
 
 <template>
-  <view class="container">
+  <view class="container" :style="{ top: `calc(50% - ${isIos ? 59 : 64}px)` }">
     <view class="number pump-in" v-if="count === 3">3</view>
     <view class="number pump-in" v-if="count === 2">2</view>
     <view class="number pump-in" v-if="count === 1">1</view>