/* global React, Icons, FIELDS, FIELD_INFO, HARVEST, HARVEST_INFO, STATUS, StatusBadge */
const { useState: detState, useEffect: detEffect } = React;
const money = (n) => "$" + Number(n).toLocaleString("es-ES");
function DRow({ label, value, strong }) {
return (
{label}
{value}
);
}
function SectionTitle({ children }) {
return {children}
;
}
function Metric({ label, value, unit, color }) {
return (
{label}
{value}
{unit && {unit}}
);
}
function Drawer({ tag, title, subtitle, children, footer, onClose }) {
return (
{tag &&
{tag}
}
{title}
{subtitle &&
{subtitle}
}
{children}
{footer &&
{footer}
}
);
}
function AskButton({ seed, onClose }) {
return (
);
}
function FieldDetail({ field, onClose }) {
const info = FIELD_INFO[field.id] || {};
const s = STATUS[field.status];
const trendUp = field.change >= 0;
return (
}>
{trendUp ? : }{Math.abs(field.change)}% vs. sem. pasada
0.55 ? "#4f8a2f" : field.ndvi > 0.42 ? "#b58a16" : "#c0492f"} />
= 50 ? "#4f8a2f" : "#c0492f"} />
{info.ndviTrend && (
Tendencia NDVI
últimas 6 sem.
0.45 ? "#3a6b22" : "#c0492f"} width={416} height={44} />
)}
CULTIVO
ÚLTIMA ACTIVIDAD
{info.obs && (
)}
);
}
function HarvestDetail({ crop, onClose }) {
const h = HARVEST.find((x) => x.crop === crop);
const info = HARVEST_INFO[crop] || {};
if (!h) return null;
const pct = Math.round((h.amount / h.cap) * 100);
return (
}>
85 ? "#c0492f" : "#4f8a2f"} />
{info.avgMoisture != null && (
Humedad de almacenaje
{info.avgMoisture}% / {info.target}% máx.
)}
TRAZABILIDAD DE INGRESOS
FECHALOTE ORIGENTON.HUM.
{(info.entries || []).map((e, i) => (
{e.date}
{e.field}
{e.tonnes}
{e.moisture != null ? e.moisture + "%" : "—"}
))}
LOGÍSTICA
{info.note && (
)}
);
}
function DetailLayer() {
const [state, setState] = detState(null);
detEffect(() => {
const onField = (e) => { const f = FIELDS.find((x) => x.id === e.detail.id); if (f) setState({ type: "field", field: f }); };
const onHarvest = (e) => setState({ type: "harvest", crop: e.detail.crop });
const onKey = (e) => { if (e.key === "Escape") setState(null); };
window.addEventListener("detail:field", onField);
window.addEventListener("detail:harvest", onHarvest);
window.addEventListener("keydown", onKey);
return () => {
window.removeEventListener("detail:field", onField);
window.removeEventListener("detail:harvest", onHarvest);
window.removeEventListener("keydown", onKey);
};
}, []);
const close = () => setState(null);
if (!state) return null;
if (state.type === "field") return ;
if (state.type === "harvest") return ;
return null;
}
window.openField = (id) => window.dispatchEvent(new CustomEvent("detail:field", { detail: { id } }));
window.openHarvest = (crop) => window.dispatchEvent(new CustomEvent("detail:harvest", { detail: { crop } }));
window.DetailLayer = DetailLayer;