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

Further refinement on jobs detail screen on header. BOD-155

Browse Source
This commit is contained in:
Patrick Fic
2020-06-11 16:29:55 -07:00
parent 4e5c305f95
commit 230b45847a
18 changed files with 319 additions and 305 deletions
Download Patch File Download Diff File Expand all files Collapse all files

73
client/src/components/job-invoices-total/job-invoices-total.component.jsx
View File

@@ -1,12 +1,17 @@
import React from "react";
import LoadingSkeleton from "../loading-skeleton/loading-skeleton.component";
import { Statistic, Descriptions } from "antd";
import { useTranslation } from "react-i18next";
import { Statistic } from "antd";
import Dinero from "dinero.js";
import React from "react";
import { useTranslation } from "react-i18next";
import AlertComponent from "../alert/alert.component";
import LoadingSkeleton from "../loading-skeleton/loading-skeleton.component";
import "./job-invoices-total.styles.scss";
export default function JobInvoiceTotals({ loading, invoices, jobTotals }) {
const { t } = useTranslation();
if (loading) return <LoadingSkeleton />;
if (!!!jobTotals)
return (
<AlertComponent type='error' message={t("jobs.errors.nofinancial")} />
);
const totals = JSON.parse(jobTotals);
let invoiceTotals = Dinero({ amount: 0 });
@@ -24,44 +29,26 @@ export default function JobInvoiceTotals({ loading, invoices, jobTotals }) {
const discrepancy = Dinero(totals.parts.parts.total).subtract(invoiceTotals);
return (
<div>
<Descriptions
bordered
size='small'
column={1}
title={t("jobs.labels.partssubletstotal")}>
<Descriptions.Item label={t("jobs.labels.partstotal")}>
<Statistic
value={Dinero(totals.parts.parts.total).toFormat()}
suffix={`(${Dinero(
totals.parts.parts.subtotal
).toFormat()} ± ${Dinero(
totals.parts.parts.adjustments
).toFormat()})`}
/>
</Descriptions.Item>
<Descriptions.Item label={t("jobs.labels.subletstotal")}>
<Statistic
value={Dinero(totals.parts.sublets.total).toFormat()}
suffix={`(${Dinero(
totals.parts.sublets.subtotal
).toFormat()} ± ${Dinero(
totals.parts.sublets.adjustments
).toFormat()})`}
/>
</Descriptions.Item>
<Descriptions.Item label={t("invoices.labels.retailtotal")}>
<Statistic value={invoiceTotals.toFormat()} />
</Descriptions.Item>
<Descriptions.Item label={t("invoices.labels.discrepancy")}>
<Statistic
valueStyle={{
color: discrepancy.getAmount === 0 ? "green" : "red",
}}
value={discrepancy.toFormat()}
/>
</Descriptions.Item>
</Descriptions>
<div className='job-invoices-totals-container'>
<Statistic
title={t("jobs.labels.partstotal")}
value={Dinero(totals.parts.parts.total).toFormat()}
/>
<Statistic
title={t("jobs.labels.subletstotal")}
value={Dinero(totals.parts.sublets.total).toFormat()}
/>
<Statistic
title={t("invoices.labels.retailtotal")}
value={invoiceTotals.toFormat()}
/>
<Statistic
title={t("invoices.labels.discrepancy")}
valueStyle={{
color: discrepancy.getAmount === 0 ? "green" : "red",
}}
value={discrepancy.toFormat()}
/>
</div>
);
}

7
client/src/components/job-invoices-total/job-invoices-total.styles.scss Normal file
View File

@@ -0,0 +1,7 @@
.job-invoices-totals-container {
margin: 0rem 2rem;
display: flex;
flex-direction: column;
justify-content: space-evenly;
flex-wrap: wrap;
}