Feat: Agro Cards, Add Data Capture Date
This commit is contained in:
@@ -10,7 +10,7 @@ import CloseIcon from '@mui/icons-material/Close';
|
||||
|
||||
import type { CotizacionGanado } from '../models/mercadoModels';
|
||||
import { useApiData } from '../hooks/useApiData';
|
||||
import { formatCurrency, formatInteger } from '../utils/formatters';
|
||||
import { formatCurrency, formatInteger, formatDateOnly } from '../utils/formatters';
|
||||
import { AgroHistoricalChartWidget } from './AgroHistoricalChartWidget';
|
||||
|
||||
// El subcomponente ahora tendrá un botón para el gráfico.
|
||||
@@ -61,17 +61,24 @@ const AgroCard = ({ registro, onChartClick }: { registro: CotizacionGanado, onCh
|
||||
<Typography variant="body2" sx={{ fontWeight: 'bold' }}>${formatCurrency(registro.mediano)}</Typography>
|
||||
</Box>
|
||||
|
||||
<Box sx={{ display: 'flex', alignItems: 'center', justifyContent: 'center', gap: 3, pt: 1, borderTop: 1, borderColor: 'divider' }}>
|
||||
<Box sx={{ textAlign: 'center' }}>
|
||||
<PiCow size="28" />
|
||||
<Typography variant="body1" sx={{ fontWeight: 'bold' }}>{formatInteger(registro.cabezas)}</Typography>
|
||||
<Typography variant="caption" color="text.secondary">Cabezas</Typography>
|
||||
</Box>
|
||||
<Box sx={{ textAlign: 'center' }}>
|
||||
<ScaleIcon color="action" />
|
||||
<Typography variant="body1" sx={{ fontWeight: 'bold' }}>{formatInteger(registro.kilosTotales)}</Typography>
|
||||
<Typography variant="caption" color="text.secondary">Kilos</Typography>
|
||||
{/* Pie de la tarjeta */}
|
||||
<Box sx={{ mt: 2, pt: 1, borderTop: 1, borderColor: 'divider' }}>
|
||||
<Box sx={{ display: 'flex', alignItems: 'center', justifyContent: 'center', gap: 3 }}>
|
||||
<Box sx={{ textAlign: 'center' }}>
|
||||
<PiCow size="28" />
|
||||
<Typography variant="body1" sx={{ fontWeight: 'bold' }}>{formatInteger(registro.cabezas)}</Typography>
|
||||
<Typography variant="caption" color="text.secondary">Cabezas</Typography>
|
||||
</Box>
|
||||
<Box sx={{ textAlign: 'center' }}>
|
||||
<ScaleIcon color="action" />
|
||||
<Typography variant="body1" sx={{ fontWeight: 'bold' }}>{formatInteger(registro.kilosTotales)}</Typography>
|
||||
<Typography variant="caption" color="text.secondary">Kilos</Typography>
|
||||
</Box>
|
||||
</Box>
|
||||
|
||||
<Typography variant="caption" sx={{ display: 'block', textAlign: 'left', color: 'text.secondary', mt: 1, pt: 1, borderTop: 1, borderColor: 'divider' }}>
|
||||
Dato Registrado el {formatDateOnly(registro.fechaRegistro)}
|
||||
</Typography>
|
||||
</Box>
|
||||
</Paper>
|
||||
);
|
||||
|
||||
@@ -6,7 +6,6 @@ import type { CotizacionGanado } from '../models/mercadoModels';
|
||||
import { useApiData } from '../hooks/useApiData';
|
||||
import { formatCurrency, formatInteger, formatFullDateTime } from '../utils/formatters';
|
||||
|
||||
// --- V INICIO DE LA MODIFICACIÓN V ---
|
||||
// El sub-componente ahora solo necesita renderizar la tarjeta de móvil.
|
||||
// La fila de la tabla la haremos directamente en el componente principal.
|
||||
const AgroDataCard = ({ row }: { row: CotizacionGanado }) => {
|
||||
@@ -56,7 +55,6 @@ const AgroDataCard = ({ row }: { row: CotizacionGanado }) => {
|
||||
</Paper>
|
||||
);
|
||||
};
|
||||
// --- ^ FIN DE LA MODIFICACIÓN ^ ---
|
||||
|
||||
|
||||
export const MercadoAgroWidget = () => {
|
||||
|
||||
Reference in New Issue
Block a user