feature/feature/IO-3554-Form-Row-Layout - Responsive overhaul

This commit is contained in:
Dave
2026-02-26 15:56:57 -05:00
parent 226cc801ae
commit fd6f46e39d
99 changed files with 807 additions and 443 deletions

View File

@@ -1,5 +1,6 @@
import { EditFilled } from "@ant-design/icons";
import { Alert, Card, Col, Row, Space, Table, Typography } from "antd";
import { Alert, Card, Col, Row, Space, Typography } from "antd";
import ResponsiveTable from "../responsive-table/responsive-table.component";
import { useEffect, useMemo, useState } from "react";
import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
@@ -196,8 +197,9 @@ export function LaborAllocationsTable({
<Row gutter={[16, 16]}>
<Col span={24}>
<Card title={t("jobs.labels.laborallocations")}>
<Table
<ResponsiveTable
columns={columns}
mobileColumnKeys={["line_desc", "total", "cost_center", "hrs_claimed"]}
rowKey={(record) => `${record.cost_center} ${record.mod_lbr_ty}`}
pagination={false}
onChange={handleTableChange}
@@ -215,16 +217,22 @@ export function LaborAllocationsTable({
x: true
}}
summary={() => (
<Table.Summary.Row>
<Table.Summary.Cell>
<ResponsiveTable.Summary.Row>
<ResponsiveTable.Summary.Cell>
<Typography.Title level={4} style={{ margin: 0, lineHeight: 1 }}>
{t("general.labels.totals")}
</Typography.Title>
</Table.Summary.Cell>
<Table.Summary.Cell align="right">{summary.hrs_total.toFixed(1)}</Table.Summary.Cell>
<Table.Summary.Cell align="right">{summary.hrs_claimed.toFixed(1)}</Table.Summary.Cell>
<Table.Summary.Cell align="right">{summary.adjustments.toFixed(1)}</Table.Summary.Cell>
<Table.Summary.Cell align="right">
</ResponsiveTable.Summary.Cell>
<ResponsiveTable.Summary.Cell align="right">
{summary.hrs_total.toFixed(1)}
</ResponsiveTable.Summary.Cell>
<ResponsiveTable.Summary.Cell align="right">
{summary.hrs_claimed.toFixed(1)}
</ResponsiveTable.Summary.Cell>
<ResponsiveTable.Summary.Cell align="right">
{summary.adjustments.toFixed(1)}
</ResponsiveTable.Summary.Cell>
<ResponsiveTable.Summary.Cell align="right">
<Typography.Text
style={{
fontWeight: "bold",
@@ -233,8 +241,8 @@ export function LaborAllocationsTable({
>
{(Math.abs(summary.difference) < 0.05 ? 0 : summary.difference).toFixed(1)}
</Typography.Text>
</Table.Summary.Cell>
</Table.Summary.Row>
</ResponsiveTable.Summary.Cell>
</ResponsiveTable.Summary.Row>
)}
/>
</Card>
@@ -242,8 +250,9 @@ export function LaborAllocationsTable({
{convertedLines && convertedLines.length > 0 && (
<Col span={24}>
<Card title={t("jobs.labels.convertedtolabor")}>
<Table
<ResponsiveTable
columns={convertedTableCols}
mobileColumnKeys={["line_desc", "total", "cost_center", "hrs_claimed"]}
rowKey="id"
pagination={false}
dataSource={hasTimeTicketAccess ? convertedLines : []}

View File

@@ -1,4 +1,5 @@
import { Alert, Button, Card, Col, Row, Space, Table, Typography } from "antd";
import { Alert, Button, Card, Col, Row, Space, Typography } from "antd";
import ResponsiveTable from "../responsive-table/responsive-table.component";
import { SyncOutlined } from "@ant-design/icons";
import axios from "axios";
import _ from "lodash";
@@ -251,8 +252,9 @@ export function PayrollLaborAllocationsTable({
</Space>
}
>
<Table
<ResponsiveTable
columns={columns}
mobileColumnKeys={["line_desc", "employeeid", "mod_lbr_ty", "rate"]}
rowKey={(record) => `${record.employeeid} ${record.mod_lbr_ty}`}
pagination={false}
onChange={handleTableChange}
@@ -270,16 +272,16 @@ export function PayrollLaborAllocationsTable({
})
}}
summary={() => (
<Table.Summary.Row>
<Table.Summary.Cell>
<ResponsiveTable.Summary.Row>
<ResponsiveTable.Summary.Cell>
<Typography.Title level={4}>{t("general.labels.totals")}</Typography.Title>
</Table.Summary.Cell>
<Table.Summary.Cell></Table.Summary.Cell>
<Table.Summary.Cell>{summary.hrs_total.toFixed(5)}</Table.Summary.Cell>
<Table.Summary.Cell>{summary.hrs_claimed.toFixed(5)}</Table.Summary.Cell>
</ResponsiveTable.Summary.Cell>
<ResponsiveTable.Summary.Cell></ResponsiveTable.Summary.Cell>
<ResponsiveTable.Summary.Cell>{summary.hrs_total.toFixed(5)}</ResponsiveTable.Summary.Cell>
<ResponsiveTable.Summary.Cell>{summary.hrs_claimed.toFixed(5)}</ResponsiveTable.Summary.Cell>
<Table.Summary.Cell>{summary.difference.toFixed(5)}</Table.Summary.Cell>
</Table.Summary.Row>
<ResponsiveTable.Summary.Cell>{summary.difference.toFixed(5)}</ResponsiveTable.Summary.Cell>
</ResponsiveTable.Summary.Row>
)}
/>
</Card>
@@ -287,8 +289,9 @@ export function PayrollLaborAllocationsTable({
{convertedLines && convertedLines.length > 0 && (
<Col span={24}>
<Card title={t("jobs.labels.convertedtolabor")}>
<Table
<ResponsiveTable
columns={convertedTableCols}
mobileColumnKeys={["line_desc", "employeeid", "mod_lbr_ty", "rate"]}
rowKey="id"
pagination={false}
dataSource={convertedLines}