fix(AudioPlayer): 修复音频列表为空时的渲染问题

修复了当音频列表为空时，AudioPlayer组件渲染出错的问题。通过在StudyDetailPage.vue中添加条件渲染，确保只有在音频列表不为空时才渲染AudioPlayer组件。同时，在AudioPlayer.vue中增加了对currentSong和song属性的可选链操作，防止未定义时的错误。

 <!--
  * @Date: 2025-04-07 12:35:35
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2025-05-08 10:20:49
+ * @LastEditTime: 2025-05-16 16:50:23
  * @FilePath: /mlaj/src/components/ui/AudioPlayer.vue
  * @Description: 音频播放器组件，支持播放控制、进度条调节、音量控制、播放列表等功能
 -->
@@ -12,13 +12,13 @@
     <div class="flex flex-col items-center mb-4">
       <!-- 歌曲封面 -->
       <div class="w-24 h-24 rounded-lg overflow-hidden mb-2">
-        <img :src="currentSong.cover" alt="封面" class="w-full h-full object-cover">
+        <img :src="currentSong?.cover" alt="封面" class="w-full h-full object-cover">
       </div>
 
       <!-- 歌曲信息 -->
       <div class="text-center">
-        <h3 class="text-base font-medium">{{ currentSong.title }}</h3>
-        <p class="text-xs text-gray-500">{{ currentSong.artist }}</p>
+        <h3 class="text-base font-medium">{{ currentSong?.title }}</h3>
+        <p class="text-xs text-gray-500">{{ currentSong?.artist }}</p>
       </div>
 
       </div>
@@ -105,11 +105,11 @@
         >
           <div class="absolute top-0 left-0 right-0 h-[1px] bg-gray-200"></div>
           <div class="w-16 h-16 rounded-lg overflow-hidden mr-4 flex-shrink-0">
-            <img :src="song.cover" alt="封面" class="w-full h-full object-cover">
+            <img :src="song?.cover" alt="封面" class="w-full h-full object-cover">
           </div>
           <div class="flex-1">
-            <div class="font-medium">{{ song.title }}</div>
-            <div class="text-sm text-gray-500">{{ song.artist }}</div>
+            <div class="font-medium">{{ song?.title }}</div>
+            <div class="text-sm text-gray-500">{{ song?.artist }}</div>
           </div>
           <font-awesome-icon
             v-if="index === currentIndex && isPlaying"
@@ -275,6 +275,7 @@ const handleVolumeChange = (e) => {
 
 // 监听歌曲列表变化
 watch(() => props.songs, () => {
+  console.warn('歌曲列表变化', props.songs);
   currentIndex.value = 0
   loadAudio()
 }, { deep: true })

@@ -29,7 +29,7 @@
                 <div v-if="course.course_type === 'audio'" class="w-full relative"
                     style="border-bottom: 1px solid #F3F4F6;">
                     <!-- 音频播放器 -->
-                    <AudioPlayer :songs="audioList" />
+                    <AudioPlayer v-if="audioList.length" :songs="audioList" />
                 </div>
                 <!-- 图片列表展示区域 -->
                 <div v-if="course.course_type === 'image'" class="w-full relative">
@@ -359,6 +359,18 @@ const handleLessonClick = async (lesson) => {
         course.value = data;
         courseFile.value = data.file;
 
+        // 更新音频列表数据
+        if (data.course_type === 'audio' && data.file?.list?.length) {
+            audioList.value = data.file.list.map(item => ({
+                title: item.title || '未命名音频',
+                artist: '',
+                url: item.url,
+                cover: item.cover ||  'https://cdn.ipadbiz.cn/mlaj/images/audio_d_cover.jpg'
+            }));
+        } else {
+            audioList.value = [];
+        }
+
         // 获取评论列表
         const comment = await getGroupCommentListAPI({ group_id: data.group_id, schedule_id: data.id });
         if (comment.code) {