admin/imexmobile
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

cleaned up labor allocations component

Browse Source
This commit is contained in:
jfrye122
2023-05-15 10:48:05 -04:00
parent 668d371fb8
commit ccaa0fd450
1 changed files with 88 additions and 157 deletions
Download Patch File Download Diff File Expand all files Collapse all files

245
components/labor-allocations-table/labor-allocations-table.component.jsx
View File

@@ -18,55 +18,31 @@ const mapStateToProps = createStructuredSelector({
});
export function LaborAllocationsTable({ jobId, bodyshop, technician }) {
console.log("LaborAllocationsTable, jobId", jobId);
//, loading, refetch
//const jobid = jobid !== undefined ? jobid : "";
// console.log("LaborAllocationsTable, jobId", jobId);
const { t } = useTranslation();
const onRefresh = async () => {
console.log("LaborAllocationsTable refetch");
return refetch();
};
//maybe use this
const { loading, error, data, refetch } = useQuery(GET_LINE_TICKET_BY_PK, {
variables: { id: jobId },
skip: !!!jobId,
fetchPolicy: "network-only",
nextFetchPolicy: "network-only",
});
// console.log("LaborAllocationsTable, data", data);
if (error) return <ErrorDisplay errorMessage={error.message} />;
// let joblines = [];
// let timetickets = [];
// let adjustments = [];
const [totals, setTotals] = useState([]);
const [state, setState] = useState({
sortedInfo: {
columnKey: "cost_center",
field: "cost_center",
order: "ascend",
},
filteredInfo: {},
});
useEffect(() => {
console.log("LaborAllocationsTable useEffect on data change");
// joblines = data?.joblines ? data.joblines : [];
// timetickets = data?.timetickets ? data.timetickets : [];
// adjustments = data?.adjustments ? data.adjustments : [];
}, [data]);
useEffect(() => {
console.log(
"LaborAllocationsTable useEffect on [joblines, timetickets, bodyshop, adjustments, jobId] change",
data?.joblines,
data?.adjustments
);
// console.log("LaborAllocationsTable useEffect on [all inputs] change",data?.joblines,data?.adjustments);
if (!!data?.joblines && !!data?.timetickets && !!bodyshop)
setTotals(
CalculateAllocationsTotals(
@@ -79,11 +55,6 @@ export function LaborAllocationsTable({ jobId, bodyshop, technician }) {
if (!jobId) setTotals([]);
}, [data?.joblines, data?.timetickets, bodyshop, data?.adjustments, jobId]);
// const convertedLines = useMemo(
// () => data?.joblines && data?.joblines.filter((j) => j.convertedtolbr),
// [data?.joblines]
// );
const summary =
totals &&
totals.reduce(
@@ -96,8 +67,7 @@ export function LaborAllocationsTable({ jobId, bodyshop, technician }) {
},
{ hrs_total: 0, hrs_claimed: 0, adjustments: 0, difference: 0 }
);
console.log("labor summary is:", summary);
// console.log("labor summary is:", summary);
return (
<View style={{ flexGrow: 1 }}>
@@ -115,120 +85,70 @@ export function LaborAllocationsTable({ jobId, bodyshop, technician }) {
<Divider orientation="vertical" />
</DataTable>
<DataTable>
<FlatList
data={totals}
refreshControl={
<RefreshControl refreshing={loading} onRefresh={onRefresh} />
}
keyExtractor={(item) => item.cost_center}
ItemSeparatorComponent={<Divider orientation="vertical" />}
renderItem={(object) => (
<DataTable.Row>
<View style={{ flex: 1, alignItems:'flex-start' }}>
<Text>
{object.item.cost_center} {" ("}
{object.item.mod_lbr_ty}{")"}
</Text>
</View>
<View style={{ flex: 1, alignItems:'center'}} >
<Text>{object.item.total && object.item.total.toFixed(1)}</Text>
</View>
<View style={{ flex: 1, alignItems:'center' }}>
<Text>{object.item.claimed && object.item.claimed.toFixed(1)}</Text>
</View>
<View style={{ flex: 1, alignItems:'center' }}>
<Text>
{object.item.adjustments && object.item.adjustments.toFixed(1)}
{/* {!technician && (
<LaborAllocationsAdjustmentEdit
jobId={jobId}
adjustments={adjustments}
mod_lbr_ty={record.opcode}
refetchQueryNames={["GET_LINE_TICKET_BY_PK"]}
>
<EditFilled />
</LaborAllocationsAdjustmentEdit>
)} */}
</Text>
</View>
<View style={{flex: 1, alignItems:'center'}}>
<Text style={{
color: object.item.difference >= 0 ? "green" : "red",
}}>
{/* <strong
<FlatList
data={totals}
refreshControl={
<RefreshControl refreshing={loading} onRefresh={onRefresh} />
}
keyExtractor={(item) => item.cost_center}
ItemSeparatorComponent={<Divider orientation="vertical" />}
renderItem={(object) => (
<DataTable.Row>
<View style={{ flex: 1, alignItems: "flex-start" }}>
<Text>
{object.item.cost_center} {" ("}
{object.item.mod_lbr_ty}
{")"}
</Text>
</View>
<View style={{ flex: 1, alignItems: "center" }}>
<Text>
{object.item.total && object.item.total.toFixed(1)}
</Text>
</View>
<View style={{ flex: 1, alignItems: "center" }}>
<Text>
{object.item.claimed && object.item.claimed.toFixed(1)}
</Text>
</View>
<View style={{ flex: 1, alignItems: "center" }}>
<Text>
{object.item.adjustments &&
object.item.adjustments.toFixed(1)}
</Text>
</View>
<View style={{ flex: 1, alignItems: "center" }}>
<Text
style={{
color: object.difference >= 0 ? "green" : "red",
color: object.item.difference >= 0 ? "green" : "red",
}}
>
{_.round(object.difference, 1)}
</strong> */}
{_.round(object.item.difference, 1)}
</Text>
</View>
</DataTable.Row>
{_.round(object.item.difference, 1)}
</Text>
</View>
</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>
)}
/>
{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>
</View>
) : null}
{/* <DataTable>
<DataTable.Header>
<DataTable.Title style={{ flex: 4 }}>
{t("jobdetail.labels.lines_desc")}
</DataTable.Title>
<DataTable.Title style={{ flex: 2 }}>
{t("jobdetail.labels.lines_lbr_ty")}
</DataTable.Title>
<DataTable.Title style={{ flex: 1 }}>
{t("jobdetail.labels.lines_lb_hrs")}
</DataTable.Title>
<DataTable.Title style={{ flex: 2 }}>
{t("jobdetail.labels.lines_part_type")}
</DataTable.Title>
<DataTable.Title style={{ flex: 1 }}>
{t("jobdetail.labels.lines_qty")}
</DataTable.Title>
</DataTable.Header>
</DataTable> */}
{/* <FlatList
data={job.joblines}
refreshControl={
<RefreshControl refreshing={loading} onRefresh={onRefresh} />
}
keyExtractor={(item) => item.id}
renderItem={(object) => (
<DataTable.Row>
<DataTable.Cell style={{ flex: 4 }}>
{object.item.line_desc}
</DataTable.Cell>
<DataTable.Cell style={{ flex: 2 }}>
{object.item.mod_lbr_ty &&
t(`jobdetail.lbr_types.${object.item.mod_lbr_ty}`)}
</DataTable.Cell>
<DataTable.Cell style={{ flex: 1 }}>
{object.item.mod_lb_hrs}
</DataTable.Cell>
<DataTable.Cell style={{ flex: 2 }}>
{object.item.part_type &&
t(`jobdetail.part_types.${object.item.part_type}`)}
</DataTable.Cell>
<DataTable.Cell style={{ flex: 1 }}>
{object.item.part_qty}
</DataTable.Cell>
</DataTable.Row>
)}
/> */}
{/* use "totals" for the rows in the table */}
{/* use "summary" for the totals at the bottom */}
</View>
@@ -236,22 +156,33 @@ export function LaborAllocationsTable({ jobId, bodyshop, technician }) {
}
const localStyles = StyleSheet.create({
headerArea:{
flexDirection:"row",
justifyContent:"center",
alignItems:"center",
margin:1
},
footertext:{
flex:1, textAlign:'center', textAlignVertical:'center',margin:1,paddingBottom:8
},
headertext:{
flex:1, textAlign:'center', textAlignVertical:'center',margin:1,paddingBottom:8
},
headertextAdjusts:{
flex:1, textAlign:'center', textAlignVertical:'center',margin:1,paddingBottom:8
},
headerArea: {
flexDirection: "row",
justifyContent: "center",
alignItems: "center",
margin: 1,
},
footertext: {
flex: 1,
textAlign: "center",
textAlignVertical: "center",
margin: 1,
paddingBottom: 8,
},
headertext: {
flex: 1,
textAlign: "center",
textAlignVertical: "center",
margin: 1,
paddingBottom: 8,
},
headertextAdjusts: {
flex: 1,
textAlign: "center",
textAlignVertical: "center",
margin: 1,
paddingBottom: 8,
},
});
export default connect(mapStateToProps, null)(LaborAllocationsTable);