添加声音

src/audioManager.js

@@ -0,0 +1,93 @@
+const audioFils = {
+  第一轮:
+    "https://api.shelingxingqiu.com/attachment/2025-07-14/dbblu6fl26qrspvy79.mp3",
+  第二轮:
+    "https://api.shelingxingqiu.com/attachment/2025-07-14/dbblu6fehshrpe5ook.mp3",
+  第三轮:
+    "https://api.shelingxingqiu.com/attachment/2025-07-14/dbblu6fgbz3iimk7yy.mp3",
+  第四轮:
+    "https://api.shelingxingqiu.com/attachment/2025-07-14/dbblu6fjwf50tlxxbi.mp3",
+  第五轮:
+    "https://api.shelingxingqiu.com/attachment/2025-07-14/dbblu6fg63lqrslhm7.mp3",
+  决金箭轮:
+    "https://api.shelingxingqiu.com/attachment/2025-07-14/dbblu6fhjycwubbwil.mp3",
+  请蓝方射击:
+    "https://api.shelingxingqiu.com/attachment/2025-07-14/dbblu6fr0zpluiabph.mp3",
+  请红方射击:
+    "https://api.shelingxingqiu.com/attachment/2025-07-14/dbblu6fu169yerpwey.mp3",
+  中场休息:
+    "https://api.shelingxingqiu.com/attachment/2025-07-14/dbblu6fug8faqrbtwd.mp3",
+  比赛结束:
+    "https://api.shelingxingqiu.com/attachment/2025-07-14/dbblsdl717ilr0b3o0.mp3",
+  比赛开始:
+    "https://api.shelingxingqiu.com/attachment/2025-07-14/dbblsdl7qlkqgvthfr.mp3",
+  请开始射击:
+    "https://api.shelingxingqiu.com/attachment/2025-07-14/dbbljrfx5guqt5oulk.mp3",
+  未上靶:
+    "https://api.shelingxingqiu.com/attachment/2025-07-14/dbbkxm60bul0khcoqq.mp3",
+  "1环":
+    "https://api.shelingxingqiu.com/attachment/2025-07-14/dbbklufj59qmdo96ha.mp3",
+  "2环":
+    "https://api.shelingxingqiu.com/attachment/2025-07-14/dbbklufogy49ousbv4.mp3",
+  "3环":
+    "https://api.shelingxingqiu.com/attachment/2025-07-14/dbbklufl3hhijeasck.mp3",
+  "4环":
+    "https://api.shelingxingqiu.com/attachment/2025-07-14/dbbklufo8vo7k6jxdz.mp3",
+  "5环":
+    "https://api.shelingxingqiu.com/attachment/2025-07-14/dbbklkzq7lrbfpr6ij.mp3",
+  "6环":
+    "https://api.shelingxingqiu.com/attachment/2025-07-14/dbbkll0fw7hbmmhxkl.mp3",
+  "7环":
+    "https://api.shelingxingqiu.com/attachment/2025-07-14/dbbkll0fkirkanghmf.mp3",
+  "8环":
+    "https://api.shelingxingqiu.com/attachment/2025-07-14/dbbkll0cly2noykieg.mp3",
+  "9环":
+    "https://api.shelingxingqiu.com/attachment/2025-07-14/dbbkll0gsuumekhpkn.mp3",
+  "10环":
+    "https://api.shelingxingqiu.com/attachment/2025-07-14/dbbklgw2dk22ek7qha.mp3",
+};
+
+class AudioManager {
+  constructor() {
+    this.audioMap = new Map();
+    Object.keys(audioFils).forEach((key) => {
+      const audio = uni.createInnerAudioContext();
+      audio.src = audioFils[key];
+      audio.autoplay = false;
+
+      // 监听加载状态
+      audio.onCanplay(() => {
+        console.log(`音频 ${key} 已加载完成`);
+      });
+
+      audio.onError((res) => {
+        console.log(`音频 ${key} 加载失败：`, res.errMsg);
+      });
+
+      this.audioMap.set(key, audio);
+    });
+  }
+
+  // 播放指定音频
+  play(key) {
+    const audio = this.audioMap.get(key);
+    if (audio) audio.play();
+  }
+
+  // 停止指定音频
+  stop(key) {
+    const audio = this.audioMap.get(key);
+    if (audio) audio.stop();
+  }
+
+  // 销毁所有音频实例
+  destroyAll() {
+    this.audioMap.forEach((audio) => {
+      audio.destroy();
+    });
+    this.audioMap.clear();
+  }
+}
+
+// 导出单例
+export default new AudioManager();

src/components/ShootProgress.vue

@@ -1,5 +1,7 @@
 <script setup>
 import { ref, watch, onMounted, onUnmounted } from "vue";
+import audioManager from "@/audioManager";
+import { MESSAGETYPES } from "@/constants";
 const props = defineProps({
   start: {
     type: Boolean,
@@ -17,22 +19,44 @@ const props = defineProps({
     type: Number,
     default: 0,
   },
-  onTimeIsUp: {
-    type: Function,
-    default: () => {},
-  },
 });
 
 const barColor = ref("#fed847");
 const remain = ref(props.total);
 const timer = ref(null);
 const sound = ref(true);
+const currentSound = ref("");
+const currentRound = ref(0);
+const currentRoundEnded = ref(true);
 
 watch(
   () => props.tips,
   (newVal) => {
-    if (newVal.includes("红队")) barColor.value = "#FF6060";
+    let key = "";
-    if (newVal.includes("蓝队")) barColor.value = "#5FADFF";
+    if (newVal.includes("红队")) {
+      barColor.value = "#FF6060";
+      key = "请红方射击";
+    }
+    if (newVal.includes("蓝队")) {
+      barColor.value = "#5FADFF";
+      key = "请蓝方射击";
+    }
+    if (key && sound.value) {
+      if (currentRoundEnded.value) {
+        currentRound.value += 1;
+        currentRoundEnded.value = false;
+        if (currentRound.value === 1) audioManager.play("第一轮");
+        if (currentRound.value === 2) audioManager.play("第二轮");
+        if (currentRound.value === 3) audioManager.play("第三轮");
+        if (currentRound.value === 4) audioManager.play("第四轮");
+        if (currentRound.value === 5) audioManager.play("第五轮");
+        setTimeout(() => {
+          audioManager.play(key);
+        }, 1000);
+      } else {
+        audioManager.play(key);
+      }
+    }
   },
   {
     immediate: true,
@@ -45,11 +69,7 @@ watch(
     if (timer.value) clearInterval(timer.value);
     remain.value = props.total;
     timer.value = setInterval(() => {
-      if (remain.value > 0) {
+      if (remain.value > 0) remain.value--;
-        remain.value--;
-      } else {
-        props.onTimeIsUp();
-      }
     }, 1000);
   }
 );
@@ -62,15 +82,9 @@ watch(
     }
     if (newVal) {
       remain.value = props.total;
-      // setTimeout(() => {
       timer.value = setInterval(() => {
-        if (remain.value > 0) {
+        if (remain.value > 0) remain.value--;
-          remain.value--;
-        } else {
-          props.onTimeIsUp();
-        }
       }, 1000);
-      // }, 3000);
     } else {
       if (timer.value) clearInterval(timer.value);
     }
@@ -84,20 +98,59 @@ const updateRemain = (value) => {
   if (timer.value) clearInterval(timer.value);
   remain.value = Math.floor(value);
   timer.value = setInterval(() => {
-    if (remain.value > 0) {
+    if (remain.value > 0) remain.value--;
-      remain.value--;
-    } else {
-      props.onTimeIsUp();
-    }
   }, 1000);
 };
 
+const updateSound = () => {
+  sound.value = !sound.value;
+  if (!sound.value) audioManager.stop(currentSound.value);
+};
+
+async function onReceiveMessage(messages = []) {
+  if (!sound.value) return;
+  messages.forEach((msg) => {
+    if (
+      msg.constructor === MESSAGETYPES.ShootSyncMeArrowID ||
+      msg.constructor === MESSAGETYPES.ShootResult
+    ) {
+      if (msg.target) {
+        currentSound.value = msg.target.ring
+          ? `${msg.target.ring}环`
+          : "未上靶";
+        audioManager.play(currentSound.value);
+      }
+    } else if (msg.constructor === MESSAGETYPES.AllReady) {
+      audioManager.play("比赛开始");
+    } else if (msg.constructor === MESSAGETYPES.MeleeAllReady) {
+      audioManager.play("比赛开始");
+    } else if (msg.constructor === MESSAGETYPES.CurrentRoundEnded) {
+      currentRoundEnded.value = true;
+    } else if (msg.constructor === MESSAGETYPES.HalfTimeOver) {
+      audioManager.play("中场休息");
+    } else if (msg.constructor === MESSAGETYPES.MatchOver) {
+      audioManager.play("比赛结束");
+    } else if (msg.constructor === MESSAGETYPES.FinalShoot) {
+      audioManager.play("决金箭轮");
+    }
+  });
+}
+
+const playSound = (key) => {
+  currentSound.value = key;
+  audioManager.play(key);
+};
+
 onMounted(() => {
   uni.$on("update-ramain", updateRemain);
+  uni.$on("socket-inbox", onReceiveMessage);
+  uni.$on("play-sound", playSound);
 });
 
 onUnmounted(() => {
   uni.$off("update-ramain", updateRemain);
+  uni.$off("socket-inbox", onReceiveMessage);
+  uni.$off("play-sound", playSound);
   if (timer.value) clearInterval(timer.value);
 });
 </script>
@@ -107,7 +160,7 @@ onUnmounted(() => {
     <view>
       <image src="../static/shooter.png" mode="widthFix" />
       <text>{{ start && remain === 0 ? "时间到！" : tips }}</text>
-      <button hover-class="none" @click="() => (sound = !sound)">
+      <button hover-class="none" @click="updateSound">
         <image
           :src="`../static/sound${sound ? '' : '-off'}-yellow.png`"
           mode="widthFix"

src/pages/first-try.vue

@@ -126,6 +126,9 @@ const nextStep = async () => {
     scores.value = [];
     step.value = 4;
     start.value = true;
+    setTimeout(() => {
+      uni.$emit("play-sound", "请开始射击");
+    }, 300);
   } else if (step.value === 5) {
     uni.navigateBack({
       delta: 1,

src/pages/practise-one.vue

@@ -33,6 +33,9 @@ const onReady = async () => {
   currentRound.value = 0;
   scores.value = [];
   start.value = true;
+  setTimeout(() => {
+    uni.$emit("play-sound", "请开始射击");
+  }, 300);
 };
 
 async function onReceiveMessage(messages = []) {

src/pages/practise-two.vue

@@ -31,6 +31,9 @@ const onReady = async () => {
   if (result) practiseId.value = result.id;
   scores.value = [];
   start.value = true;
+  setTimeout(() => {
+    uni.$emit("play-sound", "请开始射击");
+  }, 300);
 };
 
 async function onReceiveMessage(messages = []) {