feat: 添加短剧筛选功能和自定义Panel容器组件

1. 新增DramaQuery类型扩展分页查询参数，支持标题、状态、类型筛选
2. 重构usePageData hook，支持自定义查询类型和筛选状态管理
3. 新建Panel通用容器组件替代原生Card
4. 为短剧管理页面添加搜索筛选UI和逻辑
5. 统一所有页面的分页查询默认参数
6. 调整布局样式优化后台管理界面展示

src/hooks/interface.ts

@@ -2,4 +2,4 @@ import type { PageData, PageQuery } from "../api";
 
 export type { PageData, PageQuery };
 
-export type PageFetcher<T> = (query: PageQuery) => Promise<PageData<T>>;
+export type PageFetcher<T, Q extends PageQuery = PageQuery> = (query: Q) => Promise<PageData<T>>;

src/hooks/usePageData.ts

@@ -1,45 +1,53 @@
 import { useEffect, useState } from "react";
-import type { PageData, PageFetcher, PageQuery } from "./interface";
+import type { PageData, PageQuery } from "../api";
+import type { PageFetcher } from "./interface";
 import { resolvePageData } from "./pageData";
 
-export function usePageData<T>(fetcher: PageFetcher<T>, enabled = true) {
+export function usePageData<T, Q extends PageQuery = PageQuery>(
+    fetcher: PageFetcher<T, Q>,
+    initialQuery: Q,
+    enabled = true,
+) {
     const [loading, setLoading] = useState(false);
-    const [pageQuery, setPageQuery] = useState<PageQuery>({
-        page: 1,
-        pageSize: 20,
-    });
+    const [query, setQuery] = useState<Q>(initialQuery);
     const [data, setData] = useState<PageData<T>>({
         list: [],
         pagination: { page: 1, pageSize: 20, total: 0 },
     });
 
-    const load = async (query = pageQuery) => {
+    const load = async (q = query) => {
         if (!enabled) {
             return;
         }
         setLoading(true);
         try {
-            const response = await fetcher(query);
-            setData(resolvePageData(response, query));
+            const response = await fetcher(q);
+            setData(resolvePageData(response, q));
         } finally {
             setLoading(false);
         }
     };
 
     const changePage = (page: number, pageSize: number) => {
-        setPageQuery({ page, pageSize });
+        setQuery((prev) => ({ ...prev, page, pageSize } as Q));
+    };
+
+    const setFilter = (patch: Partial<Q>) => {
+        setQuery((prev) => ({ ...prev, ...patch, page: 1 } as Q));
     };
 
     useEffect(() => {
         if (enabled) {
-            void load(pageQuery);
+            void load(query);
         }
-    }, [fetcher, enabled, pageQuery.page, pageQuery.pageSize]);
+    }, [fetcher, enabled, query]);
 
     return {
         data,
         loading,
-        reload: () => load(pageQuery),
+        query,
+        reload: () => load(query),
         changePage,
+        setFilter,
     };
 }