transfered test files to separate component

This commit is contained in:
swtmply
2023-03-04 04:05:28 +08:00
parent c8ee9ca5a7
commit aa5110ae13
7 changed files with 130 additions and 63 deletions

View File

@@ -1,43 +0,0 @@
import { Modal } from "antd";
import React from "react";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { toggleModalVisible } from "../../redux/modals/modals.actions";
import { selectCardPayment } from "../../redux/modals/modals.selectors";
import { selectBodyshop } from "../../redux/user/user.selectors";
import IntellipayTestPage from "./intellipay-test";
const mapStateToProps = createStructuredSelector({
cardPaymentModal: selectCardPayment,
bodyshop: selectBodyshop,
});
const mapDispatchToProps = (dispatch) => ({
toggleModalVisible: () => dispatch(toggleModalVisible("cardPayment")),
});
function CardPaymentModalComponent({
cardPaymentModal,
toggleModalVisible,
bodyshop,
}) {
const { context, visible } = cardPaymentModal;
return (
<Modal
visible={visible}
onOk={() => toggleModalVisible()}
onCancel={() => toggleModalVisible()}
cancelButtonProps={{ style: { display: "none" } }}
width="90%"
destroyOnClose
>
<IntellipayTestPage bodyshop={bodyshop} context={context} />
</Modal>
);
}
export default connect(
mapStateToProps,
mapDispatchToProps
)(CardPaymentModalComponent);

View File

@@ -3,7 +3,7 @@ import React from "react";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { setModalContext } from "../../redux/modals/modals.actions";
import CardPaymentModalComponent from "./card-payment-modal.component.";
import CardPaymentModalContainer from "../card-payment-modal/card-payment-modal.container.";
const mapStateToProps = createStructuredSelector({});
@@ -15,13 +15,11 @@ const mapDispatchToProps = (dispatch) => ({
function Test({ setCardPaymentContext }) {
return (
<div>
<CardPaymentModalComponent />
<CardPaymentModalContainer />
<Button
onClick={() =>
setCardPaymentContext({
context: {
test: "Test String",
},
context: {},
})
}
>

View File

@@ -1,17 +1,19 @@
import React, { useEffect } from "react";
import axios from "axios";
import { useTranslation } from "react-i18next";
import { Button, Card, Form, Input, InputNumber, Select } from "antd";
import { Button, Card, Form, Input, InputNumber, Row, Select } from "antd";
import moment from "moment";
import { useMutation } from "@apollo/client";
import LayoutFormRow from "../layout-form-row/layout-form-row.component";
import JobSearchSelectComponent from "../job-search-select/job-search-select.component";
import { INSERT_NEW_PAYMENT } from "../../graphql/payments.queries";
import { INSERT_PAYMENT_RESPONSE } from "./payment_response.queries";
import { INSERT_PAYMENT_RESPONSE } from "../_test/payment_response.queries";
import DataLabel from "../data-label/data-label.component";
const IntellpayTestPage = ({ bodyshop, context }) => {
const CardPaymentModalComponent = ({ bodyshop, context }) => {
const [form] = Form.useForm();
const amount = Form.useWatch("amount", form);
const payer = Form.useWatch("payer", form);
const [insertPayment] = useMutation(INSERT_NEW_PAYMENT);
const [insertPaymentResponse] = useMutation(INSERT_PAYMENT_RESPONSE);
const { t } = useTranslation();
@@ -36,8 +38,17 @@ const IntellpayTestPage = ({ bodyshop, context }) => {
console.log("Modal - Payment Response: ", response);
// TODO store the response
form.setFieldValue("paymentResponse", response);
form.submit();
});
window.intellipay.runOnNonApproval(function (response) {
console.log("Modal: Non Payment: ", response);
});
});
if (context.jobid) {
form.setFieldValue("jobid", context.jobid);
}
}, []);
const disabled = false;
@@ -90,12 +101,12 @@ const IntellpayTestPage = ({ bodyshop, context }) => {
rules={[
{
required: true,
//message: t("general.validation.required"),
// message: t("general.validation.required"),
},
]}
>
<JobSearchSelectComponent
disabled={disabled}
disabled={context.jobid}
notExported={false}
clm_no
/>
@@ -121,7 +132,7 @@ const IntellpayTestPage = ({ bodyshop, context }) => {
rules={[
{
required: true,
//message: t("general.validation.required"),
// message: t("general.validation.required"),
},
]}
>
@@ -147,15 +158,29 @@ const IntellpayTestPage = ({ bodyshop, context }) => {
>
<InputNumber />
</Form.Item>
<Button type="primary" data-ipayname="submit" className="ipayfield">
Proceed to Payment
</Button>
</LayoutFormRow>
<Button htmlType="submit">Submit Payment</Button>
<Row justify="space-around">
<Button
type="primary"
data-ipayname="submit"
className="ipayfield"
disabled={!amount || !payer}
>
Proceed to Payment
</Button>
<DataLabel
valueStyle={{
color: context.balance.getAmount() !== 0 ? "red" : "green",
}}
label={t("payments.labels.balance")}
>
{context.balance.toFormat()}
</DataLabel>
</Row>
</LayoutFormRow>
</Form>
</Card>
);
};
export default IntellpayTestPage;
export default CardPaymentModalComponent;

View File

@@ -0,0 +1,62 @@
import { Button, Modal } from "antd";
import React from "react";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { toggleModalVisible } from "../../redux/modals/modals.actions";
import { selectCardPayment } from "../../redux/modals/modals.selectors";
import { selectBodyshop } from "../../redux/user/user.selectors";
import CardPaymentModalComponent from "./card-payment-modal.component.";
const mapStateToProps = createStructuredSelector({
cardPaymentModal: selectCardPayment,
bodyshop: selectBodyshop,
});
const mapDispatchToProps = (dispatch) => ({
toggleModalVisible: () => dispatch(toggleModalVisible("cardPayment")),
});
function CardPaymentModalContainer({
cardPaymentModal,
toggleModalVisible,
bodyshop,
}) {
const { context, visible, actions } = cardPaymentModal;
const handleCancel = () => {
toggleModalVisible();
actions.refetch();
};
const handleOK = () => {
toggleModalVisible();
actions.refetch();
};
const handleNewPayment = () => {};
return (
<Modal
visible={visible}
onOk={handleOK}
onCancel={handleCancel}
footer={[
<Button key="back" onClick={handleCancel}>
Go Back
</Button>,
<Button key="submit" type="primary" onClick={handleNewPayment}>
Submit Payment
</Button>,
]}
width="50%"
destroyOnClose
>
<CardPaymentModalComponent bodyshop={bodyshop} context={context} />
</Modal>
);
}
export default connect(
mapStateToProps,
mapDispatchToProps
)(CardPaymentModalContainer);

View File

@@ -23,6 +23,8 @@ const mapStateToProps = createStructuredSelector({
const mapDispatchToProps = (dispatch) => ({
setPaymentContext: (context) =>
dispatch(setModalContext({ context: context, modal: "payment" })),
setCardPaymentContext: (context) =>
dispatch(setModalContext({ context: context, modal: "cardPayment" })),
});
export function JobPayments({
@@ -30,6 +32,7 @@ export function JobPayments({
jobRO,
bodyshop,
setPaymentContext,
setCardPaymentContext,
refetch,
}) {
const { t } = useTranslation();
@@ -160,6 +163,16 @@ export function JobPayments({
>
{t("menus.header.enterpayment")}
</Button>
<Button
onClick={() =>
setCardPaymentContext({
actions: { refetch: refetch },
context: { jobid: job.id, balance },
})
}
>
Card Payment
</Button>
<DataLabel
valueStyle={{ color: balance.getAmount() !== 0 ? "red" : "green" }}
label={t("payments.labels.balance")}

View File

@@ -31,6 +31,10 @@ const ManageRootPage = lazy(() =>
);
const JobsPage = lazy(() => import("../jobs/jobs.page"));
const CardPaymentModalContainer = lazy(() =>
import("../../components/card-payment-modal/card-payment-modal.container.")
);
const JobsDetailPage = lazy(() =>
import("../jobs-detail/jobs-detail.page.container")
);
@@ -195,6 +199,8 @@ export function Manage({ match, conflict, bodyshop }) {
>
<PaymentModalContainer />
<CardPaymentModalContainer />
<BreadCrumbs />
<BillEnterModalContainer />
<JobCostingModal />

View File

@@ -11,8 +11,11 @@ require("dotenv").config({
),
});
const url = process.env.NODE_ENV
? "https://secure.cpteller.com/api/custapi.cfc?method=autoterminal"
: "https://test.cpteller.com/api/custapi.cfc?method=autoterminal";
exports.lightbox_credentials = async (req, res) => {
console.log("In API Lightbox Credential route.");
try {
const options = {
method: "POST",
@@ -21,9 +24,12 @@ exports.lightbox_credentials = async (req, res) => {
data: qs.stringify({
merchantkey: "3B8068",
apikey: "Oepn2B.XqRgzAqHqvOOmYUxD2VW.vGSipi",
operatingenv: "businessattended", // add these for EMV Swipe
operatingenv:
process.env.NODE_ENV === undefined
? process.env.NODE_ENV
: "businessattended",
}),
url: "https://test.cpteller.com/api/custapi.cfc?method=autoterminal", //added .test
url,
};
const response = await axios(options);