feat(AudioPlayer): 添加倍速播放功能并优化播放按钮样式

- 新增倍速播放控件，支持0.5x-2.0x多档调节
- 暴露倍速控制方法给父组件
- 修复播放按钮动画类名错误

@@ -54,7 +54,7 @@
         </button>
         </button>
         <button
         <button
           @click="togglePlay"
           @click="togglePlay"
-          :class="{'paused': !isPlaying, 'opacity-50 cursor-not-allowed': isLoading}"
+          :class="{'playing': isPlaying, 'opacity-50 cursor-not-allowed': isLoading}"
           :disabled="isLoading"
           :disabled="isLoading"
           class="w-12 h-12 flex items-center justify-center rounded-full bg-blue-500 hover:bg-blue-600 transition-colors shadow-lg"
           class="w-12 h-12 flex items-center justify-center rounded-full bg-blue-500 hover:bg-blue-600 transition-colors shadow-lg"
         >
         >
@@ -72,8 +72,17 @@
         </button>
         </button>
       </div>
       </div>
 
 
-    <!-- 播放列表按钮 -->
-    <div class="flex justify-end mt-4">
+    <!-- 倍速播放和播放列表按钮 -->
+    <div class="flex justify-between items-center mt-4">
+      <!-- 倍速播放控件 -->
+      <button 
+        @click="cycleSpeed" 
+        class="flex items-center space-x-1 text-gray-500 hover:text-gray-700 transition-colors px-2 py-1 rounded-md hover:bg-gray-100"
+      >
+        <span class="text-sm font-medium">{{ speed }}x</span>
+      </button>
+
+      <!-- 播放列表按钮 -->
       <button @click="togglePlaylist" class="text-gray-500 hover:text-gray-700 transition-colors">
       <button @click="togglePlaylist" class="text-gray-500 hover:text-gray-700 transition-colors">
         <font-awesome-icon icon="list" class="text-lg" />
         <font-awesome-icon icon="list" class="text-lg" />
       </button>
       </button>
@@ -146,6 +155,7 @@ const volume = ref(100) // 音量值
 const isPlaylistVisible = ref(false) // 播放列表显示状态
 const isPlaylistVisible = ref(false) // 播放列表显示状态
 const speed = ref(1.0) // 播放速度
 const speed = ref(1.0) // 播放速度
 const meta_id = ref(null) // 音频meta_id
 const meta_id = ref(null) // 音频meta_id
+const speedOptions = [0.5, 0.75, 1.0, 1.25, 1.5, 2.0] // 倍速选项
 
 
 // 计算属性
 // 计算属性
 const currentSong = computed(() => props.songs[currentIndex.value]) // 当前播放的歌曲
 const currentSong = computed(() => props.songs[currentIndex.value]) // 当前播放的歌曲
@@ -484,6 +494,34 @@ watch([isPlaying, currentIndex], () => {
   }
   }
 })
 })
 
 
+// 倍速播放相关方法
+/**
+ * 循环切换播放速度
+ */
+const cycleSpeed = () => {
+    const currentIndex = speedOptions.indexOf(speed.value)
+    const nextIndex = (currentIndex + 1) % speedOptions.length
+    const newSpeed = speedOptions[nextIndex]
+    
+    speed.value = newSpeed
+    if (audio.value) {
+        audio.value.playbackRate = newSpeed
+    }
+}
+
+/**
+ * 改变播放速度
+ * @param {number} newSpeed - 新的播放速度
+ */
+const changeSpeed = (newSpeed) => {
+    speed.value = newSpeed
+    if (audio.value) {
+        audio.value.playbackRate = newSpeed
+    }
+}
+
+
+
 
 
 // 暴露给父组件的方法
 // 暴露给父组件的方法
 defineExpose({
 defineExpose({
@@ -502,6 +540,8 @@ defineExpose({
   isPlaying: () => isPlaying.value,
   isPlaying: () => isPlaying.value,
   id: props.id,
   id: props.id,
   getPlayer: () => audio.value,
   getPlayer: () => audio.value,
+  changeSpeed, // 暴露倍速控制方法
+  getCurrentSpeed: () => speed.value, // 暴露获取当前速度方法
 })
 })
 </script>
 </script>
 
 
@@ -554,7 +594,7 @@ button:not(:disabled) {
   }
   }
 }
 }
 
 
-button.paused .fa-pause {
+button.playing .fa-pause {
   animation: pulse 1.5s infinite;
   animation: pulse 1.5s infinite;
 }
 }