IO-710 Export Log page & insert actions on export

client/src/pages/export-logs/export-logs.page.component.jsx

@@ -1,6 +1,6 @@
 import { SyncOutlined } from "@ant-design/icons";
 import { useQuery } from "@apollo/client";
-import { Button, Card, Input, Space, Table, Typography } from "antd";
+import { Button, Card, Checkbox, Input, Space, Table, Typography } from "antd";
 import _ from "lodash";
 import queryString from "query-string";
 import React from "react";
@@ -9,18 +9,16 @@ import { connect } from "react-redux";
 import { Link, useHistory, useLocation } from "react-router-dom";
 import { createStructuredSelector } from "reselect";
 import AlertComponent from "../../components/alert/alert.component";
-import JobRemoveFromPartsQueue from "../../components/job-remove-from-parst-queue/job-remove-from-parts-queue.component";
 import { QUERY_EXPORT_LOG_PAGINATED } from "../../graphql/accounting.queries";
 import { selectBodyshop } from "../../redux/user/user.selectors";
-import CurrencyFormatter from "../../utils/CurrencyFormatter";
-import { TimeAgoFormatter } from "../../utils/DateFormatter";
+import { DateTimeFormatter } from "../../utils/DateFormatter";
 import { alphaSort } from "../../utils/sorters";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
 });
 
-export function PartsQueuePageComponent({ bodyshop }) {
+export function ExportLogsPageComponent({ bodyshop }) {
   const searchParams = queryString.parse(useLocation().search);
   const { page, sortcolumn, sortorder, search } = searchParams;
   const history = useHistory();
@@ -29,10 +27,10 @@ export function PartsQueuePageComponent({ bodyshop }) {
     QUERY_EXPORT_LOG_PAGINATED,
     {
       variables: {
-        //search: search || "",
+        search: search || "",
         offset: page ? (page - 1) * 25 : 0,
         limit: 25,
-        order: sortcolumn && [
+        order: [
           {
             [sortcolumn || "created_at"]: sortorder
               ? sortorder === "descend"
@@ -64,6 +62,19 @@ export function PartsQueuePageComponent({ bodyshop }) {
   };
 
   const columns = [
+    {
+      title: t("general.labels.created_at"),
+      dataIndex: "created_at",
+      key: "created_at",
+      render: (text, record) => (
+        <DateTimeFormatter>{record.created_at}</DateTimeFormatter>
+      ),
+    },
+    {
+      title: t("employees.fields.user_email"),
+      dataIndex: "useremail",
+      key: "useremail",
+    },
     {
       title: t("jobs.fields.ro_number"),
       dataIndex: "ro_number",
@@ -71,106 +82,62 @@ export function PartsQueuePageComponent({ bodyshop }) {
       sorter: (a, b) => alphaSort(a.ro_number, b.ro_number),
       sortOrder: sortcolumn === "ro_number" && sortorder,
 
-      render: (text, record) => (
-        <Link to={"/manage/jobs/" + record.id}>
-          {(record.job && record.job.ro_number) || t("general.labels.na")}
-        </Link>
-      ),
-    },
-    {
-      title: t("jobs.fields.owner"),
-      dataIndex: "owner",
-      key: "owner",
-      // sorter: (a, b) => alphaSort(a.ownr_ln, b.ownr_ln),
-      // sortOrder: sortcolumn === "owner" && sortorder,
-      render: (text, record) => {
-        return record.owner ? (
-          <Link to={"/manage/owners/" + record.owner.id}>
-            {`${record.ownr_fn || ""} ${record.ownr_ln || ""} ${
-              record.ownr_co_nm || ""
-            }`}
+      render: (text, record) =>
+        record.job && (
+          <Link to={"/manage/jobs/" + record.job && record.job.id}>
+            {(record.job && record.job.ro_number) || t("general.labels.na")}
           </Link>
-        ) : (
-          <span>{`${record.ownr_fn || ""} ${record.ownr_ln || ""} ${
-            record.ownr_co_nm || ""
-          }`}</span>
-        );
-      },
+        ),
     },
-
     {
-      title: t("jobs.fields.vehicle"),
-      dataIndex: "vehicle",
-      key: "vehicle",
-      ellipsis: true,
-      render: (text, record) => {
-        return record.vehicleid ? (
-          <Link to={"/manage/vehicles/" + record.vehicleid}>
-            {`${record.v_model_yr || ""} ${record.v_make_desc || ""} ${
-              record.v_model_desc || ""
-            }`}
+      title: t("bills.fields.invoice_number"),
+      dataIndex: "invoice_number",
+      key: "invoice_number",
+      render: (text, record) =>
+        record.bill && (
+          <Link to={"/manage/bills?billid=" + (record.bill && record.bill.id)}>
+            {record.bill && record.bill.invoice_number}
           </Link>
-        ) : (
-          <span>{`${record.v_model_yr || ""} ${record.v_make_desc || ""} ${
-            record.v_model_desc || ""
-          }`}</span>
-        );
-      },
+        ),
     },
     {
-      title: t("vehicles.fields.plate_no"),
-      dataIndex: "plate_no",
-      key: "plate_no",
-      sorter: (a, b) => alphaSort(a.plate_no, b.plate_no),
-      sortOrder: sortcolumn === "plate_no" && sortorder,
-      render: (text, record) => {
-        return record.plate_no ? record.plate_no : "";
-      },
+      title: t("payments.fields.paymentnum"),
+      dataIndex: "paymentnum",
+      key: "paymentnum",
+      render: (text, record) =>
+        record.payment && (
+          <Link
+            to={
+              "/manage/payments?search=" +
+              (record.payment && record.payment.paymentnum)
+            }
+          >
+            {record.payment && record.payment.paymentnum}
+          </Link>
+        ),
     },
     {
-      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,
-      render: (text, record) => {
-        return record.clm_no ? (
-          <span>{record.clm_no}</span>
-        ) : (
-          t("general.labels.unknown")
-        );
-      },
-    },
-    {
-      title: t("jobs.fields.clm_total"),
-      dataIndex: "clm_total",
-      key: "clm_total",
-      sorter: (a, b) => a.clm_total - b.clm_total,
-      sortOrder: sortcolumn === "clm_total" && sortorder,
-      render: (text, record) => {
-        return record.clm_total ? (
-          <CurrencyFormatter>{record.clm_total}</CurrencyFormatter>
-        ) : (
-          t("general.labels.unknown")
-        );
-      },
-    },
-    {
-      title: t("jobs.fields.updated_at"),
-      dataIndex: "updated_at",
-      key: "updated_at",
+      title: t("general.labels.successful"),
+      dataIndex: "successful",
+      key: "successful",
       render: (text, record) => (
-        <TimeAgoFormatter>{record.updated_at}</TimeAgoFormatter>
+        <Checkbox disabled checked={record.successful} />
       ),
     },
     {
-      title: t("general.labels.actions"),
-      dataIndex: "actions",
-      key: "actions",
-      render: (text, record) => (
-        <JobRemoveFromPartsQueue jobId={record.id} refetch={refetch} />
-      ),
+      title: t("general.labels.message"),
+      dataIndex: "message",
+      key: "message",
+      render: (text, record) =>
+        record.message && (
+          <div>
+            <ul>
+              {JSON.parse(record.message).map((m, idx) => (
+                <li key={idx}>{m}</li>
+              ))}
+            </ul>
+          </div>
+        ),
     },
   ];
 
@@ -214,11 +181,11 @@ export function PartsQueuePageComponent({ bodyshop }) {
           position: "top",
           pageSize: 25,
           current: parseInt(page || 1),
-          total: data && data.exportlog_aggregate.aggregate.count,
+          total: data && data.search_exportlog_aggregate.aggregate.count,
         }}
         columns={columns}
         rowKey="id"
-        dataSource={data && data.exportlog}
+        dataSource={data && data.search_exportlog}
         style={{ height: "100%" }}
         scroll={{ x: true }}
         onChange={handleTableChange}
@@ -227,4 +194,4 @@ export function PartsQueuePageComponent({ bodyshop }) {
   );
 }
 
-export default connect(mapStateToProps, null)(PartsQueuePageComponent);
+export default connect(mapStateToProps, null)(ExportLogsPageComponent);