IO-795 Resolve parts reconciliation issues.

client/src/components/job-reconciliation-modal/job-reconciliation.modal.container.jsx

@@ -1,11 +1,15 @@
+import { useQuery } from "@apollo/client";
 import { Modal } from "antd";
 import React from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
+import { GET_JOB_RECONCILIATION_BY_PK } from "../../graphql/jobs.queries";
 import { toggleModalVisible } from "../../redux/modals/modals.actions";
 import { selectReconciliation } from "../../redux/modals/modals.selectors";
 import JobReconciliationModalComponent from "./job-reconciliation-modal.component";
+import LoadingSpinner from "../loading-spinner/loading-spinner.component";
+import AlertComponent from "../alert/alert.component";
 
 const mapStateToProps = createStructuredSelector({
   reconciliationModal: selectReconciliation,
@@ -20,7 +24,12 @@ function JobReconciliationModalContainer({
 }) {
   const { t } = useTranslation();
   const { context, visible } = reconciliationModal;
-  const { job, bills } = context;
+  const { job } = context;
+
+  const { loading, error, data } = useQuery(GET_JOB_RECONCILIATION_BY_PK, {
+    variables: { id: job && job.id },
+    skip: !(job && job.id) || !visible,
+  });
 
   const handleCancel = () => {
     toggleModalVisible();
@@ -37,7 +46,15 @@ function JobReconciliationModalContainer({
       cancelButtonProps={{ display: "none" }}
       destroyOnClose
     >
-      <JobReconciliationModalComponent job={job} bills={bills} />
+      <LoadingSpinner loading={loading}>
+        {error && <AlertComponent message={error.message} type="error" />}
+        {data && (
+          <JobReconciliationModalComponent
+            job={data && data.jobs_by_pk}
+            bills={data && data.bills}
+          />
+        )}
+      </LoadingSpinner>
     </Modal>
   );
 }

client/src/components/job-reconciliation-parts-table/job-reconciliation-parts-table.component.jsx

@@ -3,6 +3,7 @@ import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import CurrencyFormatter from "../../utils/CurrencyFormatter";
 import { alphaSort } from "../../utils/sorters";
+import "./job-reconciliation-parts-table.styles.scss";
 
 export default function JobReconcilitionPartsTable({
   jobLineState,
@@ -114,7 +115,11 @@ export default function JobReconcilitionPartsTable({
           onChange: handleOnRowClick,
           selectedRowKeys: selectedLines,
         }}
+        rowClassName={(record) => record.removed && "text-strikethrough"}
       />
+      <div style={{ fontStyle: "italic", margin: "4px" }}>
+        {t("jobs.labels.reconciliation.removedpartsstrikethrough")}
+      </div>
     </div>
   );
 }

client/src/components/job-reconciliation-parts-table/job-reconciliation-parts-table.styles.scss

@@ -0,0 +1,3 @@
+.text-strikethrough {
+  text-decoration: line-through;
+}

client/src/components/job-reconciliation-totals/job-reconciliation-totals.component.jsx

@@ -39,7 +39,9 @@ export default function JobReconciliationTotals({
           return acc.add(
             Dinero({
               amount: Math.round((val.actual_price || 0) * 100),
-            }).multiply(val.quantity || 1)
+            })
+              .multiply(val.quantity || 1)
+              .multiply(val.bill.is_credit_memo ? -1 : 1)
           );
         }, Dinero()),
     };
@@ -97,6 +99,7 @@ export default function JobReconciliationTotals({
             onClick={() => {
               jobLineState[1]([]);
               billLineState[1]([]);
+              setErrors([]);
             }}
           >
             {t("jobs.labels.reconciliation.clear")}

client/src/components/job-reconciliation-totals/job-reconciliation-totals.utility.js

@@ -23,11 +23,6 @@ export const reconcileByAssocLine = (
     setErrors((errors) => [
       ...errors,
       ..._.uniqBy(duplicatedJobLinesbyInvoiceId).map((dupedId) => {
-        console.log(
-          "dupedId",
-          dupedId,
-          billLines.find((b) => b.id === dupedId)
-        );
         return i18next.t("jobs.labels.reconciliation.multiplebilllines", {
           line_desc: jobLines.find((j) => j.id === dupedId)?.line_desc,
         });