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

Added labor adjustments to allocations table. IO-570

Browse Source
This commit is contained in:
Patrick Fic
2021-01-08 16:16:05 -08:00
parent 6f96bcfa7e
commit baef1eaaf9
22 changed files with 1929 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

113
client/src/components/labor-allocations-table/labor-allocations-table.component.jsx
View File

@@ -1,15 +1,25 @@
import React, { useState, useEffect } from "react";
import { Typography, Row, Col } from "antd";
import { EditFilled } from "@ant-design/icons";
import { Typography } from "antd";
import React, { useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { CalculateAllocationsTotals } from "./labor-allocations-table.utility";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { selectBodyshop } from "../../redux/user/user.selectors";
import LaborAllocationsAdjustmentEdit from "../labor-allocations-adjustment-edit/labor-allocations-adjustment-edit.component";
import "./labor-allocations-table.styles.scss";
import { CalculateAllocationsTotals } from "./labor-allocations-table.utility";
const mapStateToProps = createStructuredSelector({
bodyshop: selectBodyshop,
});
export function LaborAllocationsTable({ joblines, timetickets, bodyshop }) {
export function LaborAllocationsTable({
jobId,
joblines,
timetickets,
bodyshop,
adjustments,
}) {
const { t } = useTranslation();
const [totals, setTotals] = useState([]);
@@ -19,47 +29,70 @@ export function LaborAllocationsTable({ joblines, timetickets, bodyshop }) {
CalculateAllocationsTotals(
bodyshop.md_responsibility_centers,
joblines,
timetickets
timetickets,
adjustments
)
);
}, [joblines, timetickets, bodyshop]);
}, [joblines, timetickets, bodyshop, adjustments]);
return (
<div>
<Typography.Title level={3}>
{t("jobs.labels.laborallocations")}
</Typography.Title>
<Row>
<Col span={6}>
<strong>{t("timetickets.fields.cost_center")}</strong>
</Col>
<Col span={6}>
<strong>{t("jobs.labels.hrs_total")}</strong>
</Col>
<Col span={6}>
<strong>{t("jobs.labels.hrs_claimed")}</strong>
</Col>
<Col span={6}>
<strong>{t("jobs.labels.difference")}</strong>
</Col>
</Row>
{totals.map((t, idx) => (
<Row key={idx}>
<Col span={6}>{t.cost_center}</Col>
<Col span={6}>{t.total.toFixed(2)}</Col>
<Col span={6}>{t.claimed.toFixed(2)}</Col>
<Col span={6}>
<strong
style={{
color: t.total - t.claimed > 0 ? "green" : "red",
}}
>
{(t.total - t.claimed).toFixed(2)}
</strong>
</Col>
</Row>
))}
<div className="imex-flex-row" style={{ margin: ".5rem" }}>
<Typography.Title level={3}>
{t("jobs.labels.laborallocations")}
</Typography.Title>
<div className="labor-allocations-table">
<table>
<thead>
<tr>
<th>
<strong>{t("timetickets.fields.cost_center")}</strong>
</th>
<th>
<strong>{t("jobs.labels.hrs_total")}</strong>
</th>
<th>
<strong>{t("jobs.labels.hrs_claimed")}</strong>
</th>
<th>
<strong>{t("jobs.labels.adjustments")}</strong>
</th>
<th>
<strong>{t("jobs.labels.difference")}</strong>
</th>
</tr>
</thead>
<tbody>
{totals.map((t, idx) => (
<tr key={idx}>
<td>{t.cost_center}</td>
<td>{t.total.toFixed(1)}</td>
<td>{t.claimed.toFixed(1)}</td>
<td>
{t.adjustments.toFixed(1)}
<LaborAllocationsAdjustmentEdit
jobId={jobId}
adjustments={adjustments}
mod_lbr_ty={t.opcode}
>
<EditFilled style={{ marginLeft: ".2rem" }} />
</LaborAllocationsAdjustmentEdit>
</td>
<td>
<strong
style={{
color: t.difference > 0 ? "green" : "red",
}}
>
{t.difference}
</strong>
</td>
</tr>
))}
</tbody>
</table>
</div>
</div>
</div>
);
}

30
client/src/components/labor-allocations-table/labor-allocations-table.styles.scss Normal file
View File

@@ -0,0 +1,30 @@
.labor-allocations-table {
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
table {
border: 1px solid #ccc;
border-collapse: collapse;
margin: 0;
padding: 0;
width: 80%;
table-layout: fixed;
}
table tr {
//background-color: #f8f8f8;
border: 1px solid #ddd;
padding: 0.35em;
}
table th,
table td {
padding: 0.625em;
text-align: center;
}
table td.currency {
text-align: right;
}
}

32
client/src/components/labor-allocations-table/labor-allocations-table.utility.js
View File

@@ -1,29 +1,41 @@
export const CalculateAllocationsTotals = (
responsibilitycenters,
joblines,
timetickets
timetickets,
adjustments = []
) => {
const jobCodes = joblines
.map((item) => item.mod_lbr_ty)
.filter((value, index, self) => self.indexOf(value) === index && !!value);
const ticketCodes = timetickets
.map((item) => item.cieca_code)
.filter((value, index, self) => self.indexOf(value) === index && !!value);
const allCodes = [...jobCodes, ...ticketCodes];
const jobCodes = joblines.map((item) => item.mod_lbr_ty);
//.filter((value, index, self) => self.indexOf(value) === index && !!value);
const ticketCodes = timetickets.map((item) => item.cieca_code);
//.filter((value, index, self) => self.indexOf(value) === index && !!value);
const adjustmentCodes = adjustments.map((item) => item.mod_lbr_ty);
//.filter((value, index, self) => self.indexOf(value) === index && !!value);
const allCodes = [...jobCodes, ...ticketCodes, ...adjustmentCodes].filter(
(value, index, self) => self.indexOf(value) === index && !!value
);
const r = allCodes.reduce((acc, value) => {
acc.push({
const r = {
opcode: value,
cost_center: responsibilitycenters.defaults.costs[value],
total: joblines.reduce((acc2, val2) => {
return val2.mod_lbr_ty === value ? acc2 + val2.mod_lb_hrs : acc2;
}, 0),
adjustments: adjustments.reduce((acc3, val3) => {
console.log("acc3", acc3);
console.log("val3", val3);
return val3.mod_lbr_ty === value ? acc3 + val3.hours : acc3;
}, 0),
claimed: timetickets.reduce((acc3, val3) => {
return val3.ciecacode === value ? acc3 + val3.productivehrs : acc3;
}, 0),
});
};
r.difference = (r.total + r.adjustments - r.claimed).toFixed(2);
acc.push(r);
return acc;
}, []);
console.log("r", r);
return r;
};