Files
bodyshop/client/src/components/job-close-ro-guard/job-close-ro-guard.ar.jsx
2024-04-11 09:49:00 -07:00

63 lines
2.1 KiB
JavaScript

import React, { useEffect } from "react";
import { Alert, Card } from "antd";
import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { selectJobReadOnly } from "../../redux/application/application.selectors";
import { selectBodyshop } from "../../redux/user/user.selectors";
import { useMemo } from "react";
import Dinero from "dinero.js";
import DataLabel from "../data-label/data-label.component";
const mapStateToProps = createStructuredSelector({
//currentUser: selectCurrentUser
bodyshop: selectBodyshop,
jobRO: selectJobReadOnly
});
const mapDispatchToProps = (dispatch) => ({
//setUserLanguage: language => dispatch(setUserLanguage(language))
});
export default connect(mapStateToProps, mapDispatchToProps)(JobCloseRoGuardProfit);
export function JobCloseRoGuardProfit({ job, jobRO, bodyshop, form, warningCallback }) {
const { t } = useTranslation();
const total = useMemo(() => {
return (
job.payments &&
job.payments.reduce((acc, val) => {
acc = acc.add(Dinero({ amount: Math.round(val.amount * 100) }));
return acc;
}, Dinero())
);
}, [job.payments]);
const balance = useMemo(() => {
if (job && job.job_totals && job.job_totals.totals.total_repairs)
return Dinero(job.job_totals.totals.total_repairs).subtract(total);
return Dinero({ amount: 0 }).subtract(total);
}, [job, total]);
useEffect(() => {
if (balance.getAmount() !== 0) {
warningCallback({ key: "ar", warning: t("jobs.labels.outstanding_ar") });
}
}, [balance, t, warningCallback]);
return (
<Card title={t("jobs.labels.accountsreceivable")} style={{ height: "100%" }}>
<DataLabel label={t("payments.labels.totalpayments")}>{total.toFormat()}</DataLabel>
<DataLabel
valueStyle={{ color: balance.getAmount() !== 0 ? "red" : "green" }}
label={t("payments.labels.balance")}
>
{balance.toFormat()}
</DataLabel>
{balance.getAmount() !== 0 && (
<Alert style={{ margin: "8px 0px" }} type="warning" message={t("jobs.labels.outstanding_ar")} />
)}
</Card>
);
}