Files
bodyshop/client/src/components/owner-detail-jobs/owner-detail-jobs.component.jsx

103 lines
3.0 KiB
JavaScript

import { Table } from "antd";
import React, { useState } from "react";
import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
import { Link } from "react-router-dom";
import { createStructuredSelector } from "reselect";
import { selectBodyshop } from "../../redux/user/user.selectors";
import CurrencyFormatter from "../../utils/CurrencyFormatter";
import OwnerDetailUpdateJobsComponent from "../owner-detail-update-jobs/owner-detail-update-jobs.component";
const mapStateToProps = createStructuredSelector({
bodyshop: selectBodyshop,
});
function OwnerDetailJobsComponent({ bodyshop, owner }) {
const { t } = useTranslation();
const [selectedJobs, setSelectedJobs] = useState([]);
const columns = [
{
title: t("jobs.fields.ro_number"),
dataIndex: "ro_number",
key: "ro_number",
ellipsis: true,
render: (text, record) => (
<Link to={`/manage/jobs/${record.id}`}>
{record.ro_number ? record.ro_number : `EST ${record.est_number}`}
</Link>
),
},
{
title: t("jobs.fields.vehicle"),
dataIndex: "vehicleid",
key: "vehicleid",
render: (text, record) => (
<Link to={`/manage/vehicles/${record.vehicleid}`}>
{`${record.v_model_yr} ${record.v_make_desc} ${record.v_model_desc}`}
</Link>
),
},
{
title: t("jobs.fields.clm_no"),
dataIndex: "clm_no",
key: "clm_no",
},
{
title: t("jobs.fields.status"),
dataIndex: "status",
key: "status",
},
{
title: t("jobs.fields.clm_total"),
dataIndex: "clm_total",
key: "clm_total",
render: (text, record) => (
<CurrencyFormatter>{record.clm_total}</CurrencyFormatter>
),
},
];
return (
<Table
title={() => (
<div>
<OwnerDetailUpdateJobsComponent
selectedJobs={selectedJobs}
owner={owner}
disabled={selectedJobs.length === 0}
/>
</div>
)}
pagination={{ position: "bottom" }}
columns={columns}
scroll={{ x: true }}
rowKey='id'
dataSource={owner.jobs}
rowSelection={{
onSelect: (record, selected, selectedRows) => {
setSelectedJobs(selectedRows ? selectedRows.map((i) => i.id) : []);
},
onSelectAll: (selected, selectedRows, changeRows) => {
setSelectedJobs(
selectedRows
? selectedRows
.filter((i) =>
bodyshop.md_ro_statuses.open_statuses.includes(i.status)
)
.map((i) => i.id)
: []
);
},
selectedRowKeys: selectedJobs,
getCheckboxProps: (record) => ({
disabled: bodyshop.md_ro_statuses.open_statuses
? !bodyshop.md_ro_statuses.open_statuses.includes(record.status)
: true,
}),
}}
/>
);
}
export default connect(mapStateToProps, null)(OwnerDetailJobsComponent);