Astrian/msr-mod
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 2 Wiki Activity

feat(播放控制): 添加播放队列的上一首和下一首功能

Browse Source 
新增 `playNext` 和 `playPrevious` 函数，用于控制播放队列中的上一首和下一首歌曲。同时为播放按钮绑定点击事件，实现播放控制功能。
This commit is contained in:
Astrian Zheng 2025-05-25 14:19:41 +10:00
parent 595caa0956
commit 3bb49881d7
Signed by: Astrian
SSH Key Fingerprint: SHA256:rVnhx3DAKjujCwWE13aDl7uV6+9U1MvydLkNRXJrBiA
1 changed files with 22 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
src/pages/Playroom.vue
View File

@ -55,6 +55,26 @@ function formatDetector() {
if (format === 'wav') { return 'WAV' }
return '未知格式'
}
function playNext() {
if (playQueueStore.currentIndex === playQueueStore.list.length - 1) {
console.log("at the bottom, pause")
playQueueStore.currentIndex = 0
playQueueStore.isPlaying = false
} else {
playQueueStore.currentIndex++
playQueueStore.isPlaying = true
}
}
function playPrevious() {
if (playQueueStore.currentTime < 5 && playQueueStore.currentIndex > 0) {
playQueueStore.currentIndex--
playQueueStore.isPlaying = true
} else {
playQueueStore.updatedCurrentTime = 0
}
}
</script>
<template>
@ -97,7 +117,7 @@ function formatDetector() {
<div class="flex-1 text-left"></div>
<div class="flex-2 text-center align-center justify-center gap-2 flex">
<button class="text-white flex-1 h-8 flex justify-center items-center rounded-lg hover:bg-white/25">
<button class="text-white flex-1 h-8 flex justify-center items-center rounded-lg hover:bg-white/25" @click="playPrevious">
<div class="w-6 h-6">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
<path
@ -133,7 +153,7 @@ function formatDetector() {
</div>
</button>
<button class="text-white flex-1 h-8 flex justify-center items-center rounded-lg hover:bg-white/25">
<button class="text-white flex-1 h-8 flex justify-center items-center rounded-lg hover:bg-white/25" @click="playNext">
<div class="w-6 h-6">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
<path