- Merge client update into test-beta
Signed-off-by: Dave Richer <dave@imexsystems.ca>
This commit is contained in:
Dave Richer
@@ -1,134 +1,134 @@
|
||||
import { Table, Typography } from "antd";
|
||||
import React, { useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import {Table, Typography} from "antd";
|
||||
import React, {useState} from "react";
|
||||
import {useTranslation} from "react-i18next";
|
||||
import CurrencyFormatter from "../../utils/CurrencyFormatter";
|
||||
import { alphaSort } from "../../utils/sorters";
|
||||
import {alphaSort} from "../../utils/sorters";
|
||||
import "./job-reconciliation-parts-table.styles.scss";
|
||||
|
||||
export default function JobReconcilitionPartsTable({
|
||||
jobLineState,
|
||||
jobLineData,
|
||||
}) {
|
||||
const { t } = useTranslation();
|
||||
jobLineState,
|
||||
jobLineData,
|
||||
}) {
|
||||
const {t} = useTranslation();
|
||||
|
||||
const [state, setState] = useState({
|
||||
sortedInfo: {},
|
||||
});
|
||||
const [state, setState] = useState({
|
||||
sortedInfo: {},
|
||||
});
|
||||
|
||||
const [selectedLines, setSelectedLines] = jobLineState;
|
||||
const [selectedLines, setSelectedLines] = jobLineState;
|
||||
|
||||
const columns = [
|
||||
{
|
||||
title: t("joblines.fields.line_desc"),
|
||||
dataIndex: "line_desc",
|
||||
key: "line_desc",
|
||||
sorter: (a, b) => alphaSort(a.line_desc, b.line_desc),
|
||||
ellipses: true,
|
||||
sortOrder:
|
||||
state.sortedInfo.columnKey === "line_desc" && state.sortedInfo.order,
|
||||
},
|
||||
// {
|
||||
// title: t("joblines.fields.oem_partno"),
|
||||
// dataIndex: "oem_partno",
|
||||
// key: "oem_partno",
|
||||
// sorter: (a, b) =>
|
||||
// alphaSort(
|
||||
// a.oem_partno ? a.oem_partno : a.op_code_desc,
|
||||
// b.oem_partno ? b.oem_partno : b.op_code_desc
|
||||
// ),
|
||||
// sortOrder:
|
||||
// state.sortedInfo.columnKey === "oem_partno" && state.sortedInfo.order,
|
||||
const columns = [
|
||||
{
|
||||
title: t("joblines.fields.line_desc"),
|
||||
dataIndex: "line_desc",
|
||||
key: "line_desc",
|
||||
sorter: (a, b) => alphaSort(a.line_desc, b.line_desc),
|
||||
ellipses: true,
|
||||
sortOrder:
|
||||
state.sortedInfo.columnKey === "line_desc" && state.sortedInfo.order,
|
||||
},
|
||||
// {
|
||||
// title: t("joblines.fields.oem_partno"),
|
||||
// dataIndex: "oem_partno",
|
||||
// key: "oem_partno",
|
||||
// sorter: (a, b) =>
|
||||
// alphaSort(
|
||||
// a.oem_partno ? a.oem_partno : a.op_code_desc,
|
||||
// b.oem_partno ? b.oem_partno : b.op_code_desc
|
||||
// ),
|
||||
// sortOrder:
|
||||
// state.sortedInfo.columnKey === "oem_partno" && state.sortedInfo.order,
|
||||
|
||||
// render: (text, record) => (
|
||||
// <span>
|
||||
// {record.oem_partno ? record.oem_partno : record.op_code_desc}
|
||||
// </span>
|
||||
// ),
|
||||
// },
|
||||
// {
|
||||
// title: t("joblines.fields.part_type"),
|
||||
// dataIndex: "part_type",
|
||||
// key: "part_type",
|
||||
// sorter: (a, b) => alphaSort(a.part_type, b.part_type),
|
||||
// sortOrder:
|
||||
// state.sortedInfo.columnKey === "part_type" && state.sortedInfo.order,
|
||||
// },
|
||||
{
|
||||
title: t("joblines.fields.act_price"),
|
||||
dataIndex: "act_price",
|
||||
key: "act_price",
|
||||
sorter: (a, b) => a.act_price - b.act_price,
|
||||
width: "7rem",
|
||||
sortOrder:
|
||||
state.sortedInfo.columnKey === "act_price" && state.sortedInfo.order,
|
||||
// render: (text, record) => (
|
||||
// <span>
|
||||
// {record.oem_partno ? record.oem_partno : record.op_code_desc}
|
||||
// </span>
|
||||
// ),
|
||||
// },
|
||||
// {
|
||||
// title: t("joblines.fields.part_type"),
|
||||
// dataIndex: "part_type",
|
||||
// key: "part_type",
|
||||
// sorter: (a, b) => alphaSort(a.part_type, b.part_type),
|
||||
// sortOrder:
|
||||
// state.sortedInfo.columnKey === "part_type" && state.sortedInfo.order,
|
||||
// },
|
||||
{
|
||||
title: t("joblines.fields.act_price"),
|
||||
dataIndex: "act_price",
|
||||
key: "act_price",
|
||||
sorter: (a, b) => a.act_price - b.act_price,
|
||||
width: "7rem",
|
||||
sortOrder:
|
||||
state.sortedInfo.columnKey === "act_price" && state.sortedInfo.order,
|
||||
|
||||
render: (text, record) => (
|
||||
<CurrencyFormatter>{record.act_price}</CurrencyFormatter>
|
||||
),
|
||||
},
|
||||
{
|
||||
title: t("joblines.fields.part_qty"),
|
||||
dataIndex: "part_qty",
|
||||
key: "part_qty",
|
||||
width: "4rem",
|
||||
},
|
||||
{
|
||||
title: t("joblines.fields.total"),
|
||||
dataIndex: "total",
|
||||
width: "7rem",
|
||||
key: "total",
|
||||
sorter: (a, b) => a.act_price * a.part_qty - b.act_price * b.part_qty,
|
||||
sortOrder:
|
||||
state.sortedInfo.columnKey === "total" && state.sortedInfo.order,
|
||||
render: (text, record) => (
|
||||
<CurrencyFormatter>{record.act_price}</CurrencyFormatter>
|
||||
),
|
||||
},
|
||||
{
|
||||
title: t("joblines.fields.part_qty"),
|
||||
dataIndex: "part_qty",
|
||||
key: "part_qty",
|
||||
width: "4rem",
|
||||
},
|
||||
{
|
||||
title: t("joblines.fields.total"),
|
||||
dataIndex: "total",
|
||||
width: "7rem",
|
||||
key: "total",
|
||||
sorter: (a, b) => a.act_price * a.part_qty - b.act_price * b.part_qty,
|
||||
sortOrder:
|
||||
state.sortedInfo.columnKey === "total" && state.sortedInfo.order,
|
||||
|
||||
render: (text, record) => (
|
||||
<CurrencyFormatter>
|
||||
{record.act_price * record.part_qty}
|
||||
</CurrencyFormatter>
|
||||
),
|
||||
},
|
||||
render: (text, record) => (
|
||||
<CurrencyFormatter>
|
||||
{record.act_price * record.part_qty}
|
||||
</CurrencyFormatter>
|
||||
),
|
||||
},
|
||||
|
||||
{
|
||||
title: t("joblines.fields.status"),
|
||||
dataIndex: "status",
|
||||
key: "status",
|
||||
sorter: (a, b) => alphaSort(a.status, b.status),
|
||||
width: "6rem",
|
||||
sortOrder:
|
||||
state.sortedInfo.columnKey === "status" && state.sortedInfo.order,
|
||||
},
|
||||
];
|
||||
{
|
||||
title: t("joblines.fields.status"),
|
||||
dataIndex: "status",
|
||||
key: "status",
|
||||
sorter: (a, b) => alphaSort(a.status, b.status),
|
||||
width: "6rem",
|
||||
sortOrder:
|
||||
state.sortedInfo.columnKey === "status" && state.sortedInfo.order,
|
||||
},
|
||||
];
|
||||
|
||||
const handleTableChange = (pagination, filters, sorter) => {
|
||||
setState({ ...state, filteredInfo: filters, sortedInfo: sorter });
|
||||
};
|
||||
const handleOnRowClick = (selectedRecordKeys, selectedRecords) => {
|
||||
setSelectedLines(selectedRecordKeys);
|
||||
};
|
||||
const handleTableChange = (pagination, filters, sorter) => {
|
||||
setState({...state, filteredInfo: filters, sortedInfo: sorter});
|
||||
};
|
||||
const handleOnRowClick = (selectedRecordKeys, selectedRecords) => {
|
||||
setSelectedLines(selectedRecordKeys);
|
||||
};
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Typography.Title level={4}>{t("jobs.labels.lines")}</Typography.Title>
|
||||
<Table
|
||||
pagination={false}
|
||||
columns={columns}
|
||||
size="small"
|
||||
scroll={{ y: "60vh" }}
|
||||
rowKey="id"
|
||||
dataSource={jobLineData}
|
||||
onChange={handleTableChange}
|
||||
rowSelection={{
|
||||
onChange: handleOnRowClick,
|
||||
getCheckboxProps: (record) => ({
|
||||
disabled: record.removed,
|
||||
}),
|
||||
selectedRowKeys: selectedLines,
|
||||
}}
|
||||
rowClassName={(record) => record.removed && "text-strikethrough"}
|
||||
/>
|
||||
<div style={{ fontStyle: "italic", margin: "4px" }}>
|
||||
{t("jobs.labels.reconciliation.removedpartsstrikethrough")}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
return (
|
||||
<div>
|
||||
<Typography.Title level={4}>{t("jobs.labels.lines")}</Typography.Title>
|
||||
<Table
|
||||
pagination={false}
|
||||
columns={columns}
|
||||
size="small"
|
||||
scroll={{y: "60vh"}}
|
||||
rowKey="id"
|
||||
dataSource={jobLineData}
|
||||
onChange={handleTableChange}
|
||||
rowSelection={{
|
||||
onChange: handleOnRowClick,
|
||||
getCheckboxProps: (record) => ({
|
||||
disabled: record.removed,
|
||||
}),
|
||||
selectedRowKeys: selectedLines,
|
||||
}}
|
||||
rowClassName={(record) => record.removed && "text-strikethrough"}
|
||||
/>
|
||||
<div style={{fontStyle: "italic", margin: "4px"}}>
|
||||
{t("jobs.labels.reconciliation.removedpartsstrikethrough")}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user