Added parts table for job close BOD-131

This commit is contained in:
Patrick Fic
2020-05-19 17:59:02 -07:00
parent bdead5b4a0
commit 94777bf661
6 changed files with 141 additions and 26 deletions

View File

@@ -1,32 +0,0 @@
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>
);
}

View File

@@ -1,94 +0,0 @@
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);

View File

@@ -1,8 +1,9 @@
import React from "react";
import { useTranslation } from "react-i18next";
import AllocationButton from "./jobs-close-labmat-allocation.button.component";
import AllocationButton from "../jobs-close-allocation-button/jobs-close-allocation-button.component";
import Dinero from "dinero.js";
import AllocationTags from "./jobs-close-labmat-allocation.allocation-tags.component";
import AllocationTags from "../jobs-close-allocation-tags/jobs-close-allocation-tags.component";
import { List } from "antd";
export default function JobCloseLabMatAllocation({
@@ -61,16 +62,16 @@ export default function JobCloseLabMatAllocation({
</td>
<td>
<AllocationButton
labmatAllocationKey={alloc}
labmatAllocation={labmatAllocations[alloc]}
setLabmatAllocations={setLabmatAllocations}
allocationKey={alloc}
allocation={labmatAllocations[alloc]}
setAllocations={setLabmatAllocations}
/>
</td>
<td>
<AllocationTags
labmatAllocationKey={alloc}
labmatAllocation={labmatAllocations[alloc]}
setLabmatAllocations={setLabmatAllocations}
allocationKey={alloc}
allocation={labmatAllocations[alloc]}
setAllocations={setLabmatAllocations}
/>
</td>
</tr>