feat: user menu and hot show

src/app/api/change-password/route.ts

@@ -0,0 +1,72 @@
+/* eslint-disable no-console*/
+
+import { NextRequest, NextResponse } from 'next/server';
+
+import { getAuthInfoFromCookie } from '@/lib/auth';
+import { getStorage } from '@/lib/db';
+import { IStorage } from '@/lib/types';
+
+export const runtime = 'edge';
+
+export async function POST(request: NextRequest) {
+  const storageType = process.env.NEXT_PUBLIC_STORAGE_TYPE || 'localstorage';
+
+  // 不支持 localstorage 模式
+  if (storageType === 'localstorage') {
+    return NextResponse.json(
+      {
+        error: '不支持本地存储模式修改密码',
+      },
+      { status: 400 }
+    );
+  }
+
+  try {
+    const body = await request.json();
+    const { newPassword } = body;
+
+    // 获取认证信息
+    const authInfo = getAuthInfoFromCookie(request);
+    if (!authInfo || !authInfo.username) {
+      return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+    }
+
+    // 验证新密码
+    if (!newPassword || typeof newPassword !== 'string') {
+      return NextResponse.json({ error: '新密码不得为空' }, { status: 400 });
+    }
+
+    const username = authInfo.username;
+
+    // 不允许站长修改密码（站长用户名等于 process.env.USERNAME）
+    if (username === process.env.USERNAME) {
+      return NextResponse.json(
+        { error: '站长不能通过此接口修改密码' },
+        { status: 403 }
+      );
+    }
+
+    // 获取存储实例
+    const storage: IStorage | null = getStorage();
+    if (!storage || typeof storage.changePassword !== 'function') {
+      return NextResponse.json(
+        { error: '存储服务不支持修改密码' },
+        { status: 500 }
+      );
+    }
+
+    // 修改密码
+    await storage.changePassword(username, newPassword);
+
+    return NextResponse.json({ ok: true });
+  } catch (error) {
+    console.error('修改密码失败:', error);
+    return NextResponse.json(
+      {
+        error: '修改密码失败',
+        details: (error as Error).message,
+      },
+      { status: 500 }
+    );
+  }
+}

src/app/page.tsx

@@ -27,6 +27,7 @@ function HomeClient() {
   const [activeTab, setActiveTab] = useState<'home' | 'favorites'>('home');
   const [hotMovies, setHotMovies] = useState<DoubanItem[]>([]);
   const [hotTvShows, setHotTvShows] = useState<DoubanItem[]>([]);
+  const [hotVarietyShows, setHotVarietyShows] = useState<DoubanItem[]>([]);
   const [loading, setLoading] = useState(true);
   const { announcement } = useSite();
 
@@ -63,14 +64,15 @@ function HomeClient() {
       try {
         setLoading(true);
 
-        // 并行获取热门电影和热门剧集
-        const [moviesData, tvShowsData] = await Promise.all([
+        // 并行获取热门电影、热门剧集和热门综艺
+        const [moviesData, tvShowsData, varietyShowsData] = await Promise.all([
           getDoubanCategories({
             kind: 'movie',
             category: '热门',
             type: '全部',
           }),
           getDoubanCategories({ kind: 'tv', category: 'tv', type: 'tv' }),
+          getDoubanCategories({ kind: 'tv', category: 'show', type: 'show' }),
         ]);
 
         if (moviesData.code === 200) {
@@ -80,6 +82,10 @@ function HomeClient() {
         if (tvShowsData.code === 200) {
           setHotTvShows(tvShowsData.list);
         }
+
+        if (varietyShowsData.code === 200) {
+          setHotVarietyShows(varietyShowsData.list);
+        }
       } catch (error) {
         console.error('获取豆瓣数据失败:', error);
       } finally {
@@ -301,6 +307,53 @@ function HomeClient() {
                       ))}
                 </ScrollableRow>
               </section>
+
+              {/* 热门综艺 */}
+              <section className='mb-8'>
+                <div className='mb-4 flex items-center justify-between'>
+                  <h2 className='text-xl font-bold text-gray-800 dark:text-gray-200'>
+                    热门综艺
+                  </h2>
+                  <Link
+                    href='/douban?type=show'
+                    className='flex items-center text-sm text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200'
+                  >
+                    查看更多
+                    <ChevronRight className='w-4 h-4 ml-1' />
+                  </Link>
+                </div>
+                <ScrollableRow>
+                  {loading
+                    ? // 加载状态显示灰色占位数据
+                      Array.from({ length: 8 }).map((_, index) => (
+                        <div
+                          key={index}
+                          className='min-w-[96px] w-24 sm:min-w-[180px] sm:w-44'
+                        >
+                          <div className='relative aspect-[2/3] w-full overflow-hidden rounded-lg bg-gray-200 animate-pulse dark:bg-gray-800'>
+                            <div className='absolute inset-0 bg-gray-300 dark:bg-gray-700'></div>
+                          </div>
+                          <div className='mt-2 h-4 bg-gray-200 rounded animate-pulse dark:bg-gray-800'></div>
+                        </div>
+                      ))
+                    : // 显示真实数据
+                      hotVarietyShows.map((show, index) => (
+                        <div
+                          key={index}
+                          className='min-w-[96px] w-24 sm:min-w-[180px] sm:w-44'
+                        >
+                          <VideoCard
+                            from='douban'
+                            title={show.title}
+                            poster={show.poster}
+                            douban_id={show.id}
+                            rate={show.rate}
+                            year={show.year}
+                          />
+                        </div>
+                      ))}
+                </ScrollableRow>
+              </section>
             </>
           )}
         </div>