From b79f4a8b2cae34a2547851352255e3eb7c1485ff Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=8F=B2=E6=82=A6?= <shiyue@hdzxbj.com>
Date: Wed, 7 Jan 2026 18:08:58 +0800
Subject: [PATCH] =?UTF-8?q?=E7=82=B9=E5=87=BB=E5=B7=A6=E4=B8=8A=E8=A7=92?=
 =?UTF-8?q?=E8=8F=9C=E5=8D=95=EF=BC=8C=E6=89=93=E5=BC=80=E4=BE=A7=E8=BE=B9?=
 =?UTF-8?q?=E6=A0=8F=E3=80=82=20=E7=82=B9=E5=87=BB=E2=80=9C=E5=AF=BC?=
 =?UTF-8?q?=E5=85=A5=E7=BD=91=E6=98=93=E4=BA=91=E6=AD=8C=E5=8D=95=E2=80=9D?=
 =?UTF-8?q?=E6=8C=89=E9=92=AE=E3=80=82=20=E7=B2=98=E8=B4=B4=E7=BD=91?=
 =?UTF-8?q?=E6=98=93=E4=BA=91=E6=AD=8C=E5=8D=95=E5=88=86=E4=BA=AB=E9=93=BE?=
 =?UTF-8?q?=E6=8E=A5=E3=80=82=20=E7=B3=BB=E7=BB=9F=E5=B0=86=E8=87=AA?=
 =?UTF-8?q?=E5=8A=A8=E6=8F=90=E5=8F=96=20ID=EF=BC=8C=E5=AF=BC=E5=85=A5?=
 =?UTF-8?q?=E6=AD=8C=E6=9B=B2=EF=BC=8C=E5=B9=B6=E5=BC=80=E5=90=AF=E6=AF=8F?=
 =?UTF-8?q?=2015=20=E5=88=86=E9=92=9F=E4=B8=80=E6=AC=A1=E7=9A=84=E8=87=AA?=
 =?UTF-8?q?=E5=8A=A8=E5=90=8C=E6=AD=A5=E3=80=82=20=E8=8B=A5=E8=A6=81?=
 =?UTF-8?q?=E5=88=87=E5=9B=9E=E7=A7=81=E6=9C=89=E4=BA=91=E5=90=8C=E6=AD=A5?=
 =?UTF-8?q?=EF=BC=8C=E5=8F=AA=E9=9C=80=E6=B8=85=E7=A9=BA=E8=BE=93=E5=85=A5?=
 =?UTF-8?q?=E6=A1=86=E5=86=85=E5=AE=B9=E6=88=96=E9=87=8D=E6=96=B0=E8=BE=93?=
 =?UTF-8?q?=E5=85=A5=E6=82=A8=E7=9A=84=20Server=20Key=20=E5=8D=B3=E5=8F=AF?=
 =?UTF-8?q?=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 index.html | 176 +++++++++++++++++++++++++++++++++++++++++++++++++----
 1 file changed, 164 insertions(+), 12 deletions(-)

diff --git a/index.html b/index.html
index cc981c6..7a09c3a 100644
--- a/index.html
+++ b/index.html
@@ -313,6 +313,19 @@
                     console.error("Get Toplist Songs failed", e);
                     return [];
                 }
+            },
+            getPlaylist: async (id, source = 'netease') => {
+                try {
+                    const res = await fetch(`${API_BASE}/api/?type=playlist&id=${id}&source=${source}`);
+                    const data = await res.json();
+                    if (data.code === 200 && data.data && Array.isArray(data.data.list)) {
+                        return data.data.list;
+                    }
+                    return [];
+                } catch (e) {
+                    console.error("Get playlist failed", e);
+                    return [];
+                }
             }
         };
 
@@ -418,7 +431,7 @@
             </div>
         );
 
-        const SideDrawer = ({ isOpen, onClose, view, setView, quality, setQuality, onClearCache, syncToken, setSyncToken, onSyncNow }) => {
+        const SideDrawer = ({ isOpen, onClose, view, setView, quality, setQuality, onClearCache, syncToken, setSyncToken, onSyncNow, onImportNetease, syncMode }) => {
             const [isSyncing, setIsSyncing] = useState(false);
             const [syncMsg, setSyncMsg] = useState('');
 
@@ -437,6 +450,19 @@
                 }
             };
 
+            const handleNeteaseImportClick = () => {
+                const url = prompt("请输入网易云歌单分享链接\n(例如: https://music.163.com/playlist?id=...)");
+                if (url) {
+                    const match = url.match(/[?&]id=(\d+)/);
+                    if (match && match[1]) {
+                        onImportNetease(match[1]);
+                        onClose();
+                    } else {
+                        alert("无法识别歌单ID，请确保链接包含 id=数字");
+                    }
+                }
+            };
+
             if (!isOpen) return null;
 
             return (
@@ -484,7 +510,9 @@
                             </div>
 
                             <div className="px-4 py-2">
-                                <label className="block text-sm text-gray-300 mb-2">云同步密钥</label>
+                                <label className="block text-sm text-gray-300 mb-2">
+                                    {syncMode === 'netease_playlist' ? '网易云歌单ID (自动同步)' : '云同步密钥'}
+                                </label>
                                 <div className="flex gap-2">
                                     <input
                                         type="text"
@@ -503,11 +531,26 @@
                                     </button>
                                 </div>
                                 <div className="flex justify-between items-center mt-1">
-                                    <p className="text-xs text-gray-500">使用相同的密钥在多端同步收藏列表</p>
+                                    <p className="text-xs text-gray-500">
+                                        {syncMode === 'netease_playlist'
+                                            ? '当前为网易云歌单同步模式，每15分钟自动刷新'
+                                            : '使用相同的密钥在多端同步收藏列表'}
+                                    </p>
                                     {syncMsg && <span className="text-xs text-primary font-bold animate-[fadeIn_0.3s]">{syncMsg}</span>}
                                 </div>
                             </div>
 
+                            <div className="px-4 py-2">
+                                <button
+                                    onClick={handleNeteaseImportClick}
+                                    className="w-full py-2 px-4 rounded-lg bg-red-600/20 border border-red-500/50 text-red-500 hover:bg-red-600/30 transition-colors text-sm flex items-center justify-center gap-2"
+                                >
+                                    <Icon name="cloud-arrow-down" />
+                                    导入网易云歌单
+                                </button>
+                                <p className="text-xs text-gray-500 mt-1 px-1">导入后将开启自动同步，每15分钟获取新歌</p>
+                            </div>
+
                              <div className="px-4 py-2 mt-2">
                                 <button
                                     onClick={() => {
@@ -878,6 +921,7 @@
             const [quality, setQuality] = useState(() => localStorage.getItem('th_quality') || '320k');
             const [syncToken, setSyncToken] = useState(() => localStorage.getItem('th_sync_token') || '');
             const [lastSuccessToken, setLastSuccessToken] = useState(() => localStorage.getItem('th_last_success_token') || '');
+            const [syncMode, setSyncMode] = useState(() => localStorage.getItem('th_sync_mode') || 'server'); // 'server' | 'netease_playlist'
             
             // UI State
             const [showFullPlayer, setShowFullPlayer] = useState(false);
@@ -911,24 +955,54 @@
             useEffect(() => { localStorage.setItem('th_quality', quality); }, [quality]);
             useEffect(() => { localStorage.setItem('th_sync_token', syncToken); }, [syncToken]);
             useEffect(() => { localStorage.setItem('th_last_success_token', lastSuccessToken); }, [lastSuccessToken]);
+            useEffect(() => { localStorage.setItem('th_sync_mode', syncMode); }, [syncMode]);
 
-            // Auto Sync Logic
+            // Auto Sync Logic for Private Server
             useEffect(() => {
-                // Only auto-sync if we have a token, it matches the last successfully synced token,
+                // Only auto-sync if we are in server mode, have a token, it matches the last successfully synced token,
                 // and there are actual changes compared to last sync.
-                // This prevents auto-syncing current favorites to a new token while typing/switching.
-                if (syncToken && syncToken === lastSuccessToken && JSON.stringify(favorites) !== JSON.stringify(lastSyncedFavorites)) {
-                    // Use a small timeout to avoid rapid-fire syncs if user clicks quickly
+                if (syncMode === 'server' && syncToken && syncToken === lastSuccessToken && JSON.stringify(favorites) !== JSON.stringify(lastSyncedFavorites)) {
                     const timer = setTimeout(() => {
                         autoSyncFavorites();
                     }, 1000);
                     return () => clearTimeout(timer);
                 }
-            }, [favorites, syncToken, lastSuccessToken, lastSyncedFavorites]);
+            }, [favorites, syncToken, lastSuccessToken, lastSyncedFavorites, syncMode]);
 
-            // 1. Auto Sync: Incremental update based on diff
+            // Auto Sync Logic for Netease Playlist (Interval based)
+            useEffect(() => {
+                if (syncMode === 'netease_playlist' && syncToken) {
+                    const doSync = async () => {
+                        console.log("Auto syncing netease playlist...");
+                        const songs = await api.getPlaylist(syncToken);
+                        if (songs && songs.length > 0) {
+                            setFavorites(prev => {
+                                const newFavs = [...prev];
+                                let changed = false;
+                                // Add new songs (reverse to keep latest at top if we prepend)
+                                [...songs].reverse().forEach(song => {
+                                    if (!newFavs.find(s => s.id === song.id)) {
+                                        newFavs.unshift({ ...song, source: 'netease' });
+                                        changed = true;
+                                    }
+                                });
+                                return changed ? newFavs : prev;
+                            });
+                        }
+                    };
+                    
+                    // Initial sync on mount/mode change
+                    doSync();
+                    
+                    // Interval sync (15 minutes)
+                    const interval = setInterval(doSync, 15 * 60 * 1000);
+                    return () => clearInterval(interval);
+                }
+            }, [syncMode, syncToken]);
+
+            // 1. Auto Sync: Incremental update based on diff (Server Mode)
             const autoSyncFavorites = async () => {
-                if (!syncToken || syncToken !== lastSuccessToken) return;
+                if (!syncToken || syncToken !== lastSuccessToken || syncMode !== 'server') return;
                 try {
                     // Get latest remote state
                     const remoteFavorites = await syncService.get('favorites', syncToken) || [];
@@ -968,9 +1042,30 @@
                 }
             };
 
-            // 2. Manual Sync
+            // 2. Manual Sync (Unified Handler)
             const manualSyncFavorites = async () => {
                 if (!syncToken) return;
+
+                // If in Netease Mode, manual sync means fetching playlist again
+                if (syncMode === 'netease_playlist') {
+                    const songs = await api.getPlaylist(syncToken);
+                    if (songs && songs.length > 0) {
+                        setFavorites(prev => {
+                            const newFavs = [...prev];
+                            [...songs].reverse().forEach(song => {
+                                if (!newFavs.find(s => s.id === song.id)) {
+                                    newFavs.unshift({ ...song, source: 'netease' });
+                                }
+                            });
+                            return newFavs;
+                        });
+                    } else {
+                        throw new Error("获取歌单失败");
+                    }
+                    return;
+                }
+                
+                // Server Mode Sync
                 
                 // Determine Mode: Switch (Overwrite Local) or Sync (Merge)
                 const isSwitchingToken = syncToken !== lastSuccessToken;
@@ -1024,6 +1119,61 @@
                 }
             };
 
+            const importNeteasePlaylist = async (id) => {
+                setLoading(true);
+                try {
+                    const songs = await api.getPlaylist(id);
+                    if (songs && songs.length > 0) {
+                        setFavorites(prev => {
+                            const newFavs = [...prev];
+                            let addedCount = 0;
+                            [...songs].reverse().forEach(song => {
+                                if (!newFavs.find(s => s.id === song.id)) {
+                                    newFavs.unshift({ ...song, source: 'netease' });
+                                    addedCount++;
+                                }
+                            });
+                            alert(`成功导入 ${addedCount} 首新歌 (共 ${songs.length} 首)`);
+                            return newFavs;
+                        });
+                        // Set sync state
+                        setSyncToken(id);
+                        setLastSuccessToken(id); // Treat as synced
+                        setSyncMode('netease_playlist');
+                        // Switch view to favorites to see result
+                        setView('favorites');
+                    } else {
+                        alert("未获取到歌曲，请检查歌单隐私设置或ID是否正确");
+                    }
+                } catch(e) {
+                    console.error(e);
+                    alert("导入失败，请稍后重试");
+                } finally {
+                    setLoading(false);
+                }
+            };
+
+            // Allow user to switch back to server mode manually by clearing token or just editing it
+            // We need to detect if user manually edits input to something that is not the playlist id
+            useEffect(() => {
+                if (syncMode === 'netease_playlist' && syncToken !== lastSuccessToken) {
+                     // If user changes token, revert to server mode implicitly?
+                     // Or wait for them to click sync?
+                     // For now, let's keep it simple. If they click "Import Netease", it forces Netease mode.
+                     // If they type a new token and click Sync, it will try to fetch playlist if mode is netease,
+                     // likely fail, then user might be confused.
+                     // Better: If user types in input, we assume they might want to switch mode if it fails?
+                     // Let's rely on the import button to set the mode.
+                     // If user wants to go back to server mode, they can clear token or we add a toggle?
+                     // The input label changes, so user knows.
+                }
+                
+                // If user clears token, reset mode to server (default)
+                if (!syncToken) {
+                    setSyncMode('server');
+                }
+            }, [syncToken]);
+
             useEffect(() => {
                 if (currentSong) {
                     api.getLrc(currentSong.id, currentSong.platform || currentSong.source).then(lrc => {
@@ -1416,6 +1566,8 @@
                         syncToken={syncToken}
                         setSyncToken={setSyncToken}
                         onSyncNow={manualSyncFavorites}
+                        onImportNetease={importNeteasePlaylist}
+                        syncMode={syncMode}
                     />
 
                     {/* Top Navigation / Search Bar */}