39 lines
1.5 KiB
TypeScript
39 lines
1.5 KiB
TypeScript
import React from 'react';
|
|
import type { CountingAccuracyWarning } from '../../utils/countingAccuracyWarning.ts';
|
|
import { formatNumber } from '../../utils/format.ts';
|
|
|
|
type Props = {
|
|
warning: CountingAccuracyWarning;
|
|
};
|
|
|
|
const CountingAccuracyWarningBanner: React.FC<Props> = ({ warning }) => {
|
|
const isOver = warning.direction === 'over';
|
|
const title = isOver
|
|
? 'Hitung ayam IoT lebih tinggi dari stock manual'
|
|
: 'Akurasi hitung ayam IoT rendah (IoT lebih rendah dari stock)';
|
|
const body = isOver
|
|
? 'Manager perlu cek: kemungkinan fraud / ayam baru yang belum tercatat, atau AI overcount; pastikan juga video kamera lengkap dan tidak bermasalah.'
|
|
: 'Manager perlu cek: video kamera lengkap atau tidak, kemungkinan masalah AI, atau ada selisih stok.';
|
|
|
|
return (
|
|
<div
|
|
role="alert"
|
|
className="mb-6 rounded-lg border-l-4 border-amber-500 bg-amber-50 p-4 text-amber-950"
|
|
>
|
|
<div className="flex items-start gap-3">
|
|
<i className="fa-solid fa-triangle-exclamation mt-0.5 text-xl text-amber-600" aria-hidden />
|
|
<div className="min-w-0 space-y-1">
|
|
<p className="text-sm font-semibold">{title}</p>
|
|
<p className="text-sm">
|
|
Hari {warning.day} · IoT {formatNumber(warning.iotCount, 0)} vs stock{' '}
|
|
{formatNumber(warning.stockAkhir, 0)} (akurasi {formatNumber(warning.accuracy, 1)}%)
|
|
</p>
|
|
<p className="text-sm">{body}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default CountingAccuracyWarningBanner;
|