diff --git a/src/components/ShootProgress.vue b/src/components/ShootProgress.vue index 3abf0c7..edfbf9d 100644 --- a/src/components/ShootProgress.vue +++ b/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); diff --git a/src/pages/practise-one.vue b/src/pages/practise-one.vue index 5aec9a8..11a6f3a 100644 --- a/src/pages/practise-one.vue +++ b/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" /> @@ -168,7 +139,6 @@ onBeforeUnmount(() => { :totalRound="start ? total / 4 : 0" :currentRound="currentRound" :scores="scores" - :stop="wait > 0" /> { }, 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(() => { - +