added totals to labor allocations

This commit is contained in:
jfrye122
2023-05-14 14:30:07 -04:00
parent 6d852453b0
commit be9d285ac9
2 changed files with 52 additions and 31 deletions

View File

@@ -2,7 +2,7 @@ import React, { useEffect, useMemo, useState } from "react";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { FlatList, RefreshControl, StyleSheet, Text, View } from "react-native"; import { FlatList, RefreshControl, StyleSheet, Text, View } from "react-native";
import _ from "lodash"; import _ from "lodash";
import { Card, DataTable } from "react-native-paper"; import { Card, DataTable, Divider } from "react-native-paper";
import { GET_LINE_TICKET_BY_PK } from "../../graphql/jobs.queries"; import { GET_LINE_TICKET_BY_PK } from "../../graphql/jobs.queries";
import ErrorDisplay from "../error-display/error-display.component"; import ErrorDisplay from "../error-display/error-display.component";
import { useQuery } from "@apollo/client"; import { useQuery } from "@apollo/client";
@@ -104,21 +104,15 @@ export function LaborAllocationsTable({ jobId, bodyshop, technician }) {
{typeof data !== "undefined" ? ( {typeof data !== "undefined" ? (
<View style={{ flexGrow: 1 }}> <View style={{ flexGrow: 1 }}>
<DataTable> <DataTable>
<DataTable.Header> <View style={localStyles.headerArea}>
<DataTable.Title style={{ flex: 2 }}>Cost Center</DataTable.Title> <Text style={localStyles.headertext}>Cost Center</Text>
<DataTable.Title numeric style={{ flex: 2 }}> <Text style={localStyles.headertext}>Hours Total</Text>
Hours Total <Text style={localStyles.headertext}>Hours Claimed</Text>
</DataTable.Title> {/* <Text numberOfLines={2} style={{ flex: 1, flexWrap:'wrap' }}>Hours Claimed</Text> */}
<DataTable.Title numeric style={{ flex: 2 }}> <Text style={localStyles.headertextAdjusts}>Adjustments</Text>
Hours Claimed <Text style={localStyles.headertext}>Difference</Text>
</DataTable.Title> </View>
<DataTable.Title numeric style={{ flex: 2 }}> <Divider orientation="vertical" />
Adjustments
</DataTable.Title>
<DataTable.Title numeric style={{ flex: 2 }}>
Difference
</DataTable.Title>
</DataTable.Header>
</DataTable> </DataTable>
<DataTable> <DataTable>
<FlatList <FlatList
@@ -127,22 +121,23 @@ export function LaborAllocationsTable({ jobId, bodyshop, technician }) {
<RefreshControl refreshing={loading} onRefresh={onRefresh} /> <RefreshControl refreshing={loading} onRefresh={onRefresh} />
} }
keyExtractor={(item) => item.cost_center} keyExtractor={(item) => item.cost_center}
ItemSeparatorComponent={<Divider orientation="vertical" />}
renderItem={(object) => ( renderItem={(object) => (
<DataTable.Row> <DataTable.Row>
<DataTable.Cell style={{ flex: 2 }}> <View style={{ flex: 1, alignItems:'flex-start' }}>
<Text> <Text>
{object.item.cost_center} {object.item.cost_center} {" ("}
{object.item.mod_lbr_ty} {object.item.mod_lbr_ty}{")"}
</Text> </Text>
</DataTable.Cell> </View>
<DataTable.Cell style={{ flex: 2 }}> <View style={{ flex: 1, alignItems:'center'}} >
<Text>{object.item.total && object.item.total.toFixed(1)}</Text> <Text>{object.item.total && object.item.total.toFixed(1)}</Text>
</DataTable.Cell> </View>
<DataTable.Cell style={{ flex: 2 }}> <View style={{ flex: 1, alignItems:'center' }}>
<Text>{object.item.claimed && object.item.claimed.toFixed(1)}</Text> <Text>{object.item.claimed && object.item.claimed.toFixed(1)}</Text>
</DataTable.Cell> </View>
<DataTable.Cell style={{ flex: 2 }}> <View style={{ flex: 1, alignItems:'center' }}>
<Text> <Text>
{object.item.adjustments && object.item.adjustments.toFixed(1)} {object.item.adjustments && object.item.adjustments.toFixed(1)}
{/* {!technician && ( {/* {!technician && (
@@ -156,10 +151,10 @@ export function LaborAllocationsTable({ jobId, bodyshop, technician }) {
</LaborAllocationsAdjustmentEdit> </LaborAllocationsAdjustmentEdit>
)} */} )} */}
</Text> </Text>
</DataTable.Cell> </View>
<DataTable.Cell style={{ flex: 2 }}> <View style={{flex: 1, alignItems:'center'}}>
<Text style={{ <Text style={{
color: object.item.difference >= 0 ? "green" : "red", color: object.item.difference >= 0 ? "green" : "red",
}}> }}>
{/* <strong {/* <strong
style={{ style={{
@@ -170,10 +165,18 @@ export function LaborAllocationsTable({ jobId, bodyshop, technician }) {
</strong> */} </strong> */}
{_.round(object.item.difference, 1)} {_.round(object.item.difference, 1)}
</Text> </Text>
</DataTable.Cell> </View>
</DataTable.Row> </DataTable.Row>
)} )}
/> />
{summary && (<View style={localStyles.headerArea}>
<Text style={localStyles.footertext}>Totals</Text>
<Text style={localStyles.footertext}>{summary.hrs_total.toFixed(1)}</Text>
<Text style={localStyles.footertext}>{summary.hrs_claimed.toFixed(1)}</Text>
<Text style={localStyles.footertext}>{summary.adjustments.toFixed(1)}</Text>
<Text style={localStyles.footertext}>{summary.difference.toFixed(1)}</Text>
</View>)
}
</DataTable> </DataTable>
</View> </View>
) : null} ) : null}
@@ -232,5 +235,23 @@ export function LaborAllocationsTable({ jobId, bodyshop, technician }) {
); );
} }
const localStyles = StyleSheet.create({}); const localStyles = StyleSheet.create({
headerArea:{
flexDirection:"row",
justifyContent:"center",
alignItems:"center",
margin:1
},
footertext:{
flex:1, textAlign:'center', textAlignVertical:'center',margin:1
},
headertext:{
flex:1, textAlign:'center', textAlignVertical:'center',backgroundColor:'blue',margin:1
},
headertextAdjusts:{
flex:1, textAlign:'center', textAlignVertical:'center',backgroundColor:'green',margin:1
},
});
export default connect(mapStateToProps, null)(LaborAllocationsTable); export default connect(mapStateToProps, null)(LaborAllocationsTable);

View File

@@ -9,7 +9,7 @@ export const CalculateAllocationsTotals = (
) => { ) => {
// console.log("🚀 ~ file: adjustments", adjustments); // console.log("🚀 ~ file: adjustments", adjustments);
// console.log("🚀 ~ file: bodyshop", bodyshop); // console.log("🚀 ~ file: bodyshop", bodyshop);
console.log("🚀 ~ file: joblines", joblines); // console.log("🚀 ~ file: joblines", joblines);
// console.log("🚀 ~ file: timetickets", timetickets); // console.log("🚀 ~ file: timetickets", timetickets);
const responsibilitycenters = bodyshop.md_responsibility_centers; const responsibilitycenters = bodyshop.md_responsibility_centers;
const jobCodes = joblines.map((item) => item.mod_lbr_ty); const jobCodes = joblines.map((item) => item.mod_lbr_ty);