Files
bodyshop/client/src/components/contract-job-block/contract-job-block.component.jsx
Patrick Fic 01eb68fda1 IO-1589
2022-04-07 17:28:57 -07:00

33 lines
1.1 KiB
JavaScript

import { Card } from "antd";
import React from "react";
import { useTranslation } from "react-i18next";
import { Link } from "react-router-dom";
import DataLabel from "../data-label/data-label.component";
import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
export default function ContractJobBlock({ job }) {
const { t } = useTranslation();
return (
<Link to={`/manage/jobs/${job && job.id}`}>
<Card
className="ant-card-grid-hoverable"
style={{ height: "100%" }}
title={t("jobs.labels.job")}
>
<div>
<DataLabel label={t("jobs.fields.ro_number")}>
{(job && job.ro_number) || ""}
</DataLabel>
<DataLabel label={t("jobs.fields.vehicle")}>
{`${(job && job.v_model_yr) || ""} ${
(job && job.v_make_desc) || ""
} ${(job && job.v_model_desc) || ""}`}
</DataLabel>
<DataLabel label={t("jobs.fields.owner")}>
<OwnerNameDisplay ownerObject={job} />
</DataLabel>
</div>
</Card>
</Link>
);
}