From 6c1a0cff8d0829a2d87b0c91dab4738d5de54e9d Mon Sep 17 00:00:00 2001 From: Allan Carr Date: Thu, 17 Aug 2023 16:05:33 -0700 Subject: [PATCH 1/2] IO-2384 Default Sort Order for Related Jobs --- .../owner-detail-jobs.component.jsx | 23 +++++++++++++++++++ client/src/graphql/owners.queries.js | 2 +- 2 files changed, 24 insertions(+), 1 deletion(-) 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 c69712a0b..aae0633e1 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 @@ -6,6 +6,7 @@ import { Link } from "react-router-dom"; import { createStructuredSelector } from "reselect"; import { selectBodyshop } from "../../redux/user/user.selectors"; import CurrencyFormatter from "../../utils/CurrencyFormatter"; +import { alphaSort, statusSort } from "../../utils/sorters"; import OwnerDetailUpdateJobsComponent from "../owner-detail-update-jobs/owner-detail-update-jobs.component"; const mapStateToProps = createStructuredSelector({ @@ -15,6 +16,15 @@ const mapStateToProps = createStructuredSelector({ function OwnerDetailJobsComponent({ bodyshop, owner }) { 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 = [ { title: t("jobs.fields.ro_number"), @@ -26,6 +36,9 @@ function OwnerDetailJobsComponent({ bodyshop, owner }) { {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.vehicle"), @@ -46,11 +59,17 @@ function OwnerDetailJobsComponent({ bodyshop, owner }) { 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), + sortOrder: + state.sortedInfo.columnKey === "status" && state.sortedInfo.order, }, { @@ -60,6 +79,9 @@ function OwnerDetailJobsComponent({ bodyshop, owner }) { render: (text, record) => ( {record.clm_total} ), + sorter: (a, b) => a.clm_total - b.clm_total, + sortOrder: + state.sortedInfo.columnKey === "clm_total" && state.sortedInfo.order, }, ]; @@ -80,6 +102,7 @@ function OwnerDetailJobsComponent({ bodyshop, owner }) { scroll={{ x: true }} rowKey="id" dataSource={owner.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 440dc3011..7dee25738 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 { + jobs(order_by: {date_open: desc}) { id ro_number clm_no From 10fceb7ddfad2d37a47e4757524c54d2e06af120 Mon Sep 17 00:00:00 2001 From: Allan Carr Date: Thu, 17 Aug 2023 16:18:56 -0700 Subject: [PATCH 2/2] IO-2384 Extend to Vehicle Related ROs --- .../owner-detail-jobs.component.jsx | 2 +- .../vehicle-detail-jobs.component.jsx | 24 ++++++++++++++++++- client/src/graphql/owners.queries.js | 2 +- client/src/graphql/vehicles.queries.js | 3 +-- 4 files changed, 26 insertions(+), 5 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 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