Created export payables screen + basic invoice exporting BOD-139

bodyshop_translations.babel

@@ -6206,6 +6206,48 @@
                                             </translation>
                                         </translations>
                                     </concept_node>
+                                    <concept_node>
+                                        <name>exporting</name>
+                                        <definition_loaded>false</definition_loaded>
+                                        <description></description>
+                                        <comment></comment>
+                                        <default_text></default_text>
+                                        <translations>
+                                            <translation>
+                                                <language>en-US</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>es-MX</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>fr-CA</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                        </translations>
+                                    </concept_node>
+                                    <concept_node>
+                                        <name>exporting-partner</name>
+                                        <definition_loaded>false</definition_loaded>
+                                        <description></description>
+                                        <comment></comment>
+                                        <default_text></default_text>
+                                        <translations>
+                                            <translation>
+                                                <language>en-US</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>es-MX</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>fr-CA</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                        </translations>
+                                    </concept_node>
                                     <concept_node>
                                         <name>invalidro</name>
                                         <definition_loaded>false</definition_loaded>
@@ -14918,6 +14960,27 @@
                     <folder_node>
                         <name>titles</name>
                         <children>
+                            <concept_node>
+                                <name>accounting-payables</name>
+                                <definition_loaded>false</definition_loaded>
+                                <description></description>
+                                <comment></comment>
+                                <default_text></default_text>
+                                <translations>
+                                    <translation>
+                                        <language>en-US</language>
+                                        <approved>false</approved>
+                                    </translation>
+                                    <translation>
+                                        <language>es-MX</language>
+                                        <approved>false</approved>
+                                    </translation>
+                                    <translation>
+                                        <language>fr-CA</language>
+                                        <approved>false</approved>
+                                    </translation>
+                                </translations>
+                            </concept_node>
                             <concept_node>
                                 <name>accounting-receivables</name>
                                 <definition_loaded>false</definition_loaded>
@@ -14963,6 +15026,27 @@
                             <folder_node>
                                 <name>bc</name>
                                 <children>
+                                    <concept_node>
+                                        <name>accounting-payables</name>
+                                        <definition_loaded>false</definition_loaded>
+                                        <description></description>
+                                        <comment></comment>
+                                        <default_text></default_text>
+                                        <translations>
+                                            <translation>
+                                                <language>en-US</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>es-MX</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>fr-CA</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                        </translations>
+                                    </concept_node>
                                     <concept_node>
                                         <name>accounting-receivables</name>
                                         <definition_loaded>false</definition_loaded>

client/src/components/accounting-payables-table/accounting-payables-table.component.jsx

@@ -0,0 +1,159 @@
+import { Input, Table, Checkbox } from "antd";
+import React, { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { Link } from "react-router-dom";
+import CurrencyFormatter from "../../utils/CurrencyFormatter";
+import { alphaSort } from "../../utils/sorters";
+import InvoiceExportButton from "../invoice-export-button/invoice-export-button.component";
+import { DateFormatter } from "../../utils/DateFormatter";
+import queryString from "query-string";
+
+export default function AccountingPayablesTableComponent({
+  loading,
+  invoices,
+}) {
+  const { t } = useTranslation();
+
+  const [state, setState] = useState({
+    sortedInfo: {},
+    search: "",
+  });
+
+  const handleTableChange = (pagination, filters, sorter) => {
+    setState({ ...state, filteredInfo: filters, sortedInfo: sorter });
+  };
+
+  const columns = [
+    {
+      title: t("invoices.fields.vendorname"),
+      dataIndex: "vendorname",
+      key: "vendorname",
+      sorter: (a, b) => alphaSort(a.vendor.name, b.vendor.name),
+      sortOrder:
+        state.sortedInfo.columnKey === "vendorname" && state.sortedInfo.order,
+      render: (text, record) => (
+        <Link
+          to={{
+            pathname: `/manage/shop/vendors`,
+            search: queryString.stringify({ selectedvendor: record.vendor.id }),
+          }}
+        >
+          {record.vendor.name}
+        </Link>
+      ),
+    },
+    {
+      title: t("invoices.fields.invoice_number"),
+      dataIndex: "invoice_number",
+      key: "invoice_number",
+      sorter: (a, b) => alphaSort(a.invoice_number, b.invoice_number),
+      sortOrder:
+        state.sortedInfo.columnKey === "invoice_number" &&
+        state.sortedInfo.order,
+      render: (text, record) => (
+        <Link
+          to={{
+            pathname: `/manage/invoices`,
+            search: queryString.stringify({
+              invoiceid: record.id,
+              vendorid: record.vendor.id,
+            }),
+          }}
+        >
+          {record.invoice_number}
+        </Link>
+      ),
+    },
+    {
+      title: t("invoices.fields.date"),
+      dataIndex: "date",
+      key: "date",
+
+      sorter: (a, b) => a.date - b.date,
+      sortOrder:
+        state.sortedInfo.columnKey === "date" && state.sortedInfo.order,
+      render: (text, record) => <DateFormatter>{record.date}</DateFormatter>,
+    },
+    {
+      title: t("invoices.fields.total"),
+      dataIndex: "total",
+      key: "total",
+
+      sorter: (a, b) => a.total - b.total,
+      sortOrder:
+        state.sortedInfo.columnKey === "total" && state.sortedInfo.order,
+      render: (text, record) => (
+        <CurrencyFormatter>{record.total}</CurrencyFormatter>
+      ),
+    },
+    {
+      title: t("invoices.fields.is_credit_memo"),
+      dataIndex: "is_credit_memo",
+      key: "is_credit_memo",
+      sorter: (a, b) => a.is_credit_memo - b.is_credit_memo,
+      sortOrder:
+        state.sortedInfo.columnKey === "is_credit_memo" &&
+        state.sortedInfo.order,
+      render: (text, record) => (
+        <Checkbox disabled checked={record.is_credit_memo} />
+      ),
+    },
+    {
+      title: t("general.labels.actions"),
+      dataIndex: "actions",
+      key: "actions",
+      sorter: (a, b) => a.clm_total - b.clm_total,
+
+      render: (text, record) => (
+        <div>
+          <InvoiceExportButton
+            invoiceId={record.id}
+            disabled={!!record.exported}
+          />
+        </div>
+      ),
+    },
+  ];
+
+  const handleSearch = (e) => {
+    setState({ ...state, search: e.target.value });
+  };
+
+  const dataSource = state.search
+    ? invoices.filter(
+        (v) =>
+          (v.vendor.name || "")
+            .toLowerCase()
+            .includes(state.search.toLowerCase()) ||
+          (v.invoice_number || "")
+            .toLowerCase()
+            .includes(state.search.toLowerCase())
+      )
+    : invoices;
+
+  return (
+    <div>
+      <Table
+        loading={loading}
+        title={() => {
+          return (
+            <div>
+              <Input
+                value={state.search}
+                onChange={handleSearch}
+                placeholder={t("general.labels.search")}
+                allowClear
+              />
+            </div>
+          );
+        }}
+        dataSource={dataSource}
+        size="small"
+        pagination={{ position: "top" }}
+        columns={columns}
+        rowKey="id"
+        onChange={handleTableChange}
+      />
+    </div>
+  );
+}

client/src/components/invoice-export-button/invoice-export-button.component.jsx

@@ -0,0 +1,98 @@
+import { useMutation } from "@apollo/react-hooks";
+import { Button, notification } from "antd";
+import axios from "axios";
+import React, { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import { auth } from "../../firebase/firebase.utils";
+import { UPDATE_INVOICE } from "../../graphql/invoices.queries";
+import { selectBodyshop } from "../../redux/user/user.selectors";
+const mapStateToProps = createStructuredSelector({
+  bodyshop: selectBodyshop,
+});
+
+export function InvoiceExportButton({ bodyshop, invoiceId, disabled }) {
+  const { t } = useTranslation();
+  const [updateInvoice] = useMutation(UPDATE_INVOICE);
+  const [loading, setLoading] = useState(false);
+
+  const handleQbxml = async () => {
+    setLoading(true);
+    let QbXmlResponse;
+    try {
+      QbXmlResponse = await axios.post(
+        "/accounting/qbxml/payables",
+        { invoices: [invoiceId] },
+        {
+          headers: {
+            Authorization: `Bearer ${await auth.currentUser.getIdToken(true)}`,
+          },
+        }
+      );
+      console.log("handle -> XML", QbXmlResponse);
+    } catch (error) {
+      console.log("Error getting QBXML from Server.", error);
+      notification["error"]({
+        message: t("invoices.errors.exporting", {
+          error: "Unable to retrieve QBXML. " + JSON.stringify(error.message),
+        }),
+      });
+      setLoading(false);
+      return;
+    }
+
+    let PartnerResponse;
+    try {
+      PartnerResponse = await axios.post(
+        "http://e9c5a8ed9079.ngrok.io/qb/receivables",
+        QbXmlResponse.data
+      );
+    } catch (error) {
+      console.log("Error connecting to quickbooks or partner.", error);
+      notification["error"]({
+        message: t("invoices.errors.exporting-partner"),
+      });
+      setLoading(false);
+      return;
+    }
+
+    console.log("PartnerResponse", PartnerResponse);
+    // const invoiceUpdateResponse = await updateInvoice({
+    //   variables: {
+    //     invoiceId: invoiceId,
+    //     invoice: {
+    //       exported: true,
+    //       exported_at: new Date(),
+    //     },
+    //   },
+    // });
+
+    // if (!!!invoiceUpdateResponse.errors) {
+    //   notification["success"]({
+    //     message: t("jobs.successes.exported"),
+    //   });
+    // } else {
+    //   notification["error"]({
+    //     message: t("jobs.errors.exporting", {
+    //       error: JSON.stringify(invoiceUpdateResponse.error),
+    //     }),
+    //   });
+    // }
+
+    setLoading(false);
+  };
+
+  return (
+    <Button
+      onClick={handleQbxml}
+      loading={loading}
+      disabled={disabled}
+      type="dashed"
+    >
+      {t("jobs.actions.export")}
+    </Button>
+  );
+}
+
+export default connect(mapStateToProps, null)(InvoiceExportButton);

client/src/components/jobs-close-export-button/jobs-close-export-button.component.jsx

@@ -44,7 +44,7 @@ export function JobsCloseExportButton({ bodyshop, jobId, disabled }) {
     let PartnerResponse;
     try {
       PartnerResponse = await axios.post(
-        "http://e9c5a8ed9079.ngrok.io/qb/receivables",
+        "http://localhost:1337/qb/receivables",
         QbXmlResponse.data,
         {
           headers: {
@@ -60,7 +60,7 @@ export function JobsCloseExportButton({ bodyshop, jobId, disabled }) {
       setLoading(false);
       return;
     }
-    
+
     console.log("PartnerResponse", PartnerResponse);
     const jobUpdateResponse = await updateJob({
       variables: {

client/src/graphql/accounting.queries.js

@@ -27,3 +27,19 @@ export const QUERY_JOBS_FOR_EXPORT = gql`
     }
   }
 `;
+
+export const QUERY_INVOICES_FOR_EXPORT = gql`
+  query QUERY_INVOICES_FOR_EXPORT {
+    invoices(where: { exported: { _eq: false } }) {
+      id
+      exported
+      date
+      invoice_number
+      total
+      vendor {
+        name
+        id
+      }
+    }
+  }
+`;

client/src/graphql/invoices.queries.js

@@ -129,6 +129,8 @@ export const UPDATE_INVOICE = gql`
     update_invoices(where: { id: { _eq: $invoiceId } }, _set: $invoice) {
       returning {
         id
+        exported
+        exported_at
       }
     }
   }

client/src/pages/accounting-payables/accounting-payables.container.jsx

@@ -0,0 +1,48 @@
+import { useQuery } from "@apollo/react-hooks";
+import React, { useEffect } from "react";
+import { useTranslation } from "react-i18next";
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import AccountingPayablesTable from "../../components/accounting-payables-table/accounting-payables-table.component";
+import AlertComponent from "../../components/alert/alert.component";
+import { QUERY_INVOICES_FOR_EXPORT } from "../../graphql/accounting.queries";
+import { setBreadcrumbs } from "../../redux/application/application.actions";
+import { selectBodyshop } from "../../redux/user/user.selectors";
+
+const mapStateToProps = createStructuredSelector({
+  bodyshop: selectBodyshop,
+});
+
+const mapDispatchToProps = (dispatch) => ({
+  setBreadcrumbs: (breadcrumbs) => dispatch(setBreadcrumbs(breadcrumbs)),
+});
+export function AccountingPayablesContainer({ bodyshop, setBreadcrumbs }) {
+  const { t } = useTranslation();
+
+  useEffect(() => {
+    document.title = t("titles.accounting-payables");
+    setBreadcrumbs([
+      {
+        link: "/manage/accounting/payables",
+        label: t("titles.bc.accounting-payables"),
+      },
+    ]);
+  }, [t, setBreadcrumbs]);
+
+  const { loading, error, data } = useQuery(QUERY_INVOICES_FOR_EXPORT);
+
+  if (error) return <AlertComponent message={error.message} type="error" />;
+
+  return (
+    <div>
+      <AccountingPayablesTable
+        loadaing={loading}
+        invoices={data ? data.invoices : []}
+      />
+    </div>
+  );
+}
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(AccountingPayablesContainer);

client/src/pages/manage/manage.page.component.jsx

@@ -94,6 +94,9 @@ const JobIntake = lazy(() =>
 const AccountingReceivables = lazy(() =>
   import("../accounting-receivables/accounting-receivables.container")
 );
+const AccountingPayables = lazy(() =>
+  import("../accounting-payables/accounting-payables.container")
+);
 const AllJobs = lazy(() => import("../jobs-all/jobs-all.container"));
 const JobsClose = lazy(() => import("../jobs-close/jobs-close.container"));
 
@@ -277,6 +280,11 @@ export function Manage({ match, conflict }) {
                   path={`${match.path}/accounting/receivables`}
                   component={AccountingReceivables}
                 />
+                <Route
+                  exact
+                  path={`${match.path}/accounting/payables`}
+                  component={AccountingPayables}
+                />
               </Suspense>
             )}
           </ErrorBoundary>

client/src/translations/en_us/common.json

@@ -425,6 +425,8 @@
 			},
 			"errors": {
 				"creating": "Error adding invoice.",
+				"exporting": "Error exporting invoice {{error}}",
+				"exporting-partner": "Unable to connect to ImEX Partner. Please ensure it is running and logged in.",
 				"invalidro": "Not a valid RO.",
 				"invalidvendor": "Not a valid vendor.",
 				"validation": "Please ensure all fields are entered correctly. "
@@ -950,9 +952,11 @@
 			}
 		},
 		"titles": {
+			"accounting-payables": "Payables | $t(titles.app)",
 			"accounting-receivables": "Receivables | $t(titles.app)",
 			"app": "ImEX Online",
 			"bc": {
+				"accounting-payables": "Payables",
 				"accounting-receivables": "Receivables",
 				"availablejobs": "Available Jobs",
 				"contracts": "Contracts",

client/src/translations/es/common.json

@@ -425,6 +425,8 @@
 			},
 			"errors": {
 				"creating": "",
+				"exporting": "",
+				"exporting-partner": "",
 				"invalidro": "",
 				"invalidvendor": "",
 				"validation": ""
@@ -950,9 +952,11 @@
 			}
 		},
 		"titles": {
+			"accounting-payables": "",
 			"accounting-receivables": "",
 			"app": "ImEX Online",
 			"bc": {
+				"accounting-payables": "",
 				"accounting-receivables": "",
 				"availablejobs": "",
 				"contracts": "",

client/src/translations/fr/common.json

@@ -425,6 +425,8 @@
 			},
 			"errors": {
 				"creating": "",
+				"exporting": "",
+				"exporting-partner": "",
 				"invalidro": "",
 				"invalidvendor": "",
 				"validation": ""
@@ -950,9 +952,11 @@
 			}
 		},
 		"titles": {
+			"accounting-payables": "",
 			"accounting-receivables": "",
 			"app": "ImEX Online",
 			"bc": {
+				"accounting-payables": "",
 				"accounting-receivables": "",
 				"availablejobs": "",
 				"contracts": "",

server.js

@@ -43,9 +43,10 @@ app.post("/test", async function (req, res) {
 const accountingIIF = require("./server/accounting/iif/iif");
 app.post("/accounting/iif/receivables", accountingIIF.receivables);
 
-//Invoicing-IIF
+//Accounting Qbxml
 const accountQbxml = require("./server/accounting/qbxml/qbxml");
 app.post("/accounting/qbxml/receivables", accountQbxml.receivables);
+app.post("/accounting/qbxml/payables", accountQbxml.payables);
 
 //Cloudinary Media Paths
 var media = require("./server/media/media");

server/accounting/qbxml/qbxml-payables.js

@@ -0,0 +1,107 @@
+const GraphQLClient = require("graphql-request").GraphQLClient;
+const path = require("path");
+const DineroQbFormat = require("../accounting-constants").DineroQbFormat;
+const queries = require("../../graphql-client/queries");
+const Dinero = require("dinero.js");
+var builder = require("xmlbuilder");
+const QbXmlUtils = require("./qbxml-utils");
+require("dotenv").config({
+  path: path.resolve(
+    process.cwd(),
+    `.env.${process.env.NODE_ENV || "development"}`
+  ),
+});
+
+exports.default = async (req, res) => {
+  const BearerToken = req.headers.authorization;
+  const { invoices: invoicesToQuery } = req.body;
+
+  const client = new GraphQLClient(process.env.GRAPHQL_ENDPOINT, {
+    headers: {
+      Authorization: BearerToken,
+    },
+  });
+
+  try {
+    const result = await client
+      .setHeaders({ Authorization: BearerToken })
+      .request(queries.QUERY_INVOICES_FOR_PAYABLES_EXPORT, {
+        invoices: invoicesToQuery,
+      });
+    const { invoices } = result;
+
+    const QbXmlToExecute = [];
+    invoices.map((i) => {
+      QbXmlToExecute.push(generateBill(i));
+    });
+
+    //For each invoice.
+
+    res.status(200).json(QbXmlToExecute);
+  } catch (error) {
+    console.log("error", error);
+    res.status(400).send(JSON.stringify(error));
+  }
+};
+
+const generateBill = (invoice) => {
+  const billQbxmlObj = {
+    QBXML: {
+      QBXMLMsgsRq: {
+        "@onError": "continueOnError",
+        BillAddRq: {
+          BillAdd: {
+            VendorRef: {
+              FullName: invoice.vendor.name,
+            },
+            TxnDate: invoice.date,
+            DueDate: invoice.due_date,
+            RefNumber: invoice.invoice_number,
+            Memo: `RO ${invoice.job.ro_number || ""} OWNER ${
+              invoice.job.ownr_fn || ""
+            } ${invoice.job.ownr_ln || ""} ${invoice.job.ownr_co_nm || ""}`,
+            ExpenseLineAdd: invoice.invoicelines.map((il) =>
+              generateBillLine(
+                il,
+                invoice.job.bodyshop.md_responsibility_centers
+              )
+            ),
+          },
+        },
+      },
+    },
+  };
+
+  var billQbxml_partial = builder
+    .create(billQbxmlObj, {
+      version: "1.30",
+      encoding: "UTF-8",
+      headless: true,
+    })
+    .end({ pretty: true });
+
+  const billQbxml_Full = QbXmlUtils.addQbxmlHeader(billQbxml_partial);
+  console.log("generateBill -> billQbxml_Full", billQbxml_Full);
+
+  return billQbxml_Full;
+};
+
+const generateBillLine = (invoiceLine, responsibilityCenters) => {
+  return {
+    AccountRef: {
+      FullName: responsibilityCenters.costs.find(
+        (c) => c.name === invoiceLine.cost_center
+      ).accountname,
+    },
+    Amount: Dinero({
+      amount: Math.round(invoiceLine.actual_cost * 100),
+    }).toFormat(DineroQbFormat),
+  };
+};
+
+// [
+//   {
+//     AccountRef: { FullName: "BODY SHOP COST:SUBLET" },
+//     Amount: invoice.amount,
+//   },
+// ],

server/accounting/qbxml/qbxml-receivables.js

@@ -4,6 +4,7 @@ const DineroQbFormat = require("../accounting-constants").DineroQbFormat;
 const queries = require("../../graphql-client/queries");
 const Dinero = require("dinero.js");
 var builder = require("xmlbuilder");
+const QbXmlUtils = require("./qbxml-utils");
 require("dotenv").config({
   path: path.resolve(
     process.cwd(),
@@ -77,7 +78,7 @@ const generateSourceCustomerQbxml = (jobs_by_pk, bodyshop) => {
     })
     .end({ pretty: true });
 
-  const customerQbxml_Full = addQbxmlHeader(customerQbxml_partial);
+  const customerQbxml_Full = QbXmlUtils.addQbxmlHeader(customerQbxml_partial);
 
   return customerQbxml_Full;
 };
@@ -138,7 +139,7 @@ const generateJobQbxml = (jobs_by_pk, bodyshop, isThreeTier, tierLevel) => {
     })
     .end({ pretty: true });
 
-  const jobQbxml_Full = addQbxmlHeader(jobQbxml_partial);
+  const jobQbxml_Full = QbXmlUtils.addQbxmlHeader(jobQbxml_partial);
   console.log("jobQbxml_Full", jobQbxml_Full);
   return jobQbxml_Full;
 };
@@ -262,7 +263,7 @@ const generateInvoiceQbxml = (jobs_by_pk, bodyshop) => {
     })
     .end({ pretty: true });
 
-  const invoiceQbxml_Full = addQbxmlHeader(invoiceQbxml_partial);
+  const invoiceQbxml_Full = QbXmlUtils.addQbxmlHeader(invoiceQbxml_partial);
 
   return invoiceQbxml_Full;
 };
@@ -291,10 +292,3 @@ const generateInvoiceLine = (job, allocation, responsibilityCenters) => {
     },
   };
 };
-
-const addQbxmlHeader = (xml) => {
-  return `<?xml version="1.0" encoding="utf-8"?>
-  <?qbxml version="13.0"?>
-  ${xml}
-  `;
-};

server/accounting/qbxml/qbxml-utils.js

@@ -0,0 +1,6 @@
+exports.addQbxmlHeader = addQbxmlHeader = (xml) => {
+  return `<?xml version="1.0" encoding="utf-8"?>
+    <?qbxml version="13.0"?>
+    ${xml}
+    `;
+};

server/accounting/qbxml/qbxml.js

@@ -1 +1,2 @@
-exports.receivables = require("./qbxml-receivables").default
+exports.receivables = require("./qbxml-receivables").default;
+exports.payables = require("./qbxml-payables").default;

server/graphql-client/queries.js

@@ -70,3 +70,41 @@ query QUERY_JOBS_FOR_RECEIVABLES_EXPORT($id: uuid!) {
   }
 }
   `;
+
+exports.QUERY_INVOICES_FOR_PAYABLES_EXPORT = `
+query QUERY_INVOICES_FOR_PAYABLES_EXPORT($invoices: [uuid!]!) {
+  invoices(where: {id: {_in: $invoices}}) {
+    id
+    date
+    due_date
+    federal_tax_rate
+    invoice_number
+    is_credit_memo
+    job {
+      id
+      ro_number
+      clm_no
+      ownr_fn
+      ownr_ln
+      ownr_co_nm
+      bodyshop{
+        md_responsibility_centers
+      }
+    }
+    invoicelines{
+      id
+      cost_center
+      actual_cost
+      applicable_taxes
+    }
+    state_tax_rate
+    local_tax_rate
+    total
+    vendor{
+      id
+      name
+    }
+  }
+}
+
+  `;