IO-1053 Fix issues with scoreboard updates.

client/src/components/scoreboard-chart/chart-custom-tooltip.jsx

@@ -12,13 +12,13 @@ const CustomTooltip = ({ active, payload, label }) => {
       >
         <p style={{ margin: "0" }}>{label}</p>
         {payload.map((data, index) => {
-          if (data.dataKey === "sales")
+          if (data.dataKey === "sales" || data.dataKey === "accSales")
             return (
               <p
                 style={{ margin: "10px 0", color: data.color }}
                 key={index}
               >{`${data.name} : ${Dinero({
-                amount: data.value,
+                amount: Math.round(data.value * 100),
               }).toFormat()}`}</p>
             );
 

client/src/components/scoreboard-chart/scoreboard-chart.component.jsx

@@ -1,3 +1,4 @@
+import Dinero from "dinero.js";
 import { Card } from "antd";
 import moment from "moment";
 import React from "react";
@@ -45,25 +46,22 @@ export function ScoreboardChart({ sbEntriesByDate, bodyshop }) {
           return {
             bodyhrs: dayAcc.bodyhrs + dayVal.bodyhrs,
             painthrs: dayAcc.painthrs + dayVal.painthrs,
+            sales:
+              dayAcc.painthrs +
+              dayVal.job.job_totals.totals.subtotal.amount / 100 +
+              2500,
           };
         },
-        { bodyhrs: 0, painthrs: 0 }
+        { bodyhrs: 0, painthrs: 0, sales: 0 }
       );
     } else {
       dayhrs = {
         bodyhrs: 0,
         painthrs: 0,
+        sales: 0,
       };
     }
 
-    const yesterdaySales = acc.length > 0 && acc[acc.length - 1].sales;
-    const sales =
-      sbEntriesByDate[val]?.reduce((acc, sb) => {
-        return acc + sb.job.job_totals.totals.subtotal.amount;
-      }, 0) || 0;
-
-    const accSales = yesterdaySales + sales;
-
     const theValue = {
       date: moment(val).format("D ddd"),
       paintHrs: _.round(dayhrs.painthrs, 1),
@@ -82,7 +80,13 @@ export function ScoreboardChart({ sbEntriesByDate, bodyshop }) {
           : dayhrs.painthrs + dayhrs.bodyhrs,
         1
       ),
-      sales: accSales,
+      sales: _.round(dayhrs.sales, 2),
+      accSales: _.round(
+        acc.length > 0
+          ? acc[acc.length - 1].accSales + dayhrs.sales
+          : dayhrs.sales,
+        2
+      ),
     };
 
     return [...acc, theValue];
@@ -99,22 +103,18 @@ export function ScoreboardChart({ sbEntriesByDate, bodyshop }) {
           <XAxis dataKey="date" strokeWidth={graphProps.strokeWidth} />
           <YAxis
             strokeWidth={graphProps.strokeWidth}
-            allowDataOverflow
+            // allowDataOverflow
             dataKey="sales"
             yAxisId="right"
+            tickFormatter={(value) =>
+              Dinero({ amount: Math.round(value * 100) }).toFormat()
+            }
             orientation="right"
           />
           <YAxis yAxisId="left" strokeWidth={graphProps.strokeWidth} />
           <Tooltip content={<CustomTooltip />} />
           <Legend />
-          <Area
-            type="monotone"
-            name="Accumulated Hours"
-            dataKey="accHrs"
-            fill="lightgreen"
-            stroke="green"
-            yAxisId="left"
-          />
+
           <Bar
             name="Body Hours"
             dataKey="bodyHrs"
@@ -140,11 +140,30 @@ export function ScoreboardChart({ sbEntriesByDate, bodyshop }) {
             strokeWidth={graphProps.strokeWidth}
           />
 
-          <Line
-            name="Sales"
+          <Area
             type="monotone"
+            name="MTD Hours"
+            dataKey="accHrs"
+            fill="lightblue"
+            stroke="blue"
+            yAxisId="left"
+          />
+          {
+            //  <Area
+            //         type="monotone"
+            //         name="MTD Sales"
+            //         dataKey="accSales"
+            //         fill="lightgreen"
+            //         stroke="green"
+            //         yAxisId="right"
+            //       />
+          }
+          <Bar
+            name="Sales"
             dataKey="sales"
-            stroke="#8F00FF"
+            stackId="day"
+            barSize={20}
+            fill="darkgreen"
             yAxisId="right"
             strokeWidth={graphProps.strokeWidth}
           />