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

Labor allocation on job close BOD-131

Browse Source
This commit is contained in:
Patrick Fic
2020-05-19 16:14:25 -07:00
parent 51ea04bf2c
commit bdead5b4a0
10 changed files with 345 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

86
bodyshop_translations.babel
View File

@@ -1,4 +1,4 @@
<babeledit_project be_version="2.6.1" version="1.2">
<babeledit_project version="1.2" be_version="2.6.1">
<!--
BabelEdit project file
@@ -6619,6 +6619,27 @@
</translation>
</translations>
</concept_node>
<concept_node>
<name>allocate</name>
<definition_loaded>false</definition_loaded>
<description></description>
<comment></comment>
<default_text></default_text>
<translations>
<translation>
<language>en-US</language>
<approved>false</approved>
</translation>
<translation>
<language>es-MX</language>
<approved>false</approved>
</translation>
<translation>
<language>fr-CA</language>
<approved>false</approved>
</translation>
</translations>
</concept_node>
<concept_node>
<name>changestatus</name>
<definition_loaded>false</definition_loaded>
@@ -9028,6 +9049,27 @@
<folder_node>
<name>labels</name>
<children>
<concept_node>
<name>allocations</name>
<definition_loaded>false</definition_loaded>
<description></description>
<comment></comment>
<default_text></default_text>
<translations>
<translation>
<language>en-US</language>
<approved>false</approved>
</translation>
<translation>
<language>es-MX</language>
<approved>false</approved>
</translation>
<translation>
<language>fr-CA</language>
<approved>false</approved>
</translation>
</translations>
</concept_node>
<concept_node>
<name>appointmentconfirmation</name>
<definition_loaded>false</definition_loaded>
@@ -9070,6 +9112,27 @@
</translation>
</translations>
</concept_node>
<concept_node>
<name>available</name>
<definition_loaded>false</definition_loaded>
<description></description>
<comment></comment>
<default_text></default_text>
<translations>
<translation>
<language>en-US</language>
<approved>false</approved>
</translation>
<translation>
<language>es-MX</language>
<approved>false</approved>
</translation>
<translation>
<language>fr-CA</language>
<approved>false</approved>
</translation>
</translations>
</concept_node>
<concept_node>
<name>availablenew</name>
<definition_loaded>false</definition_loaded>
@@ -10869,6 +10932,27 @@
<folder_node>
<name>jobsactions</name>
<children>
<concept_node>
<name>closejob</name>
<definition_loaded>false</definition_loaded>
<description></description>
<comment></comment>
<default_text></default_text>
<translations>
<translation>
<language>en-US</language>
<approved>false</approved>
</translation>
<translation>
<language>es-MX</language>
<approved>false</approved>
</translation>
<translation>
<language>fr-CA</language>
<approved>false</approved>
</translation>
</translations>
</concept_node>
<concept_node>
<name>duplicate</name>
<definition_loaded>false</definition_loaded>

32
client/src/components/jobs-close-labmat-allocation/jobs-close-labmat-allocation.allocation-tags.component.jsx Normal file
View File

@@ -0,0 +1,32 @@
import React from "react";
import { Tag } from "antd";
export default function JobsCloseLabMatAllocationTags({
labmatAllocationKey,
labmatAllocation,
setLabmatAllocations,
}) {
return (
<div>
{labmatAllocation.allocations.map((a, idx) => (
<Tag
closable
visible
onClose={() => {
setLabmatAllocations((state) => {
return {
...state,
[labmatAllocationKey]: {
...labmatAllocation,
allocations: labmatAllocation.allocations.filter(
(val, index) => index !== idx
),
},
};
});
}}
key={idx}
>{`${a.center} - ${a.amount.toFormat()}`}</Tag>
))}
</div>
);
}

94
client/src/components/jobs-close-labmat-allocation/jobs-close-labmat-allocation.button.component.jsx Normal file
View File

@@ -0,0 +1,94 @@
import { PlusCircleFilled, CloseCircleFilled } from "@ant-design/icons";
import { Button, InputNumber, Select } from "antd";
import Dinero from "dinero.js";
import React, { useState } from "react";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { selectBodyshop } from "../../redux/user/user.selectors";
import { useTranslation } from "react-i18next";
const mapStateToProps = createStructuredSelector({
bodyshop: selectBodyshop,
});
const { Option } = Select;
export function JobsCloseLabmatAllocationButton({
labmatAllocationKey,
labmatAllocation,
setLabmatAllocations,
bodyshop,
}) {
const [visible, setVisible] = useState(false);
const [state, setState] = useState({ center: "", amount: 0 });
const { t } = useTranslation();
const handleAllocate = () => {
const existingIndex = labmatAllocation.allocations.findIndex(
(e) => e.center === state.center
);
const newAllocations = labmatAllocation.allocations.slice(0);
if (existingIndex > -1) {
newAllocations[existingIndex] = {
center: state.center,
amount: newAllocations[existingIndex].amount.add(
Dinero({ amount: state.amount * 100 })
),
};
} else {
newAllocations.push({
center: state.center,
amount: Dinero({ amount: state.amount * 100 }),
});
}
setLabmatAllocations((labMatState) => {
return {
...labMatState,
[labmatAllocationKey]: {
...labmatAllocation,
allocations: newAllocations,
},
};
});
};
const showAllocation = labmatAllocation.total.getAmount() > 0;
if (!showAllocation) return null;
return (
<div style={{ display: "flex", alignItems: "center" }}>
<div style={{ display: visible ? "" : "none" }}>
<Select
style={{ width: "200px" }}
value={state.center}
onSelect={(val) => setState({ ...state, center: val })}
>
{bodyshop.md_responsibility_centers.profits.map((r, idx) => (
<Option key={idx} value={r.name}>
{r.name}
</Option>
))}
</Select>
<InputNumber
precision={2}
min={0}
onChange={(val) => setState({ ...state, amount: val })}
max={labmatAllocation.total.getAmount() / 100}
/>
<Button
onClick={handleAllocate}
disabled={state.amount === 0 || state.center === ""}
>
{t("jobs.actions.allocate")}
</Button>
</div>
<div>
{visible ? (
<CloseCircleFilled onClick={() => setVisible(false)} />
) : (
<PlusCircleFilled onClick={() => setVisible(true)} />
)}
</div>
</div>
);
}
export default connect(mapStateToProps, null)(JobsCloseLabmatAllocationButton);

100
client/src/components/jobs-close-labmat-allocation/jobs-close-labmat-allocation.component.jsx
View File

@@ -1,35 +1,101 @@
import React from "react";
import { useTranslation } from "react-i18next";
import AllocationButton from "./jobs-close-labmat-allocation.button.component";
import Dinero from "dinero.js";
import AllocationTags from "./jobs-close-labmat-allocation.allocation-tags.component";
import { List } from "antd";
export default function JobCloseLabMatAllocation({
labmatAllocations,
setLabmatAllocations,
}) {
console.log(
"JobCloseLabMatAllocation -> labmatAllocations",
labmatAllocations
);
const { t } = useTranslation();
const allocatedTotalsArray = Object.keys(labmatAllocations)
.filter((i) => !i.includes("subtotal"))
.map((i) => labmatAllocations[i].allocations)
.flat();
const allocatedTotal = Dinero({
amount: allocatedTotalsArray.reduce((acc, val) => {
console.log("acc", acc);
return (acc = acc + val.amount.getAmount());
}, 0),
});
return (
<div>
<div style={{ display: "flex" }}>
<table>
<thead>
<tr>
<th>Rate</th>
<th>Available</th>
<th>{t("jobs.labels.laborallocations")}</th>
<th>{t("jobs.labels.totals")}</th>
<th>{t("jobs.labels.available")}</th>
<th>{t("jobs.actions.allocate")}</th>
<th>{t("jobs.labels.allocations")}</th>
</tr>
</thead>
<tbody>
{Object.keys(labmatAllocations).map((alloc) => (
<tr>
<td>{alloc}</td>
<td>
{
//labmatAllocations[alloc].total.toFormat()
}
</td>
</tr>
))}
{Object.keys(labmatAllocations).map((alloc, idx) => {
if (!alloc.includes("subtotal"))
return (
<tr key={idx}>
<td>{t(`jobs.fields.${alloc}`)}</td>
<td>
{labmatAllocations[alloc].total &&
labmatAllocations[alloc].total.toFormat()}
</td>
<td>
{labmatAllocations[alloc].total
.subtract(
Dinero({
amount: labmatAllocations[alloc].allocations.reduce(
(acc, val) => {
return acc + val.amount.getAmount();
},
0
),
})
)
.toFormat()}
</td>
<td>
<AllocationButton
labmatAllocationKey={alloc}
labmatAllocation={labmatAllocations[alloc]}
setLabmatAllocations={setLabmatAllocations}
/>
</td>
<td>
<AllocationTags
labmatAllocationKey={alloc}
labmatAllocation={labmatAllocations[alloc]}
setLabmatAllocations={setLabmatAllocations}
/>
</td>
</tr>
);
else return null;
})}
<tr>
<td></td>
<td>{labmatAllocations.subtotal.toFormat()}</td>
<td>{allocatedTotal.toFormat()}</td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
<div>
<List>
{allocatedTotalsArray.map((i, idx) => (
<List.Item key={idx}>{`${
i.center
} ${i.amount.toFormat()}`}</List.Item>
))}
</List>
</div>
</div>
);
}

9
client/src/components/jobs-detail-header-actions/jobs-detail-header-actions.component.jsx
View File

@@ -81,6 +81,15 @@ export function JobsDetailHeaderActions({
>
{t("jobs.actions.postInvoices")}
</Menu.Item>
<Menu.Item key="closejob">
<Link
to={{
pathname: `/manage/jobs/${job.id}/close`,
}}
>
{t("menus.jobsactions.closejob")}
</Link>
</Menu.Item>
</Menu>
);
return (

21
client/src/pages/jobs-close/jobs-close.component.jsx
View File

@@ -1,24 +1,25 @@
import React, { useCallback, useState } from "react";
import React, { useState } from "react";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { CalculateJob } from "../../components/job-totals-table/job-totals.utility";
import JobsCloseLaborMaterialAllocation from "../../components/jobs-close-labmat-allocation/jobs-close-labmat-allocation.component";
import { selectBodyshop } from "../../redux/user/user.selectors";
const mapStateToProps = createStructuredSelector({
//currentUser: selectCurrentUser
bodyshop: selectBodyshop,
});
export function JobsCloseComponent({ job, bodyshop }) {
const CalcJobMemoized = useCallback(
() => CalculateJob(job, bodyshop.shoprates),
[job, bodyshop.shoprates]
export function JobsCloseComponent({ job, bodyshop, jobTotals }) {
const [labmatAllocations, setLabmatAllocations] = useState(
Object.keys(jobTotals.rates).reduce((acc, val) => {
acc[val] = jobTotals.rates[val];
if (val.includes("subtotal")) return acc;
//Not a subtotal - therefore can be allocated.
acc[val].allocations = [];
return acc;
}, {})
);
const jobTotals = CalcJobMemoized();
const [labmatAllocations, setLabmatAllocations] = useState(jobTotals.rates);
return (
<div>
<JobsCloseLaborMaterialAllocation

24
client/src/pages/jobs-close/jobs-close.container.jsx
View File

@@ -3,17 +3,25 @@ import React, { useEffect } from "react";
import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
import { useParams } from "react-router-dom";
import { createStructuredSelector } from "reselect";
import AlertComponent from "../../components/alert/alert.component";
import { CalculateJob } from "../../components/job-totals-table/job-totals.utility";
import LoadingSpinner from "../../components/loading-spinner/loading-spinner.component";
import { QUERY_JOB_CLOSE_DETAILS } from "../../graphql/jobs.queries";
import { setBreadcrumbs } from "../../redux/application/application.actions";
import { selectBodyshop } from "../../redux/user/user.selectors";
import JobsCloseComponent from "./jobs-close.component";
import LoadingSpinner from "../../components/loading-spinner/loading-spinner.component";
const mapStateToProps = createStructuredSelector({
//currentUser: selectCurrentUser
bodyshop: selectBodyshop,
});
const mapDispatchToProps = (dispatch) => ({
setBreadcrumbs: (breadcrumbs) => dispatch(setBreadcrumbs(breadcrumbs)),
});
export function JobsCloseContainer({ setBreadcrumbs }) {
export function JobsCloseContainer({ setBreadcrumbs, bodyshop }) {
const { jobId } = useParams();
const { loading, error, data } = useQuery(QUERY_JOB_CLOSE_DETAILS, {
variables: { id: jobId },
@@ -42,12 +50,18 @@ export function JobsCloseContainer({ setBreadcrumbs }) {
]);
}, [setBreadcrumbs, t, jobId, data]);
console.log("Container rerender");
if (loading) return <LoadingSpinner />;
if (error) return <AlertComponent message={error.message} type='error' />;
if (error) return <AlertComponent message={error.message} type="error" />;
const jobTotals = CalculateJob(data.jobs_by_pk, bodyshop.shoprates);
return (
<div>
<JobsCloseComponent job={data ? data.jobs_by_pk : {}} />
<JobsCloseComponent
job={data ? data.jobs_by_pk : {}}
jobTotals={jobTotals}
/>
</div>
);
}
export default connect(null, mapDispatchToProps)(JobsCloseContainer);
export default connect(mapStateToProps, mapDispatchToProps)(JobsCloseContainer);

4
client/src/translations/en_us/common.json
View File

@@ -457,6 +457,7 @@
"addDocuments": "Add Job Documents",
"addNote": "Add Note",
"addtoproduction": "Add to Production",
"allocate": "Allocate",
"changestatus": "Change Status",
"convert": "Convert",
"gotojob": "Go to Job",
@@ -577,8 +578,10 @@
"vehicle": "Vehicle"
},
"labels": {
"allocations": "Allocations",
"appointmentconfirmation": "Send confirmation to customer?",
"audit": "Audit Trail",
"available": "Available",
"availablenew": "Available New Jobs",
"availablesupplements": "Available Supplements",
"cards": {
@@ -677,6 +680,7 @@
"vehicles": "Vehicles"
},
"jobsactions": {
"closejob": "Close Job",
"duplicate": "Duplicate this Job",
"newcccontract": "Create Courtesy Car Contract"
},

4
client/src/translations/es/common.json
View File

@@ -457,6 +457,7 @@
"addDocuments": "Agregar documentos de trabajo",
"addNote": "Añadir la nota",
"addtoproduction": "",
"allocate": "",
"changestatus": "Cambiar Estado",
"convert": "Convertir",
"gotojob": "",
@@ -577,8 +578,10 @@
"vehicle": "Vehículo"
},
"labels": {
"allocations": "",
"appointmentconfirmation": "¿Enviar confirmación al cliente?",
"audit": "",
"available": "",
"availablenew": "",
"availablesupplements": "",
"cards": {
@@ -677,6 +680,7 @@
"vehicles": "Vehículos"
},
"jobsactions": {
"closejob": "",
"duplicate": "",
"newcccontract": ""
},

4
client/src/translations/fr/common.json
View File

@@ -457,6 +457,7 @@
"addDocuments": "Ajouter des documents de travail",
"addNote": "Ajouter une note",
"addtoproduction": "",
"allocate": "",
"changestatus": "Changer le statut",
"convert": "Convertir",
"gotojob": "",
@@ -577,8 +578,10 @@
"vehicle": "Véhicule"
},
"labels": {
"allocations": "",
"appointmentconfirmation": "Envoyer une confirmation au client?",
"audit": "",
"available": "",
"availablenew": "",
"availablesupplements": "",
"cards": {
@@ -677,6 +680,7 @@
"vehicles": "Véhicules"
},
"jobsactions": {
"closejob": "",
"duplicate": "",
"newcccontract": ""
},