feature/feature/IO-3554-Form-Row-Layout - Responsive overhaul
This commit is contained in:
Dave
@@ -1,4 +1,5 @@
|
||||
import { Space, Table } from "antd";
|
||||
import { Space } from "antd";
|
||||
import ResponsiveTable from "../responsive-table/responsive-table.component";
|
||||
import Dinero from "dinero.js";
|
||||
import { useMemo, useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
@@ -104,8 +105,9 @@ export default function JobTotalsTableLabor({ job }) {
|
||||
setState({ ...state, filteredInfo: filters, sortedInfo: sorter });
|
||||
};
|
||||
return (
|
||||
<Table
|
||||
<ResponsiveTable
|
||||
columns={columns}
|
||||
mobileColumnKeys={["total", "profitcenter_labor", "rate", "mod_lb_hrs"]}
|
||||
rowKey="id"
|
||||
pagination={false}
|
||||
onChange={handleTableChange}
|
||||
@@ -115,29 +117,29 @@ export default function JobTotalsTableLabor({ job }) {
|
||||
}}
|
||||
summary={() => (
|
||||
<>
|
||||
<Table.Summary.Row>
|
||||
<Table.Summary.Cell>
|
||||
<ResponsiveTable.Summary.Row>
|
||||
<ResponsiveTable.Summary.Cell>
|
||||
<strong>{t("jobs.labels.labor_rates_subtotal")}</strong>
|
||||
</Table.Summary.Cell>
|
||||
<Table.Summary.Cell />
|
||||
<Table.Summary.Cell>
|
||||
</ResponsiveTable.Summary.Cell>
|
||||
<ResponsiveTable.Summary.Cell />
|
||||
<ResponsiveTable.Summary.Cell>
|
||||
{(job.job_totals.rates.mapa.hours + job.job_totals.rates.mash.hours).toFixed(1)}
|
||||
</Table.Summary.Cell>
|
||||
</ResponsiveTable.Summary.Cell>
|
||||
{InstanceRenderManager({
|
||||
imex: null,
|
||||
rome: (
|
||||
<>
|
||||
<Table.Summary.Cell />
|
||||
<Table.Summary.Cell />
|
||||
<ResponsiveTable.Summary.Cell />
|
||||
<ResponsiveTable.Summary.Cell />
|
||||
</>
|
||||
)
|
||||
})}
|
||||
<Table.Summary.Cell align="right">
|
||||
<ResponsiveTable.Summary.Cell align="right">
|
||||
<strong>{Dinero(job.job_totals.rates.rates_subtotal).toFormat()}</strong>
|
||||
</Table.Summary.Cell>
|
||||
</Table.Summary.Row>
|
||||
<Table.Summary.Row>
|
||||
<Table.Summary.Cell>
|
||||
</ResponsiveTable.Summary.Cell>
|
||||
</ResponsiveTable.Summary.Row>
|
||||
<ResponsiveTable.Summary.Row>
|
||||
<ResponsiveTable.Summary.Cell>
|
||||
<Space>
|
||||
{t("jobs.labels.mapa")}
|
||||
{InstanceRenderManager({
|
||||
@@ -156,34 +158,34 @@ export default function JobTotalsTableLabor({ job }) {
|
||||
})
|
||||
})}
|
||||
</Space>
|
||||
</Table.Summary.Cell>
|
||||
<Table.Summary.Cell align="right">
|
||||
</ResponsiveTable.Summary.Cell>
|
||||
<ResponsiveTable.Summary.Cell align="right">
|
||||
<CurrencyFormatter>{job.job_totals.rates.mapa.rate}</CurrencyFormatter>
|
||||
</Table.Summary.Cell>
|
||||
<Table.Summary.Cell>{job.job_totals.rates.mapa.hours.toFixed(1)}</Table.Summary.Cell>
|
||||
</ResponsiveTable.Summary.Cell>
|
||||
<ResponsiveTable.Summary.Cell>{job.job_totals.rates.mapa.hours.toFixed(1)}</ResponsiveTable.Summary.Cell>
|
||||
{InstanceRenderManager({
|
||||
imex: (
|
||||
<Table.Summary.Cell align="right">
|
||||
<ResponsiveTable.Summary.Cell align="right">
|
||||
{Dinero(job.job_totals.rates.mapa.total).toFormat()}
|
||||
</Table.Summary.Cell>
|
||||
</ResponsiveTable.Summary.Cell>
|
||||
),
|
||||
rome: (
|
||||
<>
|
||||
<Table.Summary.Cell align="right">
|
||||
<ResponsiveTable.Summary.Cell align="right">
|
||||
{Dinero(job.job_totals.rates.mapa.base).toFormat()}
|
||||
</Table.Summary.Cell>
|
||||
<Table.Summary.Cell align="right">
|
||||
</ResponsiveTable.Summary.Cell>
|
||||
<ResponsiveTable.Summary.Cell align="right">
|
||||
{Dinero(job.job_totals.rates.mapa.adjustment).toFormat()}
|
||||
</Table.Summary.Cell>
|
||||
<Table.Summary.Cell align="right">
|
||||
</ResponsiveTable.Summary.Cell>
|
||||
<ResponsiveTable.Summary.Cell align="right">
|
||||
{Dinero(job.job_totals.rates.mapa.total).toFormat()}
|
||||
</Table.Summary.Cell>
|
||||
</ResponsiveTable.Summary.Cell>
|
||||
</>
|
||||
)
|
||||
})}
|
||||
</Table.Summary.Row>
|
||||
<Table.Summary.Row>
|
||||
<Table.Summary.Cell>
|
||||
</ResponsiveTable.Summary.Row>
|
||||
<ResponsiveTable.Summary.Row>
|
||||
<ResponsiveTable.Summary.Cell>
|
||||
<Space wrap>
|
||||
{t("jobs.labels.mash")}
|
||||
{InstanceRenderManager({
|
||||
@@ -202,51 +204,51 @@ export default function JobTotalsTableLabor({ job }) {
|
||||
})
|
||||
})}
|
||||
</Space>
|
||||
</Table.Summary.Cell>
|
||||
<Table.Summary.Cell align="right">
|
||||
</ResponsiveTable.Summary.Cell>
|
||||
<ResponsiveTable.Summary.Cell align="right">
|
||||
<CurrencyFormatter>{job.job_totals.rates.mash.rate}</CurrencyFormatter>
|
||||
</Table.Summary.Cell>
|
||||
<Table.Summary.Cell>{job.job_totals.rates.mash.hours.toFixed(1)}</Table.Summary.Cell>
|
||||
</ResponsiveTable.Summary.Cell>
|
||||
<ResponsiveTable.Summary.Cell>{job.job_totals.rates.mash.hours.toFixed(1)}</ResponsiveTable.Summary.Cell>
|
||||
{InstanceRenderManager({
|
||||
imex: (
|
||||
<Table.Summary.Cell align="right">
|
||||
<ResponsiveTable.Summary.Cell align="right">
|
||||
{Dinero(job.job_totals.rates.mash.total).toFormat()}
|
||||
</Table.Summary.Cell>
|
||||
</ResponsiveTable.Summary.Cell>
|
||||
),
|
||||
rome: (
|
||||
<>
|
||||
<Table.Summary.Cell align="right">
|
||||
<ResponsiveTable.Summary.Cell align="right">
|
||||
{Dinero(job.job_totals.rates.mash.base).toFormat()}
|
||||
</Table.Summary.Cell>
|
||||
<Table.Summary.Cell align="right">
|
||||
</ResponsiveTable.Summary.Cell>
|
||||
<ResponsiveTable.Summary.Cell align="right">
|
||||
{Dinero(job.job_totals.rates.mash.adjustment).toFormat()}
|
||||
</Table.Summary.Cell>
|
||||
<Table.Summary.Cell align="right">
|
||||
</ResponsiveTable.Summary.Cell>
|
||||
<ResponsiveTable.Summary.Cell align="right">
|
||||
{Dinero(job.job_totals.rates.mash.total).toFormat()}
|
||||
</Table.Summary.Cell>
|
||||
</ResponsiveTable.Summary.Cell>
|
||||
</>
|
||||
)
|
||||
})}
|
||||
</Table.Summary.Row>
|
||||
<Table.Summary.Row>
|
||||
<Table.Summary.Cell>
|
||||
</ResponsiveTable.Summary.Row>
|
||||
<ResponsiveTable.Summary.Row>
|
||||
<ResponsiveTable.Summary.Cell>
|
||||
<strong>{t("jobs.labels.rates_subtotal")}</strong>
|
||||
</Table.Summary.Cell>
|
||||
<Table.Summary.Cell />
|
||||
<Table.Summary.Cell />
|
||||
</ResponsiveTable.Summary.Cell>
|
||||
<ResponsiveTable.Summary.Cell />
|
||||
<ResponsiveTable.Summary.Cell />
|
||||
{InstanceRenderManager({
|
||||
imex: null,
|
||||
rome: (
|
||||
<>
|
||||
<Table.Summary.Cell />
|
||||
<Table.Summary.Cell />
|
||||
<ResponsiveTable.Summary.Cell />
|
||||
<ResponsiveTable.Summary.Cell />
|
||||
</>
|
||||
)
|
||||
})}
|
||||
<Table.Summary.Cell align="right">
|
||||
<ResponsiveTable.Summary.Cell align="right">
|
||||
<strong>{Dinero(job.job_totals.rates.subtotal).toFormat()}</strong>
|
||||
</Table.Summary.Cell>
|
||||
</Table.Summary.Row>
|
||||
</ResponsiveTable.Summary.Cell>
|
||||
</ResponsiveTable.Summary.Row>
|
||||
</>
|
||||
)}
|
||||
/>
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { Table } from "antd";
|
||||
import ResponsiveTable from "../responsive-table/responsive-table.component";
|
||||
import Dinero from "dinero.js";
|
||||
import { useMemo, useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
@@ -65,8 +65,9 @@ export default function JobTotalsTableOther({ job }) {
|
||||
setState({ ...state, filteredInfo: filters, sortedInfo: sorter });
|
||||
};
|
||||
return (
|
||||
<Table
|
||||
<ResponsiveTable
|
||||
columns={columns}
|
||||
mobileColumnKeys={["total", "key"]}
|
||||
rowKey="key"
|
||||
pagination={false}
|
||||
onChange={handleTableChange}
|
||||
@@ -76,24 +77,24 @@ export default function JobTotalsTableOther({ job }) {
|
||||
}}
|
||||
summary={() => (
|
||||
<>
|
||||
<Table.Summary.Row>
|
||||
<Table.Summary.Cell>
|
||||
<ResponsiveTable.Summary.Row>
|
||||
<ResponsiveTable.Summary.Cell>
|
||||
<strong>{t("jobs.labels.additionaltotal")}</strong>
|
||||
</Table.Summary.Cell>
|
||||
</ResponsiveTable.Summary.Cell>
|
||||
|
||||
<Table.Summary.Cell align="right">
|
||||
<ResponsiveTable.Summary.Cell align="right">
|
||||
<strong>{Dinero(job.job_totals.additional.total).toFormat()}</strong>
|
||||
</Table.Summary.Cell>
|
||||
</Table.Summary.Row>
|
||||
<Table.Summary.Row>
|
||||
<Table.Summary.Cell>
|
||||
</ResponsiveTable.Summary.Cell>
|
||||
</ResponsiveTable.Summary.Row>
|
||||
<ResponsiveTable.Summary.Row>
|
||||
<ResponsiveTable.Summary.Cell>
|
||||
<strong>{t("jobs.labels.subletstotal")}</strong>
|
||||
</Table.Summary.Cell>
|
||||
</ResponsiveTable.Summary.Cell>
|
||||
|
||||
<Table.Summary.Cell align="right">
|
||||
<ResponsiveTable.Summary.Cell align="right">
|
||||
<strong>{Dinero(job.job_totals.parts.sublets.total).toFormat()}</strong>
|
||||
</Table.Summary.Cell>
|
||||
</Table.Summary.Row>
|
||||
</ResponsiveTable.Summary.Cell>
|
||||
</ResponsiveTable.Summary.Row>
|
||||
</>
|
||||
)}
|
||||
/>
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { Table } from "antd";
|
||||
import ResponsiveTable from "../responsive-table/responsive-table.component";
|
||||
import Dinero from "dinero.js";
|
||||
import { useMemo, useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
@@ -64,8 +64,9 @@ export default function JobTotalsTableParts({ job }) {
|
||||
setState({ ...state, filteredInfo: filters, sortedInfo: sorter });
|
||||
};
|
||||
return (
|
||||
<Table
|
||||
<ResponsiveTable
|
||||
columns={columns}
|
||||
mobileColumnKeys={["total", "id"]}
|
||||
rowKey="id"
|
||||
pagination={false}
|
||||
onChange={handleTableChange}
|
||||
@@ -75,36 +76,38 @@ export default function JobTotalsTableParts({ job }) {
|
||||
}}
|
||||
summary={() => (
|
||||
<>
|
||||
<Table.Summary.Row>
|
||||
<Table.Summary.Cell>{t("jobs.labels.prt_dsmk_total")}</Table.Summary.Cell>
|
||||
<Table.Summary.Cell align="right">
|
||||
<ResponsiveTable.Summary.Row>
|
||||
<ResponsiveTable.Summary.Cell>{t("jobs.labels.prt_dsmk_total")}</ResponsiveTable.Summary.Cell>
|
||||
<ResponsiveTable.Summary.Cell align="right">
|
||||
{Dinero(job.job_totals.parts.parts.prt_dsmk_total).toFormat()}
|
||||
</Table.Summary.Cell>
|
||||
</Table.Summary.Row>
|
||||
</ResponsiveTable.Summary.Cell>
|
||||
</ResponsiveTable.Summary.Row>
|
||||
|
||||
<Table.Summary.Row>
|
||||
<Table.Summary.Cell>
|
||||
<ResponsiveTable.Summary.Row>
|
||||
<ResponsiveTable.Summary.Cell>
|
||||
<strong>{t("jobs.labels.partstotal")}</strong>
|
||||
</Table.Summary.Cell>
|
||||
</ResponsiveTable.Summary.Cell>
|
||||
|
||||
<Table.Summary.Cell align="right">
|
||||
<ResponsiveTable.Summary.Cell align="right">
|
||||
<strong>{Dinero(job.job_totals.parts.parts.total).toFormat()}</strong>
|
||||
</Table.Summary.Cell>
|
||||
</Table.Summary.Row>
|
||||
</ResponsiveTable.Summary.Cell>
|
||||
</ResponsiveTable.Summary.Row>
|
||||
{
|
||||
//TODO:AIO This shoudl only be in the US version. need to verify whether this causes problems for the CA version.
|
||||
insuranceAdjustments.length > 0 && (
|
||||
<Table.Summary.Row>
|
||||
<Table.Summary.Cell colSpan={24}>{t("jobs.labels.profileadjustments")}</Table.Summary.Cell>
|
||||
</Table.Summary.Row>
|
||||
<ResponsiveTable.Summary.Row>
|
||||
<ResponsiveTable.Summary.Cell colSpan={24}>
|
||||
{t("jobs.labels.profileadjustments")}
|
||||
</ResponsiveTable.Summary.Cell>
|
||||
</ResponsiveTable.Summary.Row>
|
||||
)
|
||||
}
|
||||
{insuranceAdjustments.map((adj, idx) => (
|
||||
<Table.Summary.Row key={idx}>
|
||||
<Table.Summary.Cell>{t(`jobs.fields.${adj.id.toLowerCase()}`)}</Table.Summary.Cell>
|
||||
<ResponsiveTable.Summary.Row key={idx}>
|
||||
<ResponsiveTable.Summary.Cell>{t(`jobs.fields.${adj.id.toLowerCase()}`)}</ResponsiveTable.Summary.Cell>
|
||||
|
||||
<Table.Summary.Cell align="right">{adj.amount.toFormat()}</Table.Summary.Cell>
|
||||
</Table.Summary.Row>
|
||||
<ResponsiveTable.Summary.Cell align="right">{adj.amount.toFormat()}</ResponsiveTable.Summary.Cell>
|
||||
</ResponsiveTable.Summary.Row>
|
||||
))}
|
||||
</>
|
||||
)}
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { Table } from "antd";
|
||||
import ResponsiveTable from "../responsive-table/responsive-table.component";
|
||||
import Dinero from "dinero.js";
|
||||
import { useMemo } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
@@ -245,8 +245,9 @@ export function JobTotalsTableTotals({ bodyshop, job }) {
|
||||
];
|
||||
|
||||
return (
|
||||
<Table
|
||||
<ResponsiveTable
|
||||
columns={columns}
|
||||
mobileColumnKeys={["total", "key"]}
|
||||
rowKey="key"
|
||||
showHeader={false}
|
||||
pagination={false}
|
||||
|
||||
Reference in New Issue
Block a user