import { Descriptions, Statistic } from "antd";
import React from "react";
import { useTranslation } from "react-i18next";
import Dinero from "dinero.js";

export default function JobsCloseTotals({
  jobTotals,
  labMatTotal,
  partsTotal,
}) {
  const { t } = useTranslation();
  return (
    <div>
      <Descriptions
        bordered
        size="small"
        //column={1}
        title={t("jobs.labels.totals")}
      >
        <Descriptions.Item label={t("jobs.labels.partstotal")}>
          <Statistic
            value={Dinero(jobTotals.parts.parts.total).toFormat()}
            suffix={`(${Dinero(
              jobTotals.parts.parts.subtotal
            ).toFormat()} ± ${Dinero(
              jobTotals.parts.parts.adjustments
            ).toFormat()})`}
          />
        </Descriptions.Item>
        <Descriptions.Item label={t("jobs.labels.subletstotal")}>
          <Statistic
            value={Dinero(jobTotals.parts.sublets.total).toFormat()}
            suffix={`(${Dinero(
              jobTotals.parts.sublets.subtotal
            ).toFormat()} ± ${Dinero(
              jobTotals.parts.sublets.adjustments
            ).toFormat()})`}
          />
        </Descriptions.Item>
        <Descriptions.Item label={t("jobs.labels.subtotal")}>
          <Statistic value={Dinero(jobTotals.totals.subtotal).toFormat()} />
        </Descriptions.Item>
        <Descriptions.Item label={t("jobs.labels.federal_tax_amt")}>
          <Statistic value={Dinero(jobTotals.totals.federal_tax).toFormat()} />
        </Descriptions.Item>
        <Descriptions.Item label={t("jobs.labels.state_tax_amt")}>
          <Statistic value={Dinero(jobTotals.totals.state_tax).toFormat()} />
        </Descriptions.Item>
        <Descriptions.Item label={t("jobs.labels.local_tax_amt")}>
          <Statistic value={Dinero(jobTotals.totals.local_tax).toFormat()} />
        </Descriptions.Item>
      </Descriptions>
      <Statistic
        title={t("jobs.labels.total_repairs")}
        value={Dinero(jobTotals.totals.total_repairs).toFormat()}
      />
      <Statistic
        title={t("jobs.labels.net_repairs")}
        value={Dinero(jobTotals.totals.net_repairs).toFormat()}
      />
      <Statistic
        title={t("jobs.labels.suspense")}
        valueStyle={{
          color:
            Dinero(jobTotals.totals.subtotal)
              .subtract(labMatTotal)
              .subtract(partsTotal)
              .getAmount() === 0
              ? "green"
              : "red",
        }}
        value={Dinero(jobTotals.totals.subtotal)
          .subtract(labMatTotal)
          .subtract(partsTotal)
          .toFormat()}
      />
    </div>
  );
}