优化评查详情，新增信息提示框组件

app/routes/rules-files.tsx

@@ -1,5 +1,6 @@
 import { type MetaFunction, type LoaderFunctionArgs } from "@remix-run/node";
 import { useLoaderData, useSearchParams, useNavigate } from "@remix-run/react";
+import { useEffect } from "react";
 import { Button } from "~/components/ui/Button";
 import { Card } from "~/components/ui/Card";
 import { FileIcon } from "~/components/ui/FileIcon";
@@ -50,7 +51,7 @@ export const REVIEW_STATUS_LABELS: Record<string, string> = {
   'pending': '待人工确认'
 };
 
-
+// 加载评查文件列表
 export async function loader({ request }: LoaderFunctionArgs) {
   const url = new URL(request.url);
   const fileType = url.searchParams.get("fileType") || "";
@@ -86,7 +87,7 @@ export async function loader({ request }: LoaderFunctionArgs) {
     const filesResponse = await getReviewFiles(searchParams);
     if (filesResponse.error) {
       console.error('获取评查文件列表失败:', filesResponse.error);
-      throw new Response('获取评查文件列表失败', { status: filesResponse.status || 500 });
+      return Response.json({ result: false, message: filesResponse.error }, { status: filesResponse.status || 500 });
     }
     
     const files = filesResponse.data?.files || [];
@@ -101,29 +102,24 @@ export async function loader({ request }: LoaderFunctionArgs) {
     });
   } catch (error) {
     console.error('加载评查文件列表失败:', error);
-    throw new Response('加载评查文件列表失败', { status: 500 });
+    return Response.json({ result: false, message: error instanceof Error ? error.message : '加载评查文件列表失败' }, { status: 500 });
   }
 }
 
-// 提取renderErrorBoundary函数作为命名导出
-export function ErrorBoundary() {
-  return (
-    <div className="error-container p-6">
-      <h1 className="text-xl font-normal text-red-500 mb-4">出错了</h1>
-      <p className="mb-4">加载评查文件列表时发生错误。请稍后再试，或联系管理员。</p>
-      <Button type="primary" to="/">返回首页</Button>
-    </div>
-  );
-}
-
-// 在文件中定义一个与路由文件名匹配的命名函数组件
 export default function RulesFiles() {
   const navigate = useNavigate();
-  const { files, documentTypes, totalCount, currentPage, pageSize } = useLoaderData<typeof loader>();
+  const { files, documentTypes, totalCount, currentPage, pageSize, result, message } = useLoaderData<typeof loader>();
   const [searchParams, setSearchParams] = useSearchParams();
   const dateFrom = searchParams.get('dateFrom') || '';
   const dateTo = searchParams.get('dateTo') || '';
 
+  // 处理初始加载数据loader的错误
+  useEffect(() => {
+    if(!result) {
+      toastService.error(message);
+    }
+  }, [result, message]);
+
   // 处理筛选条件变更
   const handleFilterChange = (e: React.ChangeEvent<HTMLSelectElement | HTMLInputElement>) => {
     const { name, value } = e.target;
@@ -178,12 +174,12 @@ export default function RulesFiles() {
       try {
         const response = await updateDocumentAuditStatus(fileId, 2);
         if (response.error) {
-          console.error('更新文件审核状态失败:', response.error);
-          // 尽管更新失败，仍然导航到文件详情页
+          throw new Error(response.error);
         }
       } catch (error) {
         console.error('更新文件审核状态时出错:', error);
-        // 尽管发生错误，仍然导航到文件详情页
+        toastService.error(`更新文件审核状态时出错:${error instanceof Error ? error.message : '未知错误'}`);
+        return;
       }
     }
     
@@ -193,9 +189,10 @@ export default function RulesFiles() {
   
   // 渲染问题摘要
   const renderIssues = (file: ReviewFileUI) => {
-    // 如果评查状态为通过(说明所有评查结果为true)，显示"所有评查点均通过"
+    // 如果文件状态为完成
     if (file.status === 'Processed') {
-      if (file.reviewStatus === 'pass') {
+      // 如果没有问题，显示"所有评查点均通过"
+      if (file.warningCount <= 0 && file.failCount <= 0) {
         return (
           <div className="text-sm text-success">
             <i className="ri-check-double-line mr-1"></i>所有评查点均通过
@@ -213,7 +210,7 @@ export default function RulesFiles() {
       // }
       
       // 显示问题列表
-      if (file.reviewStatus !== 'pass' && file.reviewStatus !== 'fail' && file.issues && file.issues.length > 0) {
+      if (file.issues && file.issues.length > 0) {
         // 最多显示2个问题
         const displayIssues = file.issues.slice(0, 2);
         
@@ -292,19 +289,11 @@ export default function RulesFiles() {
   };
 
   const handleReset = () => {
-    const newParams = new URLSearchParams(searchParams);
+    const newParams = new URLSearchParams();
     const searchInput = document.querySelector('input[name="keyword"]');
     if(searchInput) {
       (searchInput as HTMLInputElement).value = '';
     }
-    // newParams.delete('keyword');
-    
-    newParams.delete('dateFrom');
-    newParams.delete('dateTo');
-    newParams.delete('fileType');
-    // newParams.delete('reviewStatus');
-    newParams.delete('sortOrder');
-    newParams.set('page', '1');
     setSearchParams(newParams);
   };
   
@@ -314,22 +303,6 @@ export default function RulesFiles() {
     label: type.name
   }));
   
-  // 评查状态选项
-  // const reviewStatusOptions = [
-  //   { value: 'pass', label: '通过' },
-  //   { value: 'warning', label: '警告' },
-  //   { value: 'fail', label: '不通过' },
-  //   { value: 'pending', label: '待人工确认' }
-  // ];
-  
-  // 时间范围选项
-  // const dateRangeOptions = [
-  //   { value: DateRange.TODAY, label: '今天' },
-  //   { value: DateRange.WEEK, label: '本周' },
-  //   { value: DateRange.MONTH, label: '本月' },
-  //   // { value: DateRange.CUSTOM, label: '自定义时间段' }
-  // ];
-  
   // 定义表格列配置
   const columns = [
     {
@@ -570,4 +543,15 @@ export default function RulesFiles() {
       </Card>
     </div>
   );
+}
+
+// 错误边界
+export function ErrorBoundary() {
+  return (
+    <div className="error-container p-6">
+      <h1 className="text-xl font-normal text-red-500 mb-4">出错了</h1>
+      <p className="mb-4">加载评查文件列表时发生错误。请稍后再试，或联系管理员。</p>
+      <Button type="primary" to="/">返回首页</Button>
+    </div>
+  );
 }