diff --git a/index.html b/index.html
index 1c4e866..83952e1 100644
--- a/index.html
+++ b/index.html
@@ -640,38 +640,59 @@
             );
         };
 
-        const PlaylistDrawer = ({ playlist, currentSong, playSong, onClose, clearPlaylist, deleteSong }) => (
-            <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">
-                        <h3 className="text-lg font-bold">当前播放 <span className="text-gray-500 text-sm font-normal">({playlist.length})</span></h3>
-                        <div className="flex gap-4">
-                            <Icon name="trash-can" onClick={clearPlaylist} className="text-gray-400 hover:text-red-500" />
-                            <Icon name="xmark" onClick={onClose} className="text-gray-400 hover:text-white" />
+        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>
+                                {playlist.length > 0 && (
+                                    <button
+                                        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">
+                            {playlist.length === 0 ? (
+                                <div className="p-12 text-center text-gray-500 flex flex-col items-center">
+                                    <Icon name="music" size="text-4xl" className="mb-4 opacity-30" />
+                                    <p>播放列表为空</p>
+                                </div>
+                            ) : (
+                                playlist.map((song, idx) => (
+                                    <SongItem
+                                        key={`${song.id}-${idx}`}
+                                        song={song}
+                                        isCurrent={currentSong?.id === song.id}
+                                        isPlaying={currentSong?.id === song.id}
+                                        onClick={() => playSong(song)}
+                                        onDelete={() => deleteSong(idx)}
+                                    />
+                                ))
+                            )}
                         </div>
                     </div>
-                    <div className="overflow-y-auto flex-1 hide-scrollbar p-2">
-                        {playlist.length === 0 ? (
-                            <div className="p-12 text-center text-gray-500 flex flex-col items-center">
-                                <Icon name="music" size="text-4xl" className="mb-4 opacity-30" />
-                                <p>播放列表为空</p>
-                            </div>
-                        ) : (
-                            playlist.map((song, idx) => (
-                                <SongItem 
-                                    key={`${song.id}-${idx}`} 
-                                    song={song} 
-                                    isCurrent={currentSong?.id === song.id}
-                                    isPlaying={currentSong?.id === song.id} 
-                                    onClick={() => playSong(song)}
-                                    onDelete={() => deleteSong(idx)}
-                                />
-                            ))
-                        )}
-                    </div>
                 </div>
-            </div>
-        );
+            );
+        };
 
         const TopListPage = ({ source, onBack, onPlaySong, onLike, isLiked }) => {
             const [lists, setLists] = useState([]);
@@ -1316,13 +1337,15 @@
                     )}
 
                     {showPlaylist && (
-                        <PlaylistDrawer 
+                        <PlaylistDrawer
                             playlist={playlist}
                             currentSong={currentSong}
                             playSong={(song) => { setCurrentSong(song); setIsPlaying(true); }}
                             onClose={() => setShowPlaylist(false)}
                             clearPlaylist={() => { setPlaylist([]); setCurrentSong(null); setIsPlaying(false); }}
                             deleteSong={deleteFromPlaylist}
+                            mode={mode}
+                            toggleMode={toggleMode}
                         />
                     )}
                 </div>