From 947a3c6a88139462fae4a1235bb9dbeb1d70da72 Mon Sep 17 00:00:00 2001 From: Allan Carr Date: Wed, 13 Mar 2024 12:31:51 -0700 Subject: [PATCH] IO-2671 Add in appropriate sorters at same time Signed-off-by: Allan Carr --- .../owner-detail-jobs.component.jsx | 19 +++++++++++++++++-- .../vehicle-detail-jobs.component.jsx | 16 ++++++++++++++-- .../vehicles-list/vehicles-list.component.jsx | 11 ++++++++--- 3 files changed, 39 insertions(+), 7 deletions(-) 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 360954101..d47be4d1f 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 @@ -24,7 +24,7 @@ function OwnerDetailJobsComponent({ bodyshop, owner }) { const handleTableChange = (pagination, filters, sorter) => { setState({ ...state, filteredInfo: filters, sortedInfo: sorter }); }; - + const columns = [ { title: t("jobs.fields.ro_number"), @@ -44,6 +44,15 @@ function OwnerDetailJobsComponent({ bodyshop, owner }) { title: t("jobs.fields.vehicle"), dataIndex: "vehicleid", key: "vehicleid", + sorter: (a, b) => + alphaSort( + `${a.v_model_yr || ""} ${a.v_make_desc || ""} ${ + a.v_model_desc || "" + }`, + `${b.v_model_yr || ""} ${b.v_make_desc || ""} ${b.v_model_desc || ""}` + ), + sortOrder: + state.sortedInfo.columnKey === "vehicleid" && state.sortedInfo.order, render: (text, record) => record.vehicleid ? ( @@ -67,9 +76,15 @@ function OwnerDetailJobsComponent({ bodyshop, owner }) { title: t("jobs.fields.status"), dataIndex: "status", key: "status", - sorter: (a, b) => statusSort(a.status, b.status, bodyshop.md_ro_statuses.statuses), + sorter: (a, b) => + statusSort(a.status, b.status, bodyshop.md_ro_statuses.statuses), sortOrder: state.sortedInfo.columnKey === "status" && state.sortedInfo.order, + filters: bodyshop.md_ro_statuses.statuses.map((status) => ({ + text: status, + value: status, + })), + onFilter: (value, record) => value.includes(record.status), }, { 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 403d223bf..370142a2a 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 @@ -7,7 +7,9 @@ import { createStructuredSelector } from "reselect"; import { selectBodyshop } from "../../redux/user/user.selectors"; import CurrencyFormatter from "../../utils/CurrencyFormatter"; import { alphaSort, statusSort } from "../../utils/sorters"; -import OwnerNameDisplay from "../owner-name-display/owner-name-display.component"; +import OwnerNameDisplay, { + OwnerNameDisplayFunction, +} from "../owner-name-display/owner-name-display.component"; import VehicleDetailUpdateJobsComponent from "../vehicle-detail-update-jobs/vehicle-detail-update-jobs.component"; const mapStateToProps = createStructuredSelector({ @@ -45,6 +47,10 @@ export function VehicleDetailJobsComponent({ vehicle, bodyshop }) { title: t("jobs.fields.owner"), dataIndex: "owner", key: "owner", + sorter: (a, b) => + alphaSort(OwnerNameDisplayFunction(a), OwnerNameDisplayFunction(b)), + sortOrder: + state.sortedInfo.columnKey === "owner" && state.sortedInfo.order, render: (text, record) => ( @@ -63,9 +69,15 @@ export function VehicleDetailJobsComponent({ vehicle, bodyshop }) { title: t("jobs.fields.status"), dataIndex: "status", key: "status", - sorter: (a, b) => statusSort(a.status, b.status, bodyshop.md_ro_statuses.statuses), + sorter: (a, b) => + statusSort(a.status, b.status, bodyshop.md_ro_statuses.statuses), sortOrder: state.sortedInfo.columnKey === "status" && state.sortedInfo.order, + filters: bodyshop.md_ro_statuses.statuses.map((status) => ({ + text: status, + value: status, + })), + onFilter: (value, record) => value.includes(record.status), }, { diff --git a/client/src/components/vehicles-list/vehicles-list.component.jsx b/client/src/components/vehicles-list/vehicles-list.component.jsx index bb1a97183..8a6f9ea61 100644 --- a/client/src/components/vehicles-list/vehicles-list.component.jsx +++ b/client/src/components/vehicles-list/vehicles-list.component.jsx @@ -4,8 +4,9 @@ import queryString from "query-string"; import React, { useState } from "react"; import { useTranslation } from "react-i18next"; import { Link, useHistory, useLocation } from "react-router-dom"; +import { pageLimit } from "../../utils/config"; import VehicleVinDisplay from "../vehicle-vin-display/vehicle-vin-display.component"; -import {pageLimit} from "../../utils/config"; +import { alphaSort } from './../../utils/sorters'; export default function VehiclesListComponent({ loading, vehicles, @@ -31,6 +32,8 @@ export default function VehiclesListComponent({ title: t("vehicles.fields.v_vin"), dataIndex: "v_vin", key: "v_vin", + sorter: (a, b) => alphaSort(a.v_vin, b.v_vin), + sortOrder: state.sortedInfo.columnKey === "v_vin" && state.sortedInfo.order, render: (text, record) => ( {record.v_vin || "N/A"} @@ -51,8 +54,10 @@ export default function VehiclesListComponent({ }, { title: t("vehicles.fields.plate_no"), - dataIndex: "plate", - key: "plate", + dataIndex: "plate_no", + key: "plate_no", + sorter: (a, b) => alphaSort(a.plate_no, b.plate_no), + sortOrder: state.sortedInfo.columnKey === "plate_no" && state.sortedInfo.order, render: (text, record) => { return ( {`${record.plate_st || ""} | ${record.plate_no || ""}`}