IO-3624 Refine Rome responsibility center tax layout

This commit is contained in:
Dave
2026-03-24 16:37:03 -04:00
parent 2690e09626
commit 2de605e520
7 changed files with 282 additions and 180 deletions

View File

@@ -3316,22 +3316,22 @@ export function ShopInfoResponsibilityCenterComponent({ bodyshop, form }) {
<> <>
{InstanceRenderManager({ {InstanceRenderManager({
rome: ( rome: (
<> <LayoutFormRow header={t("bodyshop.labels.responsibilitycenters.quickbooks_us")} id="quickbooks_us">
<Form.Item <Form.Item
label={t("bodyshop.fields.responsibilitycenters.itemexemptcode")} label={t("bodyshop.fields.responsibilitycenters.itemexemptcode_short")}
rules={[{ required: true }]} rules={[{ required: true }]}
name={["md_responsibility_centers", "taxes", "itemexemptcode"]} name={["md_responsibility_centers", "taxes", "itemexemptcode"]}
> >
<Input /> <Input />
</Form.Item> </Form.Item>
<Form.Item <Form.Item
label={t("bodyshop.fields.responsibilitycenters.invoiceexemptcode")} label={t("bodyshop.fields.responsibilitycenters.invoiceexemptcode_short")}
rules={[{ required: true }]} rules={[{ required: true }]}
name={["md_responsibility_centers", "taxes", "invoiceexemptcode"]} name={["md_responsibility_centers", "taxes", "invoiceexemptcode"]}
> >
<Input /> <Input />
</Form.Item> </Form.Item>
</> </LayoutFormRow>
) )
})} })}
<LayoutFormRow header={<div>AR</div>} id="AR"> <LayoutFormRow header={<div>AR</div>} id="AR">

View File

@@ -1,4 +1,4 @@
import { Collapse, Divider, Form, Input, InputNumber, Space, Switch } from "antd"; import { Col, Collapse, Form, Input, InputNumber, Row, Switch } from "antd";
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";
@@ -6,6 +6,7 @@ import { selectBodyshop } from "../../redux/user/user.selectors";
import InstanceRenderManager from "../../utils/instanceRenderMgr"; import InstanceRenderManager from "../../utils/instanceRenderMgr";
import LayoutFormRow from "../layout-form-row/layout-form-row.component"; import LayoutFormRow from "../layout-form-row/layout-form-row.component";
import { bodyshopHasDmsKey } from "../../utils/dmsUtils.js"; import { bodyshopHasDmsKey } from "../../utils/dmsUtils.js";
import "./shop-info.responsibilitycenters.taxes.styles.scss";
const mapStateToProps = createStructuredSelector({ const mapStateToProps = createStructuredSelector({
//currentUser: selectCurrentUser //currentUser: selectCurrentUser
@@ -16,47 +17,96 @@ const mapDispatchToProps = () => ({
}); });
export default connect(mapStateToProps, mapDispatchToProps)(ShopInfoResponsibilityCenters); export default connect(mapStateToProps, mapDispatchToProps)(ShopInfoResponsibilityCenters);
const taxRootColProps = {
xs: 24,
sm: 12,
md: 8,
lg: { flex: "0 0 280px" },
xl: { flex: "0 0 240px" },
xxl: { flex: "0 0 300px" }
};
const taxTierFieldColProps = {
xs: 24,
sm: 12,
lg: 6
};
export function ShopInfoResponsibilityCenters({ bodyshop, form }) { export function ShopInfoResponsibilityCenters({ bodyshop, form }) {
const { t } = useTranslation(); const { t } = useTranslation();
//Iteratively build the form items. const profileTaxCards = [];
const formItems = []; for (let typeNum = 1; typeNum <= 5; typeNum++) {
for (let tyCounter = 1; tyCounter <= 5; tyCounter++) { const rootTaxItems = getRootTaxFormItems({ typeNum, bodyshop, t });
const section = [];
section.push( profileTaxCards.push(
TaxFormItems({ <LayoutFormRow key={`profile-tax-type-${typeNum}`} header={t("bodyshop.labels.responsibilitycenters.tax_type_card", { typeNum })}>
typeNum: tyCounter, <div style={{ display: "grid", rowGap: 12 }}>
rootElements: true, <Row gutter={[16, 16]} wrap>
bodyshop {rootTaxItems.map((item, index) => (
}) <Col key={item.key ?? `tax-root-${typeNum}-${index}`} {...taxRootColProps}>
{item}
</Col>
))}
</Row>
<Row gutter={[12, 12]} wrap className="responsibility-centers-tax-tier-grid">
{Array.from({ length: 5 }, (_, index) => {
const typeNumIterator = index + 1;
const tierTaxItems = getTierTaxFormItems({
typeNum,
typeNumIterator,
t
});
return (
<Col
key={`tax-tier-row-${typeNum}-${typeNumIterator}`}
xs={24}
className="responsibility-centers-tax-tier-grid__col"
>
<LayoutFormRow
header={t("bodyshop.labels.responsibilitycenters.tax_tier_card", { typeNumIterator })}
style={{ marginBottom: 0 }}
styles={{
header: {
paddingInline: 12
},
body: {
padding: 12
}
}}
>
<Row gutter={[12, 8]} wrap>
{tierTaxItems.map((item, tierIndex) => (
<Col key={item.key ?? `tax-tier-${typeNum}-${typeNumIterator}-${tierIndex}`} {...taxTierFieldColProps}>
{item}
</Col>
))}
</Row>
</LayoutFormRow>
</Col>
);
})}
</Row>
</div>
</LayoutFormRow>
); );
for (let iterator = 1; iterator <= 5; iterator++) {
section.push(
TaxFormItems({
typeNum: tyCounter,
typeNumIterator: iterator,
rootElements: false
})
);
}
formItems.push(<Space wrap>{section}</Space>);
formItems.push(<Divider />);
} }
return ( return (
<> <>
<Divider titlePlacement="left" orientation="horizontal" style={{ marginTop: ".8rem" }}> <LayoutFormRow header={t("jobs.labels.cieca_pft")}>
{t("jobs.labels.cieca_pft")} <div>{profileTaxCards}</div>
</Divider> </LayoutFormRow>
{formItems}
<Collapse <LayoutFormRow header={t("bodyshop.labels.responsibilitycenters.default_tax_setup")}>
items={[ <Collapse
{ items={[
key: "cieca_pfl", {
label: t("jobs.labels.cieca_pfl"), key: "cieca_pfl",
forceRender: true, label: t("jobs.labels.cieca_pfl"),
children: ( forceRender: true,
<> children: (
<>
<LayoutFormRow header={t("joblines.fields.lbr_types.LAB")}> <LayoutFormRow header={t("joblines.fields.lbr_types.LAB")}>
<Form.Item <Form.Item
label={t("jobs.fields.cieca_pfl.lbr_adjp")} label={t("jobs.fields.cieca_pfl.lbr_adjp")}
@@ -893,15 +943,15 @@ export function ShopInfoResponsibilityCenters({ bodyshop, form }) {
<Switch /> <Switch />
</Form.Item> </Form.Item>
</LayoutFormRow> </LayoutFormRow>
</> </>
) )
}, },
{ {
key: "cieca_pfo", key: "cieca_pfo",
label: t("jobs.labels.cieca_pfo"), label: t("jobs.labels.cieca_pfo"),
forceRender: true, forceRender: true,
children: ( 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")}
@@ -2145,76 +2195,74 @@ export function ShopInfoResponsibilityCenters({ bodyshop, form }) {
<InputNumber min={0} max={100} precision={4} /> <InputNumber min={0} max={100} precision={4} />
</Form.Item> </Form.Item>
</LayoutFormRow> </LayoutFormRow>
</> </>
) )
} }
]} ]}
/> />
</LayoutFormRow>
</> </>
); );
} }
function TaxFormItems({ typeNum, typeNumIterator, rootElements, bodyshop }) { function getRootTaxFormItems({ typeNum, bodyshop, t }) {
const { t } = useTranslation(); return [
<Form.Item
if (rootElements) key={`tax_type_${typeNum}_type`}
return ( label={t("bodyshop.fields.responsibilitycenter_tax_type", { typeNum })}
<> rules={[
<Form.Item {
label={t("bodyshop.fields.responsibilitycenter_tax_type", { required: true
typeNum, //message: t("general.validation.required"),
typeNumIterator }
})} ]}
rules={[ name={["md_responsibility_centers", "taxes", `tax_ty${typeNum}`, `tax_type${typeNum}`]}
{ >
required: true <Input />
//message: t("general.validation.required"), </Form.Item>,
} <Form.Item
]} key={`tax_type_${typeNum}_name`}
name={["md_responsibility_centers", "taxes", `tax_ty${typeNum}`, `tax_type${typeNum}`]} label={t("bodyshop.fields.responsibilitycenters.state_tax")}
> rules={[
<Input /> {
</Form.Item> required: true
//message: t("general.validation.required"),
<Form.Item }
label={t("bodyshop.fields.responsibilitycenters.state_tax")} ]}
rules={[ name={["md_responsibility_centers", "taxes", `tax_ty${typeNum}`, "name"]}
{ >
required: true <Input />
//message: t("general.validation.required"), </Form.Item>,
} <Form.Item
]} key={`tax_type_${typeNum}_accountdesc`}
name={["md_responsibility_centers", "taxes", `tax_ty${typeNum}`, "name"]} label={t("bodyshop.fields.responsibilitycenter_accountdesc")}
> rules={[
<Input /> {
</Form.Item> required: true
//message: t("general.validation.required"),
<Form.Item }
label={t("bodyshop.fields.responsibilitycenter_accountdesc")} ]}
rules={[ name={["md_responsibility_centers", "taxes", `tax_ty${typeNum}`, "accountdesc"]}
{ >
required: true <Input />
//message: t("general.validation.required"), </Form.Item>,
} <Form.Item
]} key={`tax_type_${typeNum}_accountitem`}
name={["md_responsibility_centers", "taxes", `tax_ty${typeNum}`, "accountdesc"]} label={t("bodyshop.fields.responsibilitycenter_accountitem")}
> rules={[
<Input /> {
</Form.Item> required: true
<Form.Item //message: t("general.validation.required"),
label={t("bodyshop.fields.responsibilitycenter_accountitem")} }
rules={[ ]}
{ name={["md_responsibility_centers", "taxes", `tax_ty${typeNum}`, "accountitem"]}
required: true >
//message: t("general.validation.required"), <Input />
} </Form.Item>,
]} ...(bodyshopHasDmsKey(bodyshop)
name={["md_responsibility_centers", "taxes", `tax_ty${typeNum}`, "accountitem"]} ? [
>
<Input />
</Form.Item>
{bodyshopHasDmsKey(bodyshop) && (
<Form.Item <Form.Item
key={`tax_type_${typeNum}_dms_acctnumber`}
label={t("bodyshop.fields.dms.dms_acctnumber")} label={t("bodyshop.fields.dms.dms_acctnumber")}
rules={[ rules={[
{ {
@@ -2226,71 +2274,64 @@ function TaxFormItems({ typeNum, typeNumIterator, rootElements, bodyshop }) {
> >
<Input /> <Input />
</Form.Item> </Form.Item>
)} ]
</> : [])
); ];
return ( }
<>
<Form.Item function getTierTaxFormItems({ typeNum, typeNumIterator, t }) {
label={t("bodyshop.fields.responsibilitycenter_tax_tier", { return [
typeNum, <Form.Item
typeNumIterator key={`tax_type_${typeNum}_tier_${typeNumIterator}`}
})} label={t("bodyshop.labels.responsibilitycenters.tax_tier_short")}
rules={[ rules={[
{ {
required: true required: true
//message: t("general.validation.required"), //message: t("general.validation.required"),
} }
]} ]}
name={["md_responsibility_centers", "taxes", `tax_ty${typeNum}`, `ty${typeNum}_tier${typeNumIterator}`]} name={["md_responsibility_centers", "taxes", `tax_ty${typeNum}`, `ty${typeNum}_tier${typeNumIterator}`]}
> >
<InputNumber precision={0} min={0} /> <InputNumber precision={0} min={0} />
</Form.Item> </Form.Item>,
<Form.Item <Form.Item
label={t("bodyshop.fields.responsibilitycenter_tax_thres", { key={`tax_type_${typeNum}_threshold_${typeNumIterator}`}
typeNum, label={t("bodyshop.labels.responsibilitycenters.tax_threshold_short")}
typeNumIterator rules={[
})} {
rules={[ required: true
{ //message: t("general.validation.required"),
required: true }
//message: t("general.validation.required"), ]}
} name={["md_responsibility_centers", "taxes", `tax_ty${typeNum}`, `ty${typeNum}_thres${typeNumIterator}`]}
]} >
name={["md_responsibility_centers", "taxes", `tax_ty${typeNum}`, `ty${typeNum}_thres${typeNumIterator}`]} <InputNumber min={0} precision={2} />
> </Form.Item>,
<InputNumber min={0} precision={2} /> <Form.Item
</Form.Item> key={`tax_type_${typeNum}_rate_${typeNumIterator}`}
<Form.Item label={t("bodyshop.labels.responsibilitycenters.tax_rate_short")}
label={t("bodyshop.fields.responsibilitycenter_tax_rate", { rules={[
typeNum, {
typeNumIterator required: true
})} //message: t("general.validation.required"),
rules={[ }
{ ]}
required: true name={["md_responsibility_centers", "taxes", `tax_ty${typeNum}`, `ty${typeNum}_rate${typeNumIterator}`]}
//message: t("general.validation.required"), >
} <InputNumber min={0} precision={2} />
]} </Form.Item>,
name={["md_responsibility_centers", "taxes", `tax_ty${typeNum}`, `ty${typeNum}_rate${typeNumIterator}`]} <Form.Item
> key={`tax_type_${typeNum}_surcharge_${typeNumIterator}`}
<InputNumber min={0} precision={2} /> label={t("bodyshop.labels.responsibilitycenters.tax_surcharge_short")}
</Form.Item> rules={[
<Form.Item {
label={t("bodyshop.fields.responsibilitycenter_tax_sur", { required: true
typeNum, //message: t("general.validation.required"),
typeNumIterator }
})} ]}
rules={[ name={["md_responsibility_centers", "taxes", `tax_ty${typeNum}`, `ty${typeNum}_sur${typeNumIterator}`]}
{ >
required: true <InputNumber min={0} precision={2} />
//message: t("general.validation.required"), </Form.Item>
} ];
]}
name={["md_responsibility_centers", "taxes", `tax_ty${typeNum}`, `ty${typeNum}_sur${typeNumIterator}`]}
>
<InputNumber min={0} precision={2} />
</Form.Item>
</>
);
} }

View File

@@ -0,0 +1,25 @@
.responsibility-centers-tax-tier-grid__col.ant-col {
flex: 0 0 100%;
max-width: 100%;
}
@media (min-width: 992px) {
.responsibility-centers-tax-tier-grid__col.ant-col {
flex: 0 0 50%;
max-width: 50%;
}
}
@media (min-width: 1600px) {
.responsibility-centers-tax-tier-grid__col.ant-col {
flex: 0 0 25%;
max-width: 25%;
}
}
@media (min-width: 2400px) {
.responsibility-centers-tax-tier-grid__col.ant-col {
flex: 0 0 20%;
max-width: 20%;
}
}

View File

@@ -5,6 +5,7 @@ import LayoutFormRow from "../layout-form-row/layout-form-row.component";
import { connect } from "react-redux"; import { connect } from "react-redux";
import { createStructuredSelector } from "reselect"; import { createStructuredSelector } from "reselect";
import { selectBodyshop } from "../../redux/user/user.selectors"; import { selectBodyshop } from "../../redux/user/user.selectors";
import InstanceRenderManager from "../../utils/instanceRenderMgr";
const mapStateToProps = createStructuredSelector({ const mapStateToProps = createStructuredSelector({
bodyshop: selectBodyshop bodyshop: selectBodyshop
@@ -29,7 +30,12 @@ export function ShopInfoIntellipay({ bodyshop, form }) {
}} }}
</Form.Item> </Form.Item>
<LayoutFormRow header={t("bodyshop.labels.imexpay")}> <LayoutFormRow
header={InstanceRenderManager({
rome: t("bodyshop.labels.romepay"),
imex: t("bodyshop.labels.imexpay")
})}
>
<Form.Item <Form.Item
label={t("bodyshop.fields.intellipay_config.enable_cash_discount")} label={t("bodyshop.fields.intellipay_config.enable_cash_discount")}
valuePropName="checked" valuePropName="checked"

View File

@@ -600,11 +600,13 @@
"gogcode": "GOG Code (BreakOut)", "gogcode": "GOG Code (BreakOut)",
"gst_override": "GST Override Account #", "gst_override": "GST Override Account #",
"invoiceexemptcode": "QuickBooks US - Invoice Tax Exempt Code", "invoiceexemptcode": "QuickBooks US - Invoice Tax Exempt Code",
"invoiceexemptcode_short": "Invoice Tax Exempt Code",
"item_type": "Item Type", "item_type": "Item Type",
"item_type_freight": "Freight", "item_type_freight": "Freight",
"item_type_gog": "GOG", "item_type_gog": "GOG",
"item_type_paint": "Paint Materials", "item_type_paint": "Paint Materials",
"itemexemptcode": "QuickBooks US - Line Item Tax Exempt Code", "itemexemptcode": "QuickBooks US - Line Item Tax Exempt Code",
"itemexemptcode_short": "Line Item Tax Exempt Code",
"la1": "LA1", "la1": "LA1",
"la2": "LA2", "la2": "LA2",
"la3": "LA3", "la3": "LA3",
@@ -779,9 +781,17 @@
"rbac_options": "Role Based Access Control Options", "rbac_options": "Role Based Access Control Options",
"responsibilitycenters": { "responsibilitycenters": {
"costs": "Cost Centers", "costs": "Cost Centers",
"default_tax_setup": "Default Tax Setup",
"profits": "Profit Centers", "profits": "Profit Centers",
"quickbooks_us": "QuickBooks US",
"sales_tax_codes": "Sales Tax Codes", "sales_tax_codes": "Sales Tax Codes",
"tax_accounts": "Tax Accounts", "tax_accounts": "Tax Accounts",
"tax_rate_short": "Rate",
"tax_surcharge_short": "Surcharge",
"tax_threshold_short": "Threshold",
"tax_tier_card": "Tier {{typeNumIterator}}",
"tax_tier_short": "Tier",
"tax_type_card": "Tax Type {{typeNum}}",
"title": "Responsibility Centers", "title": "Responsibility Centers",
"ttl_adjustment": "Subtotal Adjustment Account", "ttl_adjustment": "Subtotal Adjustment Account",
"ttl_tax_adjustment": "Tax Adjustment Account" "ttl_tax_adjustment": "Tax Adjustment Account"

View File

@@ -600,11 +600,13 @@
"gogcode": "", "gogcode": "",
"gst_override": "", "gst_override": "",
"invoiceexemptcode": "", "invoiceexemptcode": "",
"invoiceexemptcode_short": "",
"item_type": "Item Type", "item_type": "Item Type",
"item_type_freight": "", "item_type_freight": "",
"item_type_gog": "", "item_type_gog": "",
"item_type_paint": "", "item_type_paint": "",
"itemexemptcode": "", "itemexemptcode": "",
"itemexemptcode_short": "",
"la1": "", "la1": "",
"la2": "", "la2": "",
"la3": "", "la3": "",
@@ -779,9 +781,17 @@
"rbac_options": "", "rbac_options": "",
"responsibilitycenters": { "responsibilitycenters": {
"costs": "", "costs": "",
"default_tax_setup": "",
"profits": "", "profits": "",
"quickbooks_us": "",
"sales_tax_codes": "", "sales_tax_codes": "",
"tax_accounts": "", "tax_accounts": "",
"tax_rate_short": "",
"tax_surcharge_short": "",
"tax_threshold_short": "",
"tax_tier_card": "",
"tax_tier_short": "",
"tax_type_card": "",
"title": "", "title": "",
"ttl_adjustment": "", "ttl_adjustment": "",
"ttl_tax_adjustment": "" "ttl_tax_adjustment": ""

View File

@@ -600,11 +600,13 @@
"gogcode": "", "gogcode": "",
"gst_override": "", "gst_override": "",
"invoiceexemptcode": "", "invoiceexemptcode": "",
"invoiceexemptcode_short": "",
"item_type": "Item Type", "item_type": "Item Type",
"item_type_freight": "", "item_type_freight": "",
"item_type_gog": "", "item_type_gog": "",
"item_type_paint": "", "item_type_paint": "",
"itemexemptcode": "", "itemexemptcode": "",
"itemexemptcode_short": "",
"la1": "", "la1": "",
"la2": "", "la2": "",
"la3": "", "la3": "",
@@ -779,9 +781,17 @@
"rbac_options": "", "rbac_options": "",
"responsibilitycenters": { "responsibilitycenters": {
"costs": "", "costs": "",
"default_tax_setup": "",
"profits": "", "profits": "",
"quickbooks_us": "",
"sales_tax_codes": "", "sales_tax_codes": "",
"tax_accounts": "", "tax_accounts": "",
"tax_rate_short": "",
"tax_surcharge_short": "",
"tax_threshold_short": "",
"tax_tier_card": "",
"tax_tier_short": "",
"tax_type_card": "",
"title": "", "title": "",
"ttl_adjustment": "", "ttl_adjustment": "",
"ttl_tax_adjustment": "" "ttl_tax_adjustment": ""