Added validating claiming hours using shop setting

components/labor-allocations-table/labor-allocations-table.component.jsx

@@ -17,12 +17,13 @@ const mapStateToProps = createStructuredSelector({
   technician: selectCurrentEmployee,
 });
 
-export function LaborAllocationsTable({ jobId, bodyshop, technician }) {
-  // console.log("LaborAllocationsTable, jobId", jobId);
+export function LaborAllocationsTable({ jobId, bodyshop, technician,costCenterDiff,selectedCostCenter}) {
+  //  console.log("LaborAllocationsTable, costCenterDiff", costCenterDiff);
+  //  console.log("LaborAllocationsTable, selectedCostCenter", selectedCostCenter);
   const { t } = useTranslation();
 
   const onRefresh = async () => {
-    console.log("LaborAllocationsTable refetch");
+    // console.log("LaborAllocationsTable refetch");
     return refetch();
   };
 
@@ -43,17 +44,28 @@ export function LaborAllocationsTable({ jobId, bodyshop, technician }) {
 
   useEffect(() => {
     // console.log("LaborAllocationsTable useEffect on [all inputs] change",data?.joblines,data?.adjustments);
-    if (!!data?.joblines && !!data?.timetickets && !!bodyshop)
-      setTotals(
-        CalculateAllocationsTotals(
-          bodyshop,
-          data?.joblines,
-          data?.timetickets,
-          data?.adjustments
-        )
+    if (!!data?.joblines && !!data?.timetickets && !!bodyshop){
+      let temptotals = CalculateAllocationsTotals(
+        bodyshop,
+        data?.joblines,
+        data?.timetickets,
+        data?.adjustments
       );
+      if(!!selectedCostCenter){
+        let tempCostCenterDiff = Math.round(
+          temptotals.find(
+            (total) =>
+              total["cost_center"] === selectedCostCenter.label
+          )?.difference * 10
+        ) / 10;
+        costCenterDiff.current= tempCostCenterDiff;
+      }
+      setTotals(
+        temptotals
+      );
+    }
     if (!jobId) setTotals([]);
-  }, [data?.joblines, data?.timetickets, bodyshop, data?.adjustments, jobId]);
+  }, [data?.joblines, data?.timetickets, bodyshop, data?.adjustments, jobId,selectedCostCenter]);
 
   const summary =
     totals &&
@@ -70,9 +82,11 @@ export function LaborAllocationsTable({ jobId, bodyshop, technician }) {
   // console.log("labor summary is:", summary);
 
   return (
-    <View style={{ flexGrow: 1 }}>
+    <View style={{ flex: 1}}>
       {typeof data !== "undefined" ? (
-        <View style={{ flexGrow: 1 }}>
+        <Card style={{ flex: 1 }}>
+          <Card.Title><Text>Labor Allocations</Text></Card.Title>
+          <Card.Content>
           <DataTable>
             <View style={localStyles.headerArea}>
               <Text style={localStyles.headertext}>Cost Center</Text>
@@ -87,9 +101,6 @@ export function LaborAllocationsTable({ jobId, bodyshop, technician }) {
           <DataTable>
             <FlatList
               data={totals}
-              refreshControl={
-                <RefreshControl refreshing={loading} onRefresh={onRefresh} />
-              }
               keyExtractor={(item) => item.cost_center}
               ItemSeparatorComponent={<Divider orientation="vertical" />}
               renderItem={(object) => (
@@ -147,7 +158,9 @@ export function LaborAllocationsTable({ jobId, bodyshop, technician }) {
               </View>
             )}
           </DataTable>
-        </View>
+          </Card.Content>
+          
+        </Card>
       ) : null}
       {/* use "totals" for the rows in the table */}
       {/* use "summary" for the totals at the bottom */}