lipan/massive-cloud
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: initial commit - massive-cloud point cloud processing system

Browse Source
This commit is contained in:
lipan
2026-05-27 09:51:42 +00:00
commit 16811100d1
391 changed files with 78338 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

174
client/src/components/RealtimeReport.tsx Normal file
View File

@@ -0,0 +1,174 @@
import { useMemo } from 'react';
import { CheckCircle2, AlertTriangle, XCircle, TrendingUp, TrendingDown } from 'lucide-react';
interface MeasurementItem {
name: string;
value: number;
unit: string;
tolerance: number;
status: 'pass' | 'warning' | 'fail';
}
interface ErrorStats {
min: number;
max: number;
mean: number;
stdDev: number;
}
interface RealtimeReportProps {
processedChunks: number;
totalChunks: number;
measurements: MeasurementItem[];
errorStats: ErrorStats | null;
isProcessing: boolean;
className?: string;
}
export default function RealtimeReport({
processedChunks,
totalChunks,
measurements,
errorStats,
isProcessing,
className = ''
}: RealtimeReportProps) {
const visibleMeasurements = useMemo(() => {
const ratio = processedChunks / totalChunks;
const count = Math.floor(measurements.length * ratio);
return measurements.slice(0, count);
}, [processedChunks, totalChunks, measurements]);
const stats = useMemo(() => {
const pass = visibleMeasurements.filter(m => m.status === 'pass').length;
const warning = visibleMeasurements.filter(m => m.status === 'warning').length;
const fail = visibleMeasurements.filter(m => m.status === 'fail').length;
return { pass, warning, fail, total: visibleMeasurements.length };
}, [visibleMeasurements]);
return (
<div className={`space-y-3 ${className}`}>
{/* 误差统计卡片 */}
<div className="report-card">
<div className="report-card-header flex items-center justify-between">
<span>误差统计</span>
{isProcessing && (
<span className="text-[oklch(0.68_0.16_55)]">实时更新中...</span>
)}
</div>
<div className="report-card-body">
{errorStats ? (
<div className="grid grid-cols-2 gap-3">
<div className="flex items-center justify-between">
<span className="text-xs text-muted-foreground">最小误差</span>
<span className="data-display py-0.5 px-2 text-xs text-[oklch(0.55_0.18_250)]">
{errorStats.min.toFixed(4)} mm
</span>
</div>
<div className="flex items-center justify-between">
<span className="text-xs text-muted-foreground">最大误差</span>
<span className="data-display py-0.5 px-2 text-xs text-[oklch(0.58_0.20_30)]">
{errorStats.max.toFixed(4)} mm
</span>
</div>
<div className="flex items-center justify-between">
<span className="text-xs text-muted-foreground">平均误差</span>
<span className="data-display py-0.5 px-2 text-xs text-[oklch(0.72_0.16_85)]">
{errorStats.mean.toFixed(4)} mm
</span>
</div>
<div className="flex items-center justify-between">
<span className="text-xs text-muted-foreground">标准差</span>
<span className="data-display py-0.5 px-2 text-xs">
{errorStats.stdDev.toFixed(4)} mm
</span>
</div>
</div>
) : (
<div className="text-center text-xs text-muted-foreground py-4">
等待数据处理...
</div>
)}
</div>
</div>
{/* 测量结果卡片 */}
<div className="report-card">
<div className="report-card-header flex items-center justify-between">
<span>测量结果</span>
<div className="flex items-center gap-3">
{stats.pass > 0 && (
<span className="flex items-center gap-1 text-[oklch(0.62_0.16_145)]">
<CheckCircle2 className="w-3 h-3" />
{stats.pass}
</span>
)}
{stats.warning > 0 && (
<span className="flex items-center gap-1 text-[oklch(0.72_0.16_85)]">
<AlertTriangle className="w-3 h-3" />
{stats.warning}
</span>
)}
{stats.fail > 0 && (
<span className="flex items-center gap-1 text-[oklch(0.55_0.20_28)]">
<XCircle className="w-3 h-3" />
{stats.fail}
</span>
)}
</div>
</div>
<div className="report-card-body max-h-48 overflow-y-auto">
{visibleMeasurements.length > 0 ? (
<div className="space-y-2">
{visibleMeasurements.map((item, index) => (
<div
key={index}
className={`flex items-center justify-between p-2 rounded border ${
item.status === 'pass' ? 'border-[oklch(0.62_0.16_145/0.3)] bg-[oklch(0.62_0.16_145/0.05)]' :
item.status === 'warning' ? 'border-[oklch(0.72_0.16_85/0.3)] bg-[oklch(0.72_0.16_85/0.05)]' :
'border-[oklch(0.55_0.20_28/0.3)] bg-[oklch(0.55_0.20_28/0.05)]'
}`}
>
<div className="flex items-center gap-2">
{item.status === 'pass' && <CheckCircle2 className="w-3.5 h-3.5 text-[oklch(0.62_0.16_145)]" />}
{item.status === 'warning' && <AlertTriangle className="w-3.5 h-3.5 text-[oklch(0.72_0.16_85)]" />}
{item.status === 'fail' && <XCircle className="w-3.5 h-3.5 text-[oklch(0.55_0.20_28)]" />}
<span className="text-xs">{item.name}</span>
</div>
<div className="flex items-center gap-2">
<span className="text-xs font-mono">
{item.value.toFixed(3)} {item.unit}
</span>
<span className="text-xs text-muted-foreground">
±{item.tolerance}
</span>
</div>
</div>
))}
</div>
) : (
<div className="text-center text-xs text-muted-foreground py-4">
等待测量数据...
</div>
)}
</div>
</div>
{/* 热力图图例 */}
<div className="report-card">
<div className="report-card-header">误差热力图</div>
<div className="report-card-body">
<div className="heatmap-legend">
<span className="text-xs text-muted-foreground">负</span>
<div className="heatmap-gradient" />
<span className="text-xs text-muted-foreground">正</span>
</div>
<div className="flex items-center justify-between mt-2 text-xs text-muted-foreground">
<span>0.00 mm</span>
<span>2.50 mm</span>
</div>
</div>
</div>
</div>
);
}