IO-2030 Change & Add Columns, Add Sorters and Filters

client/src/graphql/jobs.queries.js

@@ -112,7 +112,6 @@ export const QUERY_PARTS_QUEUE = gql`
     $statuses: [String!]!
     $offset: Int
     $limit: Int
-    $order: [jobs_order_by!]
   ) {
     jobs_aggregate(where: { _and: [{ status: { _in: $statuses } }] }) {
       aggregate {
@@ -125,7 +124,7 @@ export const QUERY_PARTS_QUEUE = gql`
       }
       offset: $offset
       limit: $limit
-      order_by: $order
+      order_by: { ro_number: desc }
     ) {
       ownr_fn
       ownr_ln
@@ -142,7 +141,9 @@ export const QUERY_PARTS_QUEUE = gql`
       v_color
       vehicleid
       scheduled_in
+      scheduled_completion
       id
+      ins_co_nm
       clm_no
       ro_number
       status

client/src/pages/parts-queue/parts-queue.page.component.jsx

@@ -11,14 +11,17 @@ import { createStructuredSelector } from "reselect";
 import AlertComponent from "../../components/alert/alert.component";
 import JobPartsQueueCount from "../../components/job-parts-queue-count/job-parts-queue-count.component";
 import JobRemoveFromPartsQueue from "../../components/job-remove-from-parst-queue/job-remove-from-parts-queue.component";
-import OwnerNameDisplay from "../../components/owner-name-display/owner-name-display.component";
+import OwnerNameDisplay, {
+  OwnerNameDisplayFunction,
+} from "../../components/owner-name-display/owner-name-display.component";
 import ProductionListColumnComment from "../../components/production-list-columns/production-list-columns.comment.component";
 import { QUERY_PARTS_QUEUE } from "../../graphql/jobs.queries";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import { DateTimeFormatter, TimeAgoFormatter } from "../../utils/DateFormatter";
+import { onlyUnique } from "../../utils/arrayHelper";
+import { pageLimit } from "../../utils/config";
 import { alphaSort, dateSort } from "../../utils/sorters";
 import useLocalStorage from "../../utils/useLocalStorage";
-import {pageLimit} from "../../utils/config";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -26,12 +29,7 @@ const mapStateToProps = createStructuredSelector({
 
 export function PartsQueuePageComponent({ bodyshop }) {
   const searchParams = queryString.parse(useLocation().search);
-  const {
+  const { sortcolumn, sortorder, statusFilters } = searchParams;
-    //page,
-    sortcolumn,
-    sortorder,
-    statusFilters,
-  } = searchParams;
   const history = useHistory();
   const [filter, setFilter] = useLocalStorage("filter_parts_queue", null);
 
@@ -39,19 +37,8 @@ export function PartsQueuePageComponent({ bodyshop }) {
     fetchPolicy: "network-only",
     nextFetchPolicy: "network-only",
     variables: {
-      // offset: page ? (page - 1) * 25 : 0,
-      // limit: 25,
       statuses: (statusFilters && JSON.parse(statusFilters)) ||
         bodyshop.md_ro_statuses.active_statuses || ["Open", "Open*"],
-      order: [
-        {
-          [sortcolumn || "ro_number"]: sortorder
-            ? sortorder === "descend"
-              ? "desc"
-              : "asc"
-            : "desc",
-        },
-      ],
     },
   });
 
@@ -125,7 +112,8 @@ export function PartsQueuePageComponent({ bodyshop }) {
       title: t("jobs.fields.owner"),
       dataIndex: "ownr_ln",
       key: "ownr_ln",
-      sorter: (a, b) => alphaSort(a.ownr_ln, b.ownr_ln),
+      sorter: (a, b) =>
+        alphaSort(OwnerNameDisplayFunction(a), OwnerNameDisplayFunction(b)),
       sortOrder: sortcolumn === "ownr_ln" && sortorder,
       render: (text, record) => {
         return record.ownerid ? (
@@ -139,6 +127,56 @@ export function PartsQueuePageComponent({ bodyshop }) {
         );
       },
     },
+    {
+      title: t("jobs.fields.vehicle"),
+      dataIndex: "vehicle",
+      key: "vehicle",
+      ellipsis: true,
+      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: sortcolumn === "vehicle" && sortorder,
+      render: (text, record) => {
+        return record.vehicleid ? (
+          <Link to={"/manage/vehicles/" + record.vehicleid}>
+            {`${record.v_model_yr || ""} ${record.v_make_desc || ""} ${
+              record.v_model_desc || ""
+            }`}
+          </Link>
+        ) : (
+          <span>{`${record.v_model_yr || ""} ${record.v_make_desc || ""} ${
+            record.v_model_desc || ""
+          }`}</span>
+        );
+      },
+    },
+    {
+      title: t("jobs.fields.ins_co_nm_short"),
+      dataIndex: "ins_co_nm",
+      key: "ins_co_nm",
+      ellipsis: true,
+      sorter: (a, b) => alphaSort(a.ins_co_nm, b.ins_co_nm),
+      sortOrder: sortcolumn === "ins_co_nm" && sortorder,
+      filteredValue: filter?.ins_co_nm || null,
+      filters:
+        (jobs &&
+          jobs
+            .map((j) => j.ins_co_nm)
+            .filter(onlyUnique)
+            .map((s) => {
+              return {
+                text: s || "No Ins. Co.*",
+                value: [s],
+              };
+            })
+            .sort((a, b) => alphaSort(a.text, b.text))) ||
+        [],
+      onFilter: (value, record) => value.includes(record.ins_co_nm),
+    },
     {
       title: t("jobs.fields.status"),
       dataIndex: "status",
@@ -170,23 +208,16 @@ export function PartsQueuePageComponent({ bodyshop }) {
       ),
     },
     {
-      title: t("jobs.fields.vehicle"),
+      title: t("jobs.fields.scheduled_completion"),
-      dataIndex: "vehicle",
+      dataIndex: "scheduled_completion",
-      key: "vehicle",
+      key: "scheduled_completion",
       ellipsis: true,
-      render: (text, record) => {
+      sorter: (a, b) =>
-        return record.vehicleid ? (
+        dateSort(a.scheduled_completion, b.scheduled_completion),
-          <Link to={"/manage/vehicles/" + record.vehicleid}>
+      sortOrder: sortcolumn === "scheduled_completion" && sortorder,
-            {`${record.v_model_yr || ""} ${record.v_make_desc || ""} ${
+      render: (text, record) => (
-              record.v_model_desc || ""
+        <DateTimeFormatter>{record.scheduled_completion}</DateTimeFormatter>
-            }`}
+      ),
-          </Link>
-        ) : (
-          <span>{`${record.v_model_yr || ""} ${record.v_make_desc || ""} ${
-            record.v_model_desc || ""
-          }`}</span>
-        );
-      },
     },
     // {
     //   title: t("vehicles.fields.plate_no"),
@@ -198,14 +229,6 @@ export function PartsQueuePageComponent({ bodyshop }) {
     //     return record.plate_no ? record.plate_no : "";
     //   },
     // },
-    {
-      title: t("jobs.fields.clm_no"),
-      dataIndex: "clm_no",
-      key: "clm_no",
-      ellipsis: true,
-      sorter: (a, b) => alphaSort(a.clm_no, b.clm_no),
-      sortOrder: sortcolumn === "clm_no" && sortorder,
-    },
     // {
     //   title: t("jobs.fields.clm_total"),
     //   dataIndex: "clm_total",