已在播放列表（PlaylistDrawer）中添加了播放模式切换按钮

index.html

@@ -640,14 +640,34 @@
             );
         };
 
-        const PlaylistDrawer = ({ playlist, currentSong, playSong, onClose, clearPlaylist, deleteSong }) => (
+        const PlaylistDrawer = ({ playlist, currentSong, playSong, onClose, clearPlaylist, deleteSong, mode, toggleMode }) => {
+            const getModeText = () => {
+                switch(mode) {
+                    case 'one': return '单曲循环';
+                    case 'shuffle': return '随机播放';
+                    default: return '列表循环';
+                }
+            };
+
+            return (
                 <div className="fixed inset-0 z-50 flex flex-col justify-end bg-black/60 backdrop-blur-sm animate-[fadeIn_0.2s]" onClick={onClose}>
                     <div className="bg-gray-900/90 backdrop-blur-xl rounded-t-2xl max-h-[70vh] flex flex-col border-t border-white/10" onClick={e => e.stopPropagation()}>
                         <div className="p-4 border-b border-white/10 flex justify-between items-center sticky top-0 z-10">
+                            <div className="flex items-center gap-3">
                                 <h3 className="text-lg font-bold">当前播放 <span className="text-gray-500 text-sm font-normal">({playlist.length})</span></h3>
-                        <div className="flex gap-4">
+                                {playlist.length > 0 && (
-                            <Icon name="trash-can" onClick={clearPlaylist} className="text-gray-400 hover:text-red-500" />
+                                    <button
-                            <Icon name="xmark" onClick={onClose} className="text-gray-400 hover:text-white" />
+                                        onClick={toggleMode}
+                                        className="flex items-center gap-1.5 px-2 py-1 rounded-full bg-white/10 hover:bg-white/20 text-xs font-medium text-gray-300 hover:text-white transition-colors"
+                                    >
+                                        <Icon name={mode === 'one' ? '1' : (mode === 'shuffle' ? 'shuffle' : 'repeat')} size="text-xs" />
+                                        <span>{getModeText()}</span>
+                                    </button>
+                                )}
+                            </div>
+                            <div className="flex gap-4 items-center">
+                                <Icon name="trash-can" onClick={clearPlaylist} className="text-gray-400 hover:text-red-500 transition-colors" />
+                                <Icon name="xmark" onClick={onClose} className="text-gray-400 hover:text-white transition-colors" />
                             </div>
                         </div>
                         <div className="overflow-y-auto flex-1 hide-scrollbar p-2">
@@ -672,6 +692,7 @@
                     </div>
                 </div>
             );
+        };
 
         const TopListPage = ({ source, onBack, onPlaySong, onLike, isLiked }) => {
             const [lists, setLists] = useState([]);
@@ -1323,6 +1344,8 @@
                             onClose={() => setShowPlaylist(false)}
                             clearPlaylist={() => { setPlaylist([]); setCurrentSong(null); setIsPlaying(false); }}
                             deleteSong={deleteFromPlaylist}
+                            mode={mode}
+                            toggleMode={toggleMode}
                         />
                     )}
                 </div>