59 lines
1.8 KiB
JavaScript
59 lines
1.8 KiB
JavaScript
import React from "react";
|
|
import { Popover, Button } from "antd";
|
|
import CurrencyFormatter from "../../utils/CurrencyFormatter";
|
|
import PhoneFormatter from "../../utils/PhoneFormatter";
|
|
import { Link } from "react-router-dom";
|
|
import { useTranslation } from "react-i18next";
|
|
|
|
export default function ScheduleEventComponent({ event, handleCancel }) {
|
|
const { t } = useTranslation();
|
|
const popoverContent = (
|
|
<div>
|
|
<div>{`${t("jobs.fields.ro_number")}: ${event.job.ro_number}`}</div>
|
|
<div>
|
|
{t("jobs.fields.clm_total")}:
|
|
<CurrencyFormatter>{event.job.clm_total}</CurrencyFormatter>
|
|
</div>
|
|
<div>{`${t("jobs.fields.clm_no")}: ${event.job.clm_no}`}</div>
|
|
<div>
|
|
{t("jobs.fields.ownr_ea")}:{event.job.ownr_ea}
|
|
</div>
|
|
<div>
|
|
{t("jobs.fields.ownr_ph1")}:
|
|
<PhoneFormatter>{event.job.ownr_ph1}</PhoneFormatter>
|
|
</div>
|
|
<Link to={`/manage/jobs/${event.job.id}`}>
|
|
<Button>{t("appointments.actions.viewjob")}</Button>
|
|
</Link>
|
|
<Button onClick={() => handleCancel(event.id)}>
|
|
{t("appointments.actions.cancel")}
|
|
</Button>
|
|
<Button>
|
|
{
|
|
//TODO: Add reschedule Func.
|
|
}
|
|
{t("appointments.actions.reschedule")}
|
|
</Button>
|
|
<Button>
|
|
{
|
|
//TODO: Add intake func.
|
|
}
|
|
{t("appointments.actions.intake")}
|
|
</Button>
|
|
</div>
|
|
);
|
|
|
|
return (
|
|
<Popover content={popoverContent}>
|
|
<div>
|
|
<strong>{`${event.job.ownr_fn || ""} ${event.job.ownr_ln ||
|
|
""}`}</strong>
|
|
<span style={{ margin: 4 }}>
|
|
{`${event.job.vehicle.v_model_yr || ""} ${event.job.vehicle
|
|
.v_make_desc || ""} ${event.job.vehicle.v_model_desc || ""}`}
|
|
</span>
|
|
</div>
|
|
</Popover>
|
|
);
|
|
}
|