IO-2054 QBO Split AR

client/src/components/shop-info/shop-info.responsibilitycenters.component.jsx

@@ -4535,6 +4535,24 @@ export function ShopInfoResponsibilityCenterComponent({ bodyshop, form }) {
           <Input />
         </Form.Item>
       </LayoutFormRow>
+      <LayoutFormRow header={<div>Multiple Payers Item</div>}>
+        <Form.Item
+          label={t("bodyshop.fields.responsibilitycenter_accountitem")}
+          rules={[
+            {
+              required: true,
+              //message: t("general.validation.required"),
+            },
+          ]}
+          name={[
+            "md_responsibility_centers",
+            "qb_multiple_payers",
+            "accountitem",
+          ]}
+        >
+          <Input />
+        </Form.Item>
+      </LayoutFormRow>
       <Typography.Title level={4}>
         {t("bodyshop.labels.responsibilitycenters.sales_tax_codes")}
       </Typography.Title>

client/src/graphql/jobs.queries.js

@@ -1890,6 +1890,7 @@ export const QUERY_JOB_CLOSE_DETAILS = gql`
       actual_in
       kmin
       kmout
+      qb_multiple_payers
       joblines(where: { removed: { _eq: false } }, order_by: { line_no: asc }) {
         id
         removed

client/src/pages/jobs-close/jobs-close.component.jsx

@@ -1,34 +1,38 @@
+import { DeleteFilled } from "@ant-design/icons";
 import { useApolloClient, useMutation } from "@apollo/client";
 import {
-  Button,
-  Form,
-  notification,
-  Popconfirm,
-  Space,
   Alert,
+  Button,
   Divider,
-  PageHeader,
-  InputNumber,
+  Form,
   Input,
+  InputNumber,
+  notification,
+  PageHeader,
+  Popconfirm,
+  Select,
+  Space,
   Switch,
 } from "antd";
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 //import { useHistory } from "react-router-dom";
+import { useTreatments } from "@splitsoftware/splitio-react";
+import moment from "moment";
+import { Link } from "react-router-dom";
 import { createStructuredSelector } from "reselect";
+import DateTimePicker from "../../components/form-date-time-picker/form-date-time-picker.component";
 import FormsFieldChanged from "../../components/form-fields-changed-alert/form-fields-changed-alert.component";
+import CurrencyInput from "../../components/form-items-formatted/currency-form-item.component";
 import JobsScoreboardAdd from "../../components/job-scoreboard-add-button/job-scoreboard-add-button.component";
 import JobsCloseAutoAllocate from "../../components/jobs-close-auto-allocate/jobs-close-auto-allocate.component";
 import JobsCloseLines from "../../components/jobs-close-lines/jobs-close-lines.component";
+import LayoutFormRow from "../../components/layout-form-row/layout-form-row.component";
 import { generateJobLinesUpdatesForInvoicing } from "../../graphql/jobs-lines.queries";
 import { UPDATE_JOB } from "../../graphql/jobs.queries";
 import { selectJobReadOnly } from "../../redux/application/application.selectors";
 import { selectBodyshop } from "../../redux/user/user.selectors";
-import LayoutFormRow from "../../components/layout-form-row/layout-form-row.component";
-import DateTimePicker from "../../components/form-date-time-picker/form-date-time-picker.component";
-import moment from "moment";
-import { Link } from "react-router-dom";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -42,6 +46,11 @@ export function JobsCloseComponent({ job, bodyshop, jobRO }) {
   // const history = useHistory();
   const [closeJob] = useMutation(UPDATE_JOB);
   const [loading, setLoading] = useState(false);
+  const { Qb_Multi_Ar } = useTreatments(
+    ["Qb_Multi_Ar"],
+    {},
+    bodyshop && bodyshop.imexshopid
+  );
 
   const handleFinish = async ({ removefromproduction, ...values }) => {
     setLoading(true);
@@ -65,6 +74,9 @@ export function JobsCloseComponent({ job, bodyshop, jobRO }) {
           kmout: values.kmout,
           dms_allocation: values.dms_allocation,
           ...(removefromproduction ? { inproduction: false } : {}),
+          ...(values.qb_multiple_payers
+            ? { qb_multiple_payers: values.qb_multiple_payers }
+            : {}),
         },
       },
       refetchQueries: ["QUERY_JOB_CLOSE_DETAILS"],
@@ -127,6 +139,7 @@ export function JobsCloseComponent({ job, bodyshop, jobRO }) {
           kmin: job.kmin,
           kmout: job.kmout,
           dms_allocation: job.dms_allocation,
+          qb_multiple_payers: job.qb_multiple_payers,
         }}
         scrollToFirstError
       >
@@ -312,6 +325,76 @@ export function JobsCloseComponent({ job, bodyshop, jobRO }) {
             </Form.Item>
           )}
         </LayoutFormRow>
+        {Qb_Multi_Ar.treatment === "on" && (
+          <>
+            <Form.List name={["qb_multiple_payers"]}>
+              {(fields, { add, remove }) => {
+                return (
+                  <div>
+                    {fields.map((field, index) => (
+                      <Form.Item key={field.key}>
+                        <Space>
+                          <Form.Item
+                            label={t("jobs.fields.qb_multiple_payers.name")}
+                            key={`${index}name`}
+                            name={[field.name, "name"]}
+                            rules={[
+                              {
+                                required: true,
+                              },
+                            ]}
+                          >
+                            <Select
+                              style={{ minWidth: "12rem" }}
+                              disabled={jobRO}
+                            >
+                              {bodyshop.md_ins_cos.map((s) => (
+                                <Select.Option key={s.name} value={s.name}>
+                                  {s.name}
+                                </Select.Option>
+                              ))}
+                            </Select>
+                          </Form.Item>
+
+                          <Form.Item
+                            label={t("jobs.fields.qb_multiple_payers.amount")}
+                            key={`${index}amount`}
+                            name={[field.name, "amount"]}
+                            rules={[
+                              {
+                                required: true,
+                              },
+                            ]}
+                          >
+                            <CurrencyInput min={0} disabled={jobRO} />
+                          </Form.Item>
+
+                          <DeleteFilled
+                            disabled={jobRO}
+                            onClick={() => {
+                              remove(field.name);
+                            }}
+                          />
+                        </Space>
+                      </Form.Item>
+                    ))}
+                    <Form.Item>
+                      <Button
+                        disabled={jobRO}
+                        onClick={() => {
+                          if (fields.length < 3) add();
+                        }}
+                        style={{ width: "100%" }}
+                      >
+                        {t("jobs.actions.dms.addpayer")}
+                      </Button>
+                    </Form.Item>
+                  </div>
+                );
+              }}
+            </Form.List>
+          </>
+        )}
         <Divider />
         <JobsCloseLines job={job} />
       </Form>

client/src/translations/en_us/common.json

@@ -1468,6 +1468,10 @@
 				"production_vars": {
 					"note": "Production Note"
 				},
+				"qb_multiple_payers": {
+					"amount": "Amount",
+					"name": "Name"
+				},
 				"queued_for_parts": "Queued for Parts",
 				"rate_ats": "ATS Rate",
 				"rate_la1": "LA1",

client/src/translations/es/common.json

@@ -1468,6 +1468,10 @@
 				"production_vars": {
 					"note": ""
 				},
+				"qb_multiple_payers": {
+					"amount": "",
+					"name": ""
+				},
 				"queued_for_parts": "",
 				"rate_ats": "",
 				"rate_la1": "Tarifa LA1",

client/src/translations/fr/common.json

@@ -1468,6 +1468,10 @@
 				"production_vars": {
 					"note": ""
 				},
+				"qb_multiple_payers": {
+					"amount": "",
+					"name": ""
+				},
 				"queued_for_parts": "",
 				"rate_ats": "",
 				"rate_la1": "Taux LA1",