完成智慧法务前端调整20250522，还有登录和主页需要完善

app/components/reviews/FilePreview.tsx

@@ -69,10 +69,11 @@ interface FilePreviewProps {
   reviewPoints?: ReviewPoint[]; // 设为可选
   activeReviewPointResultId: string | null;
   targetPage?: number; // 新增目标页码参数
+  isStructuredView?: boolean; // 是否显示结构化视图
 }
 
 // export function FilePreview({ fileContent, reviewPoints, activeReviewPointResultId, targetPage }: FilePreviewProps) {
-export function FilePreview({ fileContent, activeReviewPointResultId, targetPage }: FilePreviewProps) {
+export function FilePreview({ fileContent, activeReviewPointResultId, targetPage, isStructuredView = false }: FilePreviewProps) {
   const [zoomLevel, setZoomLevel] = useState(100);
   // const [highlightsVisible, setHighlightsVisible] = useState(true);
   const contentRef = useRef<HTMLDivElement>(null);
@@ -173,6 +174,9 @@ export function FilePreview({ fileContent, activeReviewPointResultId, targetPage
   // 处理页面跳转
   const prevTargetPageRef = useRef<number | undefined>(undefined);
   useEffect(() => {
+    // 调试信息：记录组件状态
+    // console.log(`FilePreview更新 - isStructuredView:${isStructuredView}, targetPage:${targetPage}, activeReviewPointResultId:${activeReviewPointResultId}, numPages:${numPages}`);
+    
     // 如果有目标页码，并且与上次相同，提示用户
     if(targetPage && numPages && targetPage <= numPages && targetPage === prevTargetPageRef.current){
       toastService.success(`已跳转至目标页码`);
@@ -181,9 +185,6 @@ export function FilePreview({ fileContent, activeReviewPointResultId, targetPage
     if (targetPage && numPages && targetPage <= numPages && (targetPage !== prevTargetPageRef.current || activeReviewPointResultId)) {
       prevTargetPageRef.current = targetPage;
       let newTargetPage = targetPage;
-      // let newTargetPage = targetPage;
-      // console.log("targetPage:", targetPage);
-      // console.log("fileContent:", fileContent);
       
       // 页码偏移量
       try {
@@ -197,13 +198,18 @@ export function FilePreview({ fileContent, activeReviewPointResultId, targetPage
         toastService.error("访问ocrResult时出错:" + (error instanceof Error ? error.message : '未知错误'));
       }
       
-      const pageElement = document.getElementById(`page-${newTargetPage}`);
+      const pageElementId = `page-${newTargetPage}${isStructuredView ? '-structured' : ''}`;
+      // console.log(`尝试跳转到元素ID: ${pageElementId}`);
+      
+      const pageElement = document.getElementById(pageElementId);
       if (pageElement) {
         console.log(`跳转到第${newTargetPage}页，对应评查点结果ID: ${activeReviewPointResultId}`);
         pageElement.scrollIntoView({ behavior: 'smooth', block: 'start' });
+      } else {
+        console.warn(`未找到页面元素: ${pageElementId}`);
       }
     }
-  }, [targetPage, numPages, fileContent, activeReviewPointResultId]);
+  }, [targetPage, numPages, fileContent, activeReviewPointResultId, isStructuredView]);
   
   // 获取评查点对应的样式类
   // const getHighlightClass = (status: string) => {
@@ -302,9 +308,12 @@ export function FilePreview({ fileContent, activeReviewPointResultId, targetPage
         marginBottom: `${calculatePageMargin(zoomFactor)}px`, // 动态计算页面间距
       };
       
+      // 为结构化视图和普通视图创建不同的ID
+      const pageId = isStructuredView ? `page-${i}-structured` : `page-${i}`;
+      
       // 为每一页创建组件
       pages.push(
-        <div key={i} id={`page-${i}`} style={pageContainerStyle}>
+        <div key={i} id={pageId} style={pageContainerStyle}>
           {/* 页码标识，显示在页面上方 */}
           <div className="text-center text-gray-500 text-sm mb-2">第 {i} 页</div>
           
@@ -365,7 +374,20 @@ export function FilePreview({ fileContent, activeReviewPointResultId, targetPage
   
   // 渲染文档内容
   const renderDocumentContent = () => {
-    return (
+    // 如果路径无效，显示错误信息
+    if (!fileContent.path) {
+      return (
+        <div className="text-red-500 p-4">
+          <p>无法加载文件：路径无效</p>
+        </div>
+      );
+    }
+
+    // 获取文件扩展名
+    const fileExtension = fileContent.path.split('.').pop()?.toLowerCase();
+    
+    // PDF内容渲染
+    const renderPdfContent = () => (
       <div 
         style={{
           ...styles.pdfContainer,
@@ -390,32 +412,75 @@ export function FilePreview({ fileContent, activeReviewPointResultId, targetPage
         </Document>
       </div>
     );
+
+    // 结构化数据渲染
+    const renderStructuredData = () => (
+      <div className="structured-view p-4 text-left mt-4 border-t border-gray-200">
+        <div className="text-xs font-medium mb-2">结构化数据：</div>
+        {fileContent.ocrResult ? (
+          <div className="overflow-auto max-h-[300px]">
+            <pre className="text-xs whitespace-pre-wrap bg-gray-50 p-3 rounded">
+              {JSON.stringify(fileContent.ocrResult, null, 2)}
+            </pre>
+          </div>
+        ) : (
+          <div className="text-gray-500 p-4 text-center">
+            <p>无结构化数据可显示</p>
+          </div>
+        )}
+      </div>
+    );
+    
+    // 根据文件类型选择不同的渲染方式
+    if (fileExtension === 'pdf') {
+      // 结构化视图模式：显示PDF和结构化数据
+      if (isStructuredView) {
+        return (
+          <div>
+            {renderPdfContent()}
+            {renderStructuredData()}
+          </div>
+        );
+      }
+      // 普通模式：仅显示PDF
+      return renderPdfContent();
+    } else {
+      // 非PDF文件显示不支持消息
+      return (
+        <div className="text-gray-500 p-4">
+          <p>暂不支持预览此类型的文件：{fileExtension}</p>
+        </div>
+      );
+    }
   };
   
   return (
     <div className="file-preview">
-      <div className="file-preview-header py-2 px-4">
+      <div className="file-preview-header py-2 px-4 text-xs sm:text-xs md:text-sm max-w-full text-overflow-ellipsis">
         <div className="flex items-center">
-          <i className="ri-file-text-line text-primary mr-2"></i>
-          <span className="font-medium text-primary">文件预览</span>
+          <i className={`${isStructuredView ? 'ri-file-list-line' : 'ri-file-text-line'} text-primary mr-2`}></i>
+          <span className="font-medium text-primary">{isStructuredView ? '附件预览' : '文件预览'}</span>
         </div>
         <div className="file-preview-actions flex items-center">
           <button 
-            className="ant-btn ant-btn-sm ant-btn-default py-0 px-1 text-xs h-5 leading-5 "
+            className="ant-btn ant-btn-sm ant-btn-default py-0 px-1 text-xs max-h-6 leading-5"
             onClick={handleScrollToTop}
+            title="返回顶部"
           >
             <i className="ri-arrow-up-double-line"></i>
-            <span className="ml-1">返回顶部</span>
+            <span className="ml-1 sm:inline md:inline lg:hidden xl:inline">返回顶部</span>
           </button>
           <button 
-            className="ant-btn ant-btn-sm ant-btn-default py-0 px-1 text-xs h-5 leading-5"
+            className="ant-btn ant-btn-sm ant-btn-default py-0 px-1 text-xs max-h-6 leading-5"
             onClick={handleZoomIn}
+            title="放大"
           >
             <i className="ri-zoom-in-line"></i>
           </button>
           <button 
-            className="ant-btn ant-btn-sm ant-btn-default py-0 px-1 text-xs h-5 leading-5"
+            className="ant-btn ant-btn-sm ant-btn-default py-0 px-1 text-xs max-h-6 leading-5"
             onClick={handleZoomOut}
+            title="缩小"
           >
             <i className="ri-zoom-out-line"></i>
           </button>
@@ -423,7 +488,7 @@ export function FilePreview({ fileContent, activeReviewPointResultId, targetPage
           <div className="inline-flex items-center ml-2">
             <input 
               type="text" 
-              className="ant-input ant-input-sm py-0 px-1 text-xs h-5 leading-5 w-10 text-center 
+              className="ant-input ant-input-sm py-0 px-1 text-xs max-h-6 leading-5 max-w-[2.5rem] text-center 
               focus:outline-none focus:ring-1 focus:ring-green-900"
               placeholder="页码"
               value={pageInputValue}
@@ -431,29 +496,24 @@ export function FilePreview({ fileContent, activeReviewPointResultId, targetPage
               onKeyDown={handlePageInputKeyDown}
             />
             <button 
-              className="ant-btn ant-btn-sm ant-btn-default py-0 px-1 text-xs h-5 leading-5 ml-1"
+              className="ant-btn ant-btn-sm ant-btn-default py-0 px-1 text-xs max-h-6 leading-5 ml-1"
               onClick={handlePageJump}
               disabled={!numPages}
+              title="跳转到页面"
             >
               <i className="ri-arrow-right-line"></i>
             </button>
-            {numPages && <span className="ml-1 text-xs text-gray-500">/ {numPages}</span>}
+            {numPages && <span className="ml-1 text-xs text-gray-500 sm:inline md:inline lg:hidden xl:inline">/ {numPages}</span>}
           </div>
-          {/* <button 
-            className="ant-btn ant-btn-sm ant-btn-default py-0 px-1 text-xs h-5 leading-5"
-            onClick={toggleHighlights}
-          >
-            <i className="ri-mark-pen-line"></i> {highlightsVisible ? '隐藏问题' : '显示问题'}
-          </button> */}
-          <span className="ml-2 text-xs text-gray-500 inline-block">{"比例："+zoomLevel+"%"}</span>
+          <span className="ml-2 text-xs text-gray-500 inline-block sm:inline md:inline lg:hidden xl:inline">{"比例："+zoomLevel+"%"}</span>
           <button
-            className={`ant-btn ant-btn-sm ant-btn-default py-0 px-1 text-xs h-5 leading-5 ml-2 ${dragMode ? 'active bg-green-300' : ''}`}
+            className={`ant-btn ant-btn-sm ant-btn-default py-0 px-1 text-xs max-h-6 leading-5 ml-2 ${dragMode ? 'active bg-green-300' : ''}`}
             title="切换拖拽模式"
             aria-pressed={dragMode}
             onClick={toggleDragMode}
           >
             <i className="ri-drag-move-line"></i>
-            <span className="ml-1">拖拽模式{dragMode ? '(已激活)' : ''}</span>
+            <span className="ml-1 sm:inline md:inline lg:hidden xl:inline">拖拽模式{dragMode ? '(已激活)' : ''}</span>
           </button>
         </div>
       </div>