fix(音频播放器): 修复音频播放时meta_id传递问题

修正音频播放器组件中meta_id的传递逻辑，确保在播放事件中正确传递当前音频的meta_id。移除不再需要的getId方法，并在音频列表初始化时添加meta_id字段。

fix(音频播放器): 修复音频播放时meta_id传递问题
修正音频播放器组件中meta_id的传递逻辑，确保在播放事件中正确传递当前音频的meta_id。移除不再需要的getId方法，并在音频列表初始化时添加meta_id字段。
hookehuyr
Commit 796a6a89a2d572b840003ef42ee9f9a457c2d434 796a6a89 1 parent bd3e76cb
Showing 2 changed files with 13 additions and 13 deletions
src/components/ui/AudioPlayer.vue
src/views/study/StudyDetailPage.vue
--- a/src/components/ui/AudioPlayer.vue
View file @796a6a8
+++ b/src/components/ui/AudioPlayer.vue
View file @796a6a8
 <!--
  * @Date: 2025-04-07 12:35:35
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2025-06-11 11:58:22
+ * @LastEditTime: 2025-06-11 20:21:09
  * @FilePath: /mlaj/src/components/ui/AudioPlayer.vue
  * @Description: 音频播放器组件，支持播放控制、进度条调节、音量控制、播放列表等功能
 -->
@@ -145,6 +145,7 @@ const progress = ref(0) // 播放进度
 const volume = ref(100) // 音量值
 const isPlaylistVisible = ref(false) // 播放列表显示状态
 const speed = ref(1.0) // 播放速度
+const meta_id = ref(null) // 音频meta_id
 // 计算属性
 const currentSong = computed(() => props.songs[currentIndex.value]) // 当前播放的歌曲
@@ -185,6 +186,7 @@ const loadAudio = async () => {
     audio.value = new Audio(currentSong.value.url)
     audio.value.volume = volume.value / 100
     audio.value.playbackRate = speed.value
+    meta_id.value = currentSong.value.meta_id
     // 添加事件监听
     audio.value.addEventListener('timeupdate', updateProgress)
@@ -241,7 +243,7 @@ const togglePlay = async () => {
       if (audio.value) {
         try {
           await audio.value.play()
-          emit('play', audio.value)
+          emit('play', audio.value, meta_id.value)
         } catch (playError) {
           console.error('播放失败:', playError)
           return
@@ -295,7 +297,7 @@ const prevSong = async () => {
         audio.value.volume = normalizedVolume
         isPlaying.value = true
         // 发射播放事件
-        emit('play', audio.value)
+        emit('play', audio.value, meta_id.value)
       } catch (playError) {
         console.error('播放上一首歌曲失败:', playError)
         isPlaying.value = false
@@ -335,7 +337,7 @@ const nextSong = async () => {
         audio.value.volume = normalizedVolume
         isPlaying.value = true
         // 发射播放事件
-        emit('play', audio.value)
+        emit('play', audio.value, meta_id.value)
       } catch (playError) {
         console.error('播放下一首歌曲失败:', playError)
         isPlaying.value = false
@@ -384,7 +386,7 @@ watch(() => props.songs, () => {
   console.warn('歌曲列表变化', props.songs);
   currentIndex.value = 0
   loadAudio()
-}, { deep: true })
+}, { deep: true, immediate: true })
 // 组件卸载时清理事件监听
 onUnmounted(() => {
@@ -429,7 +431,7 @@ const selectSong = async (index) => {
         await audio.value.play()
         isPlaying.value = true
         // 发射播放事件
-        emit('play', audio.value)
+        emit('play', audio.value, meta_id.value)
         // 关闭播放列表
         isPlaylistVisible.value = false
         // 滚动到当前播放的音频
@@ -481,9 +483,6 @@ defineExpose({
   isPlaying: () => isPlaying.value,
   id: props.id,
   getPlayer: () => audio.value,
-  getId() {
-    return currentSong.value.meta_id || 'meta_id'
-  }
 })
 </script>
--- a/src/views/study/StudyDetailPage.vue
View file @796a6a8
+++ b/src/views/study/StudyDetailPage.vue
View file @796a6a8
@@ -370,6 +370,7 @@ const handleLessonClick = async (lesson) => {
         // 更新音频列表数据
         if (data.course_type === 'audio' && data.file?.list?.length) {
             audioList.value = data.file.list.map(item => ({
+                meta_id: item.meta_id,
                 title: item.title || '未命名音频',
                 artist: '',
                 url: item.url,
@@ -713,10 +714,10 @@ const downloadFile = ({ title, url, meta_id }) => {
  * 音频播放事件
  * @param audio 音频对象
  */
-const onAudioPlay = (audio) => {
+const onAudioPlay = (audio, meta_id) => {
     console.log('开始播放音频', audio);
     // 学习时长埋点开始
-    startAction();
+    startAction({meta_id});
 }
 /**
@@ -787,10 +788,10 @@ const startAction = (item) => {
         // 更新当前播放位置（如果是音频播放）
         if (audioPlayerRef.value && audioPlayerRef.value.getPlayer()) {
             audioPosition.value = audioPlayerRef.value.getPlayer().currentTime;
-            console.log('音频总时长:', audioDuration.value, '当前位置:', audioPosition.value, 'id:', audioPlayerRef.value.getId());
+            console.log('音频总时长:', audioDuration.value, '当前位置:', audioPosition.value, 'id:', item?.meta_id);
             paramsObj = {
                 schedule_id: courseId.value,
-                meta_id: audioPlayerRef.value.getId(),
+                meta_id: item?.meta_id,
                 media_duration: audioDuration.value,
                 playback_position: audioPosition.value,
                 playback_id: uuid,