import React, { useState } from ‘react’;
import { Card, CardHeader, CardTitle, CardContent } from ‘@/components/ui/card’;
import { Input } from ‘@/components/ui/input’;
import { Button } from ‘@/components/ui/button’;
const FuelSavingsCalculator = () => {
const [consumoKm, setConsumoKm] = useState(»);
const [litrosMensuales, setLitrosMensuales] = useState(»);
const [precioDiesel, setPrecioDiesel] = useState(»);
const [precioAditivo, setPrecioAditivo] = useState(»);
const [numeroVehiculos, setNumeroVehiculos] = useState(»);
const [resultados, setResultados] = useState([]);
const calcularAhorros = () => {
const litros = parseFloat(litrosMensuales);
const precio = parseFloat(precioDiesel);
const precioEFull = parseFloat(precioAditivo);
const vehiculos = parseInt(numeroVehiculos);
const porcentajesAhorro = [5, 8, 10, 12, 14, 16, 18, 20];
const proporcionAditivo = 1 / 30000;
const calculos = porcentajesAhorro.map(porcentaje => {
const litrosFlota = litros * vehiculos;
const ahorroLitros = Math.round(litrosFlota * (porcentaje / 100));
const dineroAhorrado = Math.round(ahorroLitros * precio);
const aditivoNecesario = Math.round(litrosFlota * proporcionAditivo * 1000) / 1000;
const costoAditivo = Math.round(aditivoNecesario * precioEFull);
const beneficioNeto = Math.round(dineroAhorrado – costoAditivo);
return {
porcentaje,
ahorroLitros: `$${ahorroLitros.toLocaleString()}`,
dineroAhorrado: `$${dineroAhorrado.toLocaleString()}`,
aditivoNecesario: `${aditivoNecesario.toFixed(3)} L`,
costoAditivo: `$${costoAditivo.toLocaleString()}`,
beneficioNeto: `$${beneficioNeto.toLocaleString()}`
};
});
setResultados(calculos);
};
return (
Calculadora de Ahorros F2-21® Nanotech para Flota
setConsumoKm(e.target.value)}
placeholder=»Consumo (L/km)»
/>
setLitrosMensuales(e.target.value)}
placeholder=»Litros mensuales por vehículo»
/>
setPrecioDiesel(e.target.value)}
placeholder=»Precio diésel ($)»
/>
setPrecioAditivo(e.target.value)}
placeholder=»Precio aditivo F2-21® ($)»
/>
setNumeroVehiculos(e.target.value)}
placeholder=»Número de vehículos en flota»
className=»col-span-2″
/>
{resultados.length > 0 && (
Ahorro (%) |
Litros Ahorrados |
Dinero Ahorrado |
Aditivo Necesario |
Costo Aditivo |
Beneficio Neto |
{resultados.map((resultado, index) => (
{resultado.porcentaje}% |
{resultado.ahorroLitros} |
{resultado.dineroAhorrado} |
{resultado.aditivoNecesario} |
{resultado.costoAditivo} |
{resultado.beneficioNeto} |
))}
)}
);
};
export default FuelSavingsCalculator;