Skip to content
Snippets Groups Projects
Commit 48c8f55a authored by HAUTBOIS Aurelie's avatar HAUTBOIS Aurelie
Browse files

feat: conversion kwh to mwh and l to m3

parent 2a8258bd
No related branches found
No related tags found
1 merge request!236features/US278-update-analysis-graph
...@@ -16,6 +16,7 @@ import WaterIcon from 'assets/icons/visu/water-small.svg' ...@@ -16,6 +16,7 @@ import WaterIcon from 'assets/icons/visu/water-small.svg'
import GasIcon from 'assets/icons/visu/gas-small.svg' import GasIcon from 'assets/icons/visu/gas-small.svg'
import ProfileTypeService from 'services/profileType.service' import ProfileTypeService from 'services/profileType.service'
import ConverterService from 'services/converter.service' import ConverterService from 'services/converter.service'
import { formatNumberValues } from 'utils/utils'
interface AnalysisConsumptionProps { interface AnalysisConsumptionProps {
aggregatedPerformanceIndicator: PerformanceIndicator aggregatedPerformanceIndicator: PerformanceIndicator
...@@ -53,7 +54,6 @@ const AnalysisConsumption: React.FC<AnalysisConsumptionProps> = ({ ...@@ -53,7 +54,6 @@ const AnalysisConsumption: React.FC<AnalysisConsumptionProps> = ({
const goToForm = useCallback(() => { const goToForm = useCallback(() => {
history.push('/profileType') history.push('/profileType')
}, [history]) }, [history])
useEffect(() => { useEffect(() => {
let subscribed = true let subscribed = true
async function loadAverageComsumption() { async function loadAverageComsumption() {
...@@ -66,7 +66,6 @@ const AnalysisConsumption: React.FC<AnalysisConsumptionProps> = ({ ...@@ -66,7 +66,6 @@ const AnalysisConsumption: React.FC<AnalysisConsumptionProps> = ({
if (subscribed) { if (subscribed) {
setForecast(MonthlyForecast) setForecast(MonthlyForecast)
setHomePriceConsumption(MonthlyForecast.totalValue) setHomePriceConsumption(MonthlyForecast.totalValue)
console.log(fluidTypes)
} }
} }
loadAverageComsumption() loadAverageComsumption()
...@@ -86,7 +85,7 @@ const AnalysisConsumption: React.FC<AnalysisConsumptionProps> = ({ ...@@ -86,7 +85,7 @@ const AnalysisConsumption: React.FC<AnalysisConsumptionProps> = ({
<div className="consumption-price"> <div className="consumption-price">
<div className="user-graph"> <div className="user-graph">
<div className="price text-15-bold"> <div className="price text-15-bold">
{userPriceConsumption.toFixed(2)} {formatNumberValues(userPriceConsumption).toString()}
</div> </div>
<div <div
className="graph" className="graph"
...@@ -109,26 +108,29 @@ const AnalysisConsumption: React.FC<AnalysisConsumptionProps> = ({ ...@@ -109,26 +108,29 @@ const AnalysisConsumption: React.FC<AnalysisConsumptionProps> = ({
100}%`, 100}%`,
}} }}
></div> ></div>
<div className="price">{homePriceConsumption.toFixed(2)}</div> <div className="price">
{formatNumberValues(homePriceConsumption).toString()}
</div>
</div> </div>
</div> </div>
)} )}
{forecast && {forecast &&
fluidTypes.map((fluid, index) => { fluidTypes.map((fluid, index) => {
const performanceValue = peformanceIndicator[fluid].value
const fluidForecast: FluidForecast = forecast.fluidForecast[fluid] const fluidForecast: FluidForecast = forecast.fluidForecast[fluid]
const performanceValue = peformanceIndicator[fluid].value
let fluidIcon = GasIcon let fluidIcon = GasIcon
let fluidClass = 'gas' let fluidClass = 'gas'
let unitFluid = 'kWh' let fluidName = 'GAS'
let fluidLoad = fluidForecast.load let fluidLoad = fluidForecast.load
let fluidValue = fluidForecast.value let fluidValue = fluidForecast.value
if (fluid === FluidType.ELECTRICITY) { if (fluid === FluidType.ELECTRICITY) {
fluidIcon = ElecIcon fluidIcon = ElecIcon
fluidClass = 'elec' fluidClass = 'elec'
fluidName = 'ELECTRICITY'
} else if (fluid === FluidType.WATER) { } else if (fluid === FluidType.WATER) {
fluidIcon = WaterIcon fluidIcon = WaterIcon
fluidClass = 'water' fluidClass = 'water'
unitFluid = 'L' fluidName = 'WATER'
} }
if (toggleHome === 'ideal') { if (toggleHome === 'ideal') {
fluidLoad = fluidLoad =
...@@ -141,7 +143,20 @@ const AnalysisConsumption: React.FC<AnalysisConsumptionProps> = ({ ...@@ -141,7 +143,20 @@ const AnalysisConsumption: React.FC<AnalysisConsumptionProps> = ({
{performanceValue && userPriceConsumption && ( {performanceValue && userPriceConsumption && (
<div className="user-graph"> <div className="user-graph">
<div className="price text-15-bold"> <div className="price text-15-bold">
{Math.round(performanceValue) + ' ' + unitFluid} {Math.round(
performanceValue >= 1000 || fluidLoad >= 1000
? performanceValue / 1000
: performanceValue
) +
' ' +
t(
`FLUID.${fluidName}.${
fluidLoad >= 1000 || performanceValue >= 1000
? 'MEGAUNIT'
: 'UNIT'
}`
)}
{}
</div> </div>
<div <div
className="graph" className="graph"
...@@ -160,17 +175,29 @@ const AnalysisConsumption: React.FC<AnalysisConsumptionProps> = ({ ...@@ -160,17 +175,29 @@ const AnalysisConsumption: React.FC<AnalysisConsumptionProps> = ({
<StyledIcon icon={fluidIcon} size={22} /> <StyledIcon icon={fluidIcon} size={22} />
</div> </div>
<div className={`${toggleHome}-graph`}> <div className={`${toggleHome}-graph`}>
<div
className="graph"
style={{
width: `${(fluidValue / homePriceConsumption) * 100}%`,
}}
></div>
{performanceValue && ( {performanceValue && (
<div <div className="price">
className="graph" {Math.round(
style={{ fluidLoad >= 1000 || performanceValue >= 1000
width: `${(fluidValue / homePriceConsumption) * 100}%`, ? fluidLoad / 1000
}} : fluidLoad
></div> ) +
' ' +
t(
`FLUID.${fluidName}.${
fluidLoad >= 1000 || performanceValue >= 1000
? 'MEGAUNIT'
: 'UNIT'
}`
)}
</div>
)} )}
<div className="price">
{Math.round(fluidLoad) + ' ' + unitFluid}
</div>
</div> </div>
</div> </div>
) )
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment