diff --git a/client/src/components/owner-detail-jobs/owner-detail-jobs.component.jsx b/client/src/components/owner-detail-jobs/owner-detail-jobs.component.jsx index aae0633e1..360954101 100644 --- a/client/src/components/owner-detail-jobs/owner-detail-jobs.component.jsx +++ b/client/src/components/owner-detail-jobs/owner-detail-jobs.component.jsx @@ -67,7 +67,7 @@ function OwnerDetailJobsComponent({ bodyshop, owner }) { title: t("jobs.fields.status"), dataIndex: "status", key: "status", - sorter: (a, b) => statusSort(a.status, b.status), + sorter: (a, b) => statusSort(a.status, b.status, bodyshop.md_ro_statuses.statuses), sortOrder: state.sortedInfo.columnKey === "status" && state.sortedInfo.order, }, diff --git a/client/src/components/vehicle-detail-jobs/vehicle-detail-jobs.component.jsx b/client/src/components/vehicle-detail-jobs/vehicle-detail-jobs.component.jsx index 490e2b5ba..403d223bf 100644 --- a/client/src/components/vehicle-detail-jobs/vehicle-detail-jobs.component.jsx +++ b/client/src/components/vehicle-detail-jobs/vehicle-detail-jobs.component.jsx @@ -6,8 +6,9 @@ import { Link } from "react-router-dom"; import { createStructuredSelector } from "reselect"; import { selectBodyshop } from "../../redux/user/user.selectors"; import CurrencyFormatter from "../../utils/CurrencyFormatter"; -import VehicleDetailUpdateJobsComponent from "../vehicle-detail-update-jobs/vehicle-detail-update-jobs.component"; +import { alphaSort, statusSort } from "../../utils/sorters"; import OwnerNameDisplay from "../owner-name-display/owner-name-display.component"; +import VehicleDetailUpdateJobsComponent from "../vehicle-detail-update-jobs/vehicle-detail-update-jobs.component"; const mapStateToProps = createStructuredSelector({ bodyshop: selectBodyshop, @@ -16,6 +17,14 @@ const mapStateToProps = createStructuredSelector({ export function VehicleDetailJobsComponent({ vehicle, bodyshop }) { const { t } = useTranslation(); const [selectedJobs, setSelectedJobs] = useState([]); + const [state, setState] = useState({ + sortedInfo: {}, + filteredInfo: { text: "" }, + }); + + const handleTableChange = (pagination, filters, sorter) => { + setState({ ...state, filteredInfo: filters, sortedInfo: sorter }); + }; const columns = [ { @@ -28,6 +37,9 @@ export function VehicleDetailJobsComponent({ vehicle, bodyshop }) { {record.ro_number || t("general.labels.na")} ), + sorter: (a, b) => alphaSort(a.ro_number, b.ro_number), + sortOrder: + state.sortedInfo.columnKey === "ro_number" && state.sortedInfo.order, }, { title: t("jobs.fields.owner"), @@ -43,11 +55,17 @@ export function VehicleDetailJobsComponent({ vehicle, bodyshop }) { title: t("jobs.fields.clm_no"), dataIndex: "clm_no", key: "clm_no", + sorter: (a, b) => alphaSort(a.clm_no, b.clm_no), + sortOrder: + state.sortedInfo.columnKey === "clm_no" && state.sortedInfo.order, }, { title: t("jobs.fields.status"), dataIndex: "status", key: "status", + sorter: (a, b) => statusSort(a.status, b.status, bodyshop.md_ro_statuses.statuses), + sortOrder: + state.sortedInfo.columnKey === "status" && state.sortedInfo.order, }, { @@ -57,6 +75,9 @@ export function VehicleDetailJobsComponent({ vehicle, bodyshop }) { render: (text, record) => ( {record.clm_total} ), + sorter: (a, b) => a.clm_total - b.clm_total, + sortOrder: + state.sortedInfo.columnKey === "clm_total" && state.sortedInfo.order, }, ]; @@ -76,6 +97,7 @@ export function VehicleDetailJobsComponent({ vehicle, bodyshop }) { rowKey="id" scroll={{ x: true }} dataSource={vehicle.jobs} + onChange={handleTableChange} rowSelection={{ onSelect: (record, selected, selectedRows) => { setSelectedJobs(selectedRows ? selectedRows.map((i) => i.id) : []); diff --git a/client/src/graphql/owners.queries.js b/client/src/graphql/owners.queries.js index 7dee25738..a4e5d1c80 100644 --- a/client/src/graphql/owners.queries.js +++ b/client/src/graphql/owners.queries.js @@ -69,7 +69,7 @@ export const QUERY_OWNER_BY_ID = gql` preferred_contact note tax_number - jobs(order_by: {date_open: desc}) { + jobs(order_by: { date_open: desc }) { id ro_number clm_no diff --git a/client/src/graphql/vehicles.queries.js b/client/src/graphql/vehicles.queries.js index 9fa2dd837..9df3c4238 100644 --- a/client/src/graphql/vehicles.queries.js +++ b/client/src/graphql/vehicles.queries.js @@ -28,11 +28,10 @@ export const QUERY_VEHICLE_BY_ID = gql` updated_at trim_color notes - jobs { + jobs(order_by: { date_open: desc }) { id ro_number ownr_fn - ownr_ln owner { id