IO-233 Beging get vehicle makes

client/src/components/dms-cdk-makes/dms-cdk-makes.component.jsx

@@ -0,0 +1,43 @@
+import React, { useState } from "react";
+import { Modal, Button, Table } from "antd";
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import { selectBodyshop } from "../../redux/user/user.selectors";
+const mapStateToProps = createStructuredSelector({
+  //currentUser: selectCurrentUser
+  bodyshop: selectBodyshop,
+});
+const mapDispatchToProps = (dispatch) => ({
+  //setUserLanguage: language => dispatch(setUserLanguage(language))
+});
+export default connect(mapStateToProps, mapDispatchToProps)(DmsCdkMakes);
+
+export function DmsCdkMakes({ bodyshop, form, socket }) {
+  const [makesList, setMakesList] = useState([]);
+  const [loading, setLoading] = useState(false);
+  const [visible, setVisible] = useState(false);
+  return (
+    <div>
+      <Modal visible={visible} onCancel={() => setVisible(false)}>
+        {JSON.stringify(makesList, null, 2)}
+        <Table loading={loading} data={makesList} />
+      </Modal>
+      <Button
+        onClick={() => {
+          setVisible(true);
+          setLoading(true);
+          socket.emit(
+            "cdk-get-makes",
+            (bodyshop.cdk_dealerid,
+            (makes) => {
+              setMakesList(makes);
+              setLoading(false);
+            })
+          );
+        }}
+      >
+        Get Makes
+      </Button>
+    </div>
+  );
+}

client/src/components/dms-post-form/dms-post-form.component.jsx

@@ -0,0 +1,150 @@
+import { DeleteFilled } from "@ant-design/icons";
+import { Button, Form, Input } from "antd";
+import React from "react";
+import { useTranslation } from "react-i18next";
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import { selectBodyshop } from "../../redux/user/user.selectors";
+import DmsCdkMakes from "../dms-cdk-makes/dms-cdk-makes.component";
+import CurrencyInput from "../form-items-formatted/currency-form-item.component";
+import LayoutFormRow from "../layout-form-row/layout-form-row.component";
+
+const mapStateToProps = createStructuredSelector({
+  bodyshop: selectBodyshop,
+});
+const mapDispatchToProps = (dispatch) => ({
+  //setUserLanguage: language => dispatch(setUserLanguage(language))
+});
+export default connect(mapStateToProps, mapDispatchToProps)(DmsPostForm);
+
+export function DmsPostForm({ bodyshop, socket, jobId }) {
+  const [form] = Form.useForm();
+  const { t } = useTranslation();
+  return (
+    <Form form={form} layout="vertical">
+      <LayoutFormRow>
+        <Form.Item
+          name="journal"
+          label={t("jobs.fields.dms.journal")}
+          initialValue={
+            bodyshop.cdk_configuration &&
+            bodyshop.cdk_configuration.default_journal
+          }
+          rules={[
+            {
+              required: true,
+              //message: t("general.validation.required"),
+            },
+          ]}
+        >
+          <Input />
+        </Form.Item>
+        <Form.Item
+          name="dms_make"
+          label={t("jobs.fields.dms.dms_make")}
+          rules={[
+            {
+              required: true,
+            },
+          ]}
+        >
+          <Input />
+        </Form.Item>
+        <Form.Item
+          name="dms_make"
+          label={t("jobs.fields.dms.dms_make")}
+          rules={[
+            {
+              required: true,
+            },
+          ]}
+        >
+          <Input />
+        </Form.Item>
+        <DmsCdkMakes form={form} socket={socket} />
+      </LayoutFormRow>
+
+      <Form.List name={["payers"]}>
+        {(fields, { add, remove }) => {
+          return (
+            <div>
+              {fields.map((field, index) => (
+                <Form.Item key={field.key}>
+                  <LayoutFormRow>
+                    <Form.Item
+                      label={t("jobs.fields.dms.payer.name")}
+                      key={`${index}name`}
+                      name={[field.name, "name"]}
+                      rules={[
+                        {
+                          required: true,
+                        },
+                      ]}
+                    >
+                      <Input />
+                    </Form.Item>
+
+                    <Form.Item
+                      label={t("jobs.fields.dms.payer.account")}
+                      key={`${index}account`}
+                      name={[field.name, "account"]}
+                      rules={[
+                        {
+                          required: true,
+                        },
+                      ]}
+                    >
+                      <Input />
+                    </Form.Item>
+
+                    <Form.Item
+                      label={t("jobs.fields.dms.payer.amount")}
+                      key={`${index}amount`}
+                      name={[field.name, "amount"]}
+                      rules={[
+                        {
+                          required: true,
+                        },
+                      ]}
+                    >
+                      <CurrencyInput />
+                    </Form.Item>
+                    <Form.Item
+                      label={t("jobs.fields.dms.payer.controlnumber")}
+                      key={`${index}controlnumber`}
+                      name={[field.name, "controlnumber"]}
+                      rules={[
+                        {
+                          required: true,
+                        },
+                      ]}
+                    >
+                      <Input />
+                    </Form.Item>
+
+                    <DeleteFilled
+                      onClick={() => {
+                        remove(field.name);
+                      }}
+                    />
+                  </LayoutFormRow>
+                </Form.Item>
+              ))}
+              <Form.Item>
+                <Button
+                  type="dashed"
+                  onClick={() => {
+                    add();
+                  }}
+                  style={{ width: "100%" }}
+                >
+                  {t("general.actions.add")}
+                </Button>
+              </Form.Item>
+            </div>
+          );
+        }}
+      </Form.List>
+    </Form>
+  );
+}

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

@@ -69,9 +69,27 @@ export function ShopInfoResponsibilityCenterComponent({ bodyshop, form }) {
 
   return (
     <div>
-      <DataLabel label={t("bodyshop.labels.dms.cdk_dealerid")}>
-        {form.getFieldValue("cdk_dealerid")}
-      </DataLabel>
+      {bodyshop.cdk_dealerid && (
+        <>
+          <DataLabel label={t("bodyshop.labels.dms.cdk_dealerid")}>
+            {form.getFieldValue("cdk_dealerid")}
+          </DataLabel>
+          <LayoutFormRow>
+            <Form.Item
+              label={t("bodyshop.fields.dms.default_journal")}
+              rules={[
+                {
+                  required: true,
+                  //message: t("general.validation.required"),
+                },
+              ]}
+              name={["cdk_configuration", "default_journal"]}
+            >
+              <Input />
+            </Form.Item>
+          </LayoutFormRow>
+        </>
+      )}
       <LayoutFormRow header={t("bodyshop.labels.responsibilitycenters.costs")}>
         <Form.List name={["md_responsibility_centers", "costs"]}>
           {(fields, { add, remove }) => {

client/src/pages/dms/dms.container.jsx

@@ -1,4 +1,4 @@
-import { useQuery } from "@apollo/client";
+//import { useQuery } from "@apollo/client";
 import { Button, Col, Result, Row, Select, Space } from "antd";
 import queryString from "query-string";
 import React, { useEffect, useState } from "react";
@@ -7,13 +7,14 @@ import { connect } from "react-redux";
 import { useLocation } from "react-router-dom";
 import { createStructuredSelector } from "reselect";
 import SocketIO from "socket.io-client";
-import AlertComponent from "../../components/alert/alert.component";
+//import AlertComponent from "../../components/alert/alert.component";
 import DmsAllocationsSummary from "../../components/dms-allocations-summary/dms-allocations-summary.component";
 import DmsCustomerSelector from "../../components/dms-customer-selector/dms-customer-selector.component";
 import DmsLogEvents from "../../components/dms-log-events/dms-log-events.component";
-import LoadingSpinner from "../../components/loading-spinner/loading-spinner.component";
+import DmsPostForm from "../../components/dms-post-form/dms-post-form.component";
+//import LoadingSpinner from "../../components/loading-spinner/loading-spinner.component";
 import { auth } from "../../firebase/firebase.utils";
-import { QUERY_JOB_EXPORT_DMS } from "../../graphql/jobs.queries";
+//import { QUERY_JOB_EXPORT_DMS } from "../../graphql/jobs.queries";
 import {
   setBreadcrumbs,
   setSelectedHeader,
@@ -51,10 +52,10 @@ export function DmsContainer({ bodyshop, setBreadcrumbs, setSelectedHeader }) {
   const search = queryString.parse(useLocation().search);
   const { jobId } = search;
 
-  const { loading, error, data } = useQuery(QUERY_JOB_EXPORT_DMS, {
-    variables: { id: jobId },
-    skip: true, //!jobId,
-  });
+  // const { loading, error } = useQuery(QUERY_JOB_EXPORT_DMS, {
+  //   variables: { id: jobId },
+  //   skip: true, //!jobId,
+  // });
 
   useEffect(() => {
     document.title = t("titles.dms");
@@ -105,8 +106,8 @@ export function DmsContainer({ bodyshop, setBreadcrumbs, setSelectedHeader }) {
 
   const dmsType = determineDmsType(bodyshop);
 
-  if (loading) return <LoadingSpinner />;
-  if (error) return <AlertComponent message={error.message} type="error" />;
+  // if (loading) return <LoadingSpinner />;
+  // if (error) return <AlertComponent message={error.message} type="error" />;
 
   return (
     <div>
@@ -140,6 +141,7 @@ export function DmsContainer({ bodyshop, setBreadcrumbs, setSelectedHeader }) {
       <Row gutter={32}>
         <Col span={18}>
           <DmsAllocationsSummary socket={socket} jobId={jobId} />
+          <DmsPostForm socket={socket} jobId={jobId} />
         </Col>
         <Col span={6}>
           <div style={{ maxHeight: "500px", overflowY: "auto" }}>

client/src/translations/en_us/common.json

@@ -232,6 +232,7 @@
 					"templates": "Delivery Templates"
 				},
 				"dms": {
+					"default_journal": "Default Journal",
 					"dms_acctnumber": "DMS Account #",
 					"dms_wip_acctnumber": "DMS W.I.P.  Account #",
 					"mappingname": "DMS Mapping Name"

client/src/translations/es/common.json

@@ -232,6 +232,7 @@
 					"templates": ""
 				},
 				"dms": {
+					"default_journal": "",
 					"dms_acctnumber": "",
 					"dms_wip_acctnumber": "",
 					"mappingname": ""

client/src/translations/fr/common.json

@@ -232,6 +232,7 @@
 					"templates": ""
 				},
 				"dms": {
+					"default_journal": "",
 					"dms_acctnumber": "",
 					"dms_wip_acctnumber": "",
 					"mappingname": ""