@pinerohit11/testwidget 0.2.113 → 0.2.115
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +275 -162
- package/dist/index.mjs +234 -121
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -134,7 +134,7 @@ var Loader_default = Loader;
|
|
|
134
134
|
|
|
135
135
|
// src/app/components/baseurl.ts
|
|
136
136
|
var baseUrl = "http://192.168.1.63:8082/";
|
|
137
|
-
var masterBaseUrl = "
|
|
137
|
+
var masterBaseUrl = "https://dev-sky-node.fractalpay.com/";
|
|
138
138
|
|
|
139
139
|
// src/app/components/Errortext.ts
|
|
140
140
|
var ErrorText = {
|
|
@@ -1159,7 +1159,7 @@ function RequestPreAuthPayment(props) {
|
|
|
1159
1159
|
}
|
|
1160
1160
|
|
|
1161
1161
|
// src/app/components/Charge/GetPaymentPage.tsx
|
|
1162
|
-
import
|
|
1162
|
+
import React13, { useEffect as useEffect4, useState as useState3 } from "react";
|
|
1163
1163
|
|
|
1164
1164
|
// src/app/components/Charge/Chargewidgetstyles.tsx
|
|
1165
1165
|
import React8 from "react";
|
|
@@ -2113,10 +2113,131 @@ function DataScript() {
|
|
|
2113
2113
|
return null;
|
|
2114
2114
|
}
|
|
2115
2115
|
|
|
2116
|
+
// src/app/components/ErrorCardMessage/ErrorCardMessage.tsx
|
|
2117
|
+
import React12 from "react";
|
|
2118
|
+
|
|
2119
|
+
// src/app/components/ErrorCardMessage/ErrorCardMessageStyle.tsx
|
|
2120
|
+
import React11 from "react";
|
|
2121
|
+
function ErrorCardMszStyle() {
|
|
2122
|
+
return /* @__PURE__ */ React11.createElement("style", null, `
|
|
2123
|
+
.card-error .logo-container {
|
|
2124
|
+
display: flex;
|
|
2125
|
+
justify-content: center;
|
|
2126
|
+
align-items: center;
|
|
2127
|
+
margin-bottom: -50px; /* Adjust this to overlap the content */
|
|
2128
|
+
z-index: 10;
|
|
2129
|
+
}
|
|
2130
|
+
|
|
2131
|
+
.card-error .client-logo {
|
|
2132
|
+
max-width: 100px;
|
|
2133
|
+
height: auto;
|
|
2134
|
+
object-fit: contain;
|
|
2135
|
+
display: block;
|
|
2136
|
+
}
|
|
2137
|
+
|
|
2138
|
+
.card-error .payment-error-container {
|
|
2139
|
+
display: flex;
|
|
2140
|
+
flex-direction: column;
|
|
2141
|
+
align-items: center;
|
|
2142
|
+
padding: 18px 20px 24px;
|
|
2143
|
+
// width: 335px;
|
|
2144
|
+
min-height: 250px; /* Fixed height */
|
|
2145
|
+
background: #FFFFFF;
|
|
2146
|
+
border-radius: 12px;
|
|
2147
|
+
position: relative;
|
|
2148
|
+
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
|
|
2149
|
+
border: 1px solid #e3e3e3;
|
|
2150
|
+
justify-content: center;
|
|
2151
|
+
text-align: center;
|
|
2152
|
+
// margin-top: 50px; /* Adjust this to move the content down */
|
|
2153
|
+
margin: 50px auto 0 auto !important;
|
|
2154
|
+
}
|
|
2155
|
+
|
|
2156
|
+
.card-error .error-icon {
|
|
2157
|
+
display: flex;
|
|
2158
|
+
flex-direction: column;
|
|
2159
|
+
align-items: center;
|
|
2160
|
+
gap: 12px;
|
|
2161
|
+
min-height: 116px;
|
|
2162
|
+
z-index: 2;
|
|
2163
|
+
}
|
|
2164
|
+
|
|
2165
|
+
.card-error .circle {
|
|
2166
|
+
width: 50px;
|
|
2167
|
+
height: 50px;
|
|
2168
|
+
border: 1px solid red;
|
|
2169
|
+
border-radius: 50%;
|
|
2170
|
+
display: flex;
|
|
2171
|
+
justify-content: center;
|
|
2172
|
+
align-items: center;
|
|
2173
|
+
margin-bottom:20px
|
|
2174
|
+
}
|
|
2175
|
+
|
|
2176
|
+
.card-error .circle .fa-times {
|
|
2177
|
+
font-size: 30px;
|
|
2178
|
+
color: red;
|
|
2179
|
+
}
|
|
2180
|
+
|
|
2181
|
+
.card-error .error-text {
|
|
2182
|
+
display: flex;
|
|
2183
|
+
flex-direction: column;
|
|
2184
|
+
justify-content: center;
|
|
2185
|
+
align-items: center;
|
|
2186
|
+
gap: 4px;
|
|
2187
|
+
// width: 227px;
|
|
2188
|
+
}
|
|
2189
|
+
|
|
2190
|
+
.card-error .payment-error-text {
|
|
2191
|
+
font-family: 'Inter', sans-serif;
|
|
2192
|
+
font-weight: 500;
|
|
2193
|
+
font-size: 18px;
|
|
2194
|
+
line-height: 21px;
|
|
2195
|
+
text-align: center;
|
|
2196
|
+
letter-spacing: -0.02em;
|
|
2197
|
+
color: #161616;
|
|
2198
|
+
}
|
|
2199
|
+
|
|
2200
|
+
.card-error .thank-you-text {
|
|
2201
|
+
font-family: 'Inter', sans-serif;
|
|
2202
|
+
font-weight: 500;
|
|
2203
|
+
font-size: 16px;
|
|
2204
|
+
line-height: 18px;
|
|
2205
|
+
text-align: center;
|
|
2206
|
+
letter-spacing: -0.02em;
|
|
2207
|
+
color: #161616 !important;
|
|
2208
|
+
opacity: 0.5;
|
|
2209
|
+
padding-top:10px
|
|
2210
|
+
}
|
|
2211
|
+
|
|
2212
|
+
.card-error .error-btn-div{
|
|
2213
|
+
padding-top:30px;
|
|
2214
|
+
|
|
2215
|
+
}
|
|
2216
|
+
.card-error .error-btn-div button{
|
|
2217
|
+
border-radius: 0.25em;
|
|
2218
|
+
border:none;
|
|
2219
|
+
background: initial;
|
|
2220
|
+
background-color: #7066e0;
|
|
2221
|
+
box-shadow: var(--swal2-confirm-button-box-shadow);
|
|
2222
|
+
color: white;
|
|
2223
|
+
font-size: 1em;
|
|
2224
|
+
padding:10px 17px;
|
|
2225
|
+
cursor:pointer;
|
|
2226
|
+
}
|
|
2227
|
+
`);
|
|
2228
|
+
}
|
|
2229
|
+
|
|
2230
|
+
// src/app/components/ErrorCardMessage/ErrorCardMessage.tsx
|
|
2231
|
+
var ErrorCardMessage = ({ onClose, error }) => {
|
|
2232
|
+
return /* @__PURE__ */ React12.createElement(React12.Fragment, null, /* @__PURE__ */ React12.createElement(ErrorCardMszStyle, null), /* @__PURE__ */ React12.createElement("div", { className: "card-error" }, /* @__PURE__ */ React12.createElement("div", { className: "payment-error-container" }, /* @__PURE__ */ React12.createElement("div", { className: "error-icon" }, /* @__PURE__ */ React12.createElement("div", { className: "circle" }, /* @__PURE__ */ React12.createElement("i", { className: "fa fa-times", "aria-hidden": "true" })), /* @__PURE__ */ React12.createElement("div", { className: "error-text" }, /* @__PURE__ */ React12.createElement("div", { className: "payment-error-text" }, error), /* @__PURE__ */ React12.createElement("div", { className: "thank-you-text" }, "Try again later ")), /* @__PURE__ */ React12.createElement("div", { className: "error-btn-div" }, /* @__PURE__ */ React12.createElement("button", { onClick: onClose }, "OK"))))));
|
|
2233
|
+
};
|
|
2234
|
+
var ErrorCardMessage_default = ErrorCardMessage;
|
|
2235
|
+
|
|
2116
2236
|
// src/app/components/Charge/GetPaymentPage.tsx
|
|
2117
2237
|
function GetPaymentPage(props) {
|
|
2118
2238
|
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
|
|
2119
2239
|
const [loading, setLoading] = useState3(false);
|
|
2240
|
+
const [error, setError] = useState3("");
|
|
2120
2241
|
const [success, setSuccess] = useState3(false);
|
|
2121
2242
|
const [show, setShow] = useState3(false);
|
|
2122
2243
|
const [activetab, setActive] = useState3("card");
|
|
@@ -2133,15 +2254,10 @@ function GetPaymentPage(props) {
|
|
|
2133
2254
|
let [tranId, setTranId] = useState3("");
|
|
2134
2255
|
const showLoader = () => setLoading(true);
|
|
2135
2256
|
const hideLoader = () => setLoading(false);
|
|
2136
|
-
const showError = (msz) => {
|
|
2137
|
-
Swal.fire({
|
|
2138
|
-
icon: "error",
|
|
2139
|
-
text: msz
|
|
2140
|
-
});
|
|
2141
|
-
};
|
|
2142
2257
|
const handleClose = () => {
|
|
2143
2258
|
setShow(false);
|
|
2144
2259
|
setActive("card");
|
|
2260
|
+
setError("");
|
|
2145
2261
|
setSuccess(false);
|
|
2146
2262
|
setTranId("");
|
|
2147
2263
|
setAchData({
|
|
@@ -2355,7 +2471,7 @@ function GetPaymentPage(props) {
|
|
|
2355
2471
|
let tokenCallback = async function(response) {
|
|
2356
2472
|
var _a3, _b3, _c3;
|
|
2357
2473
|
if (response.Error) {
|
|
2358
|
-
|
|
2474
|
+
setError(response.Error);
|
|
2359
2475
|
hideLoader();
|
|
2360
2476
|
} else {
|
|
2361
2477
|
let name = cardData == null ? void 0 : cardData.cardName;
|
|
@@ -2380,7 +2496,7 @@ function GetPaymentPage(props) {
|
|
|
2380
2496
|
hideLoader();
|
|
2381
2497
|
} catch (err) {
|
|
2382
2498
|
hideLoader();
|
|
2383
|
-
|
|
2499
|
+
setError(((_c3 = (_b3 = err == null ? void 0 : err.response) == null ? void 0 : _b3.data) == null ? void 0 : _c3.message) || (err == null ? void 0 : err.message) || "Something went wrong.");
|
|
2384
2500
|
}
|
|
2385
2501
|
}
|
|
2386
2502
|
};
|
|
@@ -2446,15 +2562,15 @@ function GetPaymentPage(props) {
|
|
|
2446
2562
|
}
|
|
2447
2563
|
} catch (err) {
|
|
2448
2564
|
hideLoader();
|
|
2449
|
-
|
|
2565
|
+
setError(((_o = (_n = err == null ? void 0 : err.response) == null ? void 0 : _n.data) == null ? void 0 : _o.message) || (err == null ? void 0 : err.message) || "Something went wrong.");
|
|
2450
2566
|
}
|
|
2451
2567
|
} catch (err) {
|
|
2452
2568
|
hideLoader();
|
|
2453
|
-
|
|
2569
|
+
setError(((_q = (_p = err == null ? void 0 : err.response) == null ? void 0 : _p.data) == null ? void 0 : _q.message) || (err == null ? void 0 : err.message) || "Something went wrong.");
|
|
2454
2570
|
}
|
|
2455
2571
|
} catch (err) {
|
|
2456
2572
|
hideLoader();
|
|
2457
|
-
|
|
2573
|
+
setError(((_s = (_r = err == null ? void 0 : err.response) == null ? void 0 : _r.data) == null ? void 0 : _s.message) || (err == null ? void 0 : err.message) || "Something went wrong.");
|
|
2458
2574
|
}
|
|
2459
2575
|
} else {
|
|
2460
2576
|
if (typeof DatacapWebToken !== "undefined") {
|
|
@@ -2463,7 +2579,7 @@ function GetPaymentPage(props) {
|
|
|
2463
2579
|
}
|
|
2464
2580
|
} catch (err) {
|
|
2465
2581
|
hideLoader();
|
|
2466
|
-
|
|
2582
|
+
setError(((_u = (_t = err == null ? void 0 : err.response) == null ? void 0 : _t.data) == null ? void 0 : _u.message) || (err == null ? void 0 : err.message) || "Something went wrong.");
|
|
2467
2583
|
}
|
|
2468
2584
|
}
|
|
2469
2585
|
}
|
|
@@ -2499,19 +2615,19 @@ function GetPaymentPage(props) {
|
|
|
2499
2615
|
handleClose();
|
|
2500
2616
|
}
|
|
2501
2617
|
});
|
|
2502
|
-
} catch (
|
|
2503
|
-
if (axios3.isAxiosError(
|
|
2618
|
+
} catch (error2) {
|
|
2619
|
+
if (axios3.isAxiosError(error2)) {
|
|
2504
2620
|
hideLoader();
|
|
2505
|
-
|
|
2621
|
+
setError((_z = (_y = (_x = (_w = error2.response) == null ? void 0 : _w.data) == null ? void 0 : _x.message) == null ? void 0 : _y.error) != null ? _z : "Something went wrong");
|
|
2506
2622
|
} else {
|
|
2507
|
-
console.error("Unexpected error",
|
|
2623
|
+
console.error("Unexpected error", error2);
|
|
2508
2624
|
}
|
|
2509
2625
|
}
|
|
2510
2626
|
}
|
|
2511
2627
|
}
|
|
2512
2628
|
};
|
|
2513
2629
|
const getPaymentDetails = async () => {
|
|
2514
|
-
var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2, _k, _l, _m;
|
|
2630
|
+
var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2, _k, _l, _m, _n, _o;
|
|
2515
2631
|
showLoader();
|
|
2516
2632
|
try {
|
|
2517
2633
|
const data = {
|
|
@@ -2522,7 +2638,7 @@ function GetPaymentPage(props) {
|
|
|
2522
2638
|
setPaymentData((_a2 = paymentData2 == null ? void 0 : paymentData2.data) == null ? void 0 : _a2.data);
|
|
2523
2639
|
if (!((_c2 = (_b2 = paymentData2 == null ? void 0 : paymentData2.data) == null ? void 0 : _b2.data) == null ? void 0 : _c2.paymentGateway)) {
|
|
2524
2640
|
handleClose();
|
|
2525
|
-
|
|
2641
|
+
setError("Something went wrong.");
|
|
2526
2642
|
}
|
|
2527
2643
|
if (((_e2 = (_d2 = paymentData2 == null ? void 0 : paymentData2.data) == null ? void 0 : _d2.data) == null ? void 0 : _e2.card_list) && ((_h2 = (_g2 = (_f2 = paymentData2 == null ? void 0 : paymentData2.data) == null ? void 0 : _f2.data) == null ? void 0 : _g2.card_list) == null ? void 0 : _h2.length) > 0) {
|
|
2528
2644
|
setCardList((_j2 = (_i2 = paymentData2 == null ? void 0 : paymentData2.data) == null ? void 0 : _i2.data) == null ? void 0 : _j2.card_list);
|
|
@@ -2536,10 +2652,9 @@ function GetPaymentPage(props) {
|
|
|
2536
2652
|
}
|
|
2537
2653
|
hideLoader();
|
|
2538
2654
|
} catch (err) {
|
|
2539
|
-
|
|
2655
|
+
console.log(err);
|
|
2540
2656
|
hideLoader();
|
|
2541
|
-
|
|
2542
|
-
showError("Something went wrong , Try again later");
|
|
2657
|
+
setError(((_o = (_n = err == null ? void 0 : err.response) == null ? void 0 : _n.data) == null ? void 0 : _o.message) || (err == null ? void 0 : err.message) || "Something went wrong");
|
|
2543
2658
|
}
|
|
2544
2659
|
};
|
|
2545
2660
|
const handlechargeCustomer = async () => {
|
|
@@ -2583,16 +2698,16 @@ function GetPaymentPage(props) {
|
|
|
2583
2698
|
}
|
|
2584
2699
|
} catch (err) {
|
|
2585
2700
|
hideLoader();
|
|
2586
|
-
|
|
2701
|
+
setError(((_f2 = (_e2 = err == null ? void 0 : err.response) == null ? void 0 : _e2.data) == null ? void 0 : _f2.message) || ((_h2 = (_g2 = err == null ? void 0 : err.response) == null ? void 0 : _g2.data) == null ? void 0 : _h2.status) || "Something went erong");
|
|
2587
2702
|
}
|
|
2588
2703
|
} else {
|
|
2589
|
-
|
|
2704
|
+
setError("Please Select A Card/ACH");
|
|
2590
2705
|
}
|
|
2591
2706
|
} else {
|
|
2592
|
-
|
|
2707
|
+
setError("Please Select Customer");
|
|
2593
2708
|
}
|
|
2594
2709
|
} else {
|
|
2595
|
-
|
|
2710
|
+
setError("Something went wrong.");
|
|
2596
2711
|
}
|
|
2597
2712
|
};
|
|
2598
2713
|
useEffect4(() => {
|
|
@@ -2666,25 +2781,27 @@ function GetPaymentPage(props) {
|
|
|
2666
2781
|
}
|
|
2667
2782
|
});
|
|
2668
2783
|
};
|
|
2669
|
-
|
|
2784
|
+
console.log(paymentData == null ? void 0 : paymentData.paymentGateway);
|
|
2785
|
+
return /* @__PURE__ */ React13.createElement(React13.Fragment, null, /* @__PURE__ */ React13.createElement(DataScript, null), /* @__PURE__ */ React13.createElement(Chargewidgetstyles, null), /* @__PURE__ */ React13.createElement(React13.Fragment, null, /* @__PURE__ */ React13.createElement(
|
|
2670
2786
|
"button",
|
|
2671
2787
|
{
|
|
2672
2788
|
className: "paymentBtn",
|
|
2673
2789
|
onClick: handleShow
|
|
2674
2790
|
},
|
|
2675
2791
|
"Pay"
|
|
2676
|
-
), /* @__PURE__ */
|
|
2792
|
+
), /* @__PURE__ */ React13.createElement(
|
|
2677
2793
|
CustomModal2_default,
|
|
2678
2794
|
{
|
|
2679
2795
|
open: show,
|
|
2680
2796
|
onClose: handleClose
|
|
2681
2797
|
},
|
|
2682
|
-
/* @__PURE__ */
|
|
2683
|
-
success
|
|
2798
|
+
error && /* @__PURE__ */ React13.createElement("div", { style: { maxHeight: "606px", minHeight: "60vh", padding: "40px" } }, /* @__PURE__ */ React13.createElement(ErrorCardMessage_default, { error, onClose: handleClose })),
|
|
2799
|
+
success && /* @__PURE__ */ React13.createElement(SuccessMsz, { onClose: handleClose, tranId }),
|
|
2800
|
+
!error && !success && /* @__PURE__ */ React13.createElement(React13.Fragment, null, loading && /* @__PURE__ */ React13.createElement(Loader_default, { loading }), /* @__PURE__ */ React13.createElement("div", { className: "frac-card-payment-page frac-form" }, /* @__PURE__ */ React13.createElement("div", { className: "parent-pay-container" }, /* @__PURE__ */ React13.createElement("span", { className: "request-payment-close-popup", onClick: handleClose }, /* @__PURE__ */ React13.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, /* @__PURE__ */ React13.createElement("g", { clipPath: "url(#clip0_12425_52336)" }, /* @__PURE__ */ React13.createElement("path", { d: "M9.46585 8.01168L15.6959 1.7814C16.1014 1.37615 16.1014 0.720912 15.6959 0.315659C15.2907 -0.0895946 14.6354 -0.0895946 14.2302 0.315659L7.99991 6.54593L1.76983 0.315659C1.36438 -0.0895946 0.709336 -0.0895946 0.304082 0.315659C-0.101361 0.720912 -0.101361 1.37615 0.304082 1.7814L6.53416 8.01168L0.304082 14.2419C-0.101361 14.6472 -0.101361 15.3024 0.304082 15.7077C0.506045 15.9098 0.771595 16.0114 1.03695 16.0114C1.30232 16.0114 1.56768 15.9098 1.76983 15.7077L7.99991 9.47742L14.2302 15.7077C14.4323 15.9098 14.6977 16.0114 14.9631 16.0114C15.2284 16.0114 15.4938 15.9098 15.6959 15.7077C16.1014 15.3024 16.1014 14.6472 15.6959 14.2419L9.46585 8.01168Z", fill: "#727272" })), /* @__PURE__ */ React13.createElement("defs", null, /* @__PURE__ */ React13.createElement("clipPath", { id: "clip0_12425_52336" }, /* @__PURE__ */ React13.createElement("rect", { width: "16", height: "16", fill: "white" }))))), /* @__PURE__ */ React13.createElement("div", { className: "pay-main-logo-res" }, /* @__PURE__ */ React13.createElement("img", { src: "https://fractal-userdata-upload.s3.us-east-1.amazonaws.com/uploaded/merchant_logo/20250311131124_merchant_logo.png", id: "pay-logos" })), /* @__PURE__ */ React13.createElement("div", { className: "pay-container" }, /* @__PURE__ */ React13.createElement("div", { className: "pay-header pay-conatiner-one" }, /* @__PURE__ */ React13.createElement("div", { className: "pay-conatiner-one-first" }, /* @__PURE__ */ React13.createElement("div", { className: "pay-logo-container" }, /* @__PURE__ */ React13.createElement("div", { className: "pay-main-logo" }, /* @__PURE__ */ React13.createElement("img", { src: "https://fractal-userdata-upload.s3.us-east-1.amazonaws.com/uploaded/merchant_logo/20250311131124_merchant_logo.png", id: "pay-logos" })), /* @__PURE__ */ React13.createElement("h1", { className: "pay-heading" }, "Pay"), (cardList == null ? void 0 : cardList.length) > 0 && activetab !== "cardList" && /* @__PURE__ */ React13.createElement("button", { className: "res-charge-payment-back-btn ", onClick: () => setActive("cardList") }, " ", /* @__PURE__ */ React13.createElement(IoArrowBack, null), " Back")), /* @__PURE__ */ React13.createElement("div", { className: "amt-pay-con" }, /* @__PURE__ */ React13.createElement("div", { className: "pay-amount-conatiner" }, /* @__PURE__ */ React13.createElement("small", { className: "pay-payment-amount" }, "Payment Amount"), /* @__PURE__ */ React13.createElement("strong", { className: "pay-amount" }, "$", props == null ? void 0 : props.amount)), activetab != "ach" && /* @__PURE__ */ React13.createElement("div", { style: { display: "flex", gap: "8px", margin: "8px 0" } }, /* @__PURE__ */ React13.createElement("img", { src: "https://dev-widget.fractalpay.com/images/visa-img.svg", alt: "", width: 33 }), /* @__PURE__ */ React13.createElement("img", { src: "https://dev-widget.fractalpay.com/images/mc-img.svg", width: 33, alt: "" }), /* @__PURE__ */ React13.createElement("img", { src: "https://dev-widget.fractalpay.com/images/ae-img.svg", alt: "", width: 33 }), /* @__PURE__ */ React13.createElement("img", { src: "https://dev-widget.fractalpay.com/images/discover-img.svg", width: 33, alt: "" })))), /* @__PURE__ */ React13.createElement("div", { className: "pay-conatiner-one-last" }, /* @__PURE__ */ React13.createElement("img", { src: "https://dev-widget.fractalpay.com/images/secure-img.png", alt: "" }), /* @__PURE__ */ React13.createElement("img", { src: "https://dev-widget.fractalpay.com/images/pov-by.png", alt: "" }), "Secure payments powered by Fractal"), /* @__PURE__ */ React13.createElement("div", null)), /* @__PURE__ */ React13.createElement("div", { className: "pay-tab pay-conatiner-two" }, !loading && /* @__PURE__ */ React13.createElement("div", { className: "col-md-12" }, /* @__PURE__ */ React13.createElement("div", { id: "payment-form-div" }, activetab !== "cardList" ? /* @__PURE__ */ React13.createElement("div", null, (cardList == null ? void 0 : cardList.length) > 0 && /* @__PURE__ */ React13.createElement("button", { className: "charge-payment-back-btn ", onClick: () => setActive("cardList") }, " ", /* @__PURE__ */ React13.createElement(IoArrowBack, null), " Back"), (paymentData == null ? void 0 : paymentData.isSkyFiAccount) && /* @__PURE__ */ React13.createElement("div", { className: "tab" }, /* @__PURE__ */ React13.createElement("button", { className: "tablinks", onClick: (e) => {
|
|
2684
2801
|
handletabchange("card");
|
|
2685
|
-
}, style: { border: activetab === "card" ? "1px solid" : "" } }, /* @__PURE__ */
|
|
2802
|
+
}, style: { border: activetab === "card" ? "1px solid" : "" } }, /* @__PURE__ */ React13.createElement("i", { className: "fas fa-credit-card me-2", style: { marginRight: "8px", fontSize: "15px" } }), "Card"), /* @__PURE__ */ React13.createElement("button", { className: "tablinks", onClick: (e) => {
|
|
2686
2803
|
handletabchange("ach");
|
|
2687
|
-
}, style: { border: activetab === "ach" ? "1px solid" : "" } }, /* @__PURE__ */
|
|
2804
|
+
}, style: { border: activetab === "ach" ? "1px solid" : "" } }, /* @__PURE__ */ React13.createElement("i", { className: "fas fa-university me-2", style: { marginRight: "8px", fontSize: "15px" } }), "Bank")), /* @__PURE__ */ React13.createElement("div", { className: "res-pay-con" }, /* @__PURE__ */ React13.createElement("div", { className: "pay-amount-conatiner", style: { margin: 0 } }, /* @__PURE__ */ React13.createElement("small", { className: "pay-payment-amount" }, "Payment Amount"), /* @__PURE__ */ React13.createElement("strong", { className: "pay-amount" }, "$", props == null ? void 0 : props.amount)), activetab != "ach" && /* @__PURE__ */ React13.createElement("div", null, /* @__PURE__ */ React13.createElement("div", null, /* @__PURE__ */ React13.createElement("img", { src: "https://dev-widget.fractalpay.com/images/visa-img.svg", alt: "", width: 35, style: { paddingRight: "5px" } }), /* @__PURE__ */ React13.createElement("img", { src: "https://dev-widget.fractalpay.com/images/mc-img.svg", width: 35, alt: "" })), /* @__PURE__ */ React13.createElement("div", null, /* @__PURE__ */ React13.createElement("img", { src: "https://dev-widget.fractalpay.com/images/ae-img.svg", alt: "", width: 35, style: { paddingRight: "5px" } }), /* @__PURE__ */ React13.createElement("img", { src: "https://dev-widget.fractalpay.com/images/discover-img.svg", width: 35, alt: "" }))))) : /* @__PURE__ */ React13.createElement("div", null, /* @__PURE__ */ React13.createElement("h6", { className: "charge-customer-name", style: { marginBottom: "16px !important" } }, " Charge ", paymentData == null ? void 0 : paymentData.customer_name), /* @__PURE__ */ React13.createElement("h6", { className: "card-ach-heading", style: { marginBottom: "10px !important" } }, " Cards/ACH"), /* @__PURE__ */ React13.createElement("div", { className: "res-pay-con" }, /* @__PURE__ */ React13.createElement("div", { className: "pay-amount-conatiner", style: { margin: 0 } }, /* @__PURE__ */ React13.createElement("small", { className: "pay-payment-amount" }, "Payment Amount"), /* @__PURE__ */ React13.createElement("strong", { className: "pay-amount" }, "$", props == null ? void 0 : props.amount)), /* @__PURE__ */ React13.createElement("div", null, /* @__PURE__ */ React13.createElement("div", null, /* @__PURE__ */ React13.createElement("img", { src: "https://dev-widget.fractalpay.com/images/visa-img.svg", alt: "", width: 35, style: { paddingRight: "5px" } }), /* @__PURE__ */ React13.createElement("img", { src: "https://dev-widget.fractalpay.com/images/mc-img.svg", width: 35, alt: "" })), /* @__PURE__ */ React13.createElement("div", null, /* @__PURE__ */ React13.createElement("img", { src: "https://dev-widget.fractalpay.com/images/ae-img.svg", alt: "", width: 35, style: { paddingRight: "5px" } }), /* @__PURE__ */ React13.createElement("img", { src: "https://dev-widget.fractalpay.com/images/discover-img.svg", width: 35, alt: "" }))))), /* @__PURE__ */ React13.createElement("div", { id: "ach", style: { display: activetab === "cardList" ? "block" : "none" }, className: "tabcontent" }, /* @__PURE__ */ React13.createElement("div", { className: "card-lint-div-in" }, /* @__PURE__ */ React13.createElement("div", { className: "card-list-div" }, (paymentData == null ? void 0 : paymentData.card_list) && ((_a = paymentData == null ? void 0 : paymentData.card_list) == null ? void 0 : _a.length) > 0 && ((_b = paymentData == null ? void 0 : paymentData.card_list) == null ? void 0 : _b.map((card, index) => /* @__PURE__ */ React13.createElement("div", { className: "card-list-single-div", key: index }, /* @__PURE__ */ React13.createElement("div", { className: "card-number-radio" }, /* @__PURE__ */ React13.createElement(
|
|
2688
2805
|
"input",
|
|
2689
2806
|
{
|
|
2690
2807
|
type: "radio",
|
|
@@ -2694,12 +2811,12 @@ function GetPaymentPage(props) {
|
|
|
2694
2811
|
checked: selectedCard === card,
|
|
2695
2812
|
onChange: (e) => setSelectedCard(card)
|
|
2696
2813
|
}
|
|
2697
|
-
), /* @__PURE__ */
|
|
2814
|
+
), /* @__PURE__ */ React13.createElement("label", { htmlFor: "", className: "card-number-last-four" }, "**** ", card == null ? void 0 : card.cardlastfourdigit), /* @__PURE__ */ React13.createElement("h6", { className: "card-expiry-date" }, card == null ? void 0 : card.expmonth, "/", card == null ? void 0 : card.expyear)), /* @__PURE__ */ React13.createElement("div", { className: "card-number-radio" }, /* @__PURE__ */ React13.createElement("span", { className: "visa-card" }, /* @__PURE__ */ React13.createElement("img", { src: (card == null ? void 0 : card.card_type) != "Bank" ? "https://dev-widget.fractalpay.com/images/visa-img.svg" : "https://dev-widget.fractalpay.com/images/bank.svg", alt: "" })), /* @__PURE__ */ React13.createElement("span", { className: "visa-card", style: { cursor: "pointer" }, onClick: () => handleDeleteCard(card == null ? void 0 : card.id) }, /* @__PURE__ */ React13.createElement("img", { src: "https://dev-widget.fractalpay.com/images/Trash.svg", alt: "" }))))))), /* @__PURE__ */ React13.createElement("div", { className: "pay-with-other-card ", onClick: () => setActive("card") }, "Pay With Other Card", /* @__PURE__ */ React13.createElement("img", { src: "https://dev-widget.fractalpay.com/images/card.svg", alt: "" }))), /* @__PURE__ */ React13.createElement("div", { className: "form-group", style: { padding: "0" } }, /* @__PURE__ */ React13.createElement("button", { className: "pay-button", style: { margin: "0px" }, type: "submit", onClick: handlechargeCustomer }, "$", props == null ? void 0 : props.amount))), /* @__PURE__ */ React13.createElement("div", { id: "card", style: { display: activetab === "card" ? "block" : "none" }, className: "tabcontent" }, /* @__PURE__ */ React13.createElement("form", { id: "PaymentForm", style: { textAlign: "start" }, onSubmit: submitFunc }, /* @__PURE__ */ React13.createElement("div", { className: "ach-scrl", style: { minHeight: (paymentData == null ? void 0 : paymentData.isSkyFiAccount) && (cardList == null ? void 0 : cardList.length) > 0 ? "398px" : (paymentData == null ? void 0 : paymentData.isSkyFiAccount) && (cardList == null ? void 0 : cardList.length) == 0 ? "456px" : (cardList == null ? void 0 : cardList.length) > 0 ? "462px" : "520px", overflow: "auto", marginRight: "5px" } }, /* @__PURE__ */ React13.createElement("div", { className: "form-group" }, /* @__PURE__ */ React13.createElement("label", { htmlFor: "cardHolderName" }, "NAME ON CARD "), /* @__PURE__ */ React13.createElement("input", { type: "text", className: "form-control", maxLength: 100, placeholder: "John Doe", value: (cardData == null ? void 0 : cardData.cardName) || "", onChange: (e) => {
|
|
2698
2815
|
const value = e.target.value;
|
|
2699
2816
|
if (/^[a-zA-Z\s]*$/.test(value)) {
|
|
2700
2817
|
handleCardChange("cardName", value);
|
|
2701
2818
|
}
|
|
2702
|
-
} }), (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */
|
|
2819
|
+
} }), (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */ React13.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.cardName)), /* @__PURE__ */ React13.createElement("div", { className: "form-group" }, /* @__PURE__ */ React13.createElement("label", { htmlFor: "cardNumber" }, "CARD NUMBER"), /* @__PURE__ */ React13.createElement("div", { className: "toggle-num-wrapper" }, /* @__PURE__ */ React13.createElement(
|
|
2703
2820
|
"input",
|
|
2704
2821
|
{
|
|
2705
2822
|
className: "form-control card-number-new",
|
|
@@ -2711,7 +2828,7 @@ function GetPaymentPage(props) {
|
|
|
2711
2828
|
onChange: (e) => handleCardNumberChange(e),
|
|
2712
2829
|
"data-token": "card_number"
|
|
2713
2830
|
}
|
|
2714
|
-
), /* @__PURE__ */
|
|
2831
|
+
), /* @__PURE__ */ React13.createElement("div", { className: "card-crdi card-expiry-new" }, /* @__PURE__ */ React13.createElement("div", { className: "exp-date-year-container" }, /* @__PURE__ */ React13.createElement("div", { className: "exp-date form-group" }, /* @__PURE__ */ React13.createElement(
|
|
2715
2832
|
"input",
|
|
2716
2833
|
{
|
|
2717
2834
|
"data-token": "exp_month",
|
|
@@ -2723,7 +2840,7 @@ function GetPaymentPage(props) {
|
|
|
2723
2840
|
value: (cardData == null ? void 0 : cardData.expiryMonth) || "",
|
|
2724
2841
|
onChange: (e) => handleCardChange("expiryMonth", e.target.value)
|
|
2725
2842
|
}
|
|
2726
|
-
)), /* @__PURE__ */
|
|
2843
|
+
)), /* @__PURE__ */ React13.createElement("div", { className: "exp-year form-group" }, /* @__PURE__ */ React13.createElement(
|
|
2727
2844
|
"input",
|
|
2728
2845
|
{
|
|
2729
2846
|
"data-token": "exp_year",
|
|
@@ -2735,7 +2852,7 @@ function GetPaymentPage(props) {
|
|
|
2735
2852
|
value: (cardData == null ? void 0 : cardData.expiryYear) || "",
|
|
2736
2853
|
onChange: (e) => handleCardChange("expiryYear", e.target.value)
|
|
2737
2854
|
}
|
|
2738
|
-
)), /* @__PURE__ */
|
|
2855
|
+
)), /* @__PURE__ */ React13.createElement("div", { className: "security-digit form-group" }, /* @__PURE__ */ React13.createElement(
|
|
2739
2856
|
"input",
|
|
2740
2857
|
{
|
|
2741
2858
|
"data-token": "cvv",
|
|
@@ -2747,7 +2864,7 @@ function GetPaymentPage(props) {
|
|
|
2747
2864
|
value: (cardData == null ? void 0 : cardData.cvv) || "",
|
|
2748
2865
|
onChange: (e) => handleCardChange("cvv", e.target.value)
|
|
2749
2866
|
}
|
|
2750
|
-
)))), (cardError == null ? void 0 : cardError.cardNumber) && /* @__PURE__ */
|
|
2867
|
+
)))), (cardError == null ? void 0 : cardError.cardNumber) && /* @__PURE__ */ React13.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.cardNumber), /* @__PURE__ */ React13.createElement("p", { style: { margin: "0" } }, (cardError == null ? void 0 : cardError.expiryMonth) || (cardError == null ? void 0 : cardError.expiryYear) ? /* @__PURE__ */ React13.createElement("span", { className: "error-span", style: { paddingRight: "4px" } }, cardError == null ? void 0 : cardError.expiryMonth) : "", (cardError == null ? void 0 : cardError.cvv) && /* @__PURE__ */ React13.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.cvv)))), /* @__PURE__ */ React13.createElement("div", { className: "form-group" }, /* @__PURE__ */ React13.createElement("label", { htmlFor: "OrderId" }, "Order ID / Description"), /* @__PURE__ */ React13.createElement(
|
|
2751
2868
|
"input",
|
|
2752
2869
|
{
|
|
2753
2870
|
type: "text",
|
|
@@ -2758,7 +2875,7 @@ function GetPaymentPage(props) {
|
|
|
2758
2875
|
value: (_c = props == null ? void 0 : props.orderID) != null ? _c : "",
|
|
2759
2876
|
style: { background: "#F6F6F7", color: "#727272" }
|
|
2760
2877
|
}
|
|
2761
|
-
)), /* @__PURE__ */
|
|
2878
|
+
)), /* @__PURE__ */ React13.createElement("div", { className: "form-group" }, /* @__PURE__ */ React13.createElement("label", { htmlFor: "zip" }, "ZIP"), /* @__PURE__ */ React13.createElement("input", { type: "text", className: "form-control", maxLength: 100, placeholder: "000000", value: (_d = cardData == null ? void 0 : cardData.zipCode) != null ? _d : "", onChange: (e) => handleCardChange("zipCode", e.target.value) }), (cardError == null ? void 0 : cardError.zipCode) && /* @__PURE__ */ React13.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.zipCode)), (props == null ? void 0 : props.customerId) && /* @__PURE__ */ React13.createElement("div", { className: "form-group" }, /* @__PURE__ */ React13.createElement("div", { style: { display: "flex", alignItems: "center", gap: "10px", paddingTop: "10px" } }, /* @__PURE__ */ React13.createElement(
|
|
2762
2879
|
"input",
|
|
2763
2880
|
{
|
|
2764
2881
|
type: "checkbox",
|
|
@@ -2767,10 +2884,10 @@ function GetPaymentPage(props) {
|
|
|
2767
2884
|
checked: saveCardInfo,
|
|
2768
2885
|
onChange: (e) => setSaveCardInfo(e.target.checked)
|
|
2769
2886
|
}
|
|
2770
|
-
), /* @__PURE__ */
|
|
2887
|
+
), /* @__PURE__ */ React13.createElement("label", { htmlFor: "save_card", className: "toggle-label" }), /* @__PURE__ */ React13.createElement("label", { htmlFor: "save_card" }, "Save card for future payments "), /* @__PURE__ */ React13.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, /* @__PURE__ */ React13.createElement("g", { clipPath: "url(#clip0_12420_50192)" }, /* @__PURE__ */ React13.createElement("rect", { width: "20", height: "20", fill: "white" }), /* @__PURE__ */ React13.createElement("circle", { cx: "10", cy: "10", r: "10", fill: "#E0DFE2" }), /* @__PURE__ */ React13.createElement("path", { d: "M9.03406 12.0979V12.0072C9.04055 11.4153 9.10057 10.9443 9.21411 10.5943C9.3309 10.2442 9.49635 9.96102 9.71046 9.74463C9.92457 9.52824 10.1825 9.33095 10.4842 9.15274C10.6788 9.03182 10.854 8.89658 11.0097 8.74702C11.1655 8.59745 11.2887 8.42562 11.3796 8.2315C11.4704 8.03739 11.5158 7.82259 11.5158 7.58711C11.5158 7.3039 11.4477 7.05887 11.3114 6.85203C11.1752 6.64519 10.9935 6.48608 10.7664 6.3747C10.5426 6.26014 10.2928 6.20286 10.017 6.20286C9.76723 6.20286 9.52879 6.25378 9.3017 6.35561C9.07461 6.45744 8.88646 6.61655 8.73723 6.83294C8.588 7.04614 8.50203 7.3214 8.47932 7.65871H7C7.02271 7.08592 7.17032 6.60223 7.44282 6.20764C7.71533 5.80986 8.07543 5.50915 8.52311 5.30549C8.97405 5.10183 9.47202 5 10.017 5C10.6139 5 11.1363 5.10979 11.5839 5.32936C12.0316 5.54574 12.3788 5.84964 12.6253 6.24105C12.8751 6.62928 13 7.08274 13 7.60143C13 7.95784 12.9432 8.27924 12.8297 8.56563C12.7161 8.84885 12.5539 9.10183 12.3431 9.32458C12.1354 9.54733 11.8856 9.74463 11.5937 9.91647C11.3179 10.0851 11.0941 10.2601 10.9221 10.4415C10.7534 10.6229 10.6302 10.8377 10.5523 11.0859C10.4745 11.3341 10.4323 11.6412 10.4258 12.0072V12.0979H9.03406ZM9.76886 15C9.50284 15 9.27413 14.9077 9.08273 14.7232C8.89132 14.5354 8.79562 14.3095 8.79562 14.0453C8.79562 13.7844 8.89132 13.5617 9.08273 13.3771C9.27413 13.1893 9.50284 13.0955 9.76886 13.0955C10.0316 13.0955 10.2587 13.1893 10.4501 13.3771C10.6448 13.5617 10.7421 13.7844 10.7421 14.0453C10.7421 14.2204 10.6967 14.3811 10.6058 14.5274C10.5182 14.6706 10.4015 14.7852 10.2555 14.8711C10.1095 14.957 9.94728 15 9.76886 15Z", fill: "#161616" })), /* @__PURE__ */ React13.createElement("defs", null, /* @__PURE__ */ React13.createElement("clipPath", { id: "clip0_12420_50192" }, /* @__PURE__ */ React13.createElement("rect", { width: "20", height: "20", fill: "white" }))))))), /* @__PURE__ */ React13.createElement("div", { className: "form-group", style: { marginTop: "20px", padding: "0" } }, /* @__PURE__ */ React13.createElement("button", { type: "submit", style: { margin: 0 }, className: "pay-button" }, "$", props == null ? void 0 : props.amount)))), /* @__PURE__ */ React13.createElement("div", { id: "ach", style: { display: activetab === "ach" ? "block" : "none" }, className: "tabcontent" }, /* @__PURE__ */ React13.createElement("form", { id: "ACHPaymentForm", style: { textAlign: "start" }, onSubmit: submitFunc }, /* @__PURE__ */ React13.createElement("div", { className: "ach-scrl", style: {
|
|
2771
2888
|
minHeight: (paymentData == null ? void 0 : paymentData.isSkyFiAccount) && (cardList == null ? void 0 : cardList.length) > 0 ? "378px" : (paymentData == null ? void 0 : paymentData.isSkyFiAccount) && (cardList == null ? void 0 : cardList.length) == 0 ? "436px" : (cardList == null ? void 0 : cardList.length) > 0 ? "462px" : "520px",
|
|
2772
2889
|
maxHeight: (paymentData == null ? void 0 : paymentData.isSkyFiAccount) && (cardList == null ? void 0 : cardList.length) > 0 ? "358px" : (cardList == null ? void 0 : cardList.length) > 0 ? "380px" : "380px"
|
|
2773
|
-
} }, /* @__PURE__ */
|
|
2890
|
+
} }, /* @__PURE__ */ React13.createElement("div", { className: "form-group mb-4" }, /* @__PURE__ */ React13.createElement("label", { htmlFor: "nameonaccount" }, "Name on account"), /* @__PURE__ */ React13.createElement("input", { type: "text", id: "nameonaccount", className: "form-control", maxLength: 100, placeholder: "John Doe", name: "name", value: (_e = achData == null ? void 0 : achData.name) != null ? _e : "", onChange: handleChangeAch }), (achError == null ? void 0 : achError.name) && /* @__PURE__ */ React13.createElement("span", { className: "error-span" }, achError == null ? void 0 : achError.name)), /* @__PURE__ */ React13.createElement("div", { className: "form-group mb-4" }, /* @__PURE__ */ React13.createElement("label", { htmlFor: "routingnumber" }, "Routing number"), /* @__PURE__ */ React13.createElement(
|
|
2774
2891
|
"input",
|
|
2775
2892
|
{
|
|
2776
2893
|
type: "text",
|
|
@@ -2782,7 +2899,7 @@ function GetPaymentPage(props) {
|
|
|
2782
2899
|
value: (_f = achData == null ? void 0 : achData.routingNumber) != null ? _f : "",
|
|
2783
2900
|
onChange: handleChangeAch
|
|
2784
2901
|
}
|
|
2785
|
-
), (achError == null ? void 0 : achError.routingNumber) && /* @__PURE__ */
|
|
2902
|
+
), (achError == null ? void 0 : achError.routingNumber) && /* @__PURE__ */ React13.createElement("span", { className: "error-span" }, achError == null ? void 0 : achError.routingNumber)), /* @__PURE__ */ React13.createElement("div", { className: "form-group mb-4" }, /* @__PURE__ */ React13.createElement("label", { htmlFor: "accountnumber" }, "Account number"), /* @__PURE__ */ React13.createElement(
|
|
2786
2903
|
"input",
|
|
2787
2904
|
{
|
|
2788
2905
|
type: "text",
|
|
@@ -2794,7 +2911,7 @@ function GetPaymentPage(props) {
|
|
|
2794
2911
|
value: (_g = achData == null ? void 0 : achData.accountNumber) != null ? _g : "",
|
|
2795
2912
|
onChange: handleChangeAch
|
|
2796
2913
|
}
|
|
2797
|
-
), (achError == null ? void 0 : achError.accountNumber) && /* @__PURE__ */
|
|
2914
|
+
), (achError == null ? void 0 : achError.accountNumber) && /* @__PURE__ */ React13.createElement("span", { className: "error-span" }, achError == null ? void 0 : achError.accountNumber)), /* @__PURE__ */ React13.createElement("div", { className: "form-group mb-4" }, /* @__PURE__ */ React13.createElement("label", { htmlFor: "confirmaccountnumber" }, "Confirm account number"), /* @__PURE__ */ React13.createElement(
|
|
2798
2915
|
"input",
|
|
2799
2916
|
{
|
|
2800
2917
|
type: "text",
|
|
@@ -2806,7 +2923,7 @@ function GetPaymentPage(props) {
|
|
|
2806
2923
|
value: (_h = achData == null ? void 0 : achData.confirmAccountNumber) != null ? _h : "",
|
|
2807
2924
|
onChange: handleChangeAch
|
|
2808
2925
|
}
|
|
2809
|
-
), (achError == null ? void 0 : achError.confirmAccountNumber) && /* @__PURE__ */
|
|
2926
|
+
), (achError == null ? void 0 : achError.confirmAccountNumber) && /* @__PURE__ */ React13.createElement("span", { className: "error-span" }, achError == null ? void 0 : achError.confirmAccountNumber)), /* @__PURE__ */ React13.createElement("div", { className: "form-group mb-4" }, /* @__PURE__ */ React13.createElement("label", { htmlFor: "bankname" }, "Bank name"), /* @__PURE__ */ React13.createElement(
|
|
2810
2927
|
"input",
|
|
2811
2928
|
{
|
|
2812
2929
|
type: "text",
|
|
@@ -2818,18 +2935,19 @@ function GetPaymentPage(props) {
|
|
|
2818
2935
|
value: (_i = achData == null ? void 0 : achData.bankName) != null ? _i : "",
|
|
2819
2936
|
onChange: handleChangeAch
|
|
2820
2937
|
}
|
|
2821
|
-
), (achError == null ? void 0 : achError.bankName) && /* @__PURE__ */
|
|
2938
|
+
), (achError == null ? void 0 : achError.bankName) && /* @__PURE__ */ React13.createElement("span", { className: "error-span" }, achError == null ? void 0 : achError.bankName)), /* @__PURE__ */ React13.createElement("div", { className: "form-group mb-4" }, /* @__PURE__ */ React13.createElement("label", { htmlFor: "accounttype" }, "Select account type"), /* @__PURE__ */ React13.createElement("select", { name: "accountType", id: "accounttype", className: "form-control", value: (_j = achData == null ? void 0 : achData.accountType) != null ? _j : "", onChange: handleChangeAch }, /* @__PURE__ */ React13.createElement("option", { value: "" }, "Select account"), /* @__PURE__ */ React13.createElement("option", { value: "Personal Saving" }, "Personal Saving"), /* @__PURE__ */ React13.createElement("option", { value: "Business Saving" }, "Business Saving"), /* @__PURE__ */ React13.createElement("option", { value: "Personal Checking" }, "Personal Checking"), /* @__PURE__ */ React13.createElement("option", { value: "Business Checking" }, "Business Checking"))), /* @__PURE__ */ React13.createElement("div", { className: "form-group mb-4 save-ach-div", style: { paddingTop: "5px" } }, /* @__PURE__ */ React13.createElement("input", { type: "checkbox", id: "saveACH", className: "", maxLength: 100, placeholder: "My Bank", checked: saveACHinfo, onChange: (e) => setSaveACHinfo(e.target.checked) }), /* @__PURE__ */ React13.createElement("label", { htmlFor: "saveACH" }, "Save ACH")), saveACHinfo && /* @__PURE__ */ React13.createElement("div", { className: "form-group mb-4", style: { fontSize: "12px", color: "#727272" } }, /* @__PURE__ */ React13.createElement("p", null, "If checked, I agree for ", /* @__PURE__ */ React13.createElement("b", null, "ecommerce"), " to have my permission to charge this credit card for agreed upon purchases in the future."))), /* @__PURE__ */ React13.createElement("div", { className: "form-group " }, /* @__PURE__ */ React13.createElement("button", { className: "pay-button", style: { margin: "20px 0 0" }, type: "submit" }, "$", props == null ? void 0 : props.amount)))))))))))
|
|
2822
2939
|
)));
|
|
2823
2940
|
}
|
|
2824
2941
|
|
|
2825
2942
|
// src/app/components/PreAuthCharge/PreAuthPaymentPage.tsx
|
|
2826
|
-
import
|
|
2943
|
+
import React14, { useEffect as useEffect5, useState as useState4 } from "react";
|
|
2827
2944
|
import axios4 from "axios";
|
|
2828
2945
|
import Swal2 from "sweetalert2";
|
|
2829
2946
|
import { IoArrowBack as IoArrowBack2 } from "react-icons/io5";
|
|
2830
2947
|
function PreAuthPayment(props) {
|
|
2831
2948
|
var _a, _b, _c, _d;
|
|
2832
2949
|
const [loading, setLoading] = useState4(false);
|
|
2950
|
+
const [error, setError] = useState4("");
|
|
2833
2951
|
const [success, setSuccess] = useState4(false);
|
|
2834
2952
|
const [show, setShow] = useState4(false);
|
|
2835
2953
|
const [activetab, setActive] = useState4("card");
|
|
@@ -2843,16 +2961,10 @@ function PreAuthPayment(props) {
|
|
|
2843
2961
|
let [tranId, setTranId] = useState4("");
|
|
2844
2962
|
const showLoader = () => setLoading(true);
|
|
2845
2963
|
const hideLoader = () => setLoading(false);
|
|
2846
|
-
const showError = (msz) => {
|
|
2847
|
-
Swal2.fire({
|
|
2848
|
-
icon: "error",
|
|
2849
|
-
title: "Oops...",
|
|
2850
|
-
text: msz
|
|
2851
|
-
});
|
|
2852
|
-
};
|
|
2853
2964
|
const handleClose = () => {
|
|
2854
2965
|
setShow(false);
|
|
2855
2966
|
setActive("card");
|
|
2967
|
+
setError("");
|
|
2856
2968
|
setSuccess(false);
|
|
2857
2969
|
setTranId("");
|
|
2858
2970
|
setCardData({
|
|
@@ -2980,7 +3092,7 @@ function PreAuthPayment(props) {
|
|
|
2980
3092
|
let tokenCallback = async function(response) {
|
|
2981
3093
|
var _a3, _b3, _c3, _d3;
|
|
2982
3094
|
if (response.Error) {
|
|
2983
|
-
|
|
3095
|
+
setError(response.Error);
|
|
2984
3096
|
hideLoader();
|
|
2985
3097
|
} else {
|
|
2986
3098
|
let name = cardData == null ? void 0 : cardData.cardName;
|
|
@@ -3013,7 +3125,7 @@ function PreAuthPayment(props) {
|
|
|
3013
3125
|
} catch (err) {
|
|
3014
3126
|
console.log(err);
|
|
3015
3127
|
hideLoader();
|
|
3016
|
-
|
|
3128
|
+
setError(((_d3 = (_c3 = err == null ? void 0 : err.response) == null ? void 0 : _c3.data) == null ? void 0 : _d3.message) || (err == null ? void 0 : err.message) || "Something went wrong..");
|
|
3017
3129
|
}
|
|
3018
3130
|
}
|
|
3019
3131
|
};
|
|
@@ -3088,30 +3200,30 @@ function PreAuthPayment(props) {
|
|
|
3088
3200
|
}
|
|
3089
3201
|
} catch (err) {
|
|
3090
3202
|
hideLoader();
|
|
3091
|
-
|
|
3203
|
+
setError(((_r = (_q = err == null ? void 0 : err.response) == null ? void 0 : _q.data) == null ? void 0 : _r.message) || (err == null ? void 0 : err.message) || "Something went wrong , Try again later");
|
|
3092
3204
|
}
|
|
3093
3205
|
} catch (err) {
|
|
3094
3206
|
console.log(err);
|
|
3095
3207
|
hideLoader();
|
|
3096
|
-
|
|
3208
|
+
setError(((_t = (_s = err == null ? void 0 : err.response) == null ? void 0 : _s.data) == null ? void 0 : _t.message) || (err == null ? void 0 : err.message) || "Something went wrong , Try again later");
|
|
3097
3209
|
}
|
|
3098
3210
|
} catch (err) {
|
|
3099
3211
|
hideLoader();
|
|
3100
|
-
|
|
3212
|
+
setError(((_v = (_u = err == null ? void 0 : err.response) == null ? void 0 : _u.data) == null ? void 0 : _v.message) || (err == null ? void 0 : err.message) || "Something went wrong , Try again later");
|
|
3101
3213
|
}
|
|
3102
3214
|
} else {
|
|
3103
3215
|
DatacapWebToken.requestToken(paymentData == null ? void 0 : paymentData.dctoken, "PaymentForm", tokenCallback);
|
|
3104
3216
|
}
|
|
3105
3217
|
} catch (err) {
|
|
3106
3218
|
hideLoader();
|
|
3107
|
-
|
|
3219
|
+
setError(((_x = (_w = err == null ? void 0 : err.response) == null ? void 0 : _w.data) == null ? void 0 : _x.message) || (err == null ? void 0 : err.message) || "Something went wrong.");
|
|
3108
3220
|
}
|
|
3109
3221
|
}
|
|
3110
3222
|
}
|
|
3111
3223
|
}
|
|
3112
3224
|
};
|
|
3113
3225
|
const getPaymentDetails = async () => {
|
|
3114
|
-
var _a2, _b2, _c2, _d2, _e, _f, _g, _h, _i, _j, _k, _l, _m;
|
|
3226
|
+
var _a2, _b2, _c2, _d2, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o;
|
|
3115
3227
|
showLoader();
|
|
3116
3228
|
try {
|
|
3117
3229
|
const data = {
|
|
@@ -3123,7 +3235,7 @@ function PreAuthPayment(props) {
|
|
|
3123
3235
|
setPaymentData((_a2 = paymentData2 == null ? void 0 : paymentData2.data) == null ? void 0 : _a2.data);
|
|
3124
3236
|
if (!((_c2 = (_b2 = paymentData2 == null ? void 0 : paymentData2.data) == null ? void 0 : _b2.data) == null ? void 0 : _c2.paymentGateway)) {
|
|
3125
3237
|
handleClose();
|
|
3126
|
-
|
|
3238
|
+
setError("Something went wrong.");
|
|
3127
3239
|
}
|
|
3128
3240
|
if (((_e = (_d2 = paymentData2 == null ? void 0 : paymentData2.data) == null ? void 0 : _d2.data) == null ? void 0 : _e.card_list) && ((_h = (_g = (_f = paymentData2 == null ? void 0 : paymentData2.data) == null ? void 0 : _f.data) == null ? void 0 : _g.card_list) == null ? void 0 : _h.length) > 0) {
|
|
3129
3241
|
setCardList((_j = (_i = paymentData2 == null ? void 0 : paymentData2.data) == null ? void 0 : _i.data) == null ? void 0 : _j.card_list);
|
|
@@ -3138,10 +3250,8 @@ function PreAuthPayment(props) {
|
|
|
3138
3250
|
hideLoader();
|
|
3139
3251
|
} catch (err) {
|
|
3140
3252
|
console.log(err);
|
|
3141
|
-
setActive("card");
|
|
3142
3253
|
hideLoader();
|
|
3143
|
-
|
|
3144
|
-
showError("Something went wrong , Try again later");
|
|
3254
|
+
setError(((_o = (_n = err == null ? void 0 : err.response) == null ? void 0 : _n.data) == null ? void 0 : _o.message) || (err == null ? void 0 : err.message) || "Something went wrong");
|
|
3145
3255
|
}
|
|
3146
3256
|
};
|
|
3147
3257
|
const handlechargeCustomer = async () => {
|
|
@@ -3186,16 +3296,16 @@ function PreAuthPayment(props) {
|
|
|
3186
3296
|
} catch (err) {
|
|
3187
3297
|
hideLoader();
|
|
3188
3298
|
console.log(err);
|
|
3189
|
-
|
|
3299
|
+
setError(((_f = (_e = err == null ? void 0 : err.response) == null ? void 0 : _e.data) == null ? void 0 : _f.message) || ((_h = (_g = err == null ? void 0 : err.response) == null ? void 0 : _g.data) == null ? void 0 : _h.status) || "Something went erong");
|
|
3190
3300
|
}
|
|
3191
3301
|
} else {
|
|
3192
|
-
|
|
3302
|
+
setError("Please Select A Card/ACH");
|
|
3193
3303
|
}
|
|
3194
3304
|
} else {
|
|
3195
|
-
|
|
3305
|
+
setError("Please Select Customer");
|
|
3196
3306
|
}
|
|
3197
3307
|
} else {
|
|
3198
|
-
|
|
3308
|
+
setError("Something went wrong.");
|
|
3199
3309
|
}
|
|
3200
3310
|
};
|
|
3201
3311
|
useEffect5(() => {
|
|
@@ -3254,21 +3364,22 @@ function PreAuthPayment(props) {
|
|
|
3254
3364
|
}
|
|
3255
3365
|
});
|
|
3256
3366
|
};
|
|
3257
|
-
return /* @__PURE__ */
|
|
3367
|
+
return /* @__PURE__ */ React14.createElement(React14.Fragment, null, /* @__PURE__ */ React14.createElement(DataScript, null), /* @__PURE__ */ React14.createElement(Chargewidgetstyles, null), /* @__PURE__ */ React14.createElement(React14.Fragment, null, /* @__PURE__ */ React14.createElement(
|
|
3258
3368
|
"button",
|
|
3259
3369
|
{
|
|
3260
3370
|
className: "paymentBtn",
|
|
3261
3371
|
onClick: handleShow
|
|
3262
3372
|
},
|
|
3263
3373
|
"Pre Auth Pay"
|
|
3264
|
-
), /* @__PURE__ */
|
|
3374
|
+
), /* @__PURE__ */ React14.createElement(
|
|
3265
3375
|
CustomModal2_default,
|
|
3266
3376
|
{
|
|
3267
3377
|
open: show,
|
|
3268
3378
|
onClose: handleClose
|
|
3269
3379
|
},
|
|
3270
|
-
/* @__PURE__ */
|
|
3271
|
-
success
|
|
3380
|
+
error && /* @__PURE__ */ React14.createElement("div", { style: { maxHeight: "606px", minHeight: "60vh", padding: "40px" } }, /* @__PURE__ */ React14.createElement(ErrorCardMessage_default, { error, onClose: handleClose })),
|
|
3381
|
+
success && /* @__PURE__ */ React14.createElement(SuccessMsz, { onClose: handleClose, tranId }),
|
|
3382
|
+
!error && !success && /* @__PURE__ */ React14.createElement(React14.Fragment, null, loading && /* @__PURE__ */ React14.createElement(Loader_default, { loading }), /* @__PURE__ */ React14.createElement("div", null, /* @__PURE__ */ React14.createElement("div", { className: "frac-card-payment-page frac-form" }, /* @__PURE__ */ React14.createElement("div", { className: "parent-pay-container" }, /* @__PURE__ */ React14.createElement("span", { className: "request-payment-close-popup", onClick: handleClose }, /* @__PURE__ */ React14.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, /* @__PURE__ */ React14.createElement("g", { clipPath: "url(#clip0_12425_52336)" }, /* @__PURE__ */ React14.createElement("path", { d: "M9.46585 8.01168L15.6959 1.7814C16.1014 1.37615 16.1014 0.720912 15.6959 0.315659C15.2907 -0.0895946 14.6354 -0.0895946 14.2302 0.315659L7.99991 6.54593L1.76983 0.315659C1.36438 -0.0895946 0.709336 -0.0895946 0.304082 0.315659C-0.101361 0.720912 -0.101361 1.37615 0.304082 1.7814L6.53416 8.01168L0.304082 14.2419C-0.101361 14.6472 -0.101361 15.3024 0.304082 15.7077C0.506045 15.9098 0.771595 16.0114 1.03695 16.0114C1.30232 16.0114 1.56768 15.9098 1.76983 15.7077L7.99991 9.47742L14.2302 15.7077C14.4323 15.9098 14.6977 16.0114 14.9631 16.0114C15.2284 16.0114 15.4938 15.9098 15.6959 15.7077C16.1014 15.3024 16.1014 14.6472 15.6959 14.2419L9.46585 8.01168Z", fill: "#727272" })), /* @__PURE__ */ React14.createElement("defs", null, /* @__PURE__ */ React14.createElement("clipPath", { id: "clip0_12425_52336" }, /* @__PURE__ */ React14.createElement("rect", { width: "16", height: "16", fill: "white" }))))), /* @__PURE__ */ React14.createElement("div", { className: "pay-container" }, /* @__PURE__ */ React14.createElement("div", { className: "pay-header pay-conatiner-one" }, /* @__PURE__ */ React14.createElement("div", { className: "pay-conatiner-one-first" }, /* @__PURE__ */ React14.createElement("div", { className: "pay-logo-container" }, /* @__PURE__ */ React14.createElement("div", { className: "pay-main-logo" }, /* @__PURE__ */ React14.createElement("img", { src: "https://fractal-userdata-upload.s3.us-east-1.amazonaws.com/uploaded/merchant_logo/20250311131124_merchant_logo.png", id: "pay-logos" })), /* @__PURE__ */ React14.createElement("h1", { className: "pay-heading" }, "Pay"), (cardList == null ? void 0 : cardList.length) > 0 && activetab !== "cardList" && /* @__PURE__ */ React14.createElement("button", { className: "res-charge-payment-back-btn ", onClick: () => setActive("cardList") }, " ", /* @__PURE__ */ React14.createElement(IoArrowBack2, null), " Back")), /* @__PURE__ */ React14.createElement("div", { className: "amt-pay-con" }, /* @__PURE__ */ React14.createElement("div", { className: "pay-amount-conatiner" }, /* @__PURE__ */ React14.createElement("small", { className: "pay-payment-amount" }, "Payment Amount"), /* @__PURE__ */ React14.createElement("strong", { className: "pay-amount" }, "$", props == null ? void 0 : props.amount)), activetab != "ach" && /* @__PURE__ */ React14.createElement("div", { style: { display: "flex", gap: "8px", margin: "8px 0" } }, /* @__PURE__ */ React14.createElement("img", { src: "https://dev-widget.fractalpay.com/images/visa-img.svg", alt: "", width: 33 }), /* @__PURE__ */ React14.createElement("img", { src: "https://dev-widget.fractalpay.com/images/mc-img.svg", width: 33, alt: "" }), /* @__PURE__ */ React14.createElement("img", { src: "https://dev-widget.fractalpay.com/images/ae-img.svg", alt: "", width: 33 }), /* @__PURE__ */ React14.createElement("img", { src: "https://dev-widget.fractalpay.com/images/discover-img.svg", width: 33, alt: "" })))), /* @__PURE__ */ React14.createElement("div", { className: "pay-conatiner-one-last" }, /* @__PURE__ */ React14.createElement("img", { src: "https://dev-widget.fractalpay.com/images/secure-img.png", alt: "" }), /* @__PURE__ */ React14.createElement("img", { src: "https://dev-widget.fractalpay.com/images/pov-by.png", alt: "" }), "Secure payments powered by Fractal"), /* @__PURE__ */ React14.createElement("div", null)), !loading && /* @__PURE__ */ React14.createElement("div", { className: "pay-tab pay-conatiner-two" }, /* @__PURE__ */ React14.createElement("div", { className: "col-md-12" }, /* @__PURE__ */ React14.createElement("div", { id: "payment-form-div" }, activetab !== "cardList" ? /* @__PURE__ */ React14.createElement("div", null, (cardList == null ? void 0 : cardList.length) > 0 && /* @__PURE__ */ React14.createElement("button", { className: "charge-payment-back-btn ", onClick: () => setActive("cardList") }, " ", /* @__PURE__ */ React14.createElement(IoArrowBack2, null), " Back"), /* @__PURE__ */ React14.createElement("div", { className: "" }, /* @__PURE__ */ React14.createElement("div", { className: "res-pay-con" }, /* @__PURE__ */ React14.createElement("div", { className: "pay-amount-conatiner", style: { margin: 0 } }, /* @__PURE__ */ React14.createElement("small", { className: "pay-payment-amount" }, "Payment Amount"), /* @__PURE__ */ React14.createElement("strong", { className: "pay-amount" }, "$", props == null ? void 0 : props.amount)), /* @__PURE__ */ React14.createElement("div", null, /* @__PURE__ */ React14.createElement("div", null, /* @__PURE__ */ React14.createElement("img", { src: "https://dev-widget.fractalpay.com/images/visa-img.svg", alt: "", width: 35, style: { paddingRight: "5px" } }), /* @__PURE__ */ React14.createElement("img", { src: "https://dev-widget.fractalpay.com/images/mc-img.svg", width: 35, alt: "" })), /* @__PURE__ */ React14.createElement("div", null, /* @__PURE__ */ React14.createElement("img", { src: "https://dev-widget.fractalpay.com/images/ae-img.svg", alt: "", width: 35, style: { paddingRight: "5px" } }), /* @__PURE__ */ React14.createElement("img", { src: "https://dev-widget.fractalpay.com/images/discover-img.svg", width: 35, alt: "" })))))) : /* @__PURE__ */ React14.createElement("div", null, /* @__PURE__ */ React14.createElement("h6", { className: "charge-customer-name", style: { marginBottom: "16px !important" } }, " Charge ", paymentData == null ? void 0 : paymentData.customer_name), /* @__PURE__ */ React14.createElement("div", { className: "res-pay-con" }, /* @__PURE__ */ React14.createElement("div", { className: "pay-amount-conatiner", style: { margin: 0 } }, /* @__PURE__ */ React14.createElement("small", { className: "pay-payment-amount" }, "Payment Amount"), /* @__PURE__ */ React14.createElement("strong", { className: "pay-amount" }, "$", props == null ? void 0 : props.amount)), /* @__PURE__ */ React14.createElement("div", null, /* @__PURE__ */ React14.createElement("div", null, /* @__PURE__ */ React14.createElement("img", { src: "https://dev-widget.fractalpay.com/images/visa-img.svg", alt: "", width: 35, style: { paddingRight: "5px" } }), /* @__PURE__ */ React14.createElement("img", { src: "https://dev-widget.fractalpay.com/images/mc-img.svg", width: 35, alt: "" })), /* @__PURE__ */ React14.createElement("div", null, /* @__PURE__ */ React14.createElement("img", { src: "https://dev-widget.fractalpay.com/images/ae-img.svg", alt: "", width: 35, style: { paddingRight: "5px" } }), /* @__PURE__ */ React14.createElement("img", { src: "https://dev-widget.fractalpay.com/images/discover-img.svg", width: 35, alt: "" })))), /* @__PURE__ */ React14.createElement("h6", { className: "card-ach-heading", style: { marginBottom: "10px !important" } }, " Cards")), /* @__PURE__ */ React14.createElement("div", { style: { display: activetab === "cardList" ? "block" : "none" }, className: "tabcontent" }, /* @__PURE__ */ React14.createElement("div", { className: "card-lint-div-in" }, /* @__PURE__ */ React14.createElement("div", { className: "card-list-div" }, (paymentData == null ? void 0 : paymentData.card_list) && ((_a = paymentData == null ? void 0 : paymentData.card_list) == null ? void 0 : _a.length) > 0 && ((_b = paymentData == null ? void 0 : paymentData.card_list) == null ? void 0 : _b.map((card, index) => /* @__PURE__ */ React14.createElement("div", { className: "card-list-single-div", key: index }, /* @__PURE__ */ React14.createElement("div", { className: "card-number-radio" }, /* @__PURE__ */ React14.createElement(
|
|
3272
3383
|
"input",
|
|
3273
3384
|
{
|
|
3274
3385
|
type: "radio",
|
|
@@ -3278,7 +3389,7 @@ function PreAuthPayment(props) {
|
|
|
3278
3389
|
checked: selectedCard === card,
|
|
3279
3390
|
onChange: (e) => setSelectedCard(card)
|
|
3280
3391
|
}
|
|
3281
|
-
), /* @__PURE__ */
|
|
3392
|
+
), /* @__PURE__ */ React14.createElement("label", { htmlFor: "", className: "card-number-last-four" }, "**** ", card == null ? void 0 : card.cardlastfourdigit), /* @__PURE__ */ React14.createElement("h6", { className: "card-expiry-date" }, card == null ? void 0 : card.expmonth, "/", card == null ? void 0 : card.expyear)), /* @__PURE__ */ React14.createElement("div", { className: "card-number-radio" }, /* @__PURE__ */ React14.createElement("span", { className: "visa-card" }, /* @__PURE__ */ React14.createElement("img", { src: (card == null ? void 0 : card.card_type) != "Bank" ? "https://dev-widget.fractalpay.com/images/visa-img.svg" : "https://dev-widget.fractalpay.com/images/bank.svg", alt: "" })), /* @__PURE__ */ React14.createElement("span", { className: "visa-card", style: { cursor: "pointer" }, onClick: () => handleDeleteCard(card == null ? void 0 : card.id) }, /* @__PURE__ */ React14.createElement("img", { src: "https://dev-widget.fractalpay.com/images/Trash.svg", alt: "" }))))))), /* @__PURE__ */ React14.createElement("div", { className: "pay-with-other-card ", onClick: () => setActive("card") }, "Authorize With Other Card", /* @__PURE__ */ React14.createElement("img", { src: "https://dev-widget.fractalpay.com/images/card.svg", alt: "" }))), /* @__PURE__ */ React14.createElement("div", { className: "form-group" }, /* @__PURE__ */ React14.createElement("button", { className: "pay-button", style: { margin: "0px" }, type: "submit", onClick: handlechargeCustomer }, "$", props == null ? void 0 : props.amount))), /* @__PURE__ */ React14.createElement("div", { id: "card", style: { display: activetab === "card" ? "block" : "none" }, className: "tabcontent" }, /* @__PURE__ */ React14.createElement("form", { id: "PaymentForm", onSubmit: submitFunc }, /* @__PURE__ */ React14.createElement("div", { className: "ach-scrl", style: { minHeight: (cardList == null ? void 0 : cardList.length) > 0 ? "462px" : "520px", overflow: "auto", marginRight: "5px" } }, /* @__PURE__ */ React14.createElement("div", { className: "form-group" }, /* @__PURE__ */ React14.createElement("label", { htmlFor: "cardHolderName" }, "Name on Card"), /* @__PURE__ */ React14.createElement(
|
|
3282
3393
|
"input",
|
|
3283
3394
|
{
|
|
3284
3395
|
type: "text",
|
|
@@ -3292,7 +3403,7 @@ function PreAuthPayment(props) {
|
|
|
3292
3403
|
}
|
|
3293
3404
|
}
|
|
3294
3405
|
}
|
|
3295
|
-
), (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */
|
|
3406
|
+
), (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */ React14.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.cardName)), /* @__PURE__ */ React14.createElement("div", { className: "form-group" }, /* @__PURE__ */ React14.createElement("label", { htmlFor: "cardNumber" }, "Card Number"), /* @__PURE__ */ React14.createElement("div", { className: "toggle-num-wrapper" }, /* @__PURE__ */ React14.createElement(
|
|
3296
3407
|
"input",
|
|
3297
3408
|
{
|
|
3298
3409
|
className: "form-control card-number-new",
|
|
@@ -3304,7 +3415,7 @@ function PreAuthPayment(props) {
|
|
|
3304
3415
|
onChange: (e) => handleCardNumberChange(e),
|
|
3305
3416
|
"data-token": "card_number"
|
|
3306
3417
|
}
|
|
3307
|
-
), /* @__PURE__ */
|
|
3418
|
+
), /* @__PURE__ */ React14.createElement("div", { className: "card-crdi card-expiry-new" }, /* @__PURE__ */ React14.createElement("div", { className: "exp-date-year-container" }, /* @__PURE__ */ React14.createElement("div", { className: "exp-date form-group" }, /* @__PURE__ */ React14.createElement(
|
|
3308
3419
|
"input",
|
|
3309
3420
|
{
|
|
3310
3421
|
"data-token": "exp_month",
|
|
@@ -3316,7 +3427,7 @@ function PreAuthPayment(props) {
|
|
|
3316
3427
|
value: (cardData == null ? void 0 : cardData.expiryMonth) || "",
|
|
3317
3428
|
onChange: (e) => handleCardChange("expiryMonth", e.target.value)
|
|
3318
3429
|
}
|
|
3319
|
-
)), /* @__PURE__ */
|
|
3430
|
+
)), /* @__PURE__ */ React14.createElement("div", { className: "exp-year form-group" }, /* @__PURE__ */ React14.createElement(
|
|
3320
3431
|
"input",
|
|
3321
3432
|
{
|
|
3322
3433
|
"data-token": "exp_year",
|
|
@@ -3328,7 +3439,7 @@ function PreAuthPayment(props) {
|
|
|
3328
3439
|
value: (cardData == null ? void 0 : cardData.expiryYear) || "",
|
|
3329
3440
|
onChange: (e) => handleCardChange("expiryYear", e.target.value)
|
|
3330
3441
|
}
|
|
3331
|
-
)), /* @__PURE__ */
|
|
3442
|
+
)), /* @__PURE__ */ React14.createElement("div", { className: "security-digit form-group" }, /* @__PURE__ */ React14.createElement(
|
|
3332
3443
|
"input",
|
|
3333
3444
|
{
|
|
3334
3445
|
"data-token": "cvv",
|
|
@@ -3340,7 +3451,7 @@ function PreAuthPayment(props) {
|
|
|
3340
3451
|
value: (cardData == null ? void 0 : cardData.cvv) || "",
|
|
3341
3452
|
onChange: (e) => handleCardChange("cvv", e.target.value)
|
|
3342
3453
|
}
|
|
3343
|
-
)))), (cardError == null ? void 0 : cardError.cardNumber) && /* @__PURE__ */
|
|
3454
|
+
)))), (cardError == null ? void 0 : cardError.cardNumber) && /* @__PURE__ */ React14.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.cardNumber), /* @__PURE__ */ React14.createElement("p", { style: { margin: "0" } }, (cardError == null ? void 0 : cardError.expiryMonth) || (cardError == null ? void 0 : cardError.expiryYear) ? /* @__PURE__ */ React14.createElement("span", { className: "error-span", style: { paddingRight: "4px" } }, cardError == null ? void 0 : cardError.expiryMonth) : "", (cardError == null ? void 0 : cardError.cvv) && /* @__PURE__ */ React14.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.cvv)))), /* @__PURE__ */ React14.createElement("div", { className: "form-group" }, /* @__PURE__ */ React14.createElement("label", { htmlFor: "OrderId" }, "Order ID / Description"), /* @__PURE__ */ React14.createElement(
|
|
3344
3455
|
"input",
|
|
3345
3456
|
{
|
|
3346
3457
|
type: "text",
|
|
@@ -3352,7 +3463,7 @@ function PreAuthPayment(props) {
|
|
|
3352
3463
|
onChange: (e) => handleCardChange("orderId", e.target.value),
|
|
3353
3464
|
style: { background: "#F6F6F7", color: "#727272" }
|
|
3354
3465
|
}
|
|
3355
|
-
)), /* @__PURE__ */
|
|
3466
|
+
)), /* @__PURE__ */ React14.createElement("div", { className: "form-group" }, /* @__PURE__ */ React14.createElement("label", { htmlFor: "zip" }, "ZIP"), /* @__PURE__ */ React14.createElement("input", { type: "text", className: "form-control", maxLength: 100, placeholder: "000000", value: (_d = cardData == null ? void 0 : cardData.zipCode) != null ? _d : "", onChange: (e) => handleCardChange("zipCode", e.target.value) }), (cardError == null ? void 0 : cardError.zipCode) && /* @__PURE__ */ React14.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.zipCode)), (props == null ? void 0 : props.customerId) && /* @__PURE__ */ React14.createElement("div", { className: "form-group" }, /* @__PURE__ */ React14.createElement("div", { style: { display: "flex", alignItems: "center", gap: "10px", paddingTop: "10px" } }, /* @__PURE__ */ React14.createElement(
|
|
3356
3467
|
"input",
|
|
3357
3468
|
{
|
|
3358
3469
|
type: "checkbox",
|
|
@@ -3361,23 +3472,23 @@ function PreAuthPayment(props) {
|
|
|
3361
3472
|
checked: saveCardInfo,
|
|
3362
3473
|
onChange: (e) => setSaveCardInfo(e.target.checked)
|
|
3363
3474
|
}
|
|
3364
|
-
), /* @__PURE__ */
|
|
3475
|
+
), /* @__PURE__ */ React14.createElement("label", { htmlFor: "save_card", className: "toggle-label" }), /* @__PURE__ */ React14.createElement("label", { htmlFor: "save_card" }, "Save card for future payments "), /* @__PURE__ */ React14.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, /* @__PURE__ */ React14.createElement("g", { clipPath: "url(#clip0_12420_50192)" }, /* @__PURE__ */ React14.createElement("rect", { width: "20", height: "20", fill: "white" }), /* @__PURE__ */ React14.createElement("circle", { cx: "10", cy: "10", r: "10", fill: "#E0DFE2" }), /* @__PURE__ */ React14.createElement("path", { d: "M9.03406 12.0979V12.0072C9.04055 11.4153 9.10057 10.9443 9.21411 10.5943C9.3309 10.2442 9.49635 9.96102 9.71046 9.74463C9.92457 9.52824 10.1825 9.33095 10.4842 9.15274C10.6788 9.03182 10.854 8.89658 11.0097 8.74702C11.1655 8.59745 11.2887 8.42562 11.3796 8.2315C11.4704 8.03739 11.5158 7.82259 11.5158 7.58711C11.5158 7.3039 11.4477 7.05887 11.3114 6.85203C11.1752 6.64519 10.9935 6.48608 10.7664 6.3747C10.5426 6.26014 10.2928 6.20286 10.017 6.20286C9.76723 6.20286 9.52879 6.25378 9.3017 6.35561C9.07461 6.45744 8.88646 6.61655 8.73723 6.83294C8.588 7.04614 8.50203 7.3214 8.47932 7.65871H7C7.02271 7.08592 7.17032 6.60223 7.44282 6.20764C7.71533 5.80986 8.07543 5.50915 8.52311 5.30549C8.97405 5.10183 9.47202 5 10.017 5C10.6139 5 11.1363 5.10979 11.5839 5.32936C12.0316 5.54574 12.3788 5.84964 12.6253 6.24105C12.8751 6.62928 13 7.08274 13 7.60143C13 7.95784 12.9432 8.27924 12.8297 8.56563C12.7161 8.84885 12.5539 9.10183 12.3431 9.32458C12.1354 9.54733 11.8856 9.74463 11.5937 9.91647C11.3179 10.0851 11.0941 10.2601 10.9221 10.4415C10.7534 10.6229 10.6302 10.8377 10.5523 11.0859C10.4745 11.3341 10.4323 11.6412 10.4258 12.0072V12.0979H9.03406ZM9.76886 15C9.50284 15 9.27413 14.9077 9.08273 14.7232C8.89132 14.5354 8.79562 14.3095 8.79562 14.0453C8.79562 13.7844 8.89132 13.5617 9.08273 13.3771C9.27413 13.1893 9.50284 13.0955 9.76886 13.0955C10.0316 13.0955 10.2587 13.1893 10.4501 13.3771C10.6448 13.5617 10.7421 13.7844 10.7421 14.0453C10.7421 14.2204 10.6967 14.3811 10.6058 14.5274C10.5182 14.6706 10.4015 14.7852 10.2555 14.8711C10.1095 14.957 9.94728 15 9.76886 15Z", fill: "#161616" })), /* @__PURE__ */ React14.createElement("defs", null, /* @__PURE__ */ React14.createElement("clipPath", { id: "clip0_12420_50192" }, /* @__PURE__ */ React14.createElement("rect", { width: "20", height: "20", fill: "white" }))))))), /* @__PURE__ */ React14.createElement("div", { className: "form-group", style: { marginTop: "20px", padding: 0 } }, /* @__PURE__ */ React14.createElement("button", { type: "submit", style: { margin: 0 }, className: "pay-button" }, "$", props == null ? void 0 : props.amount))))))))))))
|
|
3365
3476
|
)));
|
|
3366
3477
|
}
|
|
3367
3478
|
|
|
3368
3479
|
// src/app/components/AddCard/AddCard.tsx
|
|
3369
|
-
import
|
|
3480
|
+
import React19, { useEffect as useEffect6, useState as useState5 } from "react";
|
|
3370
3481
|
import Swal3 from "sweetalert2";
|
|
3371
3482
|
import axios5 from "axios";
|
|
3372
3483
|
|
|
3373
3484
|
// src/app/components/AddCard/AddCardStyles.tsx
|
|
3374
|
-
import
|
|
3485
|
+
import React15 from "react";
|
|
3375
3486
|
function AddCardStyle() {
|
|
3376
3487
|
const primarycolor = "#000";
|
|
3377
3488
|
const primarybgcolor = "#fff";
|
|
3378
3489
|
const primarybodycolor = "#212529";
|
|
3379
3490
|
const primarybordercolor = "#dee2e6";
|
|
3380
|
-
return /* @__PURE__ */
|
|
3491
|
+
return /* @__PURE__ */ React15.createElement("style", null, `
|
|
3381
3492
|
.add-card {
|
|
3382
3493
|
max-width:380px;
|
|
3383
3494
|
padding: 0 20px
|
|
@@ -3640,14 +3751,14 @@ function AddCardStyle() {
|
|
|
3640
3751
|
}
|
|
3641
3752
|
|
|
3642
3753
|
// src/app/components/CustomModal/CustomModal.tsx
|
|
3643
|
-
import
|
|
3754
|
+
import React16 from "react";
|
|
3644
3755
|
var CustomModal = ({
|
|
3645
3756
|
open,
|
|
3646
3757
|
onClose,
|
|
3647
3758
|
children
|
|
3648
3759
|
}) => {
|
|
3649
3760
|
if (!open) return null;
|
|
3650
|
-
return /* @__PURE__ */
|
|
3761
|
+
return /* @__PURE__ */ React16.createElement("div", { style: {
|
|
3651
3762
|
position: "fixed",
|
|
3652
3763
|
top: 0,
|
|
3653
3764
|
left: 0,
|
|
@@ -3658,17 +3769,17 @@ var CustomModal = ({
|
|
|
3658
3769
|
display: "flex",
|
|
3659
3770
|
justifyContent: "center",
|
|
3660
3771
|
alignItems: "center"
|
|
3661
|
-
} }, /* @__PURE__ */
|
|
3772
|
+
} }, /* @__PURE__ */ React16.createElement("div", { style: { background: "white", padding: "20px", borderRadius: "8px", minWidth: "300px" } }, /* @__PURE__ */ React16.createElement("div", { className: "", style: { display: "flex", justifyContent: "end" } }, /* @__PURE__ */ React16.createElement("button", { onClick: onClose, style: { border: "none", background: "transparent", color: "black" } }, "X")), /* @__PURE__ */ React16.createElement("div", null, children)));
|
|
3662
3773
|
};
|
|
3663
3774
|
var CustomModal_default = CustomModal;
|
|
3664
3775
|
|
|
3665
3776
|
// src/app/components/SuccessCardMessage/SuccessCardMsz.tsx
|
|
3666
|
-
import
|
|
3777
|
+
import React18 from "react";
|
|
3667
3778
|
|
|
3668
3779
|
// src/app/components/SuccessCardMessage/SuccessCardMszStyle.tsx
|
|
3669
|
-
import
|
|
3780
|
+
import React17 from "react";
|
|
3670
3781
|
function SuccessCardMszStyle() {
|
|
3671
|
-
return /* @__PURE__ */
|
|
3782
|
+
return /* @__PURE__ */ React17.createElement("style", null, `
|
|
3672
3783
|
.card-success .logo-container {
|
|
3673
3784
|
display: flex;
|
|
3674
3785
|
justify-content: center;
|
|
@@ -3761,7 +3872,7 @@ function SuccessCardMszStyle() {
|
|
|
3761
3872
|
|
|
3762
3873
|
// src/app/components/SuccessCardMessage/SuccessCardMsz.tsx
|
|
3763
3874
|
var SuccessCardMsz = ({ onClose }) => {
|
|
3764
|
-
return /* @__PURE__ */
|
|
3875
|
+
return /* @__PURE__ */ React18.createElement(React18.Fragment, null, /* @__PURE__ */ React18.createElement(SuccessCardMszStyle, null), /* @__PURE__ */ React18.createElement("div", { className: "card-success" }, /* @__PURE__ */ React18.createElement("div", { className: "payment-success-container" }, /* @__PURE__ */ React18.createElement("div", { className: "success-icon" }, /* @__PURE__ */ React18.createElement("div", { className: "circle" }, /* @__PURE__ */ React18.createElement("i", { className: "fa fa-check-circle", "aria-hidden": "true" })), /* @__PURE__ */ React18.createElement("div", { className: "success-text" }, /* @__PURE__ */ React18.createElement("div", { className: "payment-success-text" }, "Your card was added successfully."), /* @__PURE__ */ React18.createElement("div", { className: "thank-you-text" }, "Thank you "))))));
|
|
3765
3876
|
};
|
|
3766
3877
|
var SuccessCardMsz_default = SuccessCardMsz;
|
|
3767
3878
|
|
|
@@ -4048,27 +4159,27 @@ function AddCard(props) {
|
|
|
4048
4159
|
}
|
|
4049
4160
|
}
|
|
4050
4161
|
};
|
|
4051
|
-
return /* @__PURE__ */
|
|
4162
|
+
return /* @__PURE__ */ React19.createElement(React19.Fragment, null, /* @__PURE__ */ React19.createElement(DataScript, null), /* @__PURE__ */ React19.createElement(AddCardStyle, null), /* @__PURE__ */ React19.createElement(
|
|
4052
4163
|
"button",
|
|
4053
4164
|
{
|
|
4054
4165
|
className: "paymentBtn",
|
|
4055
4166
|
onClick: handleShow
|
|
4056
4167
|
},
|
|
4057
4168
|
"Add Card"
|
|
4058
|
-
), /* @__PURE__ */
|
|
4169
|
+
), /* @__PURE__ */ React19.createElement(
|
|
4059
4170
|
CustomModal_default,
|
|
4060
4171
|
{
|
|
4061
4172
|
open: show,
|
|
4062
4173
|
onClose: handleClose
|
|
4063
4174
|
},
|
|
4064
|
-
/* @__PURE__ */
|
|
4065
|
-
success ? /* @__PURE__ */
|
|
4175
|
+
/* @__PURE__ */ React19.createElement(Loader_default, { loading }),
|
|
4176
|
+
success ? /* @__PURE__ */ React19.createElement(SuccessCardMsz_default, { onClose: handleClose }) : /* @__PURE__ */ React19.createElement(
|
|
4066
4177
|
"div",
|
|
4067
4178
|
{
|
|
4068
4179
|
className: "container-creditcard add-card modal-content frac-form",
|
|
4069
4180
|
id: "add-credit-card-panel"
|
|
4070
4181
|
},
|
|
4071
|
-
/* @__PURE__ */
|
|
4182
|
+
/* @__PURE__ */ React19.createElement("form", { id: "creditCardForm", onSubmit: addCardFunc }, /* @__PURE__ */ React19.createElement("div", { className: "form-group", style: { marginTop: "0", marginBottom: "10px" } }, /* @__PURE__ */ React19.createElement("label", { htmlFor: "cardNumber" }, "Card Number"), /* @__PURE__ */ React19.createElement(
|
|
4072
4183
|
"input",
|
|
4073
4184
|
{
|
|
4074
4185
|
type: "text",
|
|
@@ -4079,7 +4190,7 @@ function AddCard(props) {
|
|
|
4079
4190
|
value: (cardData == null ? void 0 : cardData.cardNumber) || "",
|
|
4080
4191
|
onChange: (e) => handleCardNumberChange(e)
|
|
4081
4192
|
}
|
|
4082
|
-
), (cardError == null ? void 0 : cardError.cardNumber) && /* @__PURE__ */
|
|
4193
|
+
), (cardError == null ? void 0 : cardError.cardNumber) && /* @__PURE__ */ React19.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.cardNumber)), /* @__PURE__ */ React19.createElement("div", { className: "card-dtl" }, /* @__PURE__ */ React19.createElement("div", { className: "exp-cvc-container" }, /* @__PURE__ */ React19.createElement("div", { className: "form-group", style: { marginTop: "0", marginBottom: "10px" } }, /* @__PURE__ */ React19.createElement("label", { htmlFor: "expMonth" }, "MM"), /* @__PURE__ */ React19.createElement(
|
|
4083
4194
|
"input",
|
|
4084
4195
|
{
|
|
4085
4196
|
"data-token": "exp_month",
|
|
@@ -4090,7 +4201,7 @@ function AddCard(props) {
|
|
|
4090
4201
|
value: (cardData == null ? void 0 : cardData.expiryMonth) || "",
|
|
4091
4202
|
onChange: (e) => handleCardChange("expiryMonth", e.target.value)
|
|
4092
4203
|
}
|
|
4093
|
-
), (cardError == null ? void 0 : cardError.expiryMonth) && /* @__PURE__ */
|
|
4204
|
+
), (cardError == null ? void 0 : cardError.expiryMonth) && /* @__PURE__ */ React19.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.expiryMonth)), /* @__PURE__ */ React19.createElement("div", { className: "form-group", style: { marginTop: "0", marginBottom: "10px" } }, /* @__PURE__ */ React19.createElement("label", { htmlFor: "expYear" }, "YYYY"), /* @__PURE__ */ React19.createElement(
|
|
4094
4205
|
"input",
|
|
4095
4206
|
{
|
|
4096
4207
|
"data-token": "exp_year",
|
|
@@ -4101,7 +4212,7 @@ function AddCard(props) {
|
|
|
4101
4212
|
value: (cardData == null ? void 0 : cardData.expiryYear) || "",
|
|
4102
4213
|
onChange: (e) => handleCardChange("expiryYear", e.target.value)
|
|
4103
4214
|
}
|
|
4104
|
-
), (cardError == null ? void 0 : cardError.expiryYear) && /* @__PURE__ */
|
|
4215
|
+
), (cardError == null ? void 0 : cardError.expiryYear) && /* @__PURE__ */ React19.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.expiryYear)), /* @__PURE__ */ React19.createElement("div", { className: "form-group", style: { marginTop: "0", marginBottom: "10px" } }, /* @__PURE__ */ React19.createElement("label", { htmlFor: "cvc" }, "CVC"), /* @__PURE__ */ React19.createElement(
|
|
4105
4216
|
"input",
|
|
4106
4217
|
{
|
|
4107
4218
|
"data-token": "cvv",
|
|
@@ -4112,7 +4223,7 @@ function AddCard(props) {
|
|
|
4112
4223
|
value: (cardData == null ? void 0 : cardData.cvv) || "",
|
|
4113
4224
|
onChange: (e) => handleCardChange("cvv", e.target.value)
|
|
4114
4225
|
}
|
|
4115
|
-
), (cardError == null ? void 0 : cardError.cvv) && /* @__PURE__ */
|
|
4226
|
+
), (cardError == null ? void 0 : cardError.cvv) && /* @__PURE__ */ React19.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.cvv)))), /* @__PURE__ */ React19.createElement("div", { className: "form-group", style: { marginTop: "0", marginBottom: "10px" } }, /* @__PURE__ */ React19.createElement("label", { htmlFor: "cardholderName" }, "Name on card"), /* @__PURE__ */ React19.createElement(
|
|
4116
4227
|
"input",
|
|
4117
4228
|
{
|
|
4118
4229
|
type: "text",
|
|
@@ -4127,7 +4238,7 @@ function AddCard(props) {
|
|
|
4127
4238
|
}
|
|
4128
4239
|
}
|
|
4129
4240
|
}
|
|
4130
|
-
), (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */
|
|
4241
|
+
), (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */ React19.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.cardName)), /* @__PURE__ */ React19.createElement("div", { className: "form-group", style: { marginBottom: "20px" } }, /* @__PURE__ */ React19.createElement("label", { htmlFor: "zipcode" }, "Zip"), /* @__PURE__ */ React19.createElement(
|
|
4131
4242
|
"input",
|
|
4132
4243
|
{
|
|
4133
4244
|
type: "text",
|
|
@@ -4137,7 +4248,7 @@ function AddCard(props) {
|
|
|
4137
4248
|
value: (_a = cardData == null ? void 0 : cardData.zipCode) != null ? _a : "",
|
|
4138
4249
|
onChange: (e) => handleCardChange("zipCode", e.target.value)
|
|
4139
4250
|
}
|
|
4140
|
-
), (cardError == null ? void 0 : cardError.zipCode) && /* @__PURE__ */
|
|
4251
|
+
), (cardError == null ? void 0 : cardError.zipCode) && /* @__PURE__ */ React19.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.zipCode)), /* @__PURE__ */ React19.createElement(
|
|
4141
4252
|
"input",
|
|
4142
4253
|
{
|
|
4143
4254
|
type: "submit",
|
|
@@ -4150,13 +4261,14 @@ function AddCard(props) {
|
|
|
4150
4261
|
}
|
|
4151
4262
|
|
|
4152
4263
|
// src/app/components/AddCard/AddCardEasyPay.tsx
|
|
4153
|
-
import
|
|
4264
|
+
import React20, { useEffect as useEffect7, useState as useState6 } from "react";
|
|
4154
4265
|
import Swal4 from "sweetalert2";
|
|
4155
4266
|
import axios6 from "axios";
|
|
4156
4267
|
function AddCardEasyPay(props) {
|
|
4157
4268
|
var _a;
|
|
4158
4269
|
const [loading, setLoading] = useState6(false);
|
|
4159
4270
|
const [success, setSuccess] = useState6(false);
|
|
4271
|
+
const [error, setError] = useState6("");
|
|
4160
4272
|
const [show, setShow] = useState6(false);
|
|
4161
4273
|
const [cardData, setCardData] = useState6();
|
|
4162
4274
|
const [cardError, setCardError] = useState6({});
|
|
@@ -4175,6 +4287,7 @@ function AddCardEasyPay(props) {
|
|
|
4175
4287
|
const handleClose = () => {
|
|
4176
4288
|
setShow(false);
|
|
4177
4289
|
setSuccess(false);
|
|
4290
|
+
setError("");
|
|
4178
4291
|
setCardData({
|
|
4179
4292
|
cardName: "",
|
|
4180
4293
|
cardNumber: "",
|
|
@@ -4284,14 +4397,14 @@ function AddCardEasyPay(props) {
|
|
|
4284
4397
|
setPaymentData((_a2 = paymentData2 == null ? void 0 : paymentData2.data) == null ? void 0 : _a2.data);
|
|
4285
4398
|
if (!((_c = (_b = paymentData2 == null ? void 0 : paymentData2.data) == null ? void 0 : _b.data) == null ? void 0 : _c.paymentGateway)) {
|
|
4286
4399
|
handleClose();
|
|
4287
|
-
|
|
4400
|
+
setError("Something went wrong.");
|
|
4288
4401
|
}
|
|
4289
4402
|
hideLoader();
|
|
4290
4403
|
} catch (err) {
|
|
4291
4404
|
console.log(err);
|
|
4292
4405
|
hideLoader();
|
|
4293
4406
|
handleClose();
|
|
4294
|
-
|
|
4407
|
+
setError("Something went wrong.");
|
|
4295
4408
|
}
|
|
4296
4409
|
};
|
|
4297
4410
|
useEffect7(() => {
|
|
@@ -4323,7 +4436,7 @@ function AddCardEasyPay(props) {
|
|
|
4323
4436
|
console.log(token);
|
|
4324
4437
|
if (token.Error) {
|
|
4325
4438
|
console.log(token == null ? void 0 : token.Error);
|
|
4326
|
-
|
|
4439
|
+
setError(token.Error);
|
|
4327
4440
|
hideLoader();
|
|
4328
4441
|
} else {
|
|
4329
4442
|
const reqData = {
|
|
@@ -4362,12 +4475,12 @@ function AddCardEasyPay(props) {
|
|
|
4362
4475
|
} catch (err) {
|
|
4363
4476
|
console.log(err);
|
|
4364
4477
|
hideLoader();
|
|
4365
|
-
|
|
4478
|
+
setError(((_c2 = (_b2 = err == null ? void 0 : err.response) == null ? void 0 : _b2.data) == null ? void 0 : _c2.message) || (err == null ? void 0 : err.message) || "Something went wrong.");
|
|
4366
4479
|
}
|
|
4367
4480
|
} catch (err) {
|
|
4368
4481
|
console.log(err);
|
|
4369
4482
|
hideLoader();
|
|
4370
|
-
|
|
4483
|
+
setError(((_e2 = (_d2 = err == null ? void 0 : err.response) == null ? void 0 : _d2.data) == null ? void 0 : _e2.message) || (err == null ? void 0 : err.message) || "Something went wrong.");
|
|
4371
4484
|
}
|
|
4372
4485
|
}
|
|
4373
4486
|
};
|
|
@@ -4427,15 +4540,15 @@ function AddCardEasyPay(props) {
|
|
|
4427
4540
|
}
|
|
4428
4541
|
} catch (err) {
|
|
4429
4542
|
hideLoader();
|
|
4430
|
-
|
|
4543
|
+
setError(((_j = (_i = err == null ? void 0 : err.response) == null ? void 0 : _i.data) == null ? void 0 : _j.message) || (err == null ? void 0 : err.message) || "Something went wrong.");
|
|
4431
4544
|
}
|
|
4432
4545
|
} catch (err) {
|
|
4433
4546
|
hideLoader();
|
|
4434
|
-
|
|
4547
|
+
setError(((_l = (_k = err == null ? void 0 : err.response) == null ? void 0 : _k.data) == null ? void 0 : _l.message) || (err == null ? void 0 : err.message) || "Something went wrong.");
|
|
4435
4548
|
}
|
|
4436
4549
|
} catch (err) {
|
|
4437
4550
|
hideLoader();
|
|
4438
|
-
|
|
4551
|
+
setError(((_n = (_m = err == null ? void 0 : err.response) == null ? void 0 : _m.data) == null ? void 0 : _n.message) || (err == null ? void 0 : err.message) || "Something went wrong.");
|
|
4439
4552
|
}
|
|
4440
4553
|
} else {
|
|
4441
4554
|
if (typeof DatacapWebToken !== "undefined") {
|
|
@@ -4444,19 +4557,19 @@ function AddCardEasyPay(props) {
|
|
|
4444
4557
|
}
|
|
4445
4558
|
} catch (err) {
|
|
4446
4559
|
hideLoader();
|
|
4447
|
-
|
|
4560
|
+
setError(((_p = (_o = err == null ? void 0 : err.response) == null ? void 0 : _o.data) == null ? void 0 : _p.message) || (err == null ? void 0 : err.message) || "Something went wrong.");
|
|
4448
4561
|
}
|
|
4449
4562
|
}
|
|
4450
4563
|
}
|
|
4451
4564
|
};
|
|
4452
|
-
return /* @__PURE__ */
|
|
4565
|
+
return /* @__PURE__ */ React20.createElement(React20.Fragment, null, /* @__PURE__ */ React20.createElement(DataScript, null), /* @__PURE__ */ React20.createElement(AddCardStyle, null), /* @__PURE__ */ React20.createElement(Loader_default, { loading }), error && /* @__PURE__ */ React20.createElement("div", { style: { maxHeight: "606px", minHeight: "60vh", padding: "40px" } }, /* @__PURE__ */ React20.createElement(ErrorCardMessage_default, { error, onClose: handleClose })), !error && !success && /* @__PURE__ */ React20.createElement(React20.Fragment, null, success ? /* @__PURE__ */ React20.createElement(SuccessCardMsz_default, { onClose: handleCloseSeccess }) : /* @__PURE__ */ React20.createElement(
|
|
4453
4566
|
"div",
|
|
4454
4567
|
{
|
|
4455
4568
|
className: "container-creditcard add-card modal-content",
|
|
4456
4569
|
id: "add-credit-card-panel",
|
|
4457
4570
|
style: { margin: "auto" }
|
|
4458
4571
|
},
|
|
4459
|
-
/* @__PURE__ */
|
|
4572
|
+
/* @__PURE__ */ React20.createElement("form", { id: "creditCardForm", onSubmit: addCardFunc, style: { padding: "0 10px" } }, /* @__PURE__ */ React20.createElement("div", { style: { maxHeight: "350px", minHeight: "0" }, className: "card-scrl" }, /* @__PURE__ */ React20.createElement("div", { className: "form-group", style: { marginTop: "0", marginBottom: "10px" } }, /* @__PURE__ */ React20.createElement("label", { htmlFor: "cardNumber" }, "Card Number"), /* @__PURE__ */ React20.createElement(
|
|
4460
4573
|
"input",
|
|
4461
4574
|
{
|
|
4462
4575
|
type: "text",
|
|
@@ -4467,7 +4580,7 @@ function AddCardEasyPay(props) {
|
|
|
4467
4580
|
value: (cardData == null ? void 0 : cardData.cardNumber) || "",
|
|
4468
4581
|
onChange: (e) => handleCardNumberChange(e)
|
|
4469
4582
|
}
|
|
4470
|
-
), (cardError == null ? void 0 : cardError.cardNumber) && /* @__PURE__ */
|
|
4583
|
+
), (cardError == null ? void 0 : cardError.cardNumber) && /* @__PURE__ */ React20.createElement("span", { className: "error-span", style: { color: "red", fontSize: "12px" } }, cardError == null ? void 0 : cardError.cardNumber), /* @__PURE__ */ React20.createElement("br", null)), /* @__PURE__ */ React20.createElement("div", { className: "card-dtl" }, /* @__PURE__ */ React20.createElement("div", { className: "exp-cvc-container", style: { margin: "0" } }, /* @__PURE__ */ React20.createElement("div", { className: "form-group", style: { marginTop: "0" } }, /* @__PURE__ */ React20.createElement("label", { htmlFor: "expMonth" }, "MM"), /* @__PURE__ */ React20.createElement(
|
|
4471
4584
|
"input",
|
|
4472
4585
|
{
|
|
4473
4586
|
"data-token": "exp_month",
|
|
@@ -4478,7 +4591,7 @@ function AddCardEasyPay(props) {
|
|
|
4478
4591
|
value: (cardData == null ? void 0 : cardData.expiryMonth) || "",
|
|
4479
4592
|
onChange: (e) => handleCardChange("expiryMonth", e.target.value)
|
|
4480
4593
|
}
|
|
4481
|
-
), (cardError == null ? void 0 : cardError.expiryMonth) && /* @__PURE__ */
|
|
4594
|
+
), (cardError == null ? void 0 : cardError.expiryMonth) && /* @__PURE__ */ React20.createElement("span", { className: "error-span", style: { color: "red", fontSize: "12px" } }, cardError == null ? void 0 : cardError.expiryMonth)), /* @__PURE__ */ React20.createElement("div", { className: "form-group", style: { marginTop: "0" } }, /* @__PURE__ */ React20.createElement("label", { htmlFor: "expYear" }, "YYYY"), /* @__PURE__ */ React20.createElement(
|
|
4482
4595
|
"input",
|
|
4483
4596
|
{
|
|
4484
4597
|
"data-token": "exp_year",
|
|
@@ -4489,7 +4602,7 @@ function AddCardEasyPay(props) {
|
|
|
4489
4602
|
value: (cardData == null ? void 0 : cardData.expiryYear) || "",
|
|
4490
4603
|
onChange: (e) => handleCardChange("expiryYear", e.target.value)
|
|
4491
4604
|
}
|
|
4492
|
-
), (cardError == null ? void 0 : cardError.expiryYear) && /* @__PURE__ */
|
|
4605
|
+
), (cardError == null ? void 0 : cardError.expiryYear) && /* @__PURE__ */ React20.createElement("span", { className: "error-span", style: { color: "red", fontSize: "12px" } }, cardError == null ? void 0 : cardError.expiryYear)), /* @__PURE__ */ React20.createElement("div", { className: "form-group", style: { marginTop: "0" } }, /* @__PURE__ */ React20.createElement("label", { htmlFor: "cvc" }, "CVC"), /* @__PURE__ */ React20.createElement(
|
|
4493
4606
|
"input",
|
|
4494
4607
|
{
|
|
4495
4608
|
"data-token": "cvv",
|
|
@@ -4500,7 +4613,7 @@ function AddCardEasyPay(props) {
|
|
|
4500
4613
|
value: (cardData == null ? void 0 : cardData.cvv) || "",
|
|
4501
4614
|
onChange: (e) => handleCardChange("cvv", e.target.value)
|
|
4502
4615
|
}
|
|
4503
|
-
), (cardError == null ? void 0 : cardError.cvv) && /* @__PURE__ */
|
|
4616
|
+
), (cardError == null ? void 0 : cardError.cvv) && /* @__PURE__ */ React20.createElement("span", { className: "error-span", style: { color: "red", fontSize: "12px" } }, cardError == null ? void 0 : cardError.cvv)))), /* @__PURE__ */ React20.createElement("div", { className: "form-group", style: { marginTop: "0" } }, /* @__PURE__ */ React20.createElement("label", { htmlFor: "cardholderName" }, "Name on card"), /* @__PURE__ */ React20.createElement(
|
|
4504
4617
|
"input",
|
|
4505
4618
|
{
|
|
4506
4619
|
type: "text",
|
|
@@ -4515,7 +4628,7 @@ function AddCardEasyPay(props) {
|
|
|
4515
4628
|
}
|
|
4516
4629
|
}
|
|
4517
4630
|
}
|
|
4518
|
-
), (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */
|
|
4631
|
+
), (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */ React20.createElement("span", { className: "error-span", style: { color: "red", fontSize: "12px" } }, cardError == null ? void 0 : cardError.cardName)), /* @__PURE__ */ React20.createElement("div", { className: "form-group", style: { marginTop: "0" } }, /* @__PURE__ */ React20.createElement("label", { htmlFor: "zipcode" }, "Zip"), /* @__PURE__ */ React20.createElement(
|
|
4519
4632
|
"input",
|
|
4520
4633
|
{
|
|
4521
4634
|
type: "text",
|
|
@@ -4525,7 +4638,7 @@ function AddCardEasyPay(props) {
|
|
|
4525
4638
|
value: (_a = cardData == null ? void 0 : cardData.zipCode) != null ? _a : "",
|
|
4526
4639
|
onChange: (e) => handleCardChange("zipCode", e.target.value)
|
|
4527
4640
|
}
|
|
4528
|
-
), (cardError == null ? void 0 : cardError.zipCode) && /* @__PURE__ */
|
|
4641
|
+
), (cardError == null ? void 0 : cardError.zipCode) && /* @__PURE__ */ React20.createElement("span", { className: "error-span", style: { color: "red", fontSize: "12px" } }, cardError == null ? void 0 : cardError.zipCode))), /* @__PURE__ */ React20.createElement(
|
|
4529
4642
|
"input",
|
|
4530
4643
|
{
|
|
4531
4644
|
type: "submit",
|
|
@@ -4533,7 +4646,7 @@ function AddCardEasyPay(props) {
|
|
|
4533
4646
|
defaultValue: "Submit"
|
|
4534
4647
|
}
|
|
4535
4648
|
))
|
|
4536
|
-
));
|
|
4649
|
+
)));
|
|
4537
4650
|
}
|
|
4538
4651
|
export {
|
|
4539
4652
|
AddCard,
|