admin/bodyshop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merged in feature/IO-3499-React-19 (pull request #2840)

Browse Source 
Feature/IO-3499 React 19
This commit is contained in:
Dave Richer
2026-01-16 22:16:02 +00:00
parent 6f8b91d9d0 ddf4256e58
commit fe8200dadd
9 changed files with 408 additions and 352 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
client/src/components/job-close-ro-guard/job-close-ro-gaurd.labor.jsx
View File

@@ -16,11 +16,15 @@ const mapDispatchToProps = () => ({});
export default connect(mapStateToProps, mapDispatchToProps)(JobCloseRoGuardLabor); export default connect(mapStateToProps, mapDispatchToProps)(JobCloseRoGuardLabor);
export function JobCloseRoGuardLabor({ job, bodyshop, warningCallback }) { export function JobCloseRoGuardLabor({ job, bodyshop, warningCallback }) {
const jobId = job?.id ?? null;
const { loading, error, data, refetch } = useQuery(GET_LINE_TICKET_BY_PK, { const { loading, error, data, refetch } = useQuery(GET_LINE_TICKET_BY_PK, {
variables: { id: job.id }, variables: { id: jobId },
skip: !jobId,
fetchPolicy: "network-only", fetchPolicy: "network-only",
nextFetchPolicy: "network-only" nextFetchPolicy: "network-only"
}); });
const { const {
treatments: { Enhanced_Payroll } treatments: { Enhanced_Payroll }
} = useTreatmentsWithConfig({ } = useTreatmentsWithConfig({
@@ -29,12 +33,13 @@ export function JobCloseRoGuardLabor({ job, bodyshop, warningCallback }) {
splitKey: bodyshop.imexshopid splitKey: bodyshop.imexshopid
}); });
if (!jobId) return <LoadingSkeleton />;
if (loading) return <LoadingSkeleton />; if (loading) return <LoadingSkeleton />;
if (error) return <AlertComponent title={error.message} type="error" />; if (error) return <AlertComponent title={error.message} type="error" />;
return Enhanced_Payroll.treatment === "on" ? ( return Enhanced_Payroll.treatment === "on" ? (
<PayrollLaborAllocationsTable <PayrollLaborAllocationsTable
jobId={job.id} jobId={jobId}
timetickets={data ? data.timetickets : []} timetickets={data ? data.timetickets : []}
refetch={refetch} refetch={refetch}
adjustments={data ? data.jobs_by_pk.lbr_adjustments : []} adjustments={data ? data.jobs_by_pk.lbr_adjustments : []}
@@ -43,7 +48,7 @@ export function JobCloseRoGuardLabor({ job, bodyshop, warningCallback }) {
/> />
) : ( ) : (
<LaborAllocationsTableComponent <LaborAllocationsTableComponent
jobId={job.id} jobId={jobId}
joblines={data ? data.joblines : []} joblines={data ? data.joblines : []}
timetickets={data ? data.timetickets : []} timetickets={data ? data.timetickets : []}
refetch={refetch} refetch={refetch}

310
client/src/components/job-employee-assignments/job-employee-assignments.component.jsx
View File

@@ -13,9 +13,7 @@ const mapStateToProps = createStructuredSelector({
bodyshop: selectBodyshop, bodyshop: selectBodyshop,
jobRO: selectJobReadOnly jobRO: selectJobReadOnly
}); });
const mapDispatchToProps = () => ({ const mapDispatchToProps = () => ({});
//setUserLanguage: language => dispatch(setUserLanguage(language))
});
const iconStyle = { marginLeft: ".3rem" }; const iconStyle = { marginLeft: ".3rem" };
@@ -31,163 +29,199 @@ export function JobEmployeeAssignments({
loading loading
}) { }) {
const { t } = useTranslation(); const { t } = useTranslation();
const [assignment, setAssignment] = useState({
operation: null,
employeeid: null
});
const [visibility, setVisibility] = useState(false);
const onChange = (value, option) => { // Which assignment popover is currently open: "body" | "prep" | "refinish" | "csr" | null
setAssignment({ ...assignment, employeeid: value, name: option.name }); const [openOperation, setOpenOperation] = useState(null);
// Current selection inside the popover
const [selected, setSelected] = useState({ employeeid: null, name: null });
const employeeOptions = (bodyshop?.employees || [])
.filter((emp) => emp.active)
.map((emp) => ({
value: emp.id,
label: `${emp.first_name} ${emp.last_name}`
}));
const getPopupContainer = () => document.querySelector("#time-ticket-modal") || document.body;
const openFor = (operation) => {
if (jobRO) return;
setSelected({ employeeid: null, name: null });
setOpenOperation(operation);
}; };
const popContent = ( const close = () => {
<Row gutter={[16, 16]}> setOpenOperation(null);
<Col span={24}> setSelected({ employeeid: null, name: null });
<Select };
id="employeeSelector"
showSearc={{ const renderAssigner = (operation) => {
optionFilterProp: "children", if (jobRO) {
filterOption: (input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0 return <PlusCircleFilled disabled style={iconStyle} />;
}} }
style={{ width: 200 }}
onChange={onChange} const popContent = (
> <Row gutter={[16, 16]}>
{bodyshop.employees <Col span={24}>
.filter((emp) => emp.active) <Select
.map((emp) => ( style={{ width: 220 }}
<Select.Option value={emp.id} key={emp.id} name={`${emp.first_name} ${emp.last_name}`}> options={employeeOptions}
{`${emp.first_name} ${emp.last_name}`} value={selected.employeeid}
</Select.Option> placeholder={t("employees.actions.select")}
))} allowClear
</Select> showSearch={{
</Col> optionFilterProp: "label"
<Col span={24}>
<Space wrap>
<Button
type="primary"
disabled={!assignment.employeeid || jobRO}
onClick={() => {
handleAdd(assignment);
setVisibility(false);
}} }}
> onChange={(value, option) => {
{t("allocations.actions.assign")} if (!value) {
</Button> setSelected({ employeeid: null, name: null });
<Button onClick={() => setVisibility(false)}>Close</Button> return;
</Space> }
</Col> setSelected({ employeeid: value, name: option?.label || null });
</Row> }}
); />
</Col>
<Col span={24}>
<Space wrap>
<Button
type="primary"
disabled={!selected.employeeid}
onClick={() => {
handleAdd({ operation, employeeid: selected.employeeid, name: selected.name });
close();
}}
>
{t("allocations.actions.assign")}
</Button>
<Button onClick={close}>Close</Button>
</Space>
</Col>
</Row>
);
return (
<Popover
destroyOnHidden
trigger="click"
open={openOperation === operation}
onOpenChange={(open) => {
// Important: let Popover drive close on outside click
if (open) openFor(operation);
else close();
}}
content={popContent}
getPopupContainer={getPopupContainer}
>
<span
role="button"
tabIndex={0}
onClick={(e) => {
// Prevent the click from being re-interpreted as "outside"
e.preventDefault();
e.stopPropagation();
openFor(operation);
}}
onKeyDown={(e) => {
if (e.key === "Enter" || e.key === " ") {
e.preventDefault();
openFor(operation);
}
}}
style={{ display: "inline-flex", alignItems: "center" }}
>
<PlusCircleFilled style={iconStyle} />
</span>
</Popover>
);
};
return ( return (
<Popover destroyOnHidden content={popContent} open={visibility}> <Spin spinning={loading}>
<Spin spinning={loading}> <DataLabel label={t("jobs.fields.employee_body")}>
<DataLabel label={t("jobs.fields.employee_body")}> {body ? (
{body ? ( <div>
<div> <span>{`${body.first_name || ""} ${body.last_name || ""}`}</span>
<span>{`${body.first_name || ""} ${body.last_name || ""}`}</span> <DeleteFilled
<DeleteFilled
operation="body"
disabled={jobRO}
style={iconStyle}
onClick={() => !jobRO && handleRemove("body")}
/>
</div>
) : (
<PlusCircleFilled
disabled={jobRO} disabled={jobRO}
style={iconStyle} style={iconStyle}
onClick={() => { onClick={(e) => {
if (!jobRO) { e.preventDefault();
setAssignment({ operation: "body" }); e.stopPropagation();
setVisibility(true); if (!jobRO) handleRemove("body");
}
}} }}
/> />
)} </div>
</DataLabel> ) : (
<DataLabel label={t("jobs.fields.employee_prep")}> renderAssigner("body")
{prep ? ( )}
<div> </DataLabel>
<span>{`${prep.first_name || ""} ${prep.last_name || ""}`}</span>
<DeleteFilled <DataLabel label={t("jobs.fields.employee_prep")}>
disabled={jobRO} {prep ? (
style={iconStyle} <div>
operation="prep" <span>{`${prep.first_name || ""} ${prep.last_name || ""}`}</span>
onClick={() => !jobRO && handleRemove("prep")} <DeleteFilled
/>
</div>
) : (
<PlusCircleFilled
disabled={jobRO} disabled={jobRO}
style={iconStyle} style={iconStyle}
onClick={() => { onClick={(e) => {
if (!jobRO) { e.preventDefault();
setAssignment({ operation: "prep" }); e.stopPropagation();
setVisibility(true); if (!jobRO) handleRemove("prep");
}
}} }}
/> />
)} </div>
</DataLabel> ) : (
<DataLabel label={t("jobs.fields.employee_refinish")}> renderAssigner("prep")
{refinish ? ( )}
<div> </DataLabel>
<span>{`${refinish.first_name || ""} ${refinish.last_name || ""}`}</span>
<DeleteFilled <DataLabel label={t("jobs.fields.employee_refinish")}>
disabled={jobRO} {refinish ? (
style={iconStyle} <div>
operation="refinish" <span>{`${refinish.first_name || ""} ${refinish.last_name || ""}`}</span>
onClick={() => !jobRO && handleRemove("refinish")} <DeleteFilled
/>
</div>
) : (
<PlusCircleFilled
disabled={jobRO} disabled={jobRO}
style={iconStyle} style={iconStyle}
onClick={() => { onClick={(e) => {
if (!jobRO) { e.preventDefault();
setAssignment({ operation: "refinish" }); e.stopPropagation();
setVisibility(true); if (!jobRO) handleRemove("refinish");
}
}} }}
/> />
)} </div>
</DataLabel> ) : (
<DataLabel renderAssigner("refinish")
label={t( )}
InstanceRenderManager({ </DataLabel>
imex: "jobs.fields.employee_csr",
rome: "jobs.fields.employee_csr_writer" <DataLabel
}) label={t(
)} InstanceRenderManager({
> imex: "jobs.fields.employee_csr",
{csr ? ( rome: "jobs.fields.employee_csr_writer"
<div> })
<span>{`${csr.first_name || ""} ${csr.last_name || ""}`}</span> )}
<DeleteFilled >
disabled={jobRO} {csr ? (
style={iconStyle} <div>
operation="csr" <span>{`${csr.first_name || ""} ${csr.last_name || ""}`}</span>
onClick={() => !jobRO && handleRemove("csr")} <DeleteFilled
/>
</div>
) : (
<PlusCircleFilled
disabled={jobRO} disabled={jobRO}
style={iconStyle} style={iconStyle}
onClick={() => { onClick={(e) => {
if (!jobRO) { e.preventDefault();
setAssignment({ operation: "csr" }); e.stopPropagation();
setVisibility(true); if (!jobRO) handleRemove("csr");
}
}} }}
/> />
)} </div>
</DataLabel> ) : (
</Spin> renderAssigner("csr")
</Popover> )}
</DataLabel>
</Spin>
); );
} }

103
client/src/components/job-employee-assignments/job-employee-assignments.container.jsx
View File

@@ -11,9 +11,7 @@ import { insertAuditTrail } from "../../redux/application/application.actions";
import AuditTrailMapping from "../../utils/AuditTrailMappings"; import AuditTrailMapping from "../../utils/AuditTrailMappings";
import { useNotification } from "../../contexts/Notifications/notificationContext.jsx"; import { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
const mapStateToProps = createStructuredSelector({ const mapStateToProps = createStructuredSelector({});
//currentUser: selectCurrentUser
});
const mapDispatchToProps = (dispatch) => ({ const mapDispatchToProps = (dispatch) => ({
insertAuditTrail: ({ jobid, operation, type }) => dispatch(insertAuditTrail({ jobid, operation, type })) insertAuditTrail: ({ jobid, operation, type }) => dispatch(insertAuditTrail({ jobid, operation, type }))
}); });
@@ -26,55 +24,69 @@ export function JobEmployeeAssignmentsContainer({ job, refetch, insertAuditTrail
const notification = useNotification(); const notification = useNotification();
const handleAdd = async (assignment) => { const handleAdd = async (assignment) => {
setLoading(true);
const { operation, employeeid, name } = assignment; const { operation, employeeid, name } = assignment;
logImEXEvent("job_assign_employee", { operation }); const empAssignment = determineFieldName(operation);
let empAssignment = determineFieldName(operation); if (!job?.id || !empAssignment || !employeeid) return;
const result = await updateJob({
variables: { jobId: job.id, job: { [empAssignment]: employeeid } }
});
if (refetch) refetch();
if (!result.errors) {
insertAuditTrail({
jobid: job.id,
operation: AuditTrailMapping.jobassignmentchange(operation, name),
type: "jobassignmentchange"
});
} else {
notification.error({
title: t("jobs.errors.assigning", {
message: JSON.stringify(result.errors)
})
});
}
setLoading(false);
};
const handleRemove = async (operation) => {
setLoading(true); setLoading(true);
logImEXEvent("job_unassign_employee", { operation }); try {
logImEXEvent("job_assign_employee", { operation });
let empAssignment = determineFieldName(operation); const result = await updateJob({
const result = await updateJob({ variables: { jobId: job.id, job: { [empAssignment]: employeeid } }
variables: { jobId: job.id, job: { [empAssignment]: null } } });
});
if (!result.errors) { if (typeof refetch === "function") await refetch();
insertAuditTrail({
jobid: job.id, if (!result.errors) {
operation: AuditTrailMapping.jobassignmentremoved(operation), insertAuditTrail({
type: "jobassignmentremoved" jobid: job.id,
}); operation: AuditTrailMapping.jobassignmentchange(operation, name),
} else { type: "jobassignmentchange"
notification.error({ });
title: t("jobs.errors.assigning", { } else {
message: JSON.stringify(result.errors) notification.error({
}) title: t("jobs.errors.assigning", {
}); message: JSON.stringify(result.errors)
})
});
}
} finally {
setLoading(false);
}
};
const handleRemove = async (operation) => {
const empAssignment = determineFieldName(operation);
if (!job?.id || !empAssignment) return;
setLoading(true);
try {
logImEXEvent("job_unassign_employee", { operation });
const result = await updateJob({
variables: { jobId: job.id, job: { [empAssignment]: null } }
});
if (typeof refetch === "function") await refetch();
if (!result.errors) {
insertAuditTrail({
jobid: job.id,
operation: AuditTrailMapping.jobassignmentremoved(operation),
type: "jobassignmentremoved"
});
} else {
notification.error({
title: t("jobs.errors.assigning", {
message: JSON.stringify(result.errors)
})
});
}
} finally {
setLoading(false);
} }
setLoading(false);
}; };
return ( return (
@@ -102,7 +114,6 @@ const determineFieldName = (operation) => {
return "employee_csr"; return "employee_csr";
case "refinish": case "refinish":
return "employee_refinish"; return "employee_refinish";
default: default:
return null; return null;
} }

8
client/src/components/jobs-detail-labor/jobs-detail-labor.container.jsx
View File

@@ -4,9 +4,11 @@ import AlertComponent from "../alert/alert.component";
import JobsDetailLaborComponent from "./jobs-detail-labor.component"; import JobsDetailLaborComponent from "./jobs-detail-labor.component";
export default function JobsDetailLaborContainer({ jobId, techConsole, job }) { export default function JobsDetailLaborContainer({ jobId, techConsole, job }) {
const id = jobId ?? null;
const { loading, error, data, refetch } = useQuery(GET_LINE_TICKET_BY_PK, { const { loading, error, data, refetch } = useQuery(GET_LINE_TICKET_BY_PK, {
variables: { id: jobId }, variables: { id },
skip: !jobId, skip: !id,
fetchPolicy: "network-only", fetchPolicy: "network-only",
nextFetchPolicy: "network-only" nextFetchPolicy: "network-only"
}); });
@@ -16,7 +18,7 @@ export default function JobsDetailLaborContainer({ jobId, techConsole, job }) {
return ( return (
<JobsDetailLaborComponent <JobsDetailLaborComponent
loading={loading} loading={loading}
jobId={jobId} jobId={id}
timetickets={data ? data.timetickets : []} timetickets={data ? data.timetickets : []}
joblines={data ? data.joblines : []} joblines={data ? data.joblines : []}
refetch={refetch} refetch={refetch}

31
client/src/components/tech-job-clock-out-button/tech-job-clock-out-button.component.jsx
View File

@@ -37,6 +37,7 @@ export function TechClockOffButton({
const [updateJobStatus] = useMutation(UPDATE_JOB_STATUS); const [updateJobStatus] = useMutation(UPDATE_JOB_STATUS);
const notification = useNotification(); const notification = useNotification();
const [form] = Form.useForm(); const [form] = Form.useForm();
const { const {
treatments: { Enhanced_Payroll } treatments: { Enhanced_Payroll }
} = useTreatmentsWithConfig({ } = useTreatmentsWithConfig({
@@ -45,14 +46,15 @@ export function TechClockOffButton({
splitKey: bodyshop.imexshopid splitKey: bodyshop.imexshopid
}); });
const { queryLoading, data: lineTicketData } = useQuery(GET_LINE_TICKET_BY_PK, { const id = jobId ?? null;
variables: {
id: jobId const { loading: queryLoading, data: lineTicketData } = useQuery(GET_LINE_TICKET_BY_PK, {
}, variables: { id },
skip: !jobId, skip: !id,
fetchPolicy: "network-only", fetchPolicy: "network-only",
nextFetchPolicy: "network-only" nextFetchPolicy: "network-only"
}); });
const { t } = useTranslation(); const { t } = useTranslation();
const emps = bodyshop.employees.filter((e) => e.id === technician?.id)[0]; const emps = bodyshop.employees.filter((e) => e.id === technician?.id)[0];
@@ -63,6 +65,7 @@ export function TechClockOffButton({
const status = values.status; const status = values.status;
delete values.status; delete values.status;
setLoading(true); setLoading(true);
const result = await updateTimeticket({ const result = await updateTimeticket({
variables: { variables: {
timeticketId: timeTicketId, timeticketId: timeTicketId,
@@ -95,10 +98,11 @@ export function TechClockOffButton({
title: t("timetickets.successes.clockedout") title: t("timetickets.successes.clockedout")
}); });
} }
if (!isShiftTicket) { if (!isShiftTicket) {
const job_update_result = await updateJobStatus({ const job_update_result = await updateJobStatus({
variables: { variables: {
jobId: jobId, jobId: id,
status: status status: status
} }
}); });
@@ -115,6 +119,7 @@ export function TechClockOffButton({
}); });
} }
} }
setLoading(false); setLoading(false);
if (completedCallback) completedCallback(); if (completedCallback) completedCallback();
}; };
@@ -139,7 +144,6 @@ export function TechClockOffButton({
rules={[ rules={[
{ {
required: true required: true
//message: t("general.validation.required"),
} }
]} ]}
> >
@@ -151,7 +155,6 @@ export function TechClockOffButton({
rules={[ rules={[
{ {
required: true required: true
//message: t("general.validation.required"),
}, },
({ getFieldValue }) => ({ ({ getFieldValue }) => ({
validator(rule, value) { validator(rule, value) {
@@ -179,9 +182,7 @@ export function TechClockOffButton({
if (value > costCenterDiff) if (value > costCenterDiff)
return Promise.reject(t("timetickets.validation.hoursenteredmorethanavailable")); return Promise.reject(t("timetickets.validation.hoursenteredmorethanavailable"));
else { return Promise.resolve();
return Promise.resolve();
}
} }
}) })
]} ]}
@@ -190,13 +191,13 @@ export function TechClockOffButton({
</Form.Item> </Form.Item>
</div> </div>
) : null} ) : null}
<Form.Item <Form.Item
name="cost_center" name="cost_center"
label={t("timetickets.fields.cost_center")} label={t("timetickets.fields.cost_center")}
rules={[ rules={[
{ {
required: true required: true
//message: t("general.validation.required"),
} }
]} ]}
> >
@@ -228,7 +229,6 @@ export function TechClockOffButton({
rules={[ rules={[
{ {
required: true required: true
//message: t("general.validation.required"),
} }
]} ]}
> >
@@ -239,12 +239,15 @@ export function TechClockOffButton({
</Select> </Select>
</Form.Item> </Form.Item>
)} )}
<Button type="primary" htmlType="submit" loading={loading}> <Button type="primary" htmlType="submit" loading={loading}>
{t("general.actions.save")} {t("general.actions.save")}
</Button> </Button>
<TechJobClockoutDelete completedCallback={completedCallback} timeTicketId={timeTicketId} /> <TechJobClockoutDelete completedCallback={completedCallback} timeTicketId={timeTicketId} />
{!isShiftTicket && ( {!isShiftTicket && (
<LaborAllocationContainer jobid={jobId || null} loading={queryLoading} lineTicketData={lineTicketData} /> <LaborAllocationContainer jobid={id || null} loading={queryLoading} lineTicketData={lineTicketData} />
)} )}
</Space> </Space>
</Form> </Form>

288
client/src/components/time-ticket-modal/time-ticket-modal.component.jsx
View File

@@ -1,7 +1,7 @@
import { useLazyQuery } from "@apollo/client/react"; import { useLazyQuery } from "@apollo/client/react";
import { useTreatmentsWithConfig } from "@splitsoftware/splitio-react"; import { useTreatmentsWithConfig } from "@splitsoftware/splitio-react";
import { Card, Form, Input, InputNumber, Select, Space, Switch } from "antd"; import { Card, Form, Input, InputNumber, Select, Space, Switch } from "antd";
import { useEffect } from "react"; import { useEffect, useRef } from "react";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { connect } from "react-redux"; import { connect } from "react-redux";
import { createStructuredSelector } from "reselect"; import { createStructuredSelector } from "reselect";
@@ -40,6 +40,7 @@ export function TimeTicketModalComponent({
isOpen isOpen
}) { }) {
const { t } = useTranslation(); const { t } = useTranslation();
const { const {
treatments: { Enhanced_Payroll } treatments: { Enhanced_Payroll }
} = useTreatmentsWithConfig({ } = useTreatmentsWithConfig({
@@ -48,49 +49,68 @@ export function TimeTicketModalComponent({
splitKey: bodyshop.imexshopid splitKey: bodyshop.imexshopid
}); });
const [loadLineTicketData, { called, loading, data: lineTicketData }] = useLazyQuery(GET_LINE_TICKET_BY_PK, { const [loadLineTicketData, { loading, data: lineTicketData }] = useLazyQuery(GET_LINE_TICKET_BY_PK, {
fetchPolicy: "network-only", fetchPolicy: "network-only",
nextFetchPolicy: "network-only" nextFetchPolicy: "network-only"
}); });
// Watch the jobid field so we can refetch the bottom section without relying on jobid changes
const watchedJobId = Form.useWatch("jobid", form); const watchedJobId = Form.useWatch("jobid", form);
// Local mutable memory: dedupe jobid-driven fetches without re-rendering.
const lastFetchedJobIdRef = useRef(null);
// Reset + fetch when job changes (never during render)
useEffect(() => {
if (!isOpen) {
lastFetchedJobIdRef.current = null;
return;
}
if (!watchedJobId) {
lastFetchedJobIdRef.current = null;
return;
}
if (lastFetchedJobIdRef.current === watchedJobId) return;
lastFetchedJobIdRef.current = watchedJobId;
loadLineTicketData({ variables: { id: watchedJobId } });
}, [isOpen, watchedJobId, loadLineTicketData]);
// Force refresh (e.g., after Save / external refresh bump)
useEffect(() => { useEffect(() => {
if (!isOpen) return; if (!isOpen) return;
if (!watchedJobId) return; if (!watchedJobId) return;
if (!lineTicketRefreshKey) return; if (lineTicketRefreshKey === 0) return;
loadLineTicketData({ id: watchedJobId }); loadLineTicketData({ variables: { id: watchedJobId } });
}, [lineTicketRefreshKey, watchedJobId, isOpen]); }, [lineTicketRefreshKey, isOpen, watchedJobId, loadLineTicketData]);
const CostCenterSelect = ({ emps, value, ...props }) => { const CostCenterSelect = ({ emps, value, ...props }) => (
return ( <Select
<Select value={value === "timetickets.labels.shift" ? t(value) : value}
value={value === "timetickets.labels.shift" ? t(value) : value} {...props}
{...props} disabled={value === "timetickets.labels.shift" || disabled}
disabled={value === "timetickets.labels.shift" || disabled} >
> {emps &&
{emps && emps.rates.map((item) => (
emps.rates.map((item) => ( <Select.Option key={item.cost_center} value={item.cost_center}>
<Select.Option key={item.cost_center} value={item.cost_center}> {item.cost_center === "timetickets.labels.shift"
{item.cost_center === "timetickets.labels.shift" ? t(item.cost_center)
? t(item.cost_center) : bodyshop.cdk_dealerid ||
: bodyshop.cdk_dealerid || bodyshop.pbs_serialnumber ||
bodyshop.pbs_serialnumber || bodyshop.rr_dealerid ||
bodyshop.rr_dealerid || Enhanced_Payroll.treatment === "on"
Enhanced_Payroll.treatment === "on" ? t(`joblines.fields.lbr_types.${item.cost_center.toUpperCase()}`)
? t(`joblines.fields.lbr_types.${item.cost_center.toUpperCase()}`) : item.cost_center}
: item.cost_center} </Select.Option>
</Select.Option> ))}
))} </Select>
</Select> );
);
};
const MemoInput = ({ value, ...props }) => { const MemoInput = ({ value, ...props }) => (
return <Input value={value?.startsWith("timetickets.labels") ? t(value) : value} {...props} />; <Input value={value?.startsWith("timetickets.labels") ? t(value) : value} {...props} />
}; );
return ( return (
<div> <div>
@@ -102,8 +122,7 @@ export function TimeTicketModalComponent({
label={t("timetickets.fields.ro_number")} label={t("timetickets.fields.ro_number")}
rules={[ rules={[
{ {
required: !(form.getFieldValue("cost_center") === "timetickets.labels.shift") required: form.getFieldValue("cost_center") !== "timetickets.labels.shift"
//message: t("general.validation.required"),
} }
]} ]}
> >
@@ -115,25 +134,25 @@ export function TimeTicketModalComponent({
</Form.Item> </Form.Item>
)} )}
</Form.Item> </Form.Item>
<Form.Item <Form.Item
label={t("timetickets.fields.date")} label={t("timetickets.fields.date")}
name="date" name="date"
rules={[ rules={[
{ {
required: true required: true
//message: t("general.validation.required"),
} }
]} ]}
> >
<DateTimePicker isDateOnly /> <DateTimePicker isDateOnly />
</Form.Item> </Form.Item>
<Form.Item <Form.Item
name="employeeid" name="employeeid"
label={t("timetickets.fields.employee")} label={t("timetickets.fields.employee")}
rules={[ rules={[
{ {
required: true required: true
//message: t("general.validation.required"),
} }
]} ]}
> >
@@ -141,29 +160,23 @@ export function TimeTicketModalComponent({
disabled={employeeSelectDisabled || disabled} disabled={employeeSelectDisabled || disabled}
options={employeeAutoCompleteOptions} options={employeeAutoCompleteOptions}
onSelect={(value) => { onSelect={(value) => {
const emps = employeeAutoCompleteOptions && employeeAutoCompleteOptions.filter((e) => e.id === value)[0]; const emps = employeeAutoCompleteOptions?.find((e) => e.id === value);
form.setFieldsValue({ flat_rate: emps?.flat_rate }); form.setFieldsValue({ flat_rate: emps?.flat_rate });
}} }}
/> />
</Form.Item> </Form.Item>
<Form.Item shouldUpdate={(prev, cur) => prev.employeeid !== cur.employeeid}> <Form.Item shouldUpdate={(prev, cur) => prev.employeeid !== cur.employeeid}>
{() => { {() => {
const employeeId = form.getFieldValue("employeeid"); const employeeId = form.getFieldValue("employeeid");
const emps = const emps = employeeAutoCompleteOptions?.find((e) => e.id === employeeId);
employeeAutoCompleteOptions && employeeAutoCompleteOptions.filter((e) => e.id === employeeId)[0];
return ( return (
<Form.Item <Form.Item
name="cost_center" name="cost_center"
label={t("timetickets.fields.cost_center")} label={t("timetickets.fields.cost_center")}
valuePropName="value" valuePropName="value"
rules={[ rules={[{ required: true }]}
{
required: true
//message: t("general.validation.required"),
}
]}
> >
<CostCenterSelect emps={emps} /> <CostCenterSelect emps={emps} />
</Form.Item> </Form.Item>
@@ -185,52 +198,46 @@ export function TimeTicketModalComponent({
<LayoutFormRow> <LayoutFormRow>
<Form.Item shouldUpdate> <Form.Item shouldUpdate>
{() => ( {() => (
<> <Form.Item
<Form.Item label={t("timetickets.fields.productivehrs")}
label={t("timetickets.fields.productivehrs")} name="productivehrs"
name="productivehrs" rules={[
rules={[ ({ getFieldValue }) => ({
({ getFieldValue }) => ({ validator(rule, value) {
validator(rule, value) { if (!bodyshop.tt_enforce_hours_for_tech_console) return Promise.resolve();
if (!bodyshop.tt_enforce_hours_for_tech_console) { if (!value || getFieldValue("cost_center") === null || !lineTicketData) return Promise.resolve();
return Promise.resolve();
}
if (!value || getFieldValue("cost_center") === null || !lineTicketData) return Promise.resolve();
//Check the cost center, const totals = CalculateAllocationsTotals(
const totals = CalculateAllocationsTotals( bodyshop,
bodyshop, lineTicketData.joblines,
lineTicketData.joblines, lineTicketData.timetickets,
lineTicketData.timetickets, lineTicketData.jobs_by_pk.lbr_adjustments
lineTicketData.jobs_by_pk.lbr_adjustments );
);
const fieldTypeToCheck = bodyshopHasDmsKey(bodyshop) ? "mod_lbr_ty" : "cost_center"; const fieldTypeToCheck = bodyshopHasDmsKey(bodyshop) ? "mod_lbr_ty" : "cost_center";
const costCenterDiff = const costCenterDiff =
Math.round( Math.round(
totals.find((total) => total[fieldTypeToCheck] === getFieldValue("cost_center"))?.difference * (totals.find((total) => total[fieldTypeToCheck] === getFieldValue("cost_center"))?.difference ||
10 0) * 10
) / 10; ) / 10;
if (value > costCenterDiff) if (value > costCenterDiff) {
return Promise.reject(t("timetickets.validation.hoursenteredmorethanavailable")); return Promise.reject(t("timetickets.validation.hoursenteredmorethanavailable"));
else {
return Promise.resolve();
}
} }
}), return Promise.resolve();
{
required: form.getFieldValue("cost_center") !== "timetickets.labels.shift"
//message: t("general.validation.required"),
} }
]} }),
> {
<InputNumber precision={1} /> required: form.getFieldValue("cost_center") !== "timetickets.labels.shift"
</Form.Item> }
</> ]}
>
<InputNumber precision={1} />
</Form.Item>
)} )}
</Form.Item> </Form.Item>
<Form.Item <Form.Item
dependencies={["productivehrs"]} dependencies={["productivehrs"]}
label={t("timetickets.fields.actualhrs")} label={t("timetickets.fields.actualhrs")}
@@ -240,71 +247,68 @@ export function TimeTicketModalComponent({
async validator(rule, value) { async validator(rule, value) {
if (value) { if (value) {
const prodHrs = getFieldValue("productivehrs"); const prodHrs = getFieldValue("productivehrs");
if (prodHrs < 0 && value !== 0) return Promise.reject(t("timetickets.labels.zeroactualnegativeprod")); if (prodHrs < 0 && value !== 0) {
else { return Promise.reject(t("timetickets.labels.zeroactualnegativeprod"));
return Promise.resolve();
} }
} else {
return Promise.resolve();
} }
return Promise.resolve();
} }
}) })
]} ]}
> >
<InputNumber min={0} precision={1} /> <InputNumber min={0} precision={1} />
</Form.Item> </Form.Item>
{
<>
<Form.Item label={t("timetickets.fields.clockon")} name="clockon">
<FormDateTimePicker
minuteStep={5}
disabled={
disabled ||
!HasRbacAccess({
bodyshop,
authLevel,
action: "timetickets:shiftedit"
})
}
/>
</Form.Item>
<Form.Item
label={t("timetickets.fields.clockoff")}
name="clockoff"
rules={[
({ getFieldValue }) => ({
validator(rule, value) {
const clockon = getFieldValue("clockon");
if (!value) return Promise.resolve(); <>
if (!clockon && value) return Promise.reject(t("timetickets.validation.clockoffwithoutclockon")); <Form.Item label={t("timetickets.fields.clockon")} name="clockon">
// TODO - Verify this exists <FormDateTimePicker
if (value?.isSameOrAfter && !value.isSameOrAfter(clockon)) minuteStep={5}
return Promise.reject(t("timetickets.validation.clockoffmustbeafterclockon")); disabled={
disabled ||
return Promise.resolve(); !HasRbacAccess({
} bodyshop,
authLevel,
action: "timetickets:shiftedit"
}) })
]} }
> />
<FormDateTimePicker </Form.Item>
minuteStep={5}
disabled={ <Form.Item
disabled || label={t("timetickets.fields.clockoff")}
!HasRbacAccess({ name="clockoff"
bodyshop, rules={[
authLevel, ({ getFieldValue }) => ({
action: "timetickets:shiftedit" validator(rule, value) {
}) const clockon = getFieldValue("clockon");
if (!value) return Promise.resolve();
if (!clockon && value) return Promise.reject(t("timetickets.validation.clockoffwithoutclockon"));
if (value?.isSameOrAfter && !value.isSameOrAfter(clockon)) {
return Promise.reject(t("timetickets.validation.clockoffmustbeafterclockon"));
}
return Promise.resolve();
} }
/> })
</Form.Item> ]}
</> >
} <FormDateTimePicker
minuteStep={5}
disabled={
disabled ||
!HasRbacAccess({
bodyshop,
authLevel,
action: "timetickets:shiftedit"
})
}
/>
</Form.Item>
</>
<Form.Item label={t("timetickets.fields.memo")} name="memo"> <Form.Item label={t("timetickets.fields.memo")} name="memo">
<MemoInput /> <MemoInput />
</Form.Item> </Form.Item>
<Form.Item shouldUpdate> <Form.Item shouldUpdate>
{() => ( {() => (
<Form.Item <Form.Item
@@ -312,8 +316,7 @@ export function TimeTicketModalComponent({
label={t("timetickets.fields.ciecacode")} label={t("timetickets.fields.ciecacode")}
rules={[ rules={[
{ {
required: !form.getFieldValue("cost_center") === "timetickets.labels.shift" required: form.getFieldValue("cost_center") !== "timetickets.labels.shift"
//message: t("general.validation.required"),
} }
]} ]}
> >
@@ -323,15 +326,7 @@ export function TimeTicketModalComponent({
</Form.Item> </Form.Item>
</LayoutFormRow> </LayoutFormRow>
<Form.Item dependencies={["jobid"]}> <LaborAllocationContainer jobid={watchedJobId || null} loading={loading} lineTicketData={lineTicketData} />
{() => {
const jobid = form.getFieldValue("jobid");
if ((!called && jobid) || (jobid && lineTicketData?.jobs_by_pk?.id !== jobid && !loading)) {
loadLineTicketData({ id: jobid });
}
return <LaborAllocationContainer jobid={jobid || null} loading={loading} lineTicketData={lineTicketData} />;
}}
</Form.Item>
</div> </div>
); );
} }
@@ -341,17 +336,20 @@ export function LaborAllocationContainer({ jobid, loading, lineTicketData, hideT
if (loading) return <LoadingSkeleton />; if (loading) return <LoadingSkeleton />;
if (!lineTicketData) return null; if (!lineTicketData) return null;
if (!jobid) return null; if (!jobid) return null;
return ( return (
<Space orientation="vertical" style={{ width: "100%" }}> <Space orientation="vertical" style={{ width: "100%" }}>
<Card style={{ height: "100%" }} title={t("jobs.labels.employeeassignments")}> <Card style={{ height: "100%" }} title={t("jobs.labels.employeeassignments")}>
<JobEmployeeAssignmentsContainer job={lineTicketData.jobs_by_pk} /> <JobEmployeeAssignmentsContainer job={lineTicketData.jobs_by_pk} />
</Card> </Card>
<LaborAllocationsTable <LaborAllocationsTable
jobId={jobid} jobId={jobid}
joblines={lineTicketData.joblines} joblines={lineTicketData.joblines}
timetickets={lineTicketData.timetickets} timetickets={lineTicketData.timetickets}
adjustments={lineTicketData.jobs_by_pk.lbr_adjustments} adjustments={lineTicketData.jobs_by_pk.lbr_adjustments}
/> />
{!hideTimeTickets && ( {!hideTimeTickets && (
<TimeTicketList loading={loading} timetickets={jobid ? lineTicketData.timetickets : []} techConsole /> <TimeTicketList loading={loading} timetickets={jobid ? lineTicketData.timetickets : []} techConsole />
)} )}

3
client/src/translations/en_us/common.json
View File

@@ -1128,7 +1128,8 @@
"actions": { "actions": {
"addvacation": "Add Vacation", "addvacation": "Add Vacation",
"new": "New Employee", "new": "New Employee",
"newrate": "New Rate" "newrate": "New Rate",
"select": "Select Employee"
}, },
"errors": { "errors": {
"delete": "Error encountered while deleting employee. {{message}}", "delete": "Error encountered while deleting employee. {{message}}",

3
client/src/translations/es/common.json
View File

@@ -1128,7 +1128,8 @@
"actions": { "actions": {
"addvacation": "", "addvacation": "",
"new": "Nuevo empleado", "new": "Nuevo empleado",
"newrate": "" "newrate": "",
"select": ""
}, },
"errors": { "errors": {
"delete": "Se encontró un error al eliminar al empleado. {{message}}", "delete": "Se encontró un error al eliminar al empleado. {{message}}",

3
client/src/translations/fr/common.json
View File

@@ -1128,7 +1128,8 @@
"actions": { "actions": {
"addvacation": "", "addvacation": "",
"new": "Nouvel employé", "new": "Nouvel employé",
"newrate": "" "newrate": "",
"select": ""
}, },
"errors": { "errors": {
"delete": "Erreur rencontrée lors de la suppression de l'employé. {{message}}", "delete": "Erreur rencontrée lors de la suppression de l'employé. {{message}}",