数据列表查询对接完成

app/routes/contract-template.search.results.tsx

@@ -38,29 +38,33 @@ interface CategoryWithSearchCount extends ContractCategory {
 interface DisplayTemplate {
   id: string;
   title: string;
-  type: string;
+  // type: string;
   description: string;
   updateTime: string;
-  useCount: number;
-  rating: number;
+  // useCount: number;
+  // rating: number;
   category: string;
+  file_path?: string;
+  file_format?: string;
 }
 
 // 将数据库模板转换为前端显示格式
 function transformTemplate(template: ContractTemplate) {
   // 模拟使用次数和评分（实际项目中可以从其他表获取）
-  const mockUsageCount = Math.floor(Math.random() * 2000) + 100;
-  const mockRating = (Math.random() * 1.5 + 3.5).toFixed(1);
+  /* const mockUsageCount = Math.floor(Math.random() * 2000) + 100;
+  const mockRating = (Math.random() * 1.5 + 3.5).toFixed(1); */
   
   return {
     id: template.id.toString(),
     title: template.title,
-    type: template.is_featured ? '推荐版' : '标准版',
+    // type: template.is_featured ? '推荐版' : '标准版',
     description: template.description || '',
     updateTime: new Date(template.updated_at).toLocaleDateString('zh-CN'),
-    useCount: mockUsageCount,
-    rating: parseFloat(mockRating),
-    category: template.category?.name || '其他'
+    // useCount: mockUsageCount,
+    // rating: parseFloat(mockRating),
+    category: template.category?.name || '其他',
+    file_path: template.file_path,
+    file_format: template.file_format
   };
 }
 
@@ -68,11 +72,38 @@ export async function loader({ request }: LoaderFunctionArgs) {
   const url = new URL(request.url);
   const query = url.searchParams.get('q') || '';
   const category = url.searchParams.get('category') || '';
+  const sortBy = url.searchParams.get('sortBy') || 'relevance';
   const page = parseInt(url.searchParams.get('page') || '1');
   const pageSize = 6;
   
   // 记录搜索开始时间
   const startTime = Date.now();
+
+  // 根据sortBy值设置数据库排序参数
+  let dbSortBy = 'id';
+  let dbSortOrder: 'asc' | 'desc' = 'asc';
+  
+  switch (sortBy) {
+    case 'relevance':
+      dbSortBy = 'id';
+      dbSortOrder = 'asc';
+      break;
+    case 'newest':
+      dbSortBy = 'updated_at';
+      dbSortOrder = 'desc';
+      break;
+    /* case 'popular':
+      dbSortBy = 'created_at';
+      dbSortOrder = 'desc';
+      break;
+    case 'rating':
+      dbSortBy = 'is_featured';
+      dbSortOrder = 'desc';
+      break; */
+    default:
+      dbSortBy = 'id';
+      dbSortOrder = 'asc';
+  }
   
   try {
     // 并行获取搜索结果和分类数据
@@ -81,8 +112,8 @@ export async function loader({ request }: LoaderFunctionArgs) {
         category,
         page,
         pageSize,
-        sortBy: 'updated_at',
-        sortOrder: 'desc'
+        sortBy: dbSortBy,
+        sortOrder: dbSortOrder
       }),
       getContractCategories()
     ]);
@@ -97,6 +128,7 @@ export async function loader({ request }: LoaderFunctionArgs) {
         total: 0,
         page,
         pageSize,
+        sortBy,
         searchTime: '搜索失败',
         categories: []
       };
@@ -155,6 +187,7 @@ export async function loader({ request }: LoaderFunctionArgs) {
       total: searchResponse.data?.total || 0,
       page,
       pageSize,
+      sortBy,
       searchTime: searchTimeText,
       categories: categoriesWithSearchCount
     };
@@ -167,6 +200,7 @@ export async function loader({ request }: LoaderFunctionArgs) {
       total: 0,
       page,
       pageSize,
+      sortBy,
       searchTime: '搜索失败',
       categories: []
     };
@@ -174,12 +208,13 @@ export async function loader({ request }: LoaderFunctionArgs) {
 }
 
 export default function ContractTemplateSearchResults() {
-  const { results, query, total, page, pageSize, searchTime, categories }: {
+  const { results, query, total, page, pageSize, sortBy, searchTime, categories }: {
     results: DisplayTemplate[];
     query: string;
     total: number;
     page: number;
     pageSize: number;
+    sortBy: string;
     searchTime: string;
     categories: CategoryWithSearchCount[];
   } = useLoaderData<typeof loader>();
@@ -188,7 +223,6 @@ export default function ContractTemplateSearchResults() {
   const navigate = useNavigate();
   const [activeFilter, setActiveFilter] = useState('全部');
   const [viewMode, setViewMode] = useState<'grid' | 'list'>('grid');
-  const [sortBy, setSortBy] = useState('relevance');
 
   const handleSearch = (newQuery: string) => {
     if (newQuery.trim()) {
@@ -220,6 +254,13 @@ export default function ContractTemplateSearchResults() {
     navigate(`/contract-template/search/results?${params.toString()}`);
   };
 
+  const handleSortChange = (newSort: string) => {
+    const params = new URLSearchParams(searchParams);
+    params.set('sortBy', newSort);
+    params.delete('page'); // 重置页码
+    navigate(`/contract-template/search/results?${params.toString()}`);
+  };
+
   // 动态生成筛选选项
   const filters = [
     { label: '全部', count: total },
@@ -246,7 +287,7 @@ export default function ContractTemplateSearchResults() {
         viewMode={viewMode}
         onViewModeChange={setViewMode}
         sortBy={sortBy}
-        onSortChange={setSortBy}
+        onSortChange={handleSortChange}
       />
 
       {/* 筛选标签 */}