527 lines
20 KiB
JavaScript
527 lines
20 KiB
JavaScript
import { DeleteFilled, DownOutlined, ReloadOutlined } from "@ant-design/icons";
|
|
import {
|
|
Button,
|
|
Card,
|
|
Col,
|
|
Divider,
|
|
Dropdown,
|
|
Form,
|
|
Input,
|
|
InputNumber,
|
|
Row,
|
|
Select,
|
|
Space,
|
|
Statistic,
|
|
Switch,
|
|
Tooltip,
|
|
Typography
|
|
} from "antd";
|
|
import Dinero from "dinero.js";
|
|
import { useTranslation } from "react-i18next";
|
|
import { connect } from "react-redux";
|
|
import { createStructuredSelector } from "reselect";
|
|
import { determineDmsType } from "../../utils/determineDMSType";
|
|
import { selectBodyshop } from "../../redux/user/user.selectors";
|
|
import i18n from "../../translations/i18n";
|
|
import dayjs from "../../utils/day";
|
|
import DmsCdkMakes from "../dms-cdk-makes/dms-cdk-makes.component";
|
|
import DmsCdkMakesRefetch from "../dms-cdk-makes/dms-cdk-makes.refetch.component";
|
|
import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
|
|
import CurrencyInput from "../form-items-formatted/currency-form-item.component";
|
|
import { useSocket } from "../../contexts/SocketIO/useSocket";
|
|
import { useSplitTreatments } from "@splitsoftware/splitio-react";
|
|
import { useEffect, useMemo, useState } from "react";
|
|
|
|
const mapStateToProps = createStructuredSelector({
|
|
bodyshop: selectBodyshop
|
|
});
|
|
const mapDispatchToProps = () => ({});
|
|
export default connect(mapStateToProps, mapDispatchToProps)(DmsPostForm);
|
|
|
|
export function DmsPostForm({ bodyshop, socket, job, logsRef }) {
|
|
const {
|
|
treatments: { Fortellis }
|
|
} = useSplitTreatments({
|
|
attributes: {},
|
|
names: ["Fortellis"],
|
|
splitKey: bodyshop.imexshopid
|
|
});
|
|
|
|
const [form] = Form.useForm();
|
|
const { t } = useTranslation();
|
|
const { socket: wsssocket } = useSocket();
|
|
|
|
// Figure out DMS once and reuse
|
|
const dms = useMemo(() => determineDmsType(bodyshop), [bodyshop]);
|
|
|
|
// ---------------- RR Advisors (unchanged behavior) ----------------
|
|
const [advisors, setAdvisors] = useState([]);
|
|
const [advLoading, setAdvLoading] = useState(false);
|
|
|
|
// Normalize advisor fields coming from various shapes
|
|
const getAdvisorNumber = (a) => a?.advisorId;
|
|
const getAdvisorLabel = (a) => `${a?.firstName || ""} ${a?.lastName || ""}`.trim();
|
|
|
|
const fetchRrAdvisors = (refresh = false) => {
|
|
if (!wsssocket) return;
|
|
setAdvLoading(true);
|
|
|
|
// Listen for the server's broadcast
|
|
const onResult = (payload) => {
|
|
try {
|
|
const list = payload?.result ?? payload ?? [];
|
|
setAdvisors(Array.isArray(list) ? list : []);
|
|
} finally {
|
|
setAdvLoading(false);
|
|
wsssocket.off("rr-get-advisors:result", onResult);
|
|
}
|
|
};
|
|
|
|
wsssocket.once("rr-get-advisors:result", onResult);
|
|
|
|
// Emit with refresh flag: server will bypass/rebuild cache when true
|
|
wsssocket.emit("rr-get-advisors", { departmentType: "B", refresh }, (ack) => {
|
|
if (ack?.ok) {
|
|
const list = ack.result ?? [];
|
|
setAdvisors(Array.isArray(list) ? list : []);
|
|
} else if (ack) {
|
|
// Preserve original logging semantics
|
|
console.error("Something went wrong fetching DMS Advisors");
|
|
}
|
|
setAdvLoading(false);
|
|
wsssocket.off("rr-get-advisors:result", onResult);
|
|
});
|
|
};
|
|
|
|
useEffect(() => {
|
|
if (dms === "rr") fetchRrAdvisors(false);
|
|
}, [dms, bodyshop?.id]);
|
|
|
|
// ---------------- Payers helpers (non-RR) ----------------
|
|
const handlePayerSelect = (value, index) => {
|
|
form.setFieldsValue({
|
|
payers: (form.getFieldValue("payers") || []).map((payer, mapIndex) => {
|
|
if (index !== mapIndex) return payer;
|
|
const cdkPayer =
|
|
bodyshop.cdk_configuration.payers && bodyshop.cdk_configuration.payers.find((i) => i.name === value);
|
|
if (!cdkPayer) return payer;
|
|
|
|
return {
|
|
...cdkPayer,
|
|
dms_acctnumber: cdkPayer.dms_acctnumber,
|
|
controlnumber: job?.[cdkPayer.control_type]
|
|
};
|
|
})
|
|
});
|
|
};
|
|
|
|
// ---------------- Submit (RR precedence preserved) ----------------
|
|
const handleFinish = (values) => {
|
|
// RR takes precedence regardless of Fortellis split
|
|
if (dms === "rr") {
|
|
// values will include advisorNo (and makeOverride if provided)
|
|
wsssocket.emit("rr-export-job", {
|
|
bodyshopId: bodyshop?.id,
|
|
jobId: job.id,
|
|
job,
|
|
txEnvelope: values
|
|
});
|
|
} else if (Fortellis.treatment === "on") {
|
|
// Fallback to existing Fortellis behavior
|
|
wsssocket.emit("fortellis-export-job", {
|
|
jobid: job.id,
|
|
txEnvelope: { ...values, SubscriptionID: bodyshop.cdk_dealerid }
|
|
});
|
|
} else {
|
|
// CDK/PBS/etc.
|
|
socket.emit(`${dms}-export-job`, { jobid: job.id, txEnvelope: values });
|
|
}
|
|
|
|
// Scroll logs into view (original behavior)
|
|
logsRef?.current?.scrollIntoView({ behavior: "smooth" });
|
|
};
|
|
|
|
return (
|
|
<Card title={t("jobs.labels.dms.postingform")}>
|
|
<Form
|
|
form={form}
|
|
layout="vertical"
|
|
onFinish={handleFinish}
|
|
style={{ width: "100%" }}
|
|
initialValues={{
|
|
story: `${t("jobs.labels.dms.defaultstory", {
|
|
ro_number: job.ro_number,
|
|
ownr_nm: `${job.ownr_fn || ""} ${job.ownr_ln || ""} ${job.ownr_co_nm || ""}`.trim(),
|
|
ins_co_nm: job.ins_co_nm || "N/A",
|
|
clm_po: `${job.clm_no ? `${job.clm_no} ` : ""}${job.po_number || ""}`
|
|
}).trim()}.${
|
|
job.area_of_damage?.impact1
|
|
? " " +
|
|
t("jobs.labels.dms.damageto", {
|
|
area_of_damage: (job.area_of_damage && job.area_of_damage.impact1.padStart(2, "0")) || "UNKNOWN"
|
|
})
|
|
: ""
|
|
}`.slice(0, 239),
|
|
inservicedate: dayjs(
|
|
`${
|
|
(job.v_model_yr &&
|
|
(job.v_model_yr < 100
|
|
? job.v_model_yr >= (dayjs().year() + 1) % 100
|
|
? 1900 + parseInt(job.v_model_yr, 10)
|
|
: 2000 + parseInt(job.v_model_yr, 10)
|
|
: job.v_model_yr)) ||
|
|
2019
|
|
}-01-01`
|
|
)
|
|
}}
|
|
>
|
|
{/* TOP ROW — bottom-aligned so the Refresh button sits flush */}
|
|
<Row gutter={[16, 12]} align="bottom">
|
|
{dms !== "rr" && (
|
|
<Col xs={24} sm={12} md={8} lg={6}>
|
|
<Form.Item
|
|
name="journal"
|
|
label={t("jobs.fields.dms.journal")}
|
|
initialValue={bodyshop.cdk_configuration?.default_journal}
|
|
rules={[{ required: true }]}
|
|
>
|
|
<Input />
|
|
</Form.Item>
|
|
</Col>
|
|
)}
|
|
|
|
{dms === "rr" && (
|
|
<>
|
|
{/* Advisor + inline Refresh (restores original behavior with better UX) */}
|
|
<Col xs={24} sm={24} md={12} lg={8}>
|
|
<Form.Item name="advisorNo" label={t("jobs.fields.dms.advisor")} rules={[{ required: true }]}>
|
|
<Space.Compact block>
|
|
<Select
|
|
style={{ flex: 1 }}
|
|
loading={advLoading}
|
|
allowClear
|
|
placeholder={t("general.actions.select", "Select...")}
|
|
popupMatchSelectWidth
|
|
options={advisors
|
|
.map((a) => {
|
|
const value = getAdvisorNumber(a);
|
|
if (value == null) return null;
|
|
return { value: String(value), label: getAdvisorLabel(a) || String(value) };
|
|
})
|
|
.filter(Boolean)}
|
|
notFoundContent={advLoading ? t("general.loading") : t("general.none")}
|
|
/>
|
|
<Tooltip title={t("general.actions.refresh")}>
|
|
<Button
|
|
aria-label={t("general.actions.refresh")}
|
|
icon={<ReloadOutlined />}
|
|
onClick={() => fetchRrAdvisors(true)}
|
|
loading={advLoading}
|
|
/>
|
|
</Tooltip>
|
|
</Space.Compact>
|
|
</Form.Item>
|
|
</Col>
|
|
|
|
{/* Make Override (RR only, beside Advisor) */}
|
|
<Col xs={24} sm={12} md={12} lg={8}>
|
|
<Form.Item name="makeOverride" label={t("jobs.fields.dms.make_override")}>
|
|
<Input allowClear placeholder={t("general.actions.optional")} />
|
|
</Form.Item>
|
|
</Col>
|
|
</>
|
|
)}
|
|
|
|
<Col xs={12} sm={8} md={6} lg={4}>
|
|
<Form.Item name="kmin" label={t("jobs.fields.kmin")} initialValue={job?.kmin} rules={[{ required: true }]}>
|
|
<InputNumber style={{ width: "100%" }} disabled />
|
|
</Form.Item>
|
|
</Col>
|
|
|
|
<Col xs={12} sm={8} md={6} lg={4}>
|
|
<Form.Item
|
|
name="kmout"
|
|
label={t("jobs.fields.kmout")}
|
|
initialValue={job?.kmout}
|
|
rules={[{ required: true }]}
|
|
>
|
|
<InputNumber style={{ width: "100%" }} disabled />
|
|
</Form.Item>
|
|
</Col>
|
|
</Row>
|
|
|
|
{/* CDK vehicle details (unchanged behavior) */}
|
|
{bodyshop.cdk_dealerid && (
|
|
<>
|
|
<Row gutter={[16, 12]}>
|
|
<Col xs={24} sm={12} md={8}>
|
|
<Form.Item name="dms_make" label={t("jobs.fields.dms.dms_make")} rules={[{ required: true }]}>
|
|
<Input />
|
|
</Form.Item>
|
|
</Col>
|
|
<Col xs={24} sm={12} md={8}>
|
|
<Form.Item name="dms_model" label={t("jobs.fields.dms.dms_model")} rules={[{ required: true }]}>
|
|
<Input />
|
|
</Form.Item>
|
|
</Col>
|
|
<Col xs={24} sm={12} md={8}>
|
|
<Form.Item name="inservicedate" label={t("jobs.fields.dms.inservicedate")}>
|
|
<DateTimePicker isDateOnly />
|
|
</Form.Item>
|
|
</Col>
|
|
</Row>
|
|
|
|
<Row gutter={[16, 12]} align="middle">
|
|
<Col>
|
|
<DmsCdkMakes form={form} job={job} />
|
|
</Col>
|
|
<Col>
|
|
<DmsCdkMakesRefetch />
|
|
</Col>
|
|
<Col>
|
|
<Form.Item name="dms_unsold" label={t("jobs.fields.dms.dms_unsold")} initialValue={false}>
|
|
<Switch />
|
|
</Form.Item>
|
|
</Col>
|
|
<Col>
|
|
<Form.Item
|
|
name="dms_model_override"
|
|
label={t("jobs.fields.dms.dms_model_override")}
|
|
initialValue={false}
|
|
>
|
|
<Switch />
|
|
</Form.Item>
|
|
</Col>
|
|
</Row>
|
|
</>
|
|
)}
|
|
|
|
<Row gutter={[16, 12]}>
|
|
<Col span={24}>
|
|
<Form.Item name="story" label={t("jobs.fields.dms.story")} rules={[{ required: true }]}>
|
|
<Input.TextArea maxLength={240} />
|
|
</Form.Item>
|
|
</Col>
|
|
</Row>
|
|
|
|
<Divider />
|
|
|
|
{/* Totals (unchanged) */}
|
|
<Space size="large" wrap align="center" style={{ marginBottom: 16 }}>
|
|
<Statistic
|
|
title={t("jobs.fields.ded_amt")}
|
|
value={Dinero(job.job_totals.totals.custPayable.deductible).toFormat()}
|
|
/>
|
|
<Statistic
|
|
title={t("jobs.labels.total_cust_payable")}
|
|
value={Dinero(job.job_totals.totals.custPayable.total).toFormat()}
|
|
/>
|
|
<Statistic
|
|
title={t("jobs.labels.net_repairs")}
|
|
value={Dinero(job.job_totals.totals.net_repairs).toFormat()}
|
|
/>
|
|
</Space>
|
|
|
|
{/* Non-RR payers list (parity with original) */}
|
|
{dms !== "rr" && (
|
|
<>
|
|
<Divider />
|
|
<Form.List name={["payers"]}>
|
|
{(fields, { add, remove }) => (
|
|
<div>
|
|
{fields.map((field, index) => (
|
|
<Card
|
|
key={field.key}
|
|
size="small"
|
|
style={{ marginBottom: 12 }}
|
|
title={`${t("jobs.fields.dms.payer.payer_type")} #${index + 1}`}
|
|
extra={
|
|
<Tooltip title={t("jobs.actions.remove", "Remove")}>
|
|
<Button
|
|
type="text"
|
|
danger
|
|
icon={<DeleteFilled />}
|
|
aria-label={t("jobs.actions.remove", "Remove")}
|
|
onClick={() => remove(field.name)}
|
|
/>
|
|
</Tooltip>
|
|
}
|
|
>
|
|
<Row gutter={[16, 8]} align="middle">
|
|
<Col xs={24} sm={12} md={8} lg={6}>
|
|
<Form.Item
|
|
label={t("jobs.fields.dms.payer.name")}
|
|
name={[field.name, "name"]}
|
|
rules={[{ required: true }]}
|
|
>
|
|
<Select style={{ minWidth: "15rem" }} onSelect={(value) => handlePayerSelect(value, index)}>
|
|
{bodyshop.cdk_configuration?.payers?.map((payer) => (
|
|
<Select.Option key={payer.name}>{payer.name}</Select.Option>
|
|
))}
|
|
</Select>
|
|
</Form.Item>
|
|
</Col>
|
|
|
|
<Col xs={24} sm={12} md={8} lg={6}>
|
|
<Form.Item
|
|
label={t("jobs.fields.dms.payer.dms_acctnumber")}
|
|
name={[field.name, "dms_acctnumber"]}
|
|
rules={[{ required: true }]}
|
|
>
|
|
<Input disabled />
|
|
</Form.Item>
|
|
</Col>
|
|
|
|
<Col xs={24} sm={12} md={8} lg={5}>
|
|
<Form.Item
|
|
label={t("jobs.fields.dms.payer.amount")}
|
|
name={[field.name, "amount"]}
|
|
rules={[{ required: true }]}
|
|
>
|
|
<CurrencyInput min={0} />
|
|
</Form.Item>
|
|
</Col>
|
|
|
|
<Col xs={24} sm={12} md={10} lg={7}>
|
|
<Form.Item
|
|
label={
|
|
<div>
|
|
{t("jobs.fields.dms.payer.controlnumber")}{" "}
|
|
<Dropdown
|
|
trigger={["click"]}
|
|
menu={{
|
|
items:
|
|
bodyshop.cdk_configuration.controllist?.map((key, idx) => ({
|
|
key: idx,
|
|
label: key.name,
|
|
onClick: () => {
|
|
form.setFieldsValue({
|
|
payers: (form.getFieldValue("payers") || []).map((row, mapIndex) => {
|
|
if (index !== mapIndex) return row;
|
|
return { ...row, controlnumber: key.controlnumber };
|
|
})
|
|
});
|
|
}
|
|
})) ?? []
|
|
}}
|
|
>
|
|
{/* Anchor trigger restored (was missing) */}
|
|
<a href="#" onClick={(e) => e.preventDefault()}>
|
|
<DownOutlined />
|
|
</a>
|
|
</Dropdown>
|
|
</div>
|
|
}
|
|
name={[field.name, "controlnumber"]}
|
|
rules={[{ required: true }]}
|
|
>
|
|
<Input />
|
|
</Form.Item>
|
|
</Col>
|
|
|
|
<Col xs={24}>
|
|
<Form.Item shouldUpdate noStyle>
|
|
{() => {
|
|
const payers = form.getFieldValue("payers");
|
|
const row = payers?.[index];
|
|
const cdkPayer =
|
|
bodyshop.cdk_configuration.payers &&
|
|
bodyshop.cdk_configuration.payers.find((i) => i && row && i.name === row.name);
|
|
if (i18n.exists(`jobs.fields.${cdkPayer?.control_type}`))
|
|
return <div>{cdkPayer && t(`jobs.fields.${cdkPayer?.control_type}`)}</div>;
|
|
else if (i18n.exists(`jobs.fields.dms.control_type.${cdkPayer?.control_type}`)) {
|
|
return (
|
|
<div>{cdkPayer && t(`jobs.fields.dms.control_type.${cdkPayer?.control_type}`)}</div>
|
|
);
|
|
} else {
|
|
return null;
|
|
}
|
|
}}
|
|
</Form.Item>
|
|
</Col>
|
|
</Row>
|
|
</Card>
|
|
))}
|
|
<Form.Item>
|
|
<Button
|
|
disabled={!(fields.length < 3)}
|
|
onClick={() => {
|
|
if (fields.length < 3) add();
|
|
}}
|
|
style={{ width: "100%" }}
|
|
>
|
|
{t("jobs.actions.dms.addpayer")}
|
|
</Button>
|
|
</Form.Item>
|
|
</div>
|
|
)}
|
|
</Form.List>
|
|
</>
|
|
)}
|
|
|
|
{/* Validation gates & summary (unchanged logic) */}
|
|
<Form.Item shouldUpdate>
|
|
{() => {
|
|
// 1) Sum allocated payers
|
|
let totalAllocated = Dinero();
|
|
const payers = form.getFieldValue("payers") || [];
|
|
payers.forEach((payer) => {
|
|
totalAllocated = totalAllocated.add(Dinero({ amount: Math.round((payer?.amount || 0) * 100) }));
|
|
});
|
|
|
|
// 2) Subtotal from socket.allocationsSummary (existing behavior)
|
|
const totals =
|
|
socket && socket.allocationsSummary
|
|
? socket.allocationsSummary.reduce(
|
|
(acc, val) => ({
|
|
totalSale: acc.totalSale.add(Dinero(val.sale)),
|
|
totalCost: acc.totalCost.add(Dinero(val.cost))
|
|
}),
|
|
{ totalSale: Dinero(), totalCost: Dinero() }
|
|
)
|
|
: { totalSale: Dinero(), totalCost: Dinero() };
|
|
|
|
const discrep = totals ? totals.totalSale.subtract(totalAllocated) : Dinero();
|
|
|
|
// 3) Validation gates
|
|
const advisorOk = dms !== "rr" || !!form.getFieldValue("advisorNo");
|
|
|
|
// Require at least one complete payer row for non-RR
|
|
const payersOk =
|
|
dms === "rr" ||
|
|
(payers.length > 0 &&
|
|
payers.every((p) => p?.name && p.dms_acctnumber && (p.amount ?? "") !== "" && p.controlnumber));
|
|
|
|
// 4) Disable rules:
|
|
// - For non-RR: must have summary and zero discrepancy
|
|
// - For RR: ignore discrepancy rule, but require advisor
|
|
const nonRrDiscrepancyGate = dms !== "rr" && (socket.allocationsSummary ? discrep.getAmount() !== 0 : true);
|
|
|
|
const disablePost = !advisorOk || !payersOk || nonRrDiscrepancyGate;
|
|
|
|
return (
|
|
<Space size="large" wrap align="center">
|
|
<Statistic
|
|
title={t("jobs.labels.subtotal")}
|
|
value={(totals ? totals.totalSale : Dinero()).toFormat()}
|
|
/>
|
|
<Typography.Title>-</Typography.Title>
|
|
<Statistic title={t("jobs.labels.dms.totalallocated")} value={totalAllocated.toFormat()} />
|
|
<Typography.Title>=</Typography.Title>
|
|
<Statistic
|
|
title={t("jobs.labels.dms.notallocated")}
|
|
valueStyle={{ color: discrep.getAmount() === 0 ? "green" : "red" }}
|
|
value={discrep.toFormat()}
|
|
/>
|
|
<Button disabled={disablePost} htmlType="submit">
|
|
{t("jobs.actions.dms.post")}
|
|
</Button>
|
|
</Space>
|
|
);
|
|
}}
|
|
</Form.Item>
|
|
</Form>
|
|
</Card>
|
|
);
|
|
}
|