Added job intake process for BOD-114

client/src/components/_test/test.component.jsx

@@ -3,7 +3,7 @@ import axios from "axios";
 import React, { useState } from "react";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
-import { EmailSettings } from "../../utils/constants";
+import { EmailSettings } from "../../utils/TemplateConstants";
 import {
   endLoading,
   startLoading,

client/src/components/email-overlay/email-overlay.container.jsx

@@ -10,7 +10,7 @@ import {
   selectEmailVisible,
 } from "../../redux/email/email.selectors.js";
 import { selectBodyshop } from "../../redux/user/user.selectors";
-import { EmailSettings } from "../../utils/constants";
+import { EmailSettings } from "../../utils/TemplateConstants";
 import RenderTemplate from "../../utils/RenderTemplate";
 import LoadingSpinner from "../loading-spinner/loading-spinner.component";
 import EmailOverlayComponent from "./email-overlay.component";
@@ -20,9 +20,11 @@ const mapStateToProps = createStructuredSelector({
   emailConfig: selectEmailConfig,
   bodyshop: selectBodyshop,
 });
+
 const mapDispatchToProps = (dispatch) => ({
   toggleEmailOverlayVisible: () => dispatch(toggleEmailOverlayVisible()),
 });
+
 export function EmailOverlayContainer({
   emailConfig,
   modalVisible,

client/src/components/job-intake/components/job-intake-form-checkbox/job-itnake-form-checkbox.component.jsx

@@ -0,0 +1,22 @@
+import React from "react";
+import { Form, Checkbox } from "antd";
+import { useTranslation } from "react-i18next";
+
+export default function JobIntakeFormCheckboxComponent({ formItem }) {
+  const { name, label, required } = formItem;
+  const { t } = useTranslation();
+  return (
+    <Form.Item
+      name={name}
+      label={label}
+      valuePropName='checked'
+      rules={[
+        {
+          required: required,
+          message: t("general.validation.required"),
+        },
+      ]}>
+      <Checkbox />
+    </Form.Item>
+  );
+}

client/src/components/job-intake/components/job-intake-form/job-intake-form.component.jsx

@@ -0,0 +1,97 @@
+import React from "react";
+import { Form, Button, Switch, DatePicker, notification } from "antd";
+import CheckboxFormItem from "../job-intake-form-checkbox/job-itnake-form-checkbox.component";
+import { useTranslation } from "react-i18next";
+import { useMutation } from "@apollo/react-hooks";
+import { UPDATE_JOB } from "../../../../graphql/jobs.queries";
+import { useParams } from "react-router-dom";
+import { selectBodyshop } from "../../../../redux/user/user.selectors";
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import { useHistory } from "react-router-dom";
+
+const mapStateToProps = createStructuredSelector({
+  bodyshop: selectBodyshop,
+});
+const mapDispatchToProps = (dispatch) => ({
+  //setUserLanguage: language => dispatch(setUserLanguage(language))
+});
+
+export function JobIntakeForm({ formItems, bodyshop }) {
+  const { t } = useTranslation();
+  const [intakeJob] = useMutation(UPDATE_JOB);
+  const { jobId } = useParams();
+  const history = useHistory();
+  const handleFinish = async (values) => {
+    console.log("values", values);
+
+    const result = await intakeJob({
+      variables: {
+        jobId: jobId,
+        job: {
+          inproduction: values.addToProduction || false,
+          status: bodyshop.md_ro_statuses.default_arrived || "Arrived*",
+          actual_in: new Date(),
+          scheduled_completion: values.scheduledCompletion,
+          intakechecklist: values,
+          scheduled_delivery: values.scheduledDelivery,
+        },
+      },
+    });
+    if (!!!result.errors) {
+      notification["success"]({ message: t("intake.successes.intake") });
+      history.push(`/manage/jobs/${jobId}`);
+    } else {
+      notification["error"]({
+        message: t("intake.errors.intake", {
+          error: JSON.stringify(result.errors),
+        }),
+      });
+    }
+    console.log("handleFinish -> result", result);
+  };
+
+  const [form] = Form.useForm();
+
+  return (
+    <Form
+      form={form}
+      onFinish={handleFinish}
+      initialValues={{ addToProduction: true }}>
+      {t("intake.labels.checklist")}
+      {formItems.map((f, idx) => {
+        switch (f.type) {
+          case "checkbox":
+            return <CheckboxFormItem key={idx} formItem={f} />;
+          default:
+            return <div key={idx}>Error</div>;
+        }
+      })}
+      <Form.Item
+        name='addToProduction'
+        valuePropName='checked'
+        label={t("intake.labels.addtoproduction")}>
+        <Switch />
+      </Form.Item>
+      <Form.Item
+        name='scheduledCompletion'
+        label={t("jobs.fields.scheduled_completion")}
+        rules={[
+          {
+            required: true,
+            message: t("general.validation.required"),
+          },
+        ]}>
+        <DatePicker />
+      </Form.Item>
+      <Form.Item
+        name='scheduledDelivery'
+        label={t("jobs.fields.scheduled_delivery")}>
+        <DatePicker />
+      </Form.Item>
+      <Button htmlType='submit'>{t("general.actions.submit")}</Button>
+    </Form>
+  );
+}
+
+export default connect(mapStateToProps, mapDispatchToProps)(JobIntakeForm);

client/src/components/job-intake/components/job-intake-template-item/job-intake-template-item.component.jsx

@@ -0,0 +1,10 @@
+import React from "react";
+import { PrinterFilled } from "@ant-design/icons";
+export default function JobIntakeTemplateItem({ templateKey, renderTemplate }) {
+  return (
+    <div>
+      {templateKey}
+      <PrinterFilled onClick={() => renderTemplate(templateKey)} />
+    </div>
+  );
+}

client/src/components/job-intake/components/job-intake-template-list/job-intake-template-list.component.jsx

@@ -0,0 +1,58 @@
+import React from "react";
+import JobIntakeTemplateItem from "../job-intake-template-item/job-intake-template-item.component";
+import { useParams } from "react-router-dom";
+import RenderTemplate, {
+  displayTemplateInWindow,
+} from "../../../../utils/RenderTemplate";
+import { Button } from "antd";
+import { selectBodyshop } from "../../../../redux/user/user.selectors";
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import { useTranslation } from "react-i18next";
+
+const mapStateToProps = createStructuredSelector({
+  //currentUser: selectCurrentUser
+  bodyshop: selectBodyshop,
+});
+const mapDispatchToProps = (dispatch) => ({
+  //setUserLanguage: language => dispatch(setUserLanguage(language))
+});
+
+export function JobIntakeTemplateList({ bodyshop, templates }) {
+  const { jobId } = useParams();
+  const { t } = useTranslation();
+  const renderTemplate = async (templateKey) => {
+    const html = await RenderTemplate(
+      {
+        name: templateKey,
+        variables: { id: jobId },
+      },
+      bodyshop
+    );
+    displayTemplateInWindow(html);
+  };
+
+  const renderAllTemplates = () => {
+    templates.forEach((template) => renderTemplate(template));
+  };
+
+  return (
+    <div>
+      {t("intake.labels.printpack")}
+      <Button onClick={renderAllTemplates}>
+        {t("intake.actions.printall")}
+      </Button>
+      {templates.map((template) => (
+        <JobIntakeTemplateItem
+          key={template}
+          templateKey={template}
+          renderTemplate={renderTemplate}
+        />
+      ))}
+    </div>
+  );
+}
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(JobIntakeTemplateList);

client/src/components/job-intake/job-intake.component.jsx

@@ -0,0 +1,13 @@
+import React from "react";
+import JobIntakeTemplateList from "./components/job-intake-template-list/job-intake-template-list.component";
+import JobIntakeForm from "./components/job-intake-form/job-intake-form.component";
+export default function JobIntakeComponent({ intakeChecklistConfig }) {
+  const { form, templates } = intakeChecklistConfig;
+
+  return (
+    <div>
+      <JobIntakeTemplateList templates={templates} />
+      <JobIntakeForm formItems={form} />
+    </div>
+  );
+}

client/src/components/print-center-item/print-center-item.component.jsx

@@ -5,7 +5,9 @@ import { createStructuredSelector } from "reselect";
 import { setEmailOptions } from "../../redux/email/email.actions";
 import { selectPrintCenter } from "../../redux/modals/modals.selectors";
 import { selectBodyshop } from "../../redux/user/user.selectors";
-import RenderTemplate from "../../utils/RenderTemplate";
+import RenderTemplate, {
+  displayTemplateInWindow,
+} from "../../utils/RenderTemplate";
 const mapStateToProps = createStructuredSelector({
   printCenterModal: selectPrintCenter,
   bodyshop: selectBodyshop,
@@ -28,12 +30,9 @@ export function PrintCenterItemComponent({
         name: item.key,
         variables: { id: id },
       },
-
       bodyshop
     );
-
-    var newWin = window.open();
-    newWin.document.write(html);
+    displayTemplateInWindow(html);
   };
 
   if (disabled) return <li className='print-center-item'>{item.title} </li>;

client/src/components/shop-template-add/shop-template-add.component.jsx

@@ -9,7 +9,7 @@ import { useHistory, useLocation } from "react-router-dom";
 import { createStructuredSelector } from "reselect";
 import { INSERT_TEMPLATE } from "../../graphql/templates.queries";
 import { selectBodyshop } from "../../redux/user/user.selectors";
-import { TemplateList } from "../../utils/constants";
+import { TemplateList } from "../../utils/TemplateConstants";
 
 const mapStateToProps = createStructuredSelector({
   //currentUser: selectCurrentUser

client/src/components/shop-templates-list/shop-templates-list.container.jsx

@@ -7,7 +7,7 @@ import Skeleton from "../loading-skeleton/loading-skeleton.component";
 import { useTranslation } from "react-i18next";
 import { useHistory, useLocation } from "react-router-dom";
 import queryString from "query-string";
-import { TemplateList } from "../../utils/constants";
+import { TemplateList } from "../../utils/TemplateConstants";
 import ShopTemplateAdd from "../shop-template-add/shop-template-add.component";
 import ShopTemplateDeleteComponent from "../shop-template-delete/shop-template-delete.component";