细节优化

src/pages/practise-one.vue

@@ -8,6 +8,7 @@ import ScoreResult from "@/components/ScoreResult.vue";
 import SButton from "@/components/SButton.vue";
 import Avatar from "@/components/Avatar.vue";
 import BowPower from "@/components/BowPower.vue";
+import StartCountdown from "@/components/StartCountdown.vue";
 import { createPractiseAPI, getHomeData } from "@/apis";
 import { MESSAGETYPES, roundsName } from "@/constants";
 import useStore from "@/store";
@@ -15,6 +16,7 @@ import { storeToRefs } from "pinia";
 const store = useStore();
 const { user } = storeToRefs(store);
 const { updateUser } = store;
+const startCount = ref(false);
 const start = ref(false);
 const showScore = ref(false);
 const scores = ref([]);
@@ -25,9 +27,15 @@ const power = ref(0);
 
 const onReady = async () => {
   await createPractiseAPI(total);
-  start.value = true;
   currentRound.value = 0;
   scores.value = [];
+  startCount.value = true;
+};
+
+const onStart = () => {
+  start.value = true;
+  scores.value = [];
+  currentRound.value = 0;
 };
 
 async function onReceiveMessage(content) {
@@ -45,6 +53,7 @@ async function onReceiveMessage(content) {
       }
     }
     if (msg.constructor === MESSAGETYPES.ShootSyncMePracticeID) {
+      start.value = false;
       practiseResult.value = {
         ...msg.practice,
         arrows: JSON.parse(msg.practice.arrows),
@@ -104,9 +113,12 @@ onUnmounted(() => {
         :onClose="onComplete"
         :result="practiseResult"
       />
+      <StartCountdown :start="startCount" :onFinish="onStart" />
     </view>
     <view :style="{ marginBottom: '20px' }">
-      <SButton v-if="!start" :onClick="onReady">准备好了，直接开始</SButton>
+      <SButton v-if="!startCount" :onClick="onReady">
+        准备好了，直接开始
+      </SButton>
     </view>
   </Container>
 </template>