清空增加确认框

src/components/ContinueWatching.tsx

@@ -2,6 +2,8 @@
 'use client';
 
 import { useEffect, useState } from 'react';
+import { createPortal } from 'react-dom';
+import { AlertTriangle } from 'lucide-react';
 
 import type { PlayRecord } from '@/lib/db.client';
 import {
@@ -22,6 +24,7 @@ export default function ContinueWatching({ className }: ContinueWatchingProps) {
     (PlayRecord & { key: string })[]
   >([]);
   const [loading, setLoading] = useState(true);
+  const [showConfirmDialog, setShowConfirmDialog] = useState(false);
 
   // 处理播放记录数据更新的函数
   const updatePlayRecords = (allRecords: Record<string, PlayRecord>) => {
@@ -85,24 +88,29 @@ export default function ContinueWatching({ className }: ContinueWatchingProps) {
     return { source, id };
   };
 
+  // 处理清空确认
+  const handleClearConfirm = async () => {
+    await clearAllPlayRecords();
+    setPlayRecords([]);
+    setShowConfirmDialog(false);
+  };
+
   return (
-    <section className={`mb-8 ${className || ''}`}>
+    <>
-      <div className='mb-4 flex items-center justify-between'>
+      <section className={`mb-8 ${className || ''}`}>
-        <h2 className='text-xl font-bold text-gray-800 dark:text-gray-200'>
+        <div className='mb-4 flex items-center justify-between'>
-          继续观看
+          <h2 className='text-xl font-bold text-gray-800 dark:text-gray-200'>
-        </h2>
+            继续观看
-        {!loading && playRecords.length > 0 && (
+          </h2>
-          <button
+          {!loading && playRecords.length > 0 && (
-            className='text-sm text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200'
+            <button
-            onClick={async () => {
+              className='text-sm text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200'
-              await clearAllPlayRecords();
+              onClick={() => setShowConfirmDialog(true)}
-              setPlayRecords([]);
+            >
-            }}
+              清空
-          >
+            </button>
-            清空
+          )}
-          </button>
+        </div>
-        )}
-      </div>
       {loading ? (
         // 加载状态显示灰色占位数据（使用原始 ScrollableRow）
         <div className="flex gap-2 overflow-x-auto scrollbar-hide">
@@ -158,5 +166,53 @@ export default function ContinueWatching({ className }: ContinueWatchingProps) {
         </VirtualScrollableRow>
       )}
     </section>
+
+    {/* 确认对话框 */}
+    {showConfirmDialog && createPortal(
+      <div
+        className='fixed inset-0 bg-black bg-opacity-50 z-[9999] flex items-center justify-center p-4 transition-opacity duration-300'
+        onClick={() => setShowConfirmDialog(false)}
+      >
+        <div
+          className='bg-white dark:bg-gray-800 rounded-lg shadow-xl max-w-md w-full border border-red-200 dark:border-red-800 transition-all duration-300'
+          onClick={(e) => e.stopPropagation()}
+        >
+          <div className="p-6">
+            {/* 图标和标题 */}
+            <div className="flex items-start gap-4 mb-4">
+              <div className="flex-shrink-0">
+                <AlertTriangle className="w-8 h-8 text-red-500" />
+              </div>
+              <div className="flex-1">
+                <h3 className="text-lg font-semibold text-gray-900 dark:text-gray-100 mb-2">
+                  清空播放记录
+                </h3>
+                <p className="text-sm text-gray-600 dark:text-gray-400">
+                  确定要清空所有播放记录吗？此操作不可恢复。
+                </p>
+              </div>
+            </div>
+
+            {/* 按钮组 */}
+            <div className="flex gap-3 mt-6">
+              <button
+                onClick={() => setShowConfirmDialog(false)}
+                className="flex-1 px-4 py-2 text-sm font-medium text-gray-700 dark:text-gray-300 bg-gray-100 dark:bg-gray-700 hover:bg-gray-200 dark:hover:bg-gray-600 rounded-lg transition-colors"
+              >
+                取消
+              </button>
+              <button
+                onClick={handleClearConfirm}
+                className="flex-1 px-4 py-2 text-sm font-medium text-white bg-red-600 hover:bg-red-700 rounded-lg transition-colors"
+              >
+                确定清空
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>,
+      document.body
+    )}
+  </>
   );
 }

src/components/FavoritesPanel.tsx

@@ -2,8 +2,9 @@
 
 'use client';
 
-import { Star, X } from 'lucide-react';
+import { Star, X, AlertTriangle } from 'lucide-react';
 import { useEffect, useState } from 'react';
+import { createPortal } from 'react-dom';
 
 import {
   clearAllFavorites,
@@ -37,6 +38,7 @@ export const FavoritesPanel: React.FC<FavoritesPanelProps> = ({
 }) => {
   const [favoriteItems, setFavoriteItems] = useState<FavoriteItem[]>([]);
   const [loading, setLoading] = useState(false);
+  const [showConfirmDialog, setShowConfirmDialog] = useState(false);
 
   // 加载收藏数据
   const loadFavorites = async () => {
@@ -83,6 +85,7 @@ export const FavoritesPanel: React.FC<FavoritesPanelProps> = ({
     try {
       await clearAllFavorites();
       setFavoriteItems([]);
+      setShowConfirmDialog(false);
     } catch (error) {
       console.error('清空收藏失败:', error);
     }
@@ -143,7 +146,7 @@ export const FavoritesPanel: React.FC<FavoritesPanelProps> = ({
           <div className='flex items-center gap-2'>
             {favoriteItems.length > 0 && (
               <button
-                onClick={handleClearAll}
+                onClick={() => setShowConfirmDialog(true)}
                 className='text-xs text-red-500 hover:text-red-700 dark:text-red-400 dark:hover:text-red-300 transition-colors'
               >
                 清空全部
@@ -186,6 +189,53 @@ export const FavoritesPanel: React.FC<FavoritesPanelProps> = ({
           )}
         </div>
       </div>
+
+      {/* 确认对话框 */}
+      {showConfirmDialog && createPortal(
+        <div
+          className='fixed inset-0 bg-black bg-opacity-50 z-[9999] flex items-center justify-center p-4 transition-opacity duration-300'
+          onClick={() => setShowConfirmDialog(false)}
+        >
+          <div
+            className='bg-white dark:bg-gray-800 rounded-lg shadow-xl max-w-md w-full border border-red-200 dark:border-red-800 transition-all duration-300'
+            onClick={(e) => e.stopPropagation()}
+          >
+            <div className="p-6">
+              {/* 图标和标题 */}
+              <div className="flex items-start gap-4 mb-4">
+                <div className="flex-shrink-0">
+                  <AlertTriangle className="w-8 h-8 text-red-500" />
+                </div>
+                <div className="flex-1">
+                  <h3 className="text-lg font-semibold text-gray-900 dark:text-gray-100 mb-2">
+                    清空收藏
+                  </h3>
+                  <p className="text-sm text-gray-600 dark:text-gray-400">
+                    确定要清空所有收藏吗？此操作不可恢复。
+                  </p>
+                </div>
+              </div>
+
+              {/* 按钮组 */}
+              <div className="flex gap-3 mt-6">
+                <button
+                  onClick={() => setShowConfirmDialog(false)}
+                  className="flex-1 px-4 py-2 text-sm font-medium text-gray-700 dark:text-gray-300 bg-gray-100 dark:bg-gray-700 hover:bg-gray-200 dark:hover:bg-gray-600 rounded-lg transition-colors"
+                >
+                  取消
+                </button>
+                <button
+                  onClick={handleClearAll}
+                  className="flex-1 px-4 py-2 text-sm font-medium text-white bg-red-600 hover:bg-red-700 rounded-lg transition-colors"
+                >
+                  确定清空
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>,
+        document.body
+      )}
     </>
   );
 };

src/lib/admin.types.ts

@@ -162,6 +162,7 @@ export interface AdminConfig {
     Username?: string; // 用户名（或使用API Key）
     Password?: string; // 密码
     UserId?: string; // 用户ID（登录后获取）
+    AuthToken?: string; // 认证令牌（用户名密码登录后获取）
     Libraries?: string[]; // 要显示的媒体库ID（可选，默认全部）
     LastSyncTime?: number; // 最后同步时间戳
     ItemCount?: number; // 媒体项数量

src/lib/types.ts

@@ -136,6 +136,7 @@ export interface SearchResult {
   vod_remarks?: string; // 视频备注信息（如"全80集"、"更新至25集"等）
   vod_total?: number; // 总集数
   proxyMode?: boolean; // 代理模式：启用后由服务器代理m3u8和ts分片
+  subtitles?: Array<Array<{ label: string; url: string }>>; // 字幕列表（按集数索引）
 }
 
 // 豆瓣数据结构