diff --git a/src/components/molecules/reporting-scatterchart/reporting-scatterchart.molecule.jsx b/src/components/molecules/reporting-scatterchart/reporting-scatterchart.molecule.jsx index c1fd722..5ecf75b 100644 --- a/src/components/molecules/reporting-scatterchart/reporting-scatterchart.molecule.jsx +++ b/src/components/molecules/reporting-scatterchart/reporting-scatterchart.molecule.jsx @@ -1,5 +1,11 @@ -import { Card, Skeleton, Typography, Tooltip as AntdToolTip } from "antd"; -import React from "react"; +import { + Card, + Radio, + Skeleton, + Tooltip as AntdToolTip, + Typography, +} from "antd"; +import React, { useState } from "react"; import { connect } from "react-redux"; import { CartesianGrid, @@ -24,19 +30,23 @@ const mapStateToProps = createStructuredSelector({ reportingLoading: selectReportLoading, scoreCard: selectScorecard, }); -const mapDispatchToProps = (dispatch) => ({ - //setUserLanguage: language => dispatch(setUserLanguage(language)) -}); +const mapDispatchToProps = (dispatch) => ({}); export default connect( mapStateToProps, mapDispatchToProps )(ReportingScatterChartMolecule); export function ReportingScatterChartMolecule({ reportingLoading, scoreCard }) { + const [type, setType] = useState("percent"); + if (reportingLoading) return ; if (!scoreCard) return ; + const handleTypeChange = (e) => { + setType(e.target.value); + }; + return (
- - % Variance from Target - +
+ {type === "percent" && ( + + + % Variance from Target + + + )} + {type === "dollars" && ( + + + $ Variance from Target + + + )} + + + % - Percent + $ - Dollars + +
- + {type === "percent" && ( + + )} + {type === "dollars" && ( + + )} + -
-
{item.owner} {item.vehicle} @@ -88,6 +132,12 @@ export function ReportingScatterChartMolecule({ reportingLoading, scoreCard }) { {item.dbPriceSum.toFormat()} + + {`${item.deviationPc}%`} + + + ${item.deviationDollars} + ); }} diff --git a/src/redux/reporting/reporting.sagas.js b/src/redux/reporting/reporting.sagas.js index 7af6c47..055797c 100644 --- a/src/redux/reporting/reporting.sagas.js +++ b/src/redux/reporting/reporting.sagas.js @@ -102,8 +102,13 @@ export function* handleCalculateScoreCard({ payload: jobs }) { actPriceSum ); + const deviationPc = Math.round((jobRpsPc - jobTarget) * 1000) / 10; + scoreCard.scatterChart[job.group].push({ - deviation: Math.round((jobRpsPc - jobTarget) * 1000) / 10, + deviationPc: isNaN(deviationPc) ? -100 : deviationPc, + deviationDollars: ( + jobRpsDollars.subtract(expectedRpsDollars).getAmount() / 100 + ).toFixed(2), age: job.v_age, dbPriceSum, dbPriceSumAmt: dbPriceSum.getAmount() / 100, @@ -112,7 +117,7 @@ export function* handleCalculateScoreCard({ payload: jobs }) { vehicle: `${job.v_model_yr} ${job.v_makedesc} ${job.v_model} (${job.v_type}) - ${job.group}`, clm_no: job.clm_no, jobRpsDollars, - jobRpsPc, + jobRpsPc: isNaN(jobRpsPc) ? -1 : jobRpsPc, }); //sum db price * percentage expected.