feature/IO-3160 - RC-COLLAPSE-ISSUE:

This commit is contained in:
Dave Richer
2025-02-27 13:01:23 -05:00
parent 01b18a4a02
commit 3877462eed
10 changed files with 2182 additions and 1999 deletions

View File

@@ -75,6 +75,22 @@ class ErrorBoundary extends React.Component {
render() { render() {
const { t } = this.props; const { t } = this.props;
const { error, info } = this.state; const { error, info } = this.state;
const collapseItems = error
? [
{
key: "errors",
label: t("general.labels.errors"),
children: (
<div>
<strong>{error.message || "Unknown error"}</strong>
<div>{error.stack || "No stack trace available"}</div>
</div>
)
}
]
: [];
if (this.state.hasErrored === true) { if (this.state.hasErrored === true) {
logImEXEvent("error_boundary_rendered", { error, info }); logImEXEvent("error_boundary_rendered", { error, info });
@@ -122,14 +138,7 @@ class ErrorBoundary extends React.Component {
/> />
<Row> <Row>
<Col offset={6} span={12}> <Col offset={6} span={12}>
<Collapse bordered={false}> <Collapse bordered={false} items={collapseItems} />
<Collapse.Panel header={t("general.labels.errors")}>
<div>
<strong>{this.state.error.message}</strong>
</div>
<div>{this.state.error.stack}</div>
</Collapse.Panel>
</Collapse>
</Col> </Col>
</Row> </Row>
</div> </div>

View File

@@ -16,7 +16,6 @@ import InstanceRenderManager from "../../utils/instanceRenderMgr";
import JobCloseRoGuardTtLifecycle from "./job-close-ro-guard.tt-lifecycle"; import JobCloseRoGuardTtLifecycle from "./job-close-ro-guard.tt-lifecycle";
const mapStateToProps = createStructuredSelector({ const mapStateToProps = createStructuredSelector({
//currentUser: selectCurrentUser
bodyshop: selectBodyshop, bodyshop: selectBodyshop,
jobRO: selectJobReadOnly jobRO: selectJobReadOnly
}); });
@@ -40,34 +39,13 @@ export function JobCloseRoGuardContainer({ job, jobRO, bodyshop, form }) {
if (!bodyshop?.md_ro_guard?.enabled) return null; if (!bodyshop?.md_ro_guard?.enabled) return null;
return ( // Define collapse items for both panels
<> const collapseItems = [
{warnings.length > 0 && ( {
<Card key: "roguard",
title={ label: t("jobs.labels.roguard"),
<Space size="small"> children: (
<Badge count={warnings.length} /> <>
{t("jobs.labels.roguardwarnings")}
</Space>
}
>
<ul>
{warnings.map((w, index) => (
<li key={index}>
{bodyshop.md_ro_guard[`enforce_${w.key}`] && (
<Tooltip title={t("jobs.labels.ro_guard.enforced")}>
<LockOutlined style={{ color: "tomato", marginRight: "8px" }} />
</Tooltip>
)}
{w.warning}
</li>
))}
</ul>
</Card>
)}
<Collapse>
<Collapse.Panel forceRender key="roguard" header={t("jobs.labels.roguard")}>
<Row gutter={[32, 32]}> <Row gutter={[32, 32]}>
<Col span={24}> <Col span={24}>
<JobCloseRoGuardBills job={job} form={form} warningCallback={warningCallback} /> <JobCloseRoGuardBills job={job} form={form} warningCallback={warningCallback} />
@@ -85,7 +63,6 @@ export function JobCloseRoGuardContainer({ job, jobRO, bodyshop, form }) {
{InstanceRenderManager({ {InstanceRenderManager({
rome: ( rome: (
<Col md={24} lg={8}> <Col md={24} lg={8}>
{/* <JobCloseRoGuardSublet job={job} warningCallback={warningCallback} /> */}
<JobCloseRoGuardPpd job={job} warningCallback={warningCallback} /> <JobCloseRoGuardPpd job={job} warningCallback={warningCallback} />
</Col> </Col>
) )
@@ -214,16 +191,50 @@ export function JobCloseRoGuardContainer({ job, jobRO, bodyshop, form }) {
> >
<Input prefix={<LockOutlined />} type="password" placeholder="Password" disabled={jobRO} /> <Input prefix={<LockOutlined />} type="password" placeholder="Password" disabled={jobRO} />
</Form.Item> </Form.Item>
</Collapse.Panel> </>
),
forceRender: true // Preserve the forceRender prop from the original
},
{
key: "performance",
label: t("jobs.labels.performance"),
children: (
<Row gutter={[32, 32]}>
<Col className="ro-guard-col" span={24}>
<JobCloseRoGuardTtLifecycle job={job} />
</Col>
</Row>
)
}
];
<Collapse.Panel header={t("jobs.labels.performance")}> return (
<Row gutter={[32, 32]}> <>
<Col className="ro-guard-col" span={24}> {warnings.length > 0 && (
<JobCloseRoGuardTtLifecycle job={job} /> <Card
</Col> title={
</Row> <Space size="small">
</Collapse.Panel> <Badge count={warnings.length} />
</Collapse> {t("jobs.labels.roguardwarnings")}
</Space>
}
>
<ul>
{warnings.map((w, index) => (
<li key={index}>
{bodyshop.md_ro_guard[`enforce_${w.key}`] && (
<Tooltip title={t("jobs.labels.ro_guard.enforced")}>
<LockOutlined style={{ color: "tomato", marginRight: "8px" }} />
</Tooltip>
)}
{w.warning}
</li>
))}
</ul>
</Card>
)}
<Collapse items={collapseItems} />
</> </>
); );
} }

View File

@@ -27,7 +27,7 @@ const colSpan = {
export function JobsTotalsTableComponent({ jobRO, currentUser, job }) { export function JobsTotalsTableComponent({ jobRO, currentUser, job }) {
const { t } = useTranslation(); const { t } = useTranslation();
if (!!!job.job_totals) { if (!job.job_totals) {
return ( return (
<Card> <Card>
<Result title={t("jobs.errors.nofinancial")} extra={<JobCalculateTotals job={job} disabled={jobRO} />} /> <Result title={t("jobs.errors.nofinancial")} extra={<JobCalculateTotals job={job} disabled={jobRO} />} />
@@ -35,6 +35,29 @@ export function JobsTotalsTableComponent({ jobRO, currentUser, job }) {
); );
} }
// Define collapse items
const collapseItems = [
{
key: "json-tree-totals",
label: "JSON Tree Totals",
children: (
<div>
<pre>
{JSON.stringify(
{
CIECA: job.cieca_ttl && job.cieca_ttl.data,
CIECASTL: job.cieca_stl && job.cieca_stl.data,
ImEXCalc: job.job_totals
},
null,
2
)}
</pre>
</div>
)
}
];
return ( return (
<div> <div>
<Row gutter={[16, 16]}> <Row gutter={[16, 16]}>
@@ -68,23 +91,7 @@ export function JobsTotalsTableComponent({ jobRO, currentUser, job }) {
<Col span={24}> <Col span={24}>
<Card title="DEVELOPMENT USE ONLY"> <Card title="DEVELOPMENT USE ONLY">
<JobCalculateTotals job={job} disabled={jobRO} /> <JobCalculateTotals job={job} disabled={jobRO} />
<Collapse> <Collapse items={collapseItems} />
<Collapse.Panel header="JSON Tree Totals">
<div>
<pre>
{JSON.stringify(
{
CIECA: job.cieca_ttl && job.cieca_ttl.data,
CIECASTL: job.cieca_stl && job.cieca_stl.data,
ImEXCalc: job.job_totals
},
null,
2
)}
</pre>
</div>
</Collapse.Panel>
</Collapse>
</Card> </Card>
</Col> </Col>
)} )}

View File

@@ -20,7 +20,6 @@ import JobsMarkPstExempt from "../jobs-mark-pst-exempt/jobs-mark-pst-exempt.comp
import LayoutFormRow from "../layout-form-row/layout-form-row.component"; import LayoutFormRow from "../layout-form-row/layout-form-row.component";
const mapStateToProps = createStructuredSelector({ const mapStateToProps = createStructuredSelector({
//currentUser: selectCurrentUser
bodyshop: selectBodyshop bodyshop: selectBodyshop
}); });
const mapDispatchToProps = (dispatch) => ({ const mapDispatchToProps = (dispatch) => ({
@@ -39,162 +38,175 @@ export function JobsCreateJobsInfo({ bodyshop, form, selected }) {
} }
}; };
return ( // Define collapse items for all three panels
<div> const collapseItems = [
<Collapse defaultActiveKey="insurance"> {
<Collapse.Panel key="insurance" header={t("menus.jobsdetail.insurance")} forceRender> key: "insurance",
<LayoutFormRow> label: t("menus.jobsdetail.insurance"),
<Form.Item label={t("jobs.fields.clm_no")} name="clm_no"> children: (
<Input /> <LayoutFormRow>
</Form.Item> <Form.Item label={t("jobs.fields.clm_no")} name="clm_no">
<Form.Item label={t("jobs.fields.policy_no")} name="policy_no"> <Input />
<Input /> </Form.Item>
</Form.Item> <Form.Item label={t("jobs.fields.policy_no")} name="policy_no">
<Form.Item label={t("jobs.fields.regie_number")} name="regie_number"> <Input />
<Input /> </Form.Item>
</Form.Item> <Form.Item label={t("jobs.fields.regie_number")} name="regie_number">
<Form.Item label={t("jobs.fields.ins_co_nm")} name="ins_co_nm"> <Input />
<Select onChange={handleInsCoChange}> </Form.Item>
{bodyshop.md_ins_cos.map((s) => ( <Form.Item label={t("jobs.fields.ins_co_nm")} name="ins_co_nm">
<Select.Option key={s.name} value={s.name}> <Select onChange={handleInsCoChange}>
{s.name} {bodyshop.md_ins_cos.map((s) => (
</Select.Option> <Select.Option key={s.name} value={s.name}>
))} {s.name}
</Select> </Select.Option>
</Form.Item> ))}
<Form.Item label={t("jobs.fields.ins_addr1")} name="ins_addr1"> </Select>
<Input /> </Form.Item>
</Form.Item> <Form.Item label={t("jobs.fields.ins_addr1")} name="ins_addr1">
<Form.Item label={t("jobs.fields.ins_city")} name="ins_city"> <Input />
<Input /> </Form.Item>
</Form.Item> <Form.Item label={t("jobs.fields.ins_city")} name="ins_city">
<Form.Item <Input />
label={ </Form.Item>
<Space> <Form.Item
{t("jobs.fields.ins_ct_ln")} label={
<JobsDetailChangeFilehandler form={form} /> <Space>
</Space> {t("jobs.fields.ins_ct_ln")}
<JobsDetailChangeFilehandler form={form} />
</Space>
}
name="ins_ct_ln"
>
<Input />
</Form.Item>
<Form.Item label={t("jobs.fields.ins_ct_fn")} name="ins_ct_fn">
<Input />
</Form.Item>
<Form.Item
label={t("jobs.fields.ins_ph1")}
name="ins_ph1"
rules={[({ getFieldValue }) => PhoneItemFormatterValidation(getFieldValue, "ins_ph1")]}
>
<FormItemPhone />
</Form.Item>
<Form.Item
label={t("jobs.fields.ins_ea")}
name="ins_ea"
rules={[
{
type: "email",
message: "This is not a valid email address."
} }
name="ins_ct_ln" ]}
> >
<Input /> <FormItemEmail email={getFieldValue("ins_ea")} />
</Form.Item> </Form.Item>
<Form.Item label={t("jobs.fields.ins_ct_fn")} name="ins_ct_fn"> <Form.Item label={t("jobs.fields.loss_date")} name="loss_date">
<Input /> <DateTimePicker isDateOnly />
</Form.Item> </Form.Item>
<Form.Item <Form.Item label={t("jobs.fields.kmin")} name="kmin">
label={t("jobs.fields.ins_ph1")} <Input />
name="ins_ph1" </Form.Item>
rules={[({ getFieldValue }) => PhoneItemFormatterValidation(getFieldValue, "ins_ph1")]} <Form.Item label={t("jobs.fields.est_co_nm")} name="est_co_nm">
> sausage <Input />
<FormItemPhone /> </Form.Item>
</Form.Item> <Form.Item
<Form.Item label={
label={t("jobs.fields.ins_ea")} <Space>
name="ins_ea" {t("jobs.fields.est_ct_fn")}
rules={[ <JobsDetailChangeEstimator form={form} />
{ </Space>
type: "email", }
message: "This is not a valid email address." name="est_ct_fn"
} >
]} <Input />
> </Form.Item>
<FormItemEmail email={getFieldValue("ins_ea")} /> <Form.Item label={t("jobs.fields.est_ct_ln")} name="est_ct_ln">
</Form.Item> <Input />
<Form.Item label={t("jobs.fields.loss_date")} name="loss_date"> </Form.Item>
<DateTimePicker isDateOnly /> <Form.Item label={t("jobs.fields.est_ph1")} name="est_ph1">
</Form.Item> <Input />
<Form.Item label={t("jobs.fields.kmin")} name="kmin"> </Form.Item>
<Input /> <Form.Item
</Form.Item> label={t("jobs.fields.est_ea")}
<Form.Item label={t("jobs.fields.est_co_nm")} name="est_co_nm"> name="est_ea"
<Input /> rules={[
</Form.Item> {
<Form.Item type: "email",
label={ message: "This is not a valid email address."
<Space>
{t("jobs.fields.est_ct_fn")}
<JobsDetailChangeEstimator form={form} />
</Space>
} }
name="est_ct_fn" ]}
> >
<Input /> <FormItemEmail email={getFieldValue("est_ea")} />
</Form.Item> </Form.Item>
<Form.Item label={t("jobs.fields.est_ct_ln")} name="est_ct_ln"> <Form.Item label={t("jobs.fields.selling_dealer")} name="selling_dealer">
<Input /> <Input />
</Form.Item> </Form.Item>
<Form.Item label={t("jobs.fields.est_ph1")} name="est_ph1"> <Form.Item label={t("jobs.fields.servicing_dealer")} name="servicing_dealer">
<Input /> <Input />
</Form.Item> </Form.Item>
<Form.Item <Form.Item label={t("jobs.fields.selling_dealer_contact")} name="selling_dealer_contact">
label={t("jobs.fields.est_ea")} <Input />
name="est_ea" </Form.Item>
rules={[ <Form.Item label={t("jobs.fields.servicing_dealer_contact")} name="servicing_dealer_contact">
{ <Input />
type: "email", </Form.Item>
message: "This is not a valid email address." </LayoutFormRow>
} ),
]} forceRender: true
> },
<FormItemEmail email={getFieldValue("est_ea")} /> {
</Form.Item> key: "claim",
<Form.Item label={t("jobs.fields.selling_dealer")} name="selling_dealer"> label: t("menus.jobsdetail.claimdetail"),
<Input /> children: (
</Form.Item> <LayoutFormRow>
<Form.Item label={t("jobs.fields.servicing_dealer")} name="servicing_dealer"> <Form.Item label={t("jobs.fields.loss_desc")} name="loss_desc">
<Input /> <Input />
</Form.Item> </Form.Item>
<Form.Item label={t("jobs.fields.selling_dealer_contact")} name="selling_dealer_contact"> <Form.Item label={t("jobs.fields.loss_of_use")} name="loss_of_use">
<Input /> <Input />
</Form.Item> </Form.Item>
<Form.Item label={t("jobs.fields.servicing_dealer_contact")} name="servicing_dealer_contact"> <Form.Item label={t("jobs.fields.ponumber")} name="po_number">
<Input /> <Input />
</Form.Item> </Form.Item>
</LayoutFormRow> <Form.Item label={t("jobs.fields.unitnumber")} name="unit_number">
</Collapse.Panel> <Input />
<Collapse.Panel forceRender key="claim" header={t("menus.jobsdetail.claimdetail")}> </Form.Item>
<LayoutFormRow> <Form.Item
<Form.Item label={t("jobs.fields.loss_desc")} name="loss_desc"> label={t("jobs.fields.specialcoveragepolicy")}
<Input /> valuePropName="checked"
</Form.Item> name="special_coverage_policy"
<Form.Item label={t("jobs.fields.loss_of_use")} name="loss_of_use"> >
<Input /> <Switch />
</Form.Item> </Form.Item>
<Form.Item label={t("jobs.fields.ponumber")} name="po_number"> <Form.Item label={t("jobs.fields.kmin")} name="kmin">
<Input /> <Input />
</Form.Item> </Form.Item>
<Form.Item label={t("jobs.fields.unitnumber")} name="unit_number"> <Form.Item label={t("jobs.fields.kmout")} name="kmout">
<Input /> <Input />
</Form.Item> </Form.Item>
<Form.Item <Form.Item label={t("jobs.fields.referralsource")} name="referral_source">
label={t("jobs.fields.specialcoveragepolicy")} <Select>
valuePropName="checked" {bodyshop.md_referral_sources.map((s) => (
name="special_coverage_policy" <Select.Option key={s} value={s}>
> {s}
<Switch /> </Select.Option>
</Form.Item> ))}
<Form.Item label={t("jobs.fields.kmin")} name="kmin"> </Select>
<Input /> </Form.Item>
</Form.Item> <Form.Item label={t("jobs.fields.referral_source_extra")} name="referral_source_extra">
<Form.Item label={t("jobs.fields.kmout")} name="kmout"> <Input />
<Input /> </Form.Item>
</Form.Item> </LayoutFormRow>
<Form.Item label={t("jobs.fields.referralsource")} name="referral_source"> ),
<Select> forceRender: true
{bodyshop.md_referral_sources.map((s) => ( },
<Select.Option key={s} value={s}> {
{s} key: "financial",
</Select.Option> label: t("menus.jobsdetail.financials"),
))} children: (
</Select> <>
</Form.Item>
<Form.Item label={t("jobs.fields.referral_source_extra")} name="referral_source_extra">
<Input />
</Form.Item>
</LayoutFormRow>
</Collapse.Panel>
<Collapse.Panel forceRender key="financial" header={t("menus.jobsdetail.financials")}>
<JobsDetailRatesChangeButton form={form} /> <JobsDetailRatesChangeButton form={form} />
{InstanceRenderManager({ {InstanceRenderManager({
imex: <JobsMarkPstExempt form={form} /> imex: <JobsMarkPstExempt form={form} />
@@ -315,8 +327,15 @@ export function JobsCreateJobsInfo({ bodyshop, form, selected }) {
<CurrencyInput /> <CurrencyInput />
</Form.Item> </Form.Item>
</LayoutFormRow> </LayoutFormRow>
</Collapse.Panel> </>
</Collapse> ),
forceRender: true
}
];
return (
<div>
<Collapse defaultActiveKey="insurance" items={collapseItems} />
<JobsDetailRatesParts jobRO={false} expanded required={selected && true} form={form} /> <JobsDetailRatesParts jobRO={false} expanded required={selected && true} form={form} />
{InstanceRenderManager({ {InstanceRenderManager({
rome: ( rome: (

View File

@@ -13,154 +13,162 @@ const mapStateToProps = createStructuredSelector({
export function JobsDetailRatesMaterials({ jobRO, expanded, required = true, form }) { export function JobsDetailRatesMaterials({ jobRO, expanded, required = true, form }) {
const { t } = useTranslation(); const { t } = useTranslation();
return ( // Define collapse items
<Collapse defaultActiveKey={expanded && "rates"}> const collapseItems = [
<Collapse.Panel forceRender header={t("jobs.fields.materials.materials")} key="materials"> {
<LayoutFormRow header={t("jobs.fields.materials.MAPA")}> key: "materials",
<Form.Item label={t("jobs.fields.materials.cal_maxdlr")} name={["materials", "MAPA", "cal_maxdlr"]}> label: t("jobs.fields.materials.materials"),
<InputNumber min={0} precision={2} disabled={jobRO} /> children: (
</Form.Item> <>
<Form.Item label={t("jobs.fields.materials.cal_opcode")} name={["materials", "MAPA", "cal_opcode"]}> <LayoutFormRow header={t("jobs.fields.materials.MAPA")}>
<Input disabled={jobRO} /> <Form.Item label={t("jobs.fields.materials.cal_maxdlr")} name={["materials", "MAPA", "cal_maxdlr"]}>
</Form.Item> <InputNumber min={0} precision={2} disabled={jobRO} />
<Form.Item label={t("jobs.fields.materials.mat_adjp")} name={["materials", "MAPA", "mat_adjp"]}> </Form.Item>
<InputNumber min={-100} max={100} precision={4} disabled={jobRO} /> <Form.Item label={t("jobs.fields.materials.cal_opcode")} name={["materials", "MAPA", "cal_opcode"]}>
</Form.Item> <Input disabled={jobRO} />
<Form.Item </Form.Item>
label={t("jobs.fields.materials.tax_ind")} <Form.Item label={t("jobs.fields.materials.mat_adjp")} name={["materials", "MAPA", "mat_adjp"]}>
name={["materials", "MAPA", "tax_ind"]} <InputNumber min={-100} max={100} precision={4} disabled={jobRO} />
valuePropName="checked" </Form.Item>
> <Form.Item
<Switch /> label={t("jobs.fields.materials.tax_ind")}
</Form.Item> name={["materials", "MAPA", "tax_ind"]}
<Form.Item shouldUpdate> valuePropName="checked"
{() => { >
return ( <Switch />
<Form.Item </Form.Item>
label={t("jobs.fields.materials.mat_taxp")} <Form.Item shouldUpdate>
name={["materials", "MAPA", "mat_taxp"]} {() => {
rules={[ return (
{ <Form.Item
required: form.getFieldValue(["materials", "MAPA", "tax_ind"]) label={t("jobs.fields.materials.mat_taxp")}
//message: t("general.validation.required"), name={["materials", "MAPA", "mat_taxp"]}
} rules={[
]} {
> required: form.getFieldValue(["materials", "MAPA", "tax_ind"])
<InputNumber min={0} max={100} precision={4} disabled={jobRO} /> //message: t("general.validation.required"),
</Form.Item> }
); ]}
}} >
</Form.Item> <InputNumber min={0} max={100} precision={4} disabled={jobRO} />
<Form.Item </Form.Item>
label={t("jobs.fields.materials.mat_tx_in1")} );
name={["materials", "MAPA", "mat_tx_in1"]} }}
valuePropName="checked" </Form.Item>
> <Form.Item
<Switch /> label={t("jobs.fields.materials.mat_tx_in1")}
</Form.Item> name={["materials", "MAPA", "mat_tx_in1"]}
<Form.Item valuePropName="checked"
label={t("jobs.fields.materials.mat_tx_in2")} >
name={["materials", "MAPA", "mat_tx_in2"]} <Switch />
valuePropName="checked" </Form.Item>
> <Form.Item
<Switch /> label={t("jobs.fields.materials.mat_tx_in2")}
</Form.Item> name={["materials", "MAPA", "mat_tx_in2"]}
<Form.Item valuePropName="checked"
label={t("jobs.fields.materials.mat_tx_in3")} >
name={["materials", "MAPA", "mat_tx_in3"]} <Switch />
valuePropName="checked" </Form.Item>
> <Form.Item
<Switch /> label={t("jobs.fields.materials.mat_tx_in3")}
</Form.Item> name={["materials", "MAPA", "mat_tx_in3"]}
<Form.Item valuePropName="checked"
label={t("jobs.fields.materials.mat_tx_in4")} >
name={["materials", "MAPA", "mat_tx_in4"]} <Switch />
valuePropName="checked" </Form.Item>
> <Form.Item
<Switch /> label={t("jobs.fields.materials.mat_tx_in4")}
</Form.Item> name={["materials", "MAPA", "mat_tx_in4"]}
<Form.Item valuePropName="checked"
label={t("jobs.fields.materials.mat_tx_in5")} >
name={["materials", "MAPA", "mat_tx_in5"]} <Switch />
valuePropName="checked" </Form.Item>
> <Form.Item
<Switch /> label={t("jobs.fields.materials.mat_tx_in5")}
</Form.Item> name={["materials", "MAPA", "mat_tx_in5"]}
</LayoutFormRow> valuePropName="checked"
<LayoutFormRow header={t("jobs.fields.materials.MASH")}> >
<Form.Item label={t("jobs.fields.materials.cal_maxdlr")} name={["materials", "MASH", "cal_maxdlr"]}> <Switch />
<InputNumber min={0} precision={2} disabled={jobRO} /> </Form.Item>
</Form.Item> </LayoutFormRow>
<Form.Item label={t("jobs.fields.materials.cal_opcode")} name={["materials", "MASH", "cal_opcode"]}> <LayoutFormRow header={t("jobs.fields.materials.MASH")}>
<Input disabled={jobRO} /> <Form.Item label={t("jobs.fields.materials.cal_maxdlr")} name={["materials", "MASH", "cal_maxdlr"]}>
</Form.Item> <InputNumber min={0} precision={2} disabled={jobRO} />
<Form.Item label={t("jobs.fields.materials.mat_adjp")} name={["materials", "MAPA", "mat_adjp"]}> </Form.Item>
<InputNumber min={-100} max={100} precision={4} disabled={jobRO} /> <Form.Item label={t("jobs.fields.materials.cal_opcode")} name={["materials", "MASH", "cal_opcode"]}>
</Form.Item> <Input disabled={jobRO} />
<Form.Item </Form.Item>
label={t("jobs.fields.materials.tax_ind")} <Form.Item label={t("jobs.fields.materials.mat_adjp")} name={["materials", "MAPA", "mat_adjp"]}>
name={["materials", "MASH", "tax_ind"]} <InputNumber min={-100} max={100} precision={4} disabled={jobRO} />
valuePropName="checked" </Form.Item>
> <Form.Item
<Switch /> label={t("jobs.fields.materials.tax_ind")}
</Form.Item> name={["materials", "MASH", "tax_ind"]}
<Form.Item shouldUpdate> valuePropName="checked"
{() => { >
return ( <Switch />
<Form.Item </Form.Item>
label={t("jobs.fields.materials.mat_taxp")} <Form.Item shouldUpdate>
name={["materials", "MASH", "mat_taxp"]} {() => {
rules={[ return (
{ <Form.Item
required: form.getFieldValue(["materials", "MASH", "tax_ind"]) label={t("jobs.fields.materials.mat_taxp")}
//message: t("general.validation.required"), name={["materials", "MASH", "mat_taxp"]}
} rules={[
]} {
> required: form.getFieldValue(["materials", "MASH", "tax_ind"])
<InputNumber min={0} max={100} precision={4} disabled={jobRO} /> //message: t("general.validation.required"),
</Form.Item> }
); ]}
}} >
</Form.Item> <InputNumber min={0} max={100} precision={4} disabled={jobRO} />
<Form.Item </Form.Item>
label={t("jobs.fields.materials.mat_tx_in1")} );
name={["materials", "MASH", "mat_tx_in1"]} }}
valuePropName="checked" </Form.Item>
> <Form.Item
<Switch /> label={t("jobs.fields.materials.mat_tx_in1")}
</Form.Item> name={["materials", "MASH", "mat_tx_in1"]}
<Form.Item valuePropName="checked"
label={t("jobs.fields.materials.mat_tx_in2")} >
name={["materials", "MASH", "mat_tx_in2"]} <Switch />
valuePropName="checked" </Form.Item>
> <Form.Item
<Switch /> label={t("jobs.fields.materials.mat_tx_in2")}
</Form.Item> name={["materials", "MASH", "mat_tx_in2"]}
<Form.Item valuePropName="checked"
label={t("jobs.fields.materials.mat_tx_in3")} >
name={["materials", "MASH", "mat_tx_in3"]} <Switch />
valuePropName="checked" </Form.Item>
> <Form.Item
<Switch /> label={t("jobs.fields.materials.mat_tx_in3")}
</Form.Item> name={["materials", "MASH", "mat_tx_in3"]}
<Form.Item valuePropName="checked"
label={t("jobs.fields.materials.mat_tx_in4")} >
name={["materials", "MASH", "mat_tx_in4"]} <Switch />
valuePropName="checked" </Form.Item>
> <Form.Item
<Switch /> label={t("jobs.fields.materials.mat_tx_in4")}
</Form.Item> name={["materials", "MASH", "mat_tx_in4"]}
<Form.Item valuePropName="checked"
label={t("jobs.fields.materials.mat_tx_in5")} >
name={["materials", "MASH", "mat_tx_in5"]} <Switch />
valuePropName="checked" </Form.Item>
> <Form.Item
<Switch /> label={t("jobs.fields.materials.mat_tx_in5")}
</Form.Item> name={["materials", "MASH", "mat_tx_in5"]}
</LayoutFormRow> valuePropName="checked"
</Collapse.Panel> >
</Collapse> <Switch />
); </Form.Item>
</LayoutFormRow>
</>
),
forceRender: true
}
];
return <Collapse defaultActiveKey={expanded && "rates"} items={collapseItems} />;
} }
export default connect(mapStateToProps, null)(JobsDetailRatesMaterials); export default connect(mapStateToProps, null)(JobsDetailRatesMaterials);

View File

@@ -13,9 +13,12 @@ const mapStateToProps = createStructuredSelector({
export function JobsDetailRatesOther({ jobRO, expanded, required = true, form }) { export function JobsDetailRatesOther({ jobRO, expanded, required = true, form }) {
const { t } = useTranslation(); const { t } = useTranslation();
return ( // Define collapse items
<Collapse defaultActiveKey={expanded && "rates"}> const collapseItems = [
<Collapse.Panel forceRender header={t("jobs.labels.cieca_pfo")} key="cieca_pfo"> {
key: "cieca_pfo",
label: t("jobs.labels.cieca_pfo"),
children: (
<LayoutFormRow noDivider> <LayoutFormRow noDivider>
<Form.Item <Form.Item
label={t("jobs.fields.cieca_pfo.tow_t_in1")} label={t("jobs.fields.cieca_pfo.tow_t_in1")}
@@ -52,7 +55,6 @@ export function JobsDetailRatesOther({ jobRO, expanded, required = true, form })
> >
<Switch /> <Switch />
</Form.Item> </Form.Item>
<Form.Item <Form.Item
label={t("jobs.fields.cieca_pfo.stor_t_in1")} label={t("jobs.fields.cieca_pfo.stor_t_in1")}
name={["cieca_pfo", "stor_t_in1"]} name={["cieca_pfo", "stor_t_in1"]}
@@ -89,9 +91,12 @@ export function JobsDetailRatesOther({ jobRO, expanded, required = true, form })
<Switch /> <Switch />
</Form.Item> </Form.Item>
</LayoutFormRow> </LayoutFormRow>
</Collapse.Panel> ),
</Collapse> forceRender: true
); }
];
return <Collapse defaultActiveKey={expanded && "rates"} items={collapseItems} />;
} }
export default connect(mapStateToProps, null)(JobsDetailRatesOther); export default connect(mapStateToProps, null)(JobsDetailRatesOther);

View File

@@ -11,6 +11,9 @@ const mapStateToProps = createStructuredSelector({
bodyshop: selectBodyshop bodyshop: selectBodyshop
}); });
//If the panel doesnt expand correctly due to the key mismatch, update the Collapse line to:
// <Collapse defaultActiveKey={expanded && "cieca_pft"} items={collapseItems} />
export function JobsDetailRatesTaxes({ jobRO, expanded, bodyshop, required = true, form }) { export function JobsDetailRatesTaxes({ jobRO, expanded, bodyshop, required = true, form }) {
const { t } = useTranslation(); const { t } = useTranslation();
const formItems = []; const formItems = [];
@@ -47,13 +50,18 @@ export function JobsDetailRatesTaxes({ jobRO, expanded, bodyshop, required = tru
</> </>
); );
} }
return (
<Collapse defaultActiveKey={expanded && "rates"}> // Define collapse items
<Collapse.Panel forceRender header={t("jobs.labels.cieca_pft")} key="cieca_pft"> const collapseItems = [
{formItems} {
</Collapse.Panel> key: "cieca_pft",
</Collapse> label: t("jobs.labels.cieca_pft"),
); children: <>{formItems}</>,
forceRender: true
}
];
return <Collapse defaultActiveKey={expanded && "rates"} items={collapseItems} />;
} }
export default connect(mapStateToProps, null)(JobsDetailRatesTaxes); export default connect(mapStateToProps, null)(JobsDetailRatesTaxes);

View File

@@ -36,6 +36,7 @@ export function ScheduleCalendarWrapperComponent({
const search = queryString.parse(useLocation().search); const search = queryString.parse(useLocation().search);
const history = useNavigate(); const history = useNavigate();
const { t } = useTranslation(); const { t } = useTranslation();
const handleEventPropStyles = (event, start, end, isSelected) => { const handleEventPropStyles = (event, start, end, isSelected) => {
return { return {
...(event.color && !((search.view || defaultView) === "agenda") ...(event.color && !((search.view || defaultView) === "agenda")
@@ -51,37 +52,41 @@ export function ScheduleCalendarWrapperComponent({
const selectedDate = new Date(date || dayjs(search.date) || Date.now()); const selectedDate = new Date(date || dayjs(search.date) || Date.now());
// Convert Collapse to use items prop
const collapseItems = [
{
key: "1",
label: <span style={{ color: "tomato" }}>{t("appointments.labels.severalerrorsfound")}</span>,
children: (
<Space direction="vertical" style={{ width: "100%" }}>
{problemJobs.map((problem) => (
<Alert
key={problem.id}
type="error"
message={
<Trans
i18nKey="appointments.labels.dataconsistency"
components={[<Link to={`/manage/jobs/${problem.id}`} target="_blank" />]}
values={{
ro_number: problem.ro_number,
code: problem.code
}}
/>
}
/>
))}
</Space>
)
}
];
return ( return (
<> <>
<JobDetailCards /> <JobDetailCards />
{HasFeatureAccess({ featureName: "smartscheduling", bodyshop }) && {HasFeatureAccess({ featureName: "smartscheduling", bodyshop }) &&
problemJobs && problemJobs &&
(problemJobs.length > 2 ? ( (problemJobs.length > 2 ? (
<Collapse style={{ marginBottom: "5px" }}> <Collapse items={collapseItems} style={{ marginBottom: "5px" }} />
<Collapse.Panel
key="1"
header={<span style={{ color: "tomato" }}>{t("appointments.labels.severalerrorsfound")}</span>}
>
<Space direction="vertical" style={{ width: "100%" }}>
{problemJobs.map((problem) => (
<Alert
key={problem.id}
type="error"
message={
<Trans
i18nKey="appointments.labels.dataconsistency"
components={[<Link to={`/manage/jobs/${problem.id}`} target="_blank" />]}
values={{
ro_number: problem.ro_number,
code: problem.code
}}
/>
}
/>
))}
</Space>
</Collapse.Panel>
</Collapse>
) : ( ) : (
<Space direction="vertical" style={{ width: "100%", marginBottom: "5px" }}> <Space direction="vertical" style={{ width: "100%", marginBottom: "5px" }}>
{problemJobs.map((problem) => ( {problemJobs.map((problem) => (
@@ -119,7 +124,6 @@ export function ScheduleCalendarWrapperComponent({
history({ search: queryString.stringify(search) }); history({ search: queryString.stringify(search) });
}} }}
step={15} step={15}
// timeslots={1}
showMultiDayTimes showMultiDayTimes
localizer={localizer} localizer={localizer}
min={bodyshop.schedule_start_time ? new Date(bodyshop.schedule_start_time) : new Date("2020-01-01T06:00:00")} min={bodyshop.schedule_start_time ? new Date(bodyshop.schedule_start_time) : new Date("2020-01-01T06:00:00")}