mirror of
https://github.com/christianvidalwolf-prog/CrazeAnalytix.git
synced 2026-08-03 16:35:23 +02:00
Fix syntax in ForecastViewProps and clean rewrite of VendorStockBadge
This commit is contained in:
@@ -17,27 +17,27 @@ export const VendorStockBadge: React.FC<VendorStockBadgeProps> = ({ asin, vendor
|
|||||||
const stock = mode === 'uk' ? stockData.uk : stockData.eu;
|
const stock = mode === 'uk' ? stockData.uk : stockData.eu;
|
||||||
|
|
||||||
// Calculate Weeks of Coverage (WOC)
|
// Calculate Weeks of Coverage (WOC)
|
||||||
// If we have sales velocity, calculate coverage.
|
// If sales are 0 but store has stock -> Infinite coverage (>52 weeks) -> Green
|
||||||
// If sales are 0 but we have stock, coverage is effectively infinite (> 4 weeks) -> Green.
|
// If sales are 0 and NO stock -> 0 weeks -> Red
|
||||||
// If sales are 0 and stock is 0, coverage is 0 -> Red.
|
// If sales > 0 -> Calculate stock/sales
|
||||||
let woc: number | null = null;
|
let woc: number = 0;
|
||||||
const velocity = avgWeeklySales || 0;
|
const velocity = avgWeeklySales || 0;
|
||||||
|
|
||||||
if (velocity > 0) {
|
if (velocity > 0) {
|
||||||
woc = stock / velocity;
|
woc = stock / velocity;
|
||||||
} else if (stock > 0) {
|
} else if (stock > 0) {
|
||||||
woc = 999; // Infinite/Safe
|
woc = 999;
|
||||||
} else {
|
} else {
|
||||||
woc = 0; // No stock, no sales -> Empty/Red
|
woc = 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
const wocColor = woc < 4 ? 'text-rose-500' : 'text-emerald-500';
|
|
||||||
const wocText = woc === 999 ? '> 52 Weeks' : `${woc.toFixed(1)} Weeks Cover`;
|
const wocText = woc === 999 ? '> 52 Weeks' : `${woc.toFixed(1)} Weeks Cover`;
|
||||||
|
const wocColor = woc < 4 ? 'text-rose-500' : 'text-emerald-500';
|
||||||
|
|
||||||
const themeClasses = "bg-slate-200 text-slate-800 border-slate-300 shadow-sm";
|
const themeClasses = "bg-slate-200 text-slate-800 border-slate-300 shadow-sm";
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="flex flex-col items-center gap-1.5 min-h-[30px] justify-center">
|
<div className="flex flex-col items-center gap-1 justify-center min-w-[60px]">
|
||||||
<div
|
<div
|
||||||
className={`inline-flex items-center gap-1 px-2 py-0.5 rounded border text-[10px] font-bold transition-all hover:scale-105 active:scale-95 cursor-default ${themeClasses}`}
|
className={`inline-flex items-center gap-1 px-2 py-0.5 rounded border text-[10px] font-bold transition-all hover:scale-105 active:scale-95 cursor-default ${themeClasses}`}
|
||||||
title={`Stock en Amazon Warehouse (${mode.toUpperCase()}): ${stock}`}
|
title={`Stock en Amazon Warehouse (${mode.toUpperCase()}): ${stock}`}
|
||||||
@@ -76,7 +76,7 @@ export const VendorStockBadge: React.FC<VendorStockBadgeProps> = ({ asin, vendor
|
|||||||
<span>{stock.toLocaleString('de-DE')}</span>
|
<span>{stock.toLocaleString('de-DE')}</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<span className={`text-[10px] font-black uppercase tracking-tight whitespace-nowrap ${wocColor}`}>
|
<span className={`text-[9px] font-black uppercase tracking-tight whitespace-nowrap ${wocColor}`}>
|
||||||
{wocText}
|
{wocText}
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user