Replaced null coalescence. Updated dates components.
This commit is contained in:
@@ -63,7 +63,7 @@ export default function CurrentUserDropdown() {
|
||||
</Col>
|
||||
<Col span={16}>
|
||||
<Link to='/manage/profile'>
|
||||
{currentUser?.displayName ?? t("general.labels.unknown")}
|
||||
{currentUser?.displayName || t("general.labels.unknown")}
|
||||
</Link>
|
||||
</Col>
|
||||
</Row>
|
||||
|
||||
@@ -1,26 +1,24 @@
|
||||
import React, { useState } from "react";
|
||||
import { Link } from "react-router-dom";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { useQuery } from "@apollo/react-hooks";
|
||||
import AlertComponent from "../alert/alert.component";
|
||||
import { Button, Icon, PageHeader, Tag } from "antd";
|
||||
import React, { useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { Link } from "react-router-dom";
|
||||
import { QUERY_JOB_CARD_DETAILS } from "../../graphql/jobs.queries";
|
||||
import { PageHeader, Button, Descriptions, Tag, Icon } from "antd";
|
||||
|
||||
import AlertComponent from "../alert/alert.component";
|
||||
import LoadingSpinner from "../loading-spinner/loading-spinner.component";
|
||||
import NoteUpsertModal from "../note-upsert-modal/note-upsert-modal.container";
|
||||
//import JobDetailCardsHeaderComponent from "./job-detail-cards.header.component";
|
||||
import JobDetailCardsCustomerComponent from "./job-detail-cards.customer.component";
|
||||
import JobDetailCardsVehicleComponent from "./job-detail-cards.vehicle.component";
|
||||
import JobDetailCardsInsuranceComponent from "./job-detail-cards.insurance.component";
|
||||
import JobDetailCardsDatesComponent from "./job-detail-cards.dates.component";
|
||||
import JobDetailCardsPartsComponent from "./job-detail-cards.parts.component";
|
||||
import JobDetailCardsNotesComponent from "./job-detail-cards.notes.component";
|
||||
import JobDetailCardsDamageComponent from "./job-detail-cards.damage.component";
|
||||
import JobDetailCardsTotalsComponent from "./job-detail-cards.totals.component";
|
||||
import JobDetailCardsDatesComponent from "./job-detail-cards.dates.component";
|
||||
import JobDetailCardsDocumentsComponent from "./job-detail-cards.documents.component";
|
||||
import LoadingSpinner from "../loading-spinner/loading-spinner.component";
|
||||
|
||||
import JobDetailCardsInsuranceComponent from "./job-detail-cards.insurance.component";
|
||||
import JobDetailCardsNotesComponent from "./job-detail-cards.notes.component";
|
||||
import JobDetailCardsPartsComponent from "./job-detail-cards.parts.component";
|
||||
import "./job-detail-cards.styles.scss";
|
||||
import LoadingSkeleton from "../loading-skeleton/loading-skeleton.component";
|
||||
import NoteUpsertModal from "../note-upsert-modal/note-upsert-modal.container";
|
||||
import JobDetailCardsTotalsComponent from "./job-detail-cards.totals.component";
|
||||
|
||||
|
||||
|
||||
export default function JobDetailCards({ selectedJob }) {
|
||||
const { loading, error, data, refetch } = useQuery(QUERY_JOB_CARD_DETAILS, {
|
||||
@@ -95,33 +93,38 @@ export default function JobDetailCards({ selectedJob }) {
|
||||
{t("jobs.actions.postInvoices")}
|
||||
</Button>
|
||||
]}>
|
||||
{loading ? (
|
||||
<LoadingSkeleton />
|
||||
) : (
|
||||
<Descriptions size='small' column={3}>
|
||||
<Descriptions.Item label='Created'>Lili Qu</Descriptions.Item>
|
||||
<Descriptions.Item label='Association'>421421</Descriptions.Item>
|
||||
<Descriptions.Item label='Creation Time'>
|
||||
2017-01-10
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item label='Effective Time'>
|
||||
2017-10-10
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item label='Remarks'>
|
||||
Gonghu Road, Xihu District, Hangzhou, Zhejiang, China
|
||||
</Descriptions.Item>
|
||||
</Descriptions>
|
||||
)}
|
||||
{
|
||||
// loading ? (
|
||||
// <LoadingSkeleton />
|
||||
// ) : (
|
||||
// <Descriptions size='small' column={3}>
|
||||
// <Descriptions.Item label='Created'>Lili Qu</Descriptions.Item>
|
||||
// <Descriptions.Item label='Association'>421421</Descriptions.Item>
|
||||
// <Descriptions.Item label='Creation Time'>
|
||||
// 2017-01-10
|
||||
// </Descriptions.Item>
|
||||
// <Descriptions.Item label='Effective Time'>
|
||||
// 2017-10-10
|
||||
// </Descriptions.Item>
|
||||
// <Descriptions.Item label='Remarks'>
|
||||
// Gonghu Road, Xihu District, Hangzhou, Zhejiang, China
|
||||
// </Descriptions.Item>
|
||||
// </Descriptions>
|
||||
// )
|
||||
}
|
||||
|
||||
<section className='job-cards'>
|
||||
<JobDetailCardsCustomerComponent
|
||||
loading={loading}
|
||||
data={data ? data.jobs_by_pk : null}
|
||||
/>
|
||||
<JobDetailCardsVehicleComponent
|
||||
loading={loading}
|
||||
data={data ? data.jobs_by_pk : null}
|
||||
/>
|
||||
{
|
||||
// <JobDetailCardsVehicleComponent
|
||||
// loading={loading}
|
||||
// data={data ? data.jobs_by_pk : null}
|
||||
// />
|
||||
}
|
||||
|
||||
<JobDetailCardsInsuranceComponent
|
||||
loading={loading}
|
||||
data={data ? data.jobs_by_pk : null}
|
||||
|
||||
@@ -1,7 +1,8 @@
|
||||
import React from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import CardTemplate from "./job-detail-cards.template.component";
|
||||
import { Link } from "react-router-dom";
|
||||
import PhoneFormatter from "../../utils/PhoneFormatter";
|
||||
import CardTemplate from "./job-detail-cards.template.component";
|
||||
|
||||
export default function JobDetailCardsCustomerComponent({ loading, data }) {
|
||||
const { t } = useTranslation();
|
||||
@@ -10,28 +11,34 @@ export default function JobDetailCardsCustomerComponent({ loading, data }) {
|
||||
<CardTemplate
|
||||
loading={loading}
|
||||
title={t("jobs.labels.cards.customer")}
|
||||
extraLink={data?.owner ? `/manage/owners/${data?.owner?.id}` : null}>
|
||||
extraLink={data && data.owner ? `/manage/owners/${data.owner.id}` : null}>
|
||||
{data ? (
|
||||
<span>
|
||||
<div>{`${data?.ownr_fn ?? ""} ${data.ownr_ln ?? ""}`}</div>
|
||||
<div>{`${data.ownr_fn || ""} ${data.ownr_ln || ""}`}</div>
|
||||
<div>
|
||||
{t("jobs.fields.phoneshort")}:
|
||||
<PhoneFormatter>{`${data?.ownr_ph1 ??
|
||||
<PhoneFormatter>{`${data.ownr_ph1 ||
|
||||
t("general.labels.na")}`}</PhoneFormatter>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
{t("jobs.fields.ownr_ea")}:
|
||||
{data?.ownr_ea ? (
|
||||
{data.ownr_ea ? (
|
||||
<a href={`mailto:${data.ownr_ea}`}>
|
||||
<span>{`${data?.ownr_ea ?? ""}`}</span>
|
||||
<span>{`${data.ownr_ea || ""}`}</span>
|
||||
</a>
|
||||
) : (
|
||||
t("general.labels.na")
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div>{`${data?.owner?.preferred_contact ?? ""}`}</div>
|
||||
<div>{`${(data.owner && data.owner.preferred_contact) || ""}`}</div>
|
||||
{data.vehicle ? (
|
||||
<Link to={`/manage/vehicles/${data.vehicle.id}`}>
|
||||
{`${data.vehicle.v_model_yr || ""} ${data.vehicle.v_make_desc ||
|
||||
""} ${data.vehicle.v_model_desc || ""}`}
|
||||
</Link>
|
||||
) : (
|
||||
<span>{t("jobs.errors.novehicle")}</span>
|
||||
)}
|
||||
</span>
|
||||
) : null}
|
||||
</CardTemplate>
|
||||
|
||||
@@ -11,13 +11,112 @@ export default function JobDetailCardsDatesComponent({ loading, data }) {
|
||||
<CardTemplate loading={loading} title={t("jobs.labels.cards.dates")}>
|
||||
{data ? (
|
||||
<Timeline>
|
||||
<Timeline.Item>
|
||||
Actual In <Moment format='MM/DD/YYYY'>{data?.actual_in}</Moment>
|
||||
</Timeline.Item>
|
||||
<Timeline.Item>
|
||||
Scheduled Completion
|
||||
<Moment format='MM/DD/YYYY'>{data?.scheduled_completion}</Moment>
|
||||
</Timeline.Item>
|
||||
{!(
|
||||
data.actual_in ||
|
||||
data.scheduled_completion ||
|
||||
data.scheduled_in ||
|
||||
data.actual_completion ||
|
||||
data.scheduled_delivery ||
|
||||
data.actual_delivery ||
|
||||
data.date_estimated ||
|
||||
data.date_open ||
|
||||
data.date_scheduled ||
|
||||
data.date_invoiced ||
|
||||
data.date_closed ||
|
||||
data.date_exported
|
||||
) ? (
|
||||
<div>{t("jobs.errors.nodates")}</div>
|
||||
) : null}
|
||||
|
||||
{data.actual_in ? (
|
||||
<Timeline.Item>
|
||||
{t("jobs.fields.actual_in")}
|
||||
<Moment format='MM/DD/YYYY'>{data.actual_in || ""}</Moment>
|
||||
</Timeline.Item>
|
||||
) : null}
|
||||
|
||||
{data.scheduled_completion ? (
|
||||
<Timeline.Item>
|
||||
{t("jobs.fields.scheduled_completion")}
|
||||
<Moment format='MM/DD/YYYY'>
|
||||
{data.scheduled_completion || ""}
|
||||
</Moment>
|
||||
</Timeline.Item>
|
||||
) : null}
|
||||
|
||||
{data.scheduled_in ? (
|
||||
<Timeline.Item>
|
||||
{t("jobs.fields.scheduled_in")}
|
||||
<Moment format='MM/DD/YYYY'>{data.scheduled_in || ""}</Moment>
|
||||
</Timeline.Item>
|
||||
) : null}
|
||||
|
||||
{data.actual_completion ? (
|
||||
<Timeline.Item>
|
||||
{t("jobs.fields.actual_completion")}
|
||||
<Moment format='MM/DD/YYYY'>
|
||||
{data.actual_completion || ""}
|
||||
</Moment>
|
||||
</Timeline.Item>
|
||||
) : null}
|
||||
|
||||
{data.scheduled_delivery ? (
|
||||
<Timeline.Item>
|
||||
{t("jobs.fields.scheduled_delivery")}
|
||||
<Moment format='MM/DD/YYYY'>
|
||||
{data.scheduled_delivery || ""}
|
||||
</Moment>
|
||||
</Timeline.Item>
|
||||
) : null}
|
||||
|
||||
{data.actual_delivery ? (
|
||||
<Timeline.Item>
|
||||
{t("jobs.fields.actual_delivery")}
|
||||
<Moment format='MM/DD/YYYY'>{data.actual_delivery || ""}</Moment>
|
||||
</Timeline.Item>
|
||||
) : null}
|
||||
|
||||
{data.date_estimated ? (
|
||||
<Timeline.Item>
|
||||
{t("jobs.fields.date_estimated")}
|
||||
<Moment format='MM/DD/YYYY'>{data.date_estimated || ""}</Moment>
|
||||
</Timeline.Item>
|
||||
) : null}
|
||||
|
||||
{data.date_open ? (
|
||||
<Timeline.Item>
|
||||
{t("jobs.fields.date_open")}
|
||||
<Moment format='MM/DD/YYYY'>{data.date_open || ""}</Moment>
|
||||
</Timeline.Item>
|
||||
) : null}
|
||||
|
||||
{data.date_scheduled ? (
|
||||
<Timeline.Item>
|
||||
{t("jobs.fields.date_scheduled")}
|
||||
<Moment format='MM/DD/YYYY'>{data.date_scheduled || ""}</Moment>
|
||||
</Timeline.Item>
|
||||
) : null}
|
||||
|
||||
{data.date_invoiced ? (
|
||||
<Timeline.Item>
|
||||
{t("jobs.fields.date_invoiced")}
|
||||
<Moment format='MM/DD/YYYY'>{data.date_invoiced || ""}</Moment>
|
||||
</Timeline.Item>
|
||||
) : null}
|
||||
|
||||
{data.date_closed ? (
|
||||
<Timeline.Item>
|
||||
{t("jobs.fields.date_closed")}
|
||||
<Moment format='MM/DD/YYYY'>{data.date_closed || ""}</Moment>
|
||||
</Timeline.Item>
|
||||
) : null}
|
||||
|
||||
{data.date_exported ? (
|
||||
<Timeline.Item>
|
||||
{t("jobs.fields.date_exported")}
|
||||
<Moment format='MM/DD/YYYY'>{data.date_exported || ""}</Moment>
|
||||
</Timeline.Item>
|
||||
) : null}
|
||||
</Timeline>
|
||||
) : null}
|
||||
</CardTemplate>
|
||||
|
||||
@@ -10,16 +10,16 @@ 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>{data?.ins_co_nm || t("general.labels.unknown")}</div>
|
||||
<div>{data?.clm_no || t("general.labels.unknown")}</div>
|
||||
<div>
|
||||
{t("jobs.labels.cards.filehandler")}
|
||||
{data?.ins_ea ? (
|
||||
<a href={`mailto:${data.ins_ea}`}>
|
||||
<div>{`${data?.ins_ct_fn ?? ""} ${data?.ins_ct_ln ?? ""}`}</div>
|
||||
<div>{`${data?.ins_ct_fn || ""} ${data?.ins_ct_ln || ""}`}</div>
|
||||
</a>
|
||||
) : (
|
||||
<div>{`${data?.ins_ct_fn ?? ""} ${data?.ins_ct_ln ?? ""}`}</div>
|
||||
<div>{`${data?.ins_ct_fn || ""} ${data?.ins_ct_ln || ""}`}</div>
|
||||
)}
|
||||
{data?.ins_ph1 ? (
|
||||
<PhoneFormatter>{data?.ins_ph1}</PhoneFormatter>
|
||||
@@ -31,10 +31,10 @@ export default function JobDetailCardsInsuranceComponent({ loading, data }) {
|
||||
{t("jobs.labels.cards.appraiser")}
|
||||
{data?.est_ea ? (
|
||||
<a href={`mailto:${data.est_ea}`}>
|
||||
<div>{`${data?.ins_ct_fn ?? ""} ${data?.ins_ct_ln ?? ""}`}</div>
|
||||
<div>{`${data?.ins_ct_fn || ""} ${data?.ins_ct_ln || ""}`}</div>
|
||||
</a>
|
||||
) : (
|
||||
<div>{`${data?.ins_ct_fn ?? ""} ${data?.ins_ct_ln ?? ""}`}</div>
|
||||
<div>{`${data?.ins_ct_fn || ""} ${data?.ins_ct_ln || ""}`}</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
@@ -42,10 +42,10 @@ export default function JobDetailCardsInsuranceComponent({ loading, data }) {
|
||||
{t("jobs.labels.cards.estimator")}
|
||||
{data?.est_ea ? (
|
||||
<a href={`mailto:${data.est_ea}`}>
|
||||
<div>{`${data?.est_ct_fn ?? ""} ${data?.est_ct_ln ?? ""}`}</div>
|
||||
<div>{`${data?.est_ct_fn || ""} ${data?.est_ct_ln || ""}`}</div>
|
||||
</a>
|
||||
) : (
|
||||
<div>{`${data?.est_ct_fn ?? ""} ${data?.est_ct_ln ?? ""}`}</div>
|
||||
<div>{`${data?.est_ct_fn || ""} ${data?.est_ct_ln || ""}`}</div>
|
||||
)}
|
||||
{data?.est_ph1 ? (
|
||||
<PhoneFormatter>{data?.est_ph1}</PhoneFormatter>
|
||||
|
||||
@@ -13,9 +13,9 @@ export default function JobDetailCardsVehicleComponent({ loading, data }) {
|
||||
>
|
||||
{data ? (
|
||||
<span>
|
||||
{data.vehicle?.v_model_yr ?? t("general.labels.na")}{" "}
|
||||
{data.vehicle?.v_make_desc ?? t("general.labels.na")}{" "}
|
||||
{data.vehicle?.v_model_desc ?? t("general.labels.na")}
|
||||
{data.vehicle?.v_model_yr || t("general.labels.na")}{" "}
|
||||
{data.vehicle?.v_make_desc || t("general.labels.na")}{" "}
|
||||
{data.vehicle?.v_model_desc || t("general.labels.na")}
|
||||
</span>
|
||||
) : null}
|
||||
</CardTemplate>
|
||||
|
||||
@@ -91,9 +91,9 @@ function JobTombstone({ job, ...otherProps }) {
|
||||
title={tombstoneTitle}
|
||||
subTitle={
|
||||
jobContext.owner
|
||||
? (jobContext.owner?.first_name ?? "") +
|
||||
? (jobContext.owner?.first_name || "") +
|
||||
" " +
|
||||
(jobContext.owner?.last_name ?? "")
|
||||
(jobContext.owner?.last_name || "")
|
||||
: t("jobs.errors.noowner")
|
||||
}
|
||||
tags={
|
||||
@@ -133,10 +133,10 @@ function JobTombstone({ job, ...otherProps }) {
|
||||
<Descriptions size='small' column={5}>
|
||||
<Descriptions.Item label={t("jobs.fields.vehicle")}>
|
||||
<Link to={`/manage/vehicles/${jobContext.vehicle?.id}`}>
|
||||
{jobContext.vehicle?.v_model_yr ?? t("general.labels.na")}{" "}
|
||||
{jobContext.vehicle?.v_make_desc ?? t("general.labels.na")}{" "}
|
||||
{jobContext.vehicle?.v_model_desc ?? t("general.labels.na")} |{" "}
|
||||
{jobContext.vehicle?.plate_no ?? t("general.labels.na")}
|
||||
{jobContext.vehicle?.v_model_yr || t("general.labels.na")}{" "}
|
||||
{jobContext.vehicle?.v_make_desc || t("general.labels.na")}{" "}
|
||||
{jobContext.vehicle?.v_model_desc || t("general.labels.na")} |{" "}
|
||||
{jobContext.vehicle?.plate_no || t("general.labels.na")}
|
||||
</Link>
|
||||
</Descriptions.Item>
|
||||
|
||||
|
||||
@@ -91,7 +91,7 @@ export default withRouter(function JobsList({
|
||||
sortOrder:
|
||||
state.sortedInfo.columnKey === "status" && state.sortedInfo.order,
|
||||
render: (text, record) => {
|
||||
return record.job_status?.name ?? t("general.labels.na");
|
||||
return record.job_status?.name || t("general.labels.na");
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
@@ -16,10 +16,5 @@ export default function SignoutComponent() {
|
||||
|
||||
const { t } = useTranslation();
|
||||
|
||||
return (
|
||||
<div>
|
||||
{this.renderRedirect()}
|
||||
<div onClick={signOut}>{t("user.actions.signout")}</div>
|
||||
</div>
|
||||
);
|
||||
return <div onClick={signOut}>{t("user.actions.signout")}</div>;
|
||||
}
|
||||
|
||||
@@ -63,11 +63,11 @@ export default function WhiteBoardCard({ metadata }) {
|
||||
<div>
|
||||
<Card
|
||||
title={
|
||||
(metadata.ro_number ?? metadata.est_number) +
|
||||
(metadata.ro_number || metadata.est_number) +
|
||||
" | " +
|
||||
(metadata.owner?.first_name ?? "") +
|
||||
(metadata.owner?.first_name || "") +
|
||||
" " +
|
||||
(metadata.owner?.last_name ?? "")
|
||||
(metadata.owner?.last_name || "")
|
||||
}
|
||||
style={{ width: 300, marginTop: 10 }}
|
||||
bodyStyle={{ padding: 10 }}
|
||||
@@ -87,15 +87,15 @@ export default function WhiteBoardCard({ metadata }) {
|
||||
<Col span={18}>
|
||||
<Row>
|
||||
<WrappedSpan>
|
||||
{metadata.vehicle?.v_model_yr ?? t("general.labels.na")}{" "}
|
||||
{metadata.vehicle?.v_make_desc ?? t("general.labels.na")}{" "}
|
||||
{metadata.vehicle?.v_model_desc ?? t("general.labels.na")}
|
||||
{metadata.vehicle?.v_model_yr || t("general.labels.na")}{" "}
|
||||
{metadata.vehicle?.v_make_desc || t("general.labels.na")}{" "}
|
||||
{metadata.vehicle?.v_model_desc || t("general.labels.na")}
|
||||
</WrappedSpan>
|
||||
</Row>
|
||||
{metadata.vehicle?.v_vin ? (
|
||||
<Row>
|
||||
<WrappedSpan>
|
||||
VIN: {metadata.vehicle?.v_vin ?? t("general.labels.na")}
|
||||
VIN: {metadata.vehicle?.v_vin || t("general.labels.na")}
|
||||
</WrappedSpan>
|
||||
</Row>
|
||||
) : null}
|
||||
|
||||
Reference in New Issue
Block a user