Files
leaudit-platform-frontend/app/components/reviews/rightColumn/FileInfoPanel.tsx
T

72 lines
2.5 KiB
TypeScript

/**
* 右栏 · 文件信息选项卡
* 以简洁的 key-value 网格展示文件基本属性和评查信息
*/
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 FileInfoPanelProps {
fileInfo: FileInfoData;
reviewInfo: ReviewInfoData;
}
function Row({ label, value }: { label: string; value: string }) {
return (
<div className="grid grid-cols-[80px,1fr] gap-2 text-[12.5px] py-1.5 border-b border-slate-100 last:border-b-0">
<span className="text-slate-400">{label}</span>
<span className="text-slate-700 break-all">{value || '—'}</span>
</div>
);
}
export function FileInfoPanel({ fileInfo, reviewInfo }: FileInfoPanelProps) {
return (
<div className="p-4 space-y-4">
{/* 文件基本信息 */}
<section>
<div className="text-[11px] font-medium text-slate-400 uppercase tracking-wider mb-2 flex items-center gap-1">
<i className="ri-file-info-line text-blue-500 text-[12px]" />
</div>
<div className="bg-slate-50/60 border border-slate-200 rounded-md p-3">
<Row label="文件名称" value={fileInfo.fileName} />
<Row label={fileInfo.fileType !== '1' ? '卷宗编号' : '合同编号'} value={fileInfo.contractNumber} />
<Row label="文件大小" value={fileInfo.fileSize} />
<Row label="文件格式" value={fileInfo.fileFormat} />
<Row label="页数" value={`${fileInfo.pageCount}`} />
<Row label="上传时间" value={fileInfo.uploadTime} />
</div>
</section>
{/* 评查信息 */}
<section>
<div className="text-[11px] font-medium text-slate-400 uppercase tracking-wider mb-2 flex items-center gap-1">
<i className="ri-search-eye-line text-purple-500 text-[12px]" />
</div>
<div className="bg-slate-50/60 border border-slate-200 rounded-md p-3">
<Row label="评查时间" value={reviewInfo.reviewTime} />
<Row label="评查模型" value={reviewInfo.reviewModel} />
<Row label="规则组" value={reviewInfo.ruleGroup} />
<Row label="问题数量" value={`${reviewInfo.issueCount}`} />
</div>
</section>
</div>
);
}