UI Fixes on Job list page. Refactored form row component. BOD-155

This commit is contained in:
Patrick Fic
2020-06-12 15:04:16 -07:00
parent 12924fe13a
commit a88785fc43
26 changed files with 634 additions and 528 deletions

View File

@@ -1,8 +1,7 @@
import React from "react";
import { useTranslation } from "react-i18next";
import DataLabel from "../data-label/data-label.component";
import CardTemplate from "./job-detail-cards.template.component";
import PhoneFormatter from "../../utils/PhoneFormatter";
export default function JobDetailCardsInsuranceComponent({ loading, data }) {
const { t } = useTranslation();
@@ -10,10 +9,15 @@ export default function JobDetailCardsInsuranceComponent({ loading, data }) {
<CardTemplate loading={loading} title={t("jobs.labels.cards.insurance")}>
{data ? (
<span>
<div>{data.ins_co_nm || t("general.labels.unknown")}</div>
<div>{data.clm_no || t("general.labels.unknown")}</div>
<div>
{t("jobs.labels.cards.filehandler")}
<DataLabel label={t("jobs.fields.ins_co_nm")} hideIfNull>
{data.ins_co_nm}
</DataLabel>
<DataLabel label={t("jobs.fields.clm_no")} hideIfNull>
{data.clm_no}
</DataLabel>
<DataLabel
label={t("jobs.labels.cards.filehandler")}
visible={data.ins_ct_fn && data.ins_ct_ln}>
{data.ins_ea ? (
<a href={`mailto:${data.ins_ea}`}>
<div>{`${data.ins_ct_fn || ""} ${data.ins_ct_ln || ""}`}</div>
@@ -21,35 +25,18 @@ export default function JobDetailCardsInsuranceComponent({ loading, data }) {
) : (
<div>{`${data.ins_ct_fn || ""} ${data.ins_ct_ln || ""}`}</div>
)}
{data.ins_ph1 ? (
<PhoneFormatter>{data.ins_ph1}</PhoneFormatter>
) : null}
</div>
<div>
{t("jobs.labels.cards.appraiser")}
{data.est_ea ? (
<a href={`mailto:${data.est_ea}`}>
<div>{`${data.ins_ct_fn || ""} ${data.ins_ct_ln || ""}`}</div>
</a>
) : (
<div>{`${data.ins_ct_fn || ""} ${data.ins_ct_ln || ""}`}</div>
)}
</div>
<div>
{t("jobs.labels.cards.estimator")}
{data.est_ea ? (
</DataLabel>
<DataLabel
label={t("jobs.labels.cards.estimator")}
visible={data.est_ct_fn && data.est_ct_ln}>
{data.ins_ea ? (
<a href={`mailto:${data.est_ea}`}>
<div>{`${data.est_ct_fn || ""} ${data.est_ct_ln || ""}`}</div>
</a>
) : (
<div>{`${data.est_ct_fn || ""} ${data.est_ct_ln || ""}`}</div>
)}
{data.est_ph1 ? (
<PhoneFormatter>{data.est_ph1}</PhoneFormatter>
) : null}
</div>
</DataLabel>
</span>
) : null}
</CardTemplate>