/** * 右栏 · 详情面板 * 包含 3 个选项卡（评查结果、抽取字段、文件信息）+ 底部操作栏 */ import { useState } from 'react'; import type { ReviewPoint, CharPosition } from '../ReviewPointsList'; import { ReviewPointDetailCard } from './ReviewPointDetailCard'; import { FileInfoPanel } from './FileInfoPanel'; type TabKey = 'result' | 'fields' | 'info'; interface FileInfoData { fileName: string; contractNumber: string; fileSize: string; fileFormat: string; pageCount: number; uploadTime: string; uploadUser: string; fileType: string; } interface ReviewInfoData { reviewTime: string; reviewModel: string; ruleGroup: string; result: string; issueCount: number; } interface DetailPanelProps { activeTab: TabKey; onTabChange: (tab: TabKey) => void; activeReviewPoint: ReviewPoint | null; reviewPoints: ReviewPoint[]; fileInfo: FileInfoData; reviewInfo: ReviewInfoData; onReviewPointSelect: (id: string, page?: number, charPositions?: CharPosition[], value?: string) => void; onStatusChange: (id: string, editAuditStatusId: string | number, status: string, message: string) => void; onConfirmResults: () => void; onDownload: () => void; auditStatus?: number; fileFormat?: string; onUploadTemplate?: () => void; onComparison?: () => void; showComparisonButton?: boolean; } function ExtractedFieldsPanel({ reviewPoints, onFieldClick }: { reviewPoints: ReviewPoint[]; onFieldClick: (page: number) => void }) { const fields: Array<{ key: string; value: string; page?: number; pointName: string }> = []; reviewPoints.forEach((p) => { if (p.content) { Object.entries(p.content).forEach(([key, data]) => { const val = (data as any)?.value; const page = (data as any)?.page; const text = typeof val === 'object' ? (val as any)?.text || JSON.stringify(val) : String(val || ''); fields.push({ key, value: text, page: page ? Number(page) : undefined, pointName: p.pointName }); }); } }); return (
抽取字段 {fields.length}
{fields.length === 0 ? (
暂无抽取字段
) : (
{fields.map((f, i) => ( ))}
)}
); } const TABS: Array<{ key: TabKey; label: string }> = [ { key: 'result', label: '评查结果' }, { key: 'fields', label: '抽取字段' }, { key: 'info', label: '文件信息' }, ]; export function DetailPanel({ activeTab, onTabChange, activeReviewPoint, reviewPoints, fileInfo, reviewInfo, onReviewPointSelect, onStatusChange, onConfirmResults, onDownload, auditStatus, fileFormat, onUploadTemplate, onComparison, showComparisonButton, }: DetailPanelProps) { return ( ); }