Added receipt print out at end of payment processing BOD-93

client/src/components/payment-form/payment-form.component.jsx

@@ -1,5 +1,5 @@
 import { CardElement } from "@stripe/react-stripe-js";
-import { Checkbox, Form, Input } from "antd";
+import { Checkbox, Form, Input, Radio } from "antd";
 import React from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
@@ -76,6 +76,17 @@ export function PaymentFormComponent({
         />
       </Form.Item>
 
+      <Form.Item
+        label={t("general.labels.sendby")}
+        name="sendby"
+        initialValue="email"
+      >
+        <Radio.Group>
+          <Radio.Button value="email">{t("general.labels.email")}</Radio.Button>
+          <Radio.Button value="print">{t("general.labels.print")}</Radio.Button>
+        </Radio.Group>
+      </Form.Item>
+
       {!!!bodyshop.stripe_acct_id ? (
         <div style={{ fontStyle: "italic" }}>{t("payments.labels.signup")}</div>
       ) : null}

client/src/components/payment-modal/payment-modal.container.jsx

@@ -14,6 +14,11 @@ import PaymentForm from "../payment-form/payment-form.container";
 import axios from "axios";
 import { useMutation } from "@apollo/react-hooks";
 import { INSERT_NEW_PAYMENT } from "../../graphql/payments.queries";
+import { TemplateList } from "../../utils/TemplateConstants";
+import RenderTemplate, {
+  displayTemplateInWindow,
+} from "../../utils/RenderTemplate";
+import { setEmailOptions } from "../../redux/email/email.actions";
 
 const mapStateToProps = createStructuredSelector({
   paymentModal: selectPayment,
@@ -22,6 +27,7 @@ const mapStateToProps = createStructuredSelector({
 });
 
 const mapDispatchToProps = (dispatch) => ({
+  setEmailOptions: (e) => dispatch(setEmailOptions(e)),
   toggleModalVisible: () => dispatch(toggleModalVisible("payment")),
 });
 
@@ -30,6 +36,7 @@ function InvoiceEnterModalContainer({
   toggleModalVisible,
   bodyshop,
   currentUser,
+  setEmailOptions,
 }) {
   const [form] = Form.useForm();
   const [insertPayment] = useMutation(INSERT_NEW_PAYMENT);
@@ -48,7 +55,7 @@ function InvoiceEnterModalContainer({
   const cardValid = !!!stripeState.error && stripeState.cardComplete;
 
   const handleFinish = async (values) => {
-    const { useStripe, ...paymentObj } = values;
+    const { useStripe, sendby, ...paymentObj } = values;
     if (useStripe && !cardValid) return;
 
     if ((useStripe && !stripe) || !elements) {
@@ -106,6 +113,33 @@ function InvoiceEnterModalContainer({
         notification["error"]({ message: t("payments.errors.payment") });
       }
 
+      if (sendby === "email") {
+        setEmailOptions({
+          messageOptions: {
+            // to: appData.email,
+            replyTo: bodyshop.email,
+          },
+          template: {
+            name: TemplateList.payment_receipt.key,
+            variables: {
+              id: newPayment.data.insert_payments.returning[0].id,
+            },
+          },
+        });
+      } else {
+        displayTemplateInWindow(
+          await RenderTemplate(
+            {
+              name: TemplateList.payment_receipt.key,
+              variables: {
+                id: newPayment.data.insert_payments.returning[0].id,
+              },
+            },
+            bodyshop
+          )
+        );
+      }
+
       if (actions.refetch) actions.refetch();
       toggleModalVisible();
     } catch (error) {

client/src/translations/en_us/common.json

@@ -401,8 +401,10 @@
 				"no": "No",
 				"out": "Out",
 				"password": "Password",
+				"print": "Print",
 				"search": "Search...",
 				"selectdate": "Select date...",
+				"sendby": "Send By",
 				"text": "Text",
 				"unknown": "Unknown",
 				"username": "Username",

client/src/translations/es/common.json

@@ -401,8 +401,10 @@
 				"no": "",
 				"out": "Afuera",
 				"password": "",
+				"print": "",
 				"search": "Buscar...",
 				"selectdate": "",
+				"sendby": "",
 				"text": "",
 				"unknown": "Desconocido",
 				"username": "",

client/src/translations/fr/common.json

@@ -401,8 +401,10 @@
 				"no": "",
 				"out": "En dehors",
 				"password": "",
+				"print": "",
 				"search": "Chercher...",
 				"selectdate": "",
+				"sendby": "",
 				"text": "",
 				"unknown": "Inconnu",
 				"username": "",

client/src/utils/TemplateConstants.js

@@ -41,4 +41,10 @@ export const TemplateList = {
     drivingId: "csi Id",
     key: "csi_invitation",
   },
+  payment_receipt: {
+    title: "Payment Receipt",
+    description: "Receipt of payment for customer",
+    drivingId: "Payment Id",
+    key: "payment_receipt",
+  },
 };