From 2d417cd6315f37c7c714b1a7dd8ed94123db357f Mon Sep 17 00:00:00 2001 From: ZF sun <34314687@qq.com> Date: Mon, 15 Dec 2025 18:26:49 +0800 Subject: [PATCH] =?UTF-8?q?chore:=20=E5=8F=AF=E4=BB=A5=E4=B8=8A=E4=BC=A0?= =?UTF-8?q?=E6=92=AD=E6=94=BE=E7=89=88=E6=9C=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/services/configService.js | 7 ++++++- src/utils/musicPlayer.js | 34 +++++++++++++++++++++++++++--- src/views/AdminPanel.vue | 2 +- src/views/BattleRanking.vue | 39 ++++++++++++++++++++++++++++++++++- 4 files changed, 76 insertions(+), 6 deletions(-) diff --git a/src/services/configService.js b/src/services/configService.js index 9a4ae75..f3dac1d 100644 --- a/src/services/configService.js +++ b/src/services/configService.js @@ -359,7 +359,12 @@ export const getMusicConfig = async () => { */ export const saveMusicConfig = async (musicConfig) => { const config = await readConfig(); - config.music = musicConfig; + // 确保音量是数字类型 + const normalizedMusicConfig = { + ...musicConfig, + volume: typeof musicConfig.volume === 'string' ? parseFloat(musicConfig.volume) : musicConfig.volume + }; + config.music = normalizedMusicConfig; return await writeConfig(config); }; diff --git a/src/utils/musicPlayer.js b/src/utils/musicPlayer.js index 2a78c5f..4b02f01 100644 --- a/src/utils/musicPlayer.js +++ b/src/utils/musicPlayer.js @@ -3,7 +3,7 @@ class MusicPlayer { constructor() { this.audio = null; this.isPlaying = false; - this.defaultPath = "/assets/music/background.mp3"; + this.defaultPath = ""; this.enabled = false; this.volume = 0.5; // 默认音量50% } @@ -23,36 +23,55 @@ class MusicPlayer { * @param {boolean} enabled 播放开关 */ initMusicConfig(filePath, enabled, volume = 0.5) { + console.log("初始化音乐配置：", { filePath, enabled, volume }); + this.enabled = enabled; - this.volume = volume; + // 确保音量是数字类型 + this.volume = typeof volume === 'string' ? parseFloat(volume) : volume; + console.log("处理后的音量值：", this.volume, "类型：", typeof this.volume); + let validPath = this.defaultPath; if (filePath && filePath.endsWith('.mp3')) { validPath = filePath; } else if (filePath) { console.warn(`音乐路径无效（非MP3格式）：${filePath}，使用兜底路径`); } + + console.log("使用的音乐路径：", validPath); + if (this.audio) { this.audio.pause(); this.audio = null; } + this.audio = new Audio(validPath); this.audio.loop = true; this.audio.volume = this.volume; + + console.log("音频对象创建完成，音量设置为：", this.audio.volume); } /** * 播放音乐（保留原有逻辑，适配开关） */ play() { + console.log("调用 play 方法，当前状态：", { enabled: this.enabled, hasAudio: !!this.audio, isPlaying: this.isPlaying }); + if (!this.enabled) { console.log("首页播放开关未开启，跳过音乐播放"); return; } + if (!this.audio) { + console.warn("音频对象未初始化"); this.initMusicConfig(this.defaultPath, false); console.warn("未初始化音乐配置，使用兜底路径且关闭播放开关"); return; } + + console.log("音频源路径：", this.audio.src); + console.log("音频就绪状态：", this.audio.readyState); + if (!this.isPlaying) { this.audio.play() .then(() => { @@ -61,8 +80,15 @@ class MusicPlayer { }) .catch(err => { console.error("音乐播放失败（浏览器自动播放限制/路径错误）：", err); + console.error("错误详情：", { + name: err.name, + message: err.message, + code: err.code + }); this.isPlaying = false; }); + } else { + console.log("音乐已在播放中"); } } @@ -93,8 +119,10 @@ setMuted(muted) { */ setVolume(volume) { if (this.audio) { + // 确保音量是数字类型 + const numericVolume = typeof volume === 'string' ? parseFloat(volume) : volume; // 限制音量范围在0.0到1.0之间 - this.volume = Math.max(0, Math.min(1, volume)); + this.volume = Math.max(0, Math.min(1, numericVolume)); this.audio.volume = this.volume; console.log(`音乐音量已设置为: ${Math.round(this.volume * 100)}%`); } diff --git a/src/views/AdminPanel.vue b/src/views/AdminPanel.vue index 1ed7039..66f30c9 100644 --- a/src/views/AdminPanel.vue +++ b/src/views/AdminPanel.vue @@ -1488,7 +1488,7 @@ const saveData = async () => { currentConfig.music = { enabled: musicEnabled.value, filePath: currentMusicPath.value, - volume: musicVolume.value + volume: parseFloat(musicVolume.value) // 确保音量是数字类型 }; // 一次性保存所有配置 diff --git a/src/views/BattleRanking.vue b/src/views/BattleRanking.vue index f1f6069..c077878 100644 --- a/src/views/BattleRanking.vue +++ b/src/views/BattleRanking.vue @@ -406,13 +406,18 @@ const taskSettings = ref({ const localMusicConfig = ref({ enabled: true, - filePath: '' + filePath: '', + volume: 1 }); // 添加首次交互处理函数 const handleFirstInteraction = () => { + console.log("用户首次交互触发"); if (localMusicConfig.value.enabled) { + console.log("尝试播放音乐..."); musicPlayer.play(); + } else { + console.log("音乐未启用，跳过播放"); } }; @@ -447,6 +452,11 @@ onBeforeMount(async () => { if (config.music) { localMusicConfig.value = config.music; + console.log("从服务器加载的音乐配置:", config.music); + console.log("音乐文件路径:", config.music.filePath); + console.log("音乐是否启用:", config.music.enabled); + console.log("音乐音量:", config.music.volume); + console.log("音量类型:", typeof config.music.volume); } @@ -895,15 +905,42 @@ onMounted(async () => { try { // 异步初始化数据 await initializeData(); + + localMusicConfig.value = await readConfig().music; + if (localMusicConfig.value.enabled) { // 获取音量设置，如果没有则使用默认值0.5 const volume = localMusicConfig.value.volume !== undefined ? localMusicConfig.value.volume : 0.5; + console.log("音乐配置信息:", localMusicConfig.value); + console.log("音乐文件路径:", localMusicConfig.value.filePath); + console.log("音乐是否启用:", localMusicConfig.value.enabled); + console.log("音乐音量:", volume); + console.log("音量类型:", typeof volume); + + // 检查音乐文件是否存在 + if (localMusicConfig.value.filePath) { + console.log("正在检查音乐文件是否存在..."); + fetch(localMusicConfig.value.filePath) + .then(response => { + console.log("音乐文件状态:", response.status, response.statusText); + if (response.ok) { + console.log("音乐文件存在，可以正常访问"); + } else { + console.error("音乐文件无法访问，状态码:", response.status); + } + }) + .catch(error => { + console.error("检查音乐文件时出错:", error); + }); + } + musicPlayer.initMusicConfig(localMusicConfig.value.filePath, localMusicConfig.value.enabled, volume); // 注意：由于浏览器自动播放策略限制，这里不直接调用play() // 而是等待用户的第一次交互（点击）后再播放 console.log("音乐已准备就绪，等待用户首次交互后播放..."); } else { musicPlayer.pause(); + console.log("音乐未启用，已暂停"); } // 更新本地显示配置，确保columnAlignments属性存在 if (displayConfig) {