Files
bodyshop/client/src/components/job-reconciliation-modal/job-reconciliation-modal.component.jsx
2022-01-19 11:50:14 -08:00

53 lines
1.6 KiB
JavaScript

import { Col, Row } from "antd";
import React, { useState } from "react";
import JobReconciliationBillsTable from "../job-reconciliation-bills-table/job-reconciliation-bills-table.component";
import JobReconciliationPartsTable from "../job-reconciliation-parts-table/job-reconciliation-parts-table.component";
import JobReconciliationTotals from "../job-reconciliation-totals/job-reconciliation-totals.component";
export default function JobReconciliationModalComponent({ job, bills }) {
const jobLineState = useState([]);
const billLineState = useState([]);
const invoiceLineData =
bills
.map((i) =>
i.billlines.map((il) => {
return { ...il, bill: i };
})
)
.flat() || [];
const jobLineData = job.joblines.filter(
(j) => j.part_type !== null && j.part_type !== "PAE"
);
return (
<div style={{ flex: 1, display: "flex", flexDirection: "column" }}>
<div style={{ flex: 1 }}>
<Row gutter={8}>
<Col span={12}>
<JobReconciliationPartsTable
jobLineData={jobLineData}
jobLineState={jobLineState}
/>
</Col>
<Col span={12}>
<JobReconciliationBillsTable
invoiceLineData={invoiceLineData}
billLineState={billLineState}
/>
</Col>
</Row>
</div>
<Row>
<JobReconciliationTotals
jobLines={jobLineData}
jobLineState={jobLineState}
billLines={invoiceLineData}
billLineState={billLineState}
/>
</Row>
</div>
);
}