diff --git a/data/config.json b/data/config.json index 3064f90..8271f3a 100644 --- a/data/config.json +++ b/data/config.json @@ -864,6 +864,9 @@ "role": "manager" } ], + "musicConfig": { + "enabled": true + }, "displayConfig": { "showBonusModule": true, "individual": { diff --git a/public/assets/music/background.mp3 b/public/assets/music/background.mp3 new file mode 100644 index 0000000..492a449 Binary files /dev/null and b/public/assets/music/background.mp3 differ diff --git a/server.js b/server.js index 20b569b..f339137 100644 --- a/server.js +++ b/server.js @@ -76,7 +76,17 @@ app.post('/api/config', (req, res) => { res.status(500).json({ error: '保存配置文件失败' }); } }); - +// 第78行(新增位置) +// API: 获取音乐配置 +app.get('/api/musicConfig', (req, res) => { + try { + const configData = fs.readFileSync(CONFIG_FILE_PATH, 'utf8'); + const config = JSON.parse(configData); + res.json(config.musicConfig || { enabled: false }); + } catch (error) { + res.status(500).json({ enabled: false }); + } +}); // API: 上传图片 app.post('/api/upload', upload.single('image'), (req, res) => { try { diff --git a/src/router/index.js b/src/router/index.js index 1036b3d..d0f8621 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -1,6 +1,8 @@ import { createRouter, createWebHistory } from 'vue-router'; import BattleRanking from '../views/BattleRanking.vue'; import AdminPanel from '../views/AdminPanel.vue'; +// 新增:引入音乐播放器(写在原有import之后,路由数组之前) +import { musicPlayer } from '@/utils/musicPlayer'; const routes = [ { @@ -26,6 +28,15 @@ const router = createRouter({ history: createWebHistory(), routes }); +// 新增:路由守卫(写在router创建完成后,export router之前) +router.afterEach((to) => { + // 主页面(/)播放,管理员页面(/admin开头)暂停 + if (to.path === '/') { + musicPlayer.play(); + } else if (to.path.startsWith('/admin')) { + musicPlayer.pause(); + } +}); // 全局前置守卫,设置页面标题 router.beforeEach((to, from, next) => { diff --git a/src/services/configService.js b/src/services/configService.js index 65dee1a..ca705e6 100644 --- a/src/services/configService.js +++ b/src/services/configService.js @@ -339,4 +339,15 @@ export const saveBackgroundConfig = async (backgroundConfig) => { const config = await readConfig(); config.backgroundConfig = backgroundConfig; return await writeConfig(config); +}; +// 新增:获取音乐开关配置 +export const getMusicConfig = async () => { + try { + // 调用后端新增的/api/musicConfig接口 + const response = await fetch('http://localhost:3000/api/musicConfig'); + return await response.json(); + } catch (error) { + // 报错时返回默认关闭状态 + return { enabled: false }; + } }; \ No newline at end of file diff --git a/src/utils/musicPlayer.js b/src/utils/musicPlayer.js new file mode 100644 index 0000000..e6f83b3 --- /dev/null +++ b/src/utils/musicPlayer.js @@ -0,0 +1,30 @@ +// 单例模式:全局唯一的音乐播放器 +class MusicPlayer { + constructor() { + // 创建音频实例,指定背景音乐文件路径(需提前把音乐文件放public/assets/music下) + this.audio = new Audio('/assets/music/background.mp3'); + // 默认设置循环播放(满足“循环播放”需求) + this.audio.loop = true; + // 初始状态:未播放 + this.isPlaying = false; + } + + // 播放音乐(仅当配置开启时执行) + play() { + if (!this.isPlaying) { + this.audio.play(); + this.isPlaying = true; + } + } + + // 暂停音乐(切到管理员页面时执行) + pause() { + if (this.isPlaying) { + this.audio.pause(); + this.isPlaying = false; + } + } +} + +// 导出单例,全局使用同一个播放器 +export const musicPlayer = new MusicPlayer(); \ No newline at end of file diff --git a/src/views/BattleRanking.vue b/src/views/BattleRanking.vue index 852120b..9f683f1 100644 --- a/src/views/BattleRanking.vue +++ b/src/views/BattleRanking.vue @@ -215,6 +215,8 @@ import { } from '../data/mockData.js'; import { readConfig } from '../services/configService.js'; +import { getMusicConfig } from '../services/configService.js'; +import { musicPlayer } from '@/utils/musicPlayer'; // 创建默认显示配置的函数 function createDefaultDisplayConfig() { return { @@ -869,7 +871,13 @@ onMounted(async () => { try { // 异步初始化数据 await initializeData(); - + // 新增:加入音乐控制逻辑 + const musicConfig = await getMusicConfig(); + if (musicConfig.enabled) { + musicPlayer.play(); + } else { + musicPlayer.pause(); + } // 更新本地显示配置,确保columnAlignments属性存在 if (displayConfig) { const configCopy = JSON.parse(JSON.stringify(displayConfig)); diff --git a/vite.config.js b/vite.config.js index bbcf80c..b76e0e1 100644 --- a/vite.config.js +++ b/vite.config.js @@ -1,7 +1,12 @@ import { defineConfig } from 'vite' import vue from '@vitejs/plugin-vue' - +import path from 'path' // 新增:引入path模块 // https://vite.dev/config/ export default defineConfig({ plugins: [vue()], + resolve: { // 新增:配置路径别名 + alias: { + '@': path.resolve(__dirname, 'src') // 让@代表项目根目录下的src文件夹 + } + } })