\r\n {renderBody()}\r\n \r\n \r\n )}\r\n \r\n );\r\n});\r\n\r\nexport default Tabla\r\n","import { React, useState, useContext, useRef } from \"react\";\r\n\r\nimport { TrashIcon } from \"@heroicons/react/solid\";\r\n\r\nimport { AppContext } from '../Provider/Provider';\r\n\r\nimport Dropdown from './DropdownComponent';\r\nimport Tabla from './TablaComponent';\r\n\r\nconst InputCard = ({ nombreCategoria, electrodomesticos, cantidad, usoDiario }) => {\r\n\r\n const [valoresConsumoState, setValoresConsumoState] = useContext(AppContext);\r\n\r\n const [electrodomesticoState, setElectrodomesticoState] = useState({});\r\n const [cantidadState, setCantidadState] = useState({});\r\n const [usoDiarioState, setUsoDiarioState] = useState({});\r\n const [inputDataState, setInputDataState] = useState([]);\r\n\r\n const [electroDropdownIsEmpty, setElectroDropdownIsEmpty] = useState(true);\r\n const [cantidadDropdownIsEmpty, setCantidadDropdownIsEmpty] = useState(true);\r\n const [usoDiarioDropdownIsEmpty, setUsoDiarioDropdownIsEmpty] = useState(true);\r\n \r\n /** Para limpiar los dropdowns */\r\n const [clearElectro, setClearElectro] = useState(false);\r\n const [clearCantidad, setClearCantidad] = useState(false);\r\n const [clearUsoDiario, setClearUsoDiario] = useState(false);\r\n \r\n\r\n const tablaRef = useRef();\r\n \r\n /** Obtiene los datos de los dropdowns */\r\n function handleElectrodomestico(item) {\r\n var localObj = valoresConsumoState;\r\n // Deshabilita el uso diario para los termotanques o heladeras\r\n if(item.name.includes(\"Termotanque\") || item.name.includes(\"Heladera\"))\r\n { \r\n localObj.disableDropdown = true;\r\n setUsoDiarioDropdownIsEmpty(false);\r\n }\r\n else\r\n localObj.disableDropdown = false;\r\n\r\n setValoresConsumoState(localObj);\r\n setElectrodomesticoState(item);\r\n setElectroDropdownIsEmpty(false);\r\n \r\n }\r\n\r\n function handleCantidad(item) {\r\n setCantidadState(item);\r\n setCantidadDropdownIsEmpty(false);\r\n }\r\n\r\n function handleUsoDiario(item) {\r\n setUsoDiarioState(item);\r\n setUsoDiarioDropdownIsEmpty(false);\r\n }\r\n /** ---------------------------------- */\r\n\r\n /** ------ Limpia los dropdowns ------ */\r\n function handleClearElectro(clearItem) {\r\n setClearElectro(clearItem);\r\n }\r\n function handleClearCantidad(clearItem) {\r\n setClearCantidad(clearItem);\r\n }\r\n function handleClearUsoDiario(clearItem) {\r\n setClearUsoDiario(clearItem);\r\n }\r\n /** ---------------------------------- */\r\n\r\n if (valoresConsumoState.clearDropdown) {\r\n enableClear();\r\n\r\n let localObj = valoresConsumoState;\r\n \r\n localObj.clearDropdown = false;\r\n setValoresConsumoState(localObj);\r\n }\r\n\r\n\r\n function handleInputDataOnClick() {\r\n if (!electroDropdownIsEmpty \r\n && !cantidadDropdownIsEmpty\r\n && !usoDiarioDropdownIsEmpty\r\n ) \r\n {\r\n var valorUsoDiario = 0;\r\n var nombreUsoDiario = \"\";\r\n if(electrodomesticoState.name.includes(\"Termotanque\")){\r\n valorUsoDiario = 2.5;\r\n nombreUsoDiario = valorUsoDiario + \" hs.\";\r\n }\r\n else if(electrodomesticoState.name.includes(\"Heladera\")){\r\n valorUsoDiario = 24;\r\n nombreUsoDiario = valorUsoDiario + \" hs.\";\r\n }\r\n else{ \r\n valorUsoDiario = usoDiarioState.value;\r\n nombreUsoDiario = usoDiarioState.name;\r\n }\r\n\r\n let digitos = 2;\r\n \r\n var calcKWH =\r\n cantidadState.name *\r\n (electrodomesticoState.W / 1000) *\r\n valorUsoDiario;\r\n \r\n var calcBim = calcKWH * 60;\r\n \r\n calcKWH =\r\n Math.trunc(calcKWH * Math.pow(10, digitos)) / Math.pow(10, digitos);\r\n calcBim =\r\n Math.trunc(calcBim * Math.pow(10, digitos)) / Math.pow(10, digitos);\r\n \r\n let inputData = {\r\n electrodomestico: electrodomesticoState.name,\r\n cantidad: cantidadState.name,\r\n kWh: calcKWH,\r\n usoDiario: nombreUsoDiario,\r\n consumoBimestral: calcBim,\r\n };\r\n\r\n setInputDataState(inputData);\r\n\r\n handleTotalkWhCategoria();\r\n \r\n disableButton();\r\n\r\n enableClear();\r\n }\r\n }\r\n\r\n function disableButton() {\r\n setElectroDropdownIsEmpty(true);\r\n setCantidadDropdownIsEmpty(true);\r\n setUsoDiarioDropdownIsEmpty(true);\r\n }\r\n\r\n function enableClear() {\r\n var localObj = valoresConsumoState;\r\n localObj.disableDropdown = false;\r\n \r\n setClearElectro(true);\r\n setClearCantidad(true);\r\n setClearUsoDiario(true);\r\n \r\n setValoresConsumoState(localObj);\r\n\r\n }\r\n\r\n\r\n function handleTotalkWhCategoria(tableData) {\r\n \r\n if (typeof tableData !== \"undefined\" && typeof nombreCategoria !== \"undefined\") {\r\n let localObj = valoresConsumoState;\r\n let digitos = 2;\r\n localObj.ValoresCategoriaCard[nombreCategoria].kWh = tableData;\r\n localObj.TotalkWhBim = tableData; //poner la suma total. \r\n localObj.TotalkWhBim = Math.trunc(localObj.TotalkWhBim * Math.pow(10, digitos)) / Math.pow(10, digitos);\r\n setValoresConsumoState(localObj);\r\n }\r\n }\r\n\r\n function handleDeleteTableOnClick(){\r\n /** Acá se llama a la función de TablaComponent */\r\n tablaRef.current.clearArrayOfElements();\r\n }\r\n\r\n return (\r\n \r\n
\r\n
{nombreCategoria}
\r\n
\r\n Electrodomésticos\r\n
\r\n
\r\n \r\n
\r\n\r\n
\r\n
\r\n
\r\n Cantidad\r\n
\r\n
\r\n
\r\n
\r\n
\r\n Uso Diario\r\n
\r\n
\r\n
\r\n
\r\n \r\n AGREGAR\r\n \r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n \r\n \r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
{totalkWhBim} kWh
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n 1\r\n \r\n \r\n Seleccioná dentro de cada categoría los electrodomésticos que utilizás, indicando cantidad y horas de uso diario.\r\n \r\n
\r\n
\r\n
\r\n
\r\n {cat.map((cate, index) => (\r\n
\r\n saveNameOnClick(itemName)}\r\n currentCateName={cateNamefromCard}\r\n />\r\n
\r\n ))}\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n 2\r\n \r\n \r\n Presioná el botón para ver cómo se compone tu consumo y descubrí consejos para ahorrar en tu factura.\r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n VER TUS RESULTADOS\r\n \r\n
\r\n
\r\n
\r\n
\r\n CONSUMO BIMESTRAL ESTIMADO:\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
{name}\r\n
\r\n
{tempRes} %\r\n
\r\n El consumo de energía está asociado con el tiempo de funcionamiento del equipo, por eso la clave es usar sólo lo necesario.\r\n
\r\n let heladera = \r\n \r\n - Mantener la parte trasera limpia y ventilada.
\r\n - Ubicarla lejos de los focos de calor y a 15 cm de la pared.
\r\n - Verificar los burletes de la puerta.
\r\n - No introducir comidas calientes.
\r\n - No abrir la puerta inútilmente o por tiempos prolongados.
\r\n - Descongelarla periódicamente.
\r\n
; \r\n let lavarropas =\r\n \r\n - Procurar siempre lavar con agua fría.
\r\n - Utilizar siempre su capacidad máxima (al igual que en los secarropas).
\r\n
;\r\n \r\n let calefones = \r\n \r\n - Ajustar el termostato para obtener una temperatura ligeramente superior a los 40°C.
\r\n - No prolongar inútilmente el tiempo de las duchas.
\r\n
;\r\n let plancha = \r\n \r\n - Mantener la superficie de la plancha limpia.
\r\n - Acumular ropa y no planchar prendas por separado.
\r\n - Desenchufarla antes de terminar y utilizar el calor remanente.
\r\n
\r\n let teleAudioCompus = \r\n \r\n - Apagarlos mientras no se utilizan.
\r\n - No dejarlos en “stand by”.
\r\n - Configurar la opción de ahorro para el monitor.
\r\n
\r\n\r\n /** \r\n * Usuarios Responsables\r\n */\r\n let usuariosResponsablesDetalle = \r\n \r\n El aporte de los usuarios es fundamental para el uso eficiente y racional de la energía eléctrica. Con la ayuda y colaboración de cada uno, los beneficios son para todos. Por eso los invitamos a:\r\n
;\r\n let usuariosResponsablesItems = \r\n \r\n - Verificar la instalación eléctrica de la vivienda para evitar pérdidas.
\r\n - Apagar las luces de los ambientes que no se usan.
\r\n - Aprovechar la luz natural y elegir colores claros para paredes y techos.
\r\n - Usar lámparas de bajo consumo.
\r\n - Apagar los electrodomésticos mientras no se utilizan.
\r\n - Desenchufar el cargador del celular.
\r\n - Elegir los de bajo consumo eléctrico, a la hora de comprar nuevos electrodomésticos.
\r\n
;\r\n\r\n /** \r\n * Iluminación Eficiente \r\n */\r\n let iluminacionDetalle1 = \r\n \r\n - Es aquella que ilumina con el menor consumo de energía posible.
\r\n - El uso de lámparas fluorescentes compactas, comúnmente llamadas “lámparas de bajo consumo”, es el mejor medio para lograr una iluminación eficiente.
\r\n - Estas lámparas tienen una potencia de entre 7 y 23 watts, para que tengan el flujo luminoso equivalente a las incandescentes de 25 a 100 w.
\r\n
\r\n let iluminacionDetalle2 = \r\n Beneficios de las lámparas fluorescentes compactas:
;\r\n let iluminacionItems = \r\n \r\n - Consumen entre 75 y 80% menos que las comunes, aún brindando la misma luz.
\r\n - Duran 6 veces más que las lámparas comunes.
\r\n - Habitualmente, son un poco más caras que las comunes, pero el ahorro compensa el gasto adicional.
\r\n - Preservan el medio ambiente, usando cuidadosamente las reservas naturales disponibles.
\r\n
\r\n\r\n /** \r\n * Aire Acondicionado \r\n */\r\n let aireAcondicionadoDetalle = \r\n \r\n El acondicionador de aire depende casi exclusivamente de la electricidad y su uso racional implica, por ende, un ahorro importante de energía.\r\n
;\r\n let aireAcondicionadoRecomendaciones = \r\n \r\n - No enfriar en exceso. Una temperatura de 24°C en verano en el interior de la vivienda brinda una suficiente sensación de bienestar. Por cada grado de temperatura por debajo de los 24°C el acondicionador consumirá aproximadamente un 5% más de energía.
\r\n - Instalar persianas y cortinas que impiden las radiaciones directas del sol y, por lo tanto, disminuyen la necesidad de refrigerar.
\r\n - Desconectar el acondicionador cuando no haya nadie en la vivienda o habitación que se está refrigerando.
\r\n - Revisar periódicamente el artefacto para comprobar si existen fugas de gas Freón (el fluido refrigerante). El escape de este gas impide el buen funcionamiento del equipo y daña el medio ambiente.
\r\n - Realizar la limpieza del filtro que atrapa la polución ambiente para mejorar el rendimiento del equipo.
\r\n
;\r\n\r\n /** \r\n * Calefacción\r\n */\r\n let calefaccionDetalle = \r\n \r\n Cualquiera sea el tipo de calefacción que se utilice, las medidas para reducir el consumo energético se agrupan alrededor de tres ideas:\r\n
\r\n let calefaccionAislamiento = \r\n Una parte del calor escapa de las viviendas por las paredes, puertas, ventanas, caja de las persianas, etc. Para evitarlo se recomienda:\r\n
\r\n - Instalar algún tipo de aislamiento térmico en paredes y techo, por ejemplo, paneles de telgopor.
\r\n - Instalar burletes adhesivos en los cierres de puertas exteriores y ventanas, cerrando así las rendijas
\r\n
\r\n ;\r\n let calefaccionTemperatura = \r\n En condiciones normales, la temperatura exterior con la que el cuerpo humano encuentra la sensación de bienestar es ligeramente inferior a los 20° C. Por ello:\r\n
\r\n - Intentar mantener la temperatura en el hogar alrededor de los 20° C.
\r\n - No usar la calefacción para mantener un ambiente exactamente opuesto al que impone la estación del año: estar desabrigado dentro de la casa en invierno es perjudicial para la salud y representa un consumo innecesario de energía.
\r\n
\r\n ;\r\n let calefaccionBuenasCostumbres = \r\n \r\n - Los calentadores eléctricos tienen un consumo energético mucho mayor.
\r\n - Apagar la calefacción por la noche.
\r\n - Ventilar la casa y cerrar las ventanas antes de encender la calefacción.
\r\n
\r\n\r\n switch (currentCat) {\r\n case \"Climatización\": \r\n return \r\n
Climatización
\r\n {aireAcondicionadoDetalle}\r\n
\r\n {aireAcondicionadoRecomendaciones}\r\n
\r\n {/* {calefaccionDetalle}\r\n
*/}\r\n {/* {calefaccionAislamiento}\r\n
*/}\r\n {/* {calefaccionTemperatura}\r\n
*/}\r\n {calefaccionBuenasCostumbres}\r\n
\r\n \r\n case \"Cocina\": \r\n return \r\n
Cocina
\r\n {usuariosResponsablesDetalle}\r\n
\r\n {usuariosResponsablesItems}\r\n
\r\n \r\n case \"Agua\":\r\n return \r\n
Agua
\r\n {artefactoDetalle}\r\n
\r\n {calefones}\r\n
\r\n \r\n case \"Refrigeración\":\r\n return \r\n
Refrigeración
\r\n {artefactoDetalle}\r\n
\r\n {heladera}\r\n
\r\n \r\n case \"Cuidado Personal\":\r\n return \r\n
Cuidado Personal
\r\n {artefactoDetalle}\r\n
\r\n \r\n case \"Electrónica, Audio y Video\":\r\n return \r\n
Electrónica, Audio y Video
\r\n {artefactoDetalle}\r\n
\r\n {teleAudioCompus}\r\n
\r\n \r\n case \"Línea Blanca\":\r\n return \r\n
Línea Blanca
\r\n {artefactoDetalle}\r\n
\r\n {lavarropas}\r\n
\r\n {plancha}\r\n
\r\n \r\n case \"Iluminación\":\r\n return \r\n
Iluminación
\r\n
Iluminación Eficiente
\r\n {iluminacionDetalle1}\r\n
\r\n {iluminacionDetalle2}\r\n
\r\n {iluminacionItems}\r\n
\r\n
\r\n
Maquinaria
\r\n {usuariosResponsablesDetalle}\r\n
\r\n {usuariosResponsablesItems}\r\n
\r\n \r\n default: \r\n return \r\n
\r\n No hay consejos para mostrar\r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n 3\r\n \r\n
\r\n
\r\n El resumen de tu simulación es el siguiente:\r\n
\r\n
\r\n
\r\n {/* Mantener comentado hasta que requieran lo contrario */}\r\n {/* \r\n IMPORTE BIMESTRAL ESTIMADO:\r\n
\r\n \r\n ${totalAPagarEstimadoBimestral.toFixed(2)}\r\n
*/}\r\n \r\n CONSUMO BIMESTRAL ESTIMADO:\r\n
\r\n \r\n
\r\n {valoresConsumoState.TotalkWhBim} kWh\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n Tu consumo se encuentra distribuido de la siguiente forma:\r\n \r\n \r\n {cat.map((cate, index) => (\r\n
\r\n \r\n
\r\n ))}\r\n
\r\n
\r\n CONSEJOS PARA MEJORAR TU CONSUMO\r\n
\r\n
\r\n \r\n
\r\n
\r\n \r\n VOLVER\r\n \r\n {/* Mantener comentado hasta que requieran lo contrario */}\r\n \r\n {(window.location.href == process.env.REACT_APP_CURRENT_URL) ? 'CERRAR Y ENVIAR' : 'CERRAR'}\r\n \r\n
\r\n
\r\n \r\n Abrir Simulador\r\n \r\n
*/}\r\n\r\n \r\n \r\n \r\n
\r\n \r\n \r\n\r\n {/* This element is to trick the browser into centering the modal contents. */}\r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n