@pinerohit11/testwidget 0.2.114 → 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.js
CHANGED
|
@@ -172,7 +172,7 @@ var Loader_default = Loader;
|
|
|
172
172
|
|
|
173
173
|
// src/app/components/baseurl.ts
|
|
174
174
|
var baseUrl = "http://192.168.1.63:8082/";
|
|
175
|
-
var masterBaseUrl = "
|
|
175
|
+
var masterBaseUrl = "https://dev-sky-node.fractalpay.com/";
|
|
176
176
|
|
|
177
177
|
// src/app/components/Errortext.ts
|
|
178
178
|
var ErrorText = {
|
|
@@ -1197,7 +1197,7 @@ function RequestPreAuthPayment(props) {
|
|
|
1197
1197
|
}
|
|
1198
1198
|
|
|
1199
1199
|
// src/app/components/Charge/GetPaymentPage.tsx
|
|
1200
|
-
var
|
|
1200
|
+
var import_react14 = __toESM(require("react"));
|
|
1201
1201
|
|
|
1202
1202
|
// src/app/components/Charge/Chargewidgetstyles.tsx
|
|
1203
1203
|
var import_react8 = __toESM(require("react"));
|
|
@@ -2151,35 +2151,151 @@ function DataScript() {
|
|
|
2151
2151
|
return null;
|
|
2152
2152
|
}
|
|
2153
2153
|
|
|
2154
|
+
// src/app/components/ErrorCardMessage/ErrorCardMessage.tsx
|
|
2155
|
+
var import_react13 = __toESM(require("react"));
|
|
2156
|
+
|
|
2157
|
+
// src/app/components/ErrorCardMessage/ErrorCardMessageStyle.tsx
|
|
2158
|
+
var import_react12 = __toESM(require("react"));
|
|
2159
|
+
function ErrorCardMszStyle() {
|
|
2160
|
+
return /* @__PURE__ */ import_react12.default.createElement("style", null, `
|
|
2161
|
+
.card-error .logo-container {
|
|
2162
|
+
display: flex;
|
|
2163
|
+
justify-content: center;
|
|
2164
|
+
align-items: center;
|
|
2165
|
+
margin-bottom: -50px; /* Adjust this to overlap the content */
|
|
2166
|
+
z-index: 10;
|
|
2167
|
+
}
|
|
2168
|
+
|
|
2169
|
+
.card-error .client-logo {
|
|
2170
|
+
max-width: 100px;
|
|
2171
|
+
height: auto;
|
|
2172
|
+
object-fit: contain;
|
|
2173
|
+
display: block;
|
|
2174
|
+
}
|
|
2175
|
+
|
|
2176
|
+
.card-error .payment-error-container {
|
|
2177
|
+
display: flex;
|
|
2178
|
+
flex-direction: column;
|
|
2179
|
+
align-items: center;
|
|
2180
|
+
padding: 18px 20px 24px;
|
|
2181
|
+
// width: 335px;
|
|
2182
|
+
min-height: 250px; /* Fixed height */
|
|
2183
|
+
background: #FFFFFF;
|
|
2184
|
+
border-radius: 12px;
|
|
2185
|
+
position: relative;
|
|
2186
|
+
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
|
|
2187
|
+
border: 1px solid #e3e3e3;
|
|
2188
|
+
justify-content: center;
|
|
2189
|
+
text-align: center;
|
|
2190
|
+
// margin-top: 50px; /* Adjust this to move the content down */
|
|
2191
|
+
margin: 50px auto 0 auto !important;
|
|
2192
|
+
}
|
|
2193
|
+
|
|
2194
|
+
.card-error .error-icon {
|
|
2195
|
+
display: flex;
|
|
2196
|
+
flex-direction: column;
|
|
2197
|
+
align-items: center;
|
|
2198
|
+
gap: 12px;
|
|
2199
|
+
min-height: 116px;
|
|
2200
|
+
z-index: 2;
|
|
2201
|
+
}
|
|
2202
|
+
|
|
2203
|
+
.card-error .circle {
|
|
2204
|
+
width: 50px;
|
|
2205
|
+
height: 50px;
|
|
2206
|
+
border: 1px solid red;
|
|
2207
|
+
border-radius: 50%;
|
|
2208
|
+
display: flex;
|
|
2209
|
+
justify-content: center;
|
|
2210
|
+
align-items: center;
|
|
2211
|
+
margin-bottom:20px
|
|
2212
|
+
}
|
|
2213
|
+
|
|
2214
|
+
.card-error .circle .fa-times {
|
|
2215
|
+
font-size: 30px;
|
|
2216
|
+
color: red;
|
|
2217
|
+
}
|
|
2218
|
+
|
|
2219
|
+
.card-error .error-text {
|
|
2220
|
+
display: flex;
|
|
2221
|
+
flex-direction: column;
|
|
2222
|
+
justify-content: center;
|
|
2223
|
+
align-items: center;
|
|
2224
|
+
gap: 4px;
|
|
2225
|
+
// width: 227px;
|
|
2226
|
+
}
|
|
2227
|
+
|
|
2228
|
+
.card-error .payment-error-text {
|
|
2229
|
+
font-family: 'Inter', sans-serif;
|
|
2230
|
+
font-weight: 500;
|
|
2231
|
+
font-size: 18px;
|
|
2232
|
+
line-height: 21px;
|
|
2233
|
+
text-align: center;
|
|
2234
|
+
letter-spacing: -0.02em;
|
|
2235
|
+
color: #161616;
|
|
2236
|
+
}
|
|
2237
|
+
|
|
2238
|
+
.card-error .thank-you-text {
|
|
2239
|
+
font-family: 'Inter', sans-serif;
|
|
2240
|
+
font-weight: 500;
|
|
2241
|
+
font-size: 16px;
|
|
2242
|
+
line-height: 18px;
|
|
2243
|
+
text-align: center;
|
|
2244
|
+
letter-spacing: -0.02em;
|
|
2245
|
+
color: #161616 !important;
|
|
2246
|
+
opacity: 0.5;
|
|
2247
|
+
padding-top:10px
|
|
2248
|
+
}
|
|
2249
|
+
|
|
2250
|
+
.card-error .error-btn-div{
|
|
2251
|
+
padding-top:30px;
|
|
2252
|
+
|
|
2253
|
+
}
|
|
2254
|
+
.card-error .error-btn-div button{
|
|
2255
|
+
border-radius: 0.25em;
|
|
2256
|
+
border:none;
|
|
2257
|
+
background: initial;
|
|
2258
|
+
background-color: #7066e0;
|
|
2259
|
+
box-shadow: var(--swal2-confirm-button-box-shadow);
|
|
2260
|
+
color: white;
|
|
2261
|
+
font-size: 1em;
|
|
2262
|
+
padding:10px 17px;
|
|
2263
|
+
cursor:pointer;
|
|
2264
|
+
}
|
|
2265
|
+
`);
|
|
2266
|
+
}
|
|
2267
|
+
|
|
2268
|
+
// src/app/components/ErrorCardMessage/ErrorCardMessage.tsx
|
|
2269
|
+
var ErrorCardMessage = ({ onClose, error }) => {
|
|
2270
|
+
return /* @__PURE__ */ import_react13.default.createElement(import_react13.default.Fragment, null, /* @__PURE__ */ import_react13.default.createElement(ErrorCardMszStyle, null), /* @__PURE__ */ import_react13.default.createElement("div", { className: "card-error" }, /* @__PURE__ */ import_react13.default.createElement("div", { className: "payment-error-container" }, /* @__PURE__ */ import_react13.default.createElement("div", { className: "error-icon" }, /* @__PURE__ */ import_react13.default.createElement("div", { className: "circle" }, /* @__PURE__ */ import_react13.default.createElement("i", { className: "fa fa-times", "aria-hidden": "true" })), /* @__PURE__ */ import_react13.default.createElement("div", { className: "error-text" }, /* @__PURE__ */ import_react13.default.createElement("div", { className: "payment-error-text" }, error), /* @__PURE__ */ import_react13.default.createElement("div", { className: "thank-you-text" }, "Try again later ")), /* @__PURE__ */ import_react13.default.createElement("div", { className: "error-btn-div" }, /* @__PURE__ */ import_react13.default.createElement("button", { onClick: onClose }, "OK"))))));
|
|
2271
|
+
};
|
|
2272
|
+
var ErrorCardMessage_default = ErrorCardMessage;
|
|
2273
|
+
|
|
2154
2274
|
// src/app/components/Charge/GetPaymentPage.tsx
|
|
2155
2275
|
function GetPaymentPage(props) {
|
|
2156
2276
|
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
|
|
2157
|
-
const [loading, setLoading] = (0,
|
|
2158
|
-
const [
|
|
2159
|
-
const [
|
|
2160
|
-
const [
|
|
2161
|
-
const [
|
|
2162
|
-
const [
|
|
2277
|
+
const [loading, setLoading] = (0, import_react14.useState)(false);
|
|
2278
|
+
const [error, setError] = (0, import_react14.useState)("");
|
|
2279
|
+
const [success, setSuccess] = (0, import_react14.useState)(false);
|
|
2280
|
+
const [show, setShow] = (0, import_react14.useState)(false);
|
|
2281
|
+
const [activetab, setActive] = (0, import_react14.useState)("card");
|
|
2282
|
+
const [saveCardInfo, setSaveCardInfo] = (0, import_react14.useState)(false);
|
|
2283
|
+
const [saveACHinfo, setSaveACHinfo] = (0, import_react14.useState)(false);
|
|
2163
2284
|
const fractalpayClientKey = props.fractalpayClientKey;
|
|
2164
|
-
const [cardData, setCardData] = (0,
|
|
2165
|
-
const [cardError, setCardError] = (0,
|
|
2166
|
-
const [achData, setAchData] = (0,
|
|
2167
|
-
const [achError, setAchError] = (0,
|
|
2168
|
-
const [cardList, setCardList] = (0,
|
|
2169
|
-
const [selectedCard, setSelectedCard] = (0,
|
|
2170
|
-
const [paymentData, setPaymentData] = (0,
|
|
2171
|
-
let [tranId, setTranId] = (0,
|
|
2285
|
+
const [cardData, setCardData] = (0, import_react14.useState)();
|
|
2286
|
+
const [cardError, setCardError] = (0, import_react14.useState)({});
|
|
2287
|
+
const [achData, setAchData] = (0, import_react14.useState)();
|
|
2288
|
+
const [achError, setAchError] = (0, import_react14.useState)({});
|
|
2289
|
+
const [cardList, setCardList] = (0, import_react14.useState)([]);
|
|
2290
|
+
const [selectedCard, setSelectedCard] = (0, import_react14.useState)();
|
|
2291
|
+
const [paymentData, setPaymentData] = (0, import_react14.useState)();
|
|
2292
|
+
let [tranId, setTranId] = (0, import_react14.useState)("");
|
|
2172
2293
|
const showLoader = () => setLoading(true);
|
|
2173
2294
|
const hideLoader = () => setLoading(false);
|
|
2174
|
-
const showError = (msz) => {
|
|
2175
|
-
import_sweetalert2.default.fire({
|
|
2176
|
-
icon: "error",
|
|
2177
|
-
text: msz
|
|
2178
|
-
});
|
|
2179
|
-
};
|
|
2180
2295
|
const handleClose = () => {
|
|
2181
2296
|
setShow(false);
|
|
2182
2297
|
setActive("card");
|
|
2298
|
+
setError("");
|
|
2183
2299
|
setSuccess(false);
|
|
2184
2300
|
setTranId("");
|
|
2185
2301
|
setAchData({
|
|
@@ -2393,7 +2509,7 @@ function GetPaymentPage(props) {
|
|
|
2393
2509
|
let tokenCallback = async function(response) {
|
|
2394
2510
|
var _a3, _b3, _c3;
|
|
2395
2511
|
if (response.Error) {
|
|
2396
|
-
|
|
2512
|
+
setError(response.Error);
|
|
2397
2513
|
hideLoader();
|
|
2398
2514
|
} else {
|
|
2399
2515
|
let name = cardData == null ? void 0 : cardData.cardName;
|
|
@@ -2418,7 +2534,7 @@ function GetPaymentPage(props) {
|
|
|
2418
2534
|
hideLoader();
|
|
2419
2535
|
} catch (err) {
|
|
2420
2536
|
hideLoader();
|
|
2421
|
-
|
|
2537
|
+
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.");
|
|
2422
2538
|
}
|
|
2423
2539
|
}
|
|
2424
2540
|
};
|
|
@@ -2484,15 +2600,15 @@ function GetPaymentPage(props) {
|
|
|
2484
2600
|
}
|
|
2485
2601
|
} catch (err) {
|
|
2486
2602
|
hideLoader();
|
|
2487
|
-
|
|
2603
|
+
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.");
|
|
2488
2604
|
}
|
|
2489
2605
|
} catch (err) {
|
|
2490
2606
|
hideLoader();
|
|
2491
|
-
|
|
2607
|
+
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.");
|
|
2492
2608
|
}
|
|
2493
2609
|
} catch (err) {
|
|
2494
2610
|
hideLoader();
|
|
2495
|
-
|
|
2611
|
+
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.");
|
|
2496
2612
|
}
|
|
2497
2613
|
} else {
|
|
2498
2614
|
if (typeof DatacapWebToken !== "undefined") {
|
|
@@ -2501,7 +2617,7 @@ function GetPaymentPage(props) {
|
|
|
2501
2617
|
}
|
|
2502
2618
|
} catch (err) {
|
|
2503
2619
|
hideLoader();
|
|
2504
|
-
|
|
2620
|
+
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.");
|
|
2505
2621
|
}
|
|
2506
2622
|
}
|
|
2507
2623
|
}
|
|
@@ -2537,19 +2653,19 @@ function GetPaymentPage(props) {
|
|
|
2537
2653
|
handleClose();
|
|
2538
2654
|
}
|
|
2539
2655
|
});
|
|
2540
|
-
} catch (
|
|
2541
|
-
if (import_axios3.default.isAxiosError(
|
|
2656
|
+
} catch (error2) {
|
|
2657
|
+
if (import_axios3.default.isAxiosError(error2)) {
|
|
2542
2658
|
hideLoader();
|
|
2543
|
-
|
|
2659
|
+
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");
|
|
2544
2660
|
} else {
|
|
2545
|
-
console.error("Unexpected error",
|
|
2661
|
+
console.error("Unexpected error", error2);
|
|
2546
2662
|
}
|
|
2547
2663
|
}
|
|
2548
2664
|
}
|
|
2549
2665
|
}
|
|
2550
2666
|
};
|
|
2551
2667
|
const getPaymentDetails = async () => {
|
|
2552
|
-
var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2, _k, _l, _m;
|
|
2668
|
+
var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2, _k, _l, _m, _n, _o;
|
|
2553
2669
|
showLoader();
|
|
2554
2670
|
try {
|
|
2555
2671
|
const data = {
|
|
@@ -2560,7 +2676,7 @@ function GetPaymentPage(props) {
|
|
|
2560
2676
|
setPaymentData((_a2 = paymentData2 == null ? void 0 : paymentData2.data) == null ? void 0 : _a2.data);
|
|
2561
2677
|
if (!((_c2 = (_b2 = paymentData2 == null ? void 0 : paymentData2.data) == null ? void 0 : _b2.data) == null ? void 0 : _c2.paymentGateway)) {
|
|
2562
2678
|
handleClose();
|
|
2563
|
-
|
|
2679
|
+
setError("Something went wrong.");
|
|
2564
2680
|
}
|
|
2565
2681
|
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) {
|
|
2566
2682
|
setCardList((_j2 = (_i2 = paymentData2 == null ? void 0 : paymentData2.data) == null ? void 0 : _i2.data) == null ? void 0 : _j2.card_list);
|
|
@@ -2574,10 +2690,9 @@ function GetPaymentPage(props) {
|
|
|
2574
2690
|
}
|
|
2575
2691
|
hideLoader();
|
|
2576
2692
|
} catch (err) {
|
|
2577
|
-
|
|
2693
|
+
console.log(err);
|
|
2578
2694
|
hideLoader();
|
|
2579
|
-
|
|
2580
|
-
showError("Something went wrong , Try again later");
|
|
2695
|
+
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");
|
|
2581
2696
|
}
|
|
2582
2697
|
};
|
|
2583
2698
|
const handlechargeCustomer = async () => {
|
|
@@ -2621,19 +2736,19 @@ function GetPaymentPage(props) {
|
|
|
2621
2736
|
}
|
|
2622
2737
|
} catch (err) {
|
|
2623
2738
|
hideLoader();
|
|
2624
|
-
|
|
2739
|
+
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");
|
|
2625
2740
|
}
|
|
2626
2741
|
} else {
|
|
2627
|
-
|
|
2742
|
+
setError("Please Select A Card/ACH");
|
|
2628
2743
|
}
|
|
2629
2744
|
} else {
|
|
2630
|
-
|
|
2745
|
+
setError("Please Select Customer");
|
|
2631
2746
|
}
|
|
2632
2747
|
} else {
|
|
2633
|
-
|
|
2748
|
+
setError("Something went wrong.");
|
|
2634
2749
|
}
|
|
2635
2750
|
};
|
|
2636
|
-
(0,
|
|
2751
|
+
(0, import_react14.useEffect)(() => {
|
|
2637
2752
|
if (show && fractalpayClientKey) {
|
|
2638
2753
|
getPaymentDetails();
|
|
2639
2754
|
}
|
|
@@ -2704,25 +2819,27 @@ function GetPaymentPage(props) {
|
|
|
2704
2819
|
}
|
|
2705
2820
|
});
|
|
2706
2821
|
};
|
|
2707
|
-
|
|
2822
|
+
console.log(paymentData == null ? void 0 : paymentData.paymentGateway);
|
|
2823
|
+
return /* @__PURE__ */ import_react14.default.createElement(import_react14.default.Fragment, null, /* @__PURE__ */ import_react14.default.createElement(DataScript, null), /* @__PURE__ */ import_react14.default.createElement(Chargewidgetstyles, null), /* @__PURE__ */ import_react14.default.createElement(import_react14.default.Fragment, null, /* @__PURE__ */ import_react14.default.createElement(
|
|
2708
2824
|
"button",
|
|
2709
2825
|
{
|
|
2710
2826
|
className: "paymentBtn",
|
|
2711
2827
|
onClick: handleShow
|
|
2712
2828
|
},
|
|
2713
2829
|
"Pay"
|
|
2714
|
-
), /* @__PURE__ */
|
|
2830
|
+
), /* @__PURE__ */ import_react14.default.createElement(
|
|
2715
2831
|
CustomModal2_default,
|
|
2716
2832
|
{
|
|
2717
2833
|
open: show,
|
|
2718
2834
|
onClose: handleClose
|
|
2719
2835
|
},
|
|
2720
|
-
/* @__PURE__ */
|
|
2721
|
-
success
|
|
2836
|
+
error && /* @__PURE__ */ import_react14.default.createElement("div", { style: { maxHeight: "606px", minHeight: "60vh", padding: "40px" } }, /* @__PURE__ */ import_react14.default.createElement(ErrorCardMessage_default, { error, onClose: handleClose })),
|
|
2837
|
+
success && /* @__PURE__ */ import_react14.default.createElement(SuccessMsz, { onClose: handleClose, tranId }),
|
|
2838
|
+
!error && !success && /* @__PURE__ */ import_react14.default.createElement(import_react14.default.Fragment, null, loading && /* @__PURE__ */ import_react14.default.createElement(Loader_default, { loading }), /* @__PURE__ */ import_react14.default.createElement("div", { className: "frac-card-payment-page frac-form" }, /* @__PURE__ */ import_react14.default.createElement("div", { className: "parent-pay-container" }, /* @__PURE__ */ import_react14.default.createElement("span", { className: "request-payment-close-popup", onClick: handleClose }, /* @__PURE__ */ import_react14.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, /* @__PURE__ */ import_react14.default.createElement("g", { clipPath: "url(#clip0_12425_52336)" }, /* @__PURE__ */ import_react14.default.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__ */ import_react14.default.createElement("defs", null, /* @__PURE__ */ import_react14.default.createElement("clipPath", { id: "clip0_12425_52336" }, /* @__PURE__ */ import_react14.default.createElement("rect", { width: "16", height: "16", fill: "white" }))))), /* @__PURE__ */ import_react14.default.createElement("div", { className: "pay-main-logo-res" }, /* @__PURE__ */ import_react14.default.createElement("img", { src: "https://fractal-userdata-upload.s3.us-east-1.amazonaws.com/uploaded/merchant_logo/20250311131124_merchant_logo.png", id: "pay-logos" })), /* @__PURE__ */ import_react14.default.createElement("div", { className: "pay-container" }, /* @__PURE__ */ import_react14.default.createElement("div", { className: "pay-header pay-conatiner-one" }, /* @__PURE__ */ import_react14.default.createElement("div", { className: "pay-conatiner-one-first" }, /* @__PURE__ */ import_react14.default.createElement("div", { className: "pay-logo-container" }, /* @__PURE__ */ import_react14.default.createElement("div", { className: "pay-main-logo" }, /* @__PURE__ */ import_react14.default.createElement("img", { src: "https://fractal-userdata-upload.s3.us-east-1.amazonaws.com/uploaded/merchant_logo/20250311131124_merchant_logo.png", id: "pay-logos" })), /* @__PURE__ */ import_react14.default.createElement("h1", { className: "pay-heading" }, "Pay"), (cardList == null ? void 0 : cardList.length) > 0 && activetab !== "cardList" && /* @__PURE__ */ import_react14.default.createElement("button", { className: "res-charge-payment-back-btn ", onClick: () => setActive("cardList") }, " ", /* @__PURE__ */ import_react14.default.createElement(import_io5.IoArrowBack, null), " Back")), /* @__PURE__ */ import_react14.default.createElement("div", { className: "amt-pay-con" }, /* @__PURE__ */ import_react14.default.createElement("div", { className: "pay-amount-conatiner" }, /* @__PURE__ */ import_react14.default.createElement("small", { className: "pay-payment-amount" }, "Payment Amount"), /* @__PURE__ */ import_react14.default.createElement("strong", { className: "pay-amount" }, "$", props == null ? void 0 : props.amount)), activetab != "ach" && /* @__PURE__ */ import_react14.default.createElement("div", { style: { display: "flex", gap: "8px", margin: "8px 0" } }, /* @__PURE__ */ import_react14.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/visa-img.svg", alt: "", width: 33 }), /* @__PURE__ */ import_react14.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/mc-img.svg", width: 33, alt: "" }), /* @__PURE__ */ import_react14.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/ae-img.svg", alt: "", width: 33 }), /* @__PURE__ */ import_react14.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/discover-img.svg", width: 33, alt: "" })))), /* @__PURE__ */ import_react14.default.createElement("div", { className: "pay-conatiner-one-last" }, /* @__PURE__ */ import_react14.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/secure-img.png", alt: "" }), /* @__PURE__ */ import_react14.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/pov-by.png", alt: "" }), "Secure payments powered by Fractal"), /* @__PURE__ */ import_react14.default.createElement("div", null)), /* @__PURE__ */ import_react14.default.createElement("div", { className: "pay-tab pay-conatiner-two" }, !loading && /* @__PURE__ */ import_react14.default.createElement("div", { className: "col-md-12" }, /* @__PURE__ */ import_react14.default.createElement("div", { id: "payment-form-div" }, activetab !== "cardList" ? /* @__PURE__ */ import_react14.default.createElement("div", null, (cardList == null ? void 0 : cardList.length) > 0 && /* @__PURE__ */ import_react14.default.createElement("button", { className: "charge-payment-back-btn ", onClick: () => setActive("cardList") }, " ", /* @__PURE__ */ import_react14.default.createElement(import_io5.IoArrowBack, null), " Back"), (paymentData == null ? void 0 : paymentData.isSkyFiAccount) && /* @__PURE__ */ import_react14.default.createElement("div", { className: "tab" }, /* @__PURE__ */ import_react14.default.createElement("button", { className: "tablinks", onClick: (e) => {
|
|
2722
2839
|
handletabchange("card");
|
|
2723
|
-
}, style: { border: activetab === "card" ? "1px solid" : "" } }, /* @__PURE__ */
|
|
2840
|
+
}, style: { border: activetab === "card" ? "1px solid" : "" } }, /* @__PURE__ */ import_react14.default.createElement("i", { className: "fas fa-credit-card me-2", style: { marginRight: "8px", fontSize: "15px" } }), "Card"), /* @__PURE__ */ import_react14.default.createElement("button", { className: "tablinks", onClick: (e) => {
|
|
2724
2841
|
handletabchange("ach");
|
|
2725
|
-
}, style: { border: activetab === "ach" ? "1px solid" : "" } }, /* @__PURE__ */
|
|
2842
|
+
}, style: { border: activetab === "ach" ? "1px solid" : "" } }, /* @__PURE__ */ import_react14.default.createElement("i", { className: "fas fa-university me-2", style: { marginRight: "8px", fontSize: "15px" } }), "Bank")), /* @__PURE__ */ import_react14.default.createElement("div", { className: "res-pay-con" }, /* @__PURE__ */ import_react14.default.createElement("div", { className: "pay-amount-conatiner", style: { margin: 0 } }, /* @__PURE__ */ import_react14.default.createElement("small", { className: "pay-payment-amount" }, "Payment Amount"), /* @__PURE__ */ import_react14.default.createElement("strong", { className: "pay-amount" }, "$", props == null ? void 0 : props.amount)), activetab != "ach" && /* @__PURE__ */ import_react14.default.createElement("div", null, /* @__PURE__ */ import_react14.default.createElement("div", null, /* @__PURE__ */ import_react14.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/visa-img.svg", alt: "", width: 35, style: { paddingRight: "5px" } }), /* @__PURE__ */ import_react14.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/mc-img.svg", width: 35, alt: "" })), /* @__PURE__ */ import_react14.default.createElement("div", null, /* @__PURE__ */ import_react14.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/ae-img.svg", alt: "", width: 35, style: { paddingRight: "5px" } }), /* @__PURE__ */ import_react14.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/discover-img.svg", width: 35, alt: "" }))))) : /* @__PURE__ */ import_react14.default.createElement("div", null, /* @__PURE__ */ import_react14.default.createElement("h6", { className: "charge-customer-name", style: { marginBottom: "16px !important" } }, " Charge ", paymentData == null ? void 0 : paymentData.customer_name), /* @__PURE__ */ import_react14.default.createElement("h6", { className: "card-ach-heading", style: { marginBottom: "10px !important" } }, " Cards/ACH"), /* @__PURE__ */ import_react14.default.createElement("div", { className: "res-pay-con" }, /* @__PURE__ */ import_react14.default.createElement("div", { className: "pay-amount-conatiner", style: { margin: 0 } }, /* @__PURE__ */ import_react14.default.createElement("small", { className: "pay-payment-amount" }, "Payment Amount"), /* @__PURE__ */ import_react14.default.createElement("strong", { className: "pay-amount" }, "$", props == null ? void 0 : props.amount)), /* @__PURE__ */ import_react14.default.createElement("div", null, /* @__PURE__ */ import_react14.default.createElement("div", null, /* @__PURE__ */ import_react14.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/visa-img.svg", alt: "", width: 35, style: { paddingRight: "5px" } }), /* @__PURE__ */ import_react14.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/mc-img.svg", width: 35, alt: "" })), /* @__PURE__ */ import_react14.default.createElement("div", null, /* @__PURE__ */ import_react14.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/ae-img.svg", alt: "", width: 35, style: { paddingRight: "5px" } }), /* @__PURE__ */ import_react14.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/discover-img.svg", width: 35, alt: "" }))))), /* @__PURE__ */ import_react14.default.createElement("div", { id: "ach", style: { display: activetab === "cardList" ? "block" : "none" }, className: "tabcontent" }, /* @__PURE__ */ import_react14.default.createElement("div", { className: "card-lint-div-in" }, /* @__PURE__ */ import_react14.default.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__ */ import_react14.default.createElement("div", { className: "card-list-single-div", key: index }, /* @__PURE__ */ import_react14.default.createElement("div", { className: "card-number-radio" }, /* @__PURE__ */ import_react14.default.createElement(
|
|
2726
2843
|
"input",
|
|
2727
2844
|
{
|
|
2728
2845
|
type: "radio",
|
|
@@ -2732,12 +2849,12 @@ function GetPaymentPage(props) {
|
|
|
2732
2849
|
checked: selectedCard === card,
|
|
2733
2850
|
onChange: (e) => setSelectedCard(card)
|
|
2734
2851
|
}
|
|
2735
|
-
), /* @__PURE__ */
|
|
2852
|
+
), /* @__PURE__ */ import_react14.default.createElement("label", { htmlFor: "", className: "card-number-last-four" }, "**** ", card == null ? void 0 : card.cardlastfourdigit), /* @__PURE__ */ import_react14.default.createElement("h6", { className: "card-expiry-date" }, card == null ? void 0 : card.expmonth, "/", card == null ? void 0 : card.expyear)), /* @__PURE__ */ import_react14.default.createElement("div", { className: "card-number-radio" }, /* @__PURE__ */ import_react14.default.createElement("span", { className: "visa-card" }, /* @__PURE__ */ import_react14.default.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__ */ import_react14.default.createElement("span", { className: "visa-card", style: { cursor: "pointer" }, onClick: () => handleDeleteCard(card == null ? void 0 : card.id) }, /* @__PURE__ */ import_react14.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/Trash.svg", alt: "" }))))))), /* @__PURE__ */ import_react14.default.createElement("div", { className: "pay-with-other-card ", onClick: () => setActive("card") }, "Pay With Other Card", /* @__PURE__ */ import_react14.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/card.svg", alt: "" }))), /* @__PURE__ */ import_react14.default.createElement("div", { className: "form-group", style: { padding: "0" } }, /* @__PURE__ */ import_react14.default.createElement("button", { className: "pay-button", style: { margin: "0px" }, type: "submit", onClick: handlechargeCustomer }, "$", props == null ? void 0 : props.amount))), /* @__PURE__ */ import_react14.default.createElement("div", { id: "card", style: { display: activetab === "card" ? "block" : "none" }, className: "tabcontent" }, /* @__PURE__ */ import_react14.default.createElement("form", { id: "PaymentForm", style: { textAlign: "start" }, onSubmit: submitFunc }, /* @__PURE__ */ import_react14.default.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__ */ import_react14.default.createElement("div", { className: "form-group" }, /* @__PURE__ */ import_react14.default.createElement("label", { htmlFor: "cardHolderName" }, "NAME ON CARD "), /* @__PURE__ */ import_react14.default.createElement("input", { type: "text", className: "form-control", maxLength: 100, placeholder: "John Doe", value: (cardData == null ? void 0 : cardData.cardName) || "", onChange: (e) => {
|
|
2736
2853
|
const value = e.target.value;
|
|
2737
2854
|
if (/^[a-zA-Z\s]*$/.test(value)) {
|
|
2738
2855
|
handleCardChange("cardName", value);
|
|
2739
2856
|
}
|
|
2740
|
-
} }), (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */
|
|
2857
|
+
} }), (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */ import_react14.default.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.cardName)), /* @__PURE__ */ import_react14.default.createElement("div", { className: "form-group" }, /* @__PURE__ */ import_react14.default.createElement("label", { htmlFor: "cardNumber" }, "CARD NUMBER"), /* @__PURE__ */ import_react14.default.createElement("div", { className: "toggle-num-wrapper" }, /* @__PURE__ */ import_react14.default.createElement(
|
|
2741
2858
|
"input",
|
|
2742
2859
|
{
|
|
2743
2860
|
className: "form-control card-number-new",
|
|
@@ -2749,7 +2866,7 @@ function GetPaymentPage(props) {
|
|
|
2749
2866
|
onChange: (e) => handleCardNumberChange(e),
|
|
2750
2867
|
"data-token": "card_number"
|
|
2751
2868
|
}
|
|
2752
|
-
), /* @__PURE__ */
|
|
2869
|
+
), /* @__PURE__ */ import_react14.default.createElement("div", { className: "card-crdi card-expiry-new" }, /* @__PURE__ */ import_react14.default.createElement("div", { className: "exp-date-year-container" }, /* @__PURE__ */ import_react14.default.createElement("div", { className: "exp-date form-group" }, /* @__PURE__ */ import_react14.default.createElement(
|
|
2753
2870
|
"input",
|
|
2754
2871
|
{
|
|
2755
2872
|
"data-token": "exp_month",
|
|
@@ -2761,7 +2878,7 @@ function GetPaymentPage(props) {
|
|
|
2761
2878
|
value: (cardData == null ? void 0 : cardData.expiryMonth) || "",
|
|
2762
2879
|
onChange: (e) => handleCardChange("expiryMonth", e.target.value)
|
|
2763
2880
|
}
|
|
2764
|
-
)), /* @__PURE__ */
|
|
2881
|
+
)), /* @__PURE__ */ import_react14.default.createElement("div", { className: "exp-year form-group" }, /* @__PURE__ */ import_react14.default.createElement(
|
|
2765
2882
|
"input",
|
|
2766
2883
|
{
|
|
2767
2884
|
"data-token": "exp_year",
|
|
@@ -2773,7 +2890,7 @@ function GetPaymentPage(props) {
|
|
|
2773
2890
|
value: (cardData == null ? void 0 : cardData.expiryYear) || "",
|
|
2774
2891
|
onChange: (e) => handleCardChange("expiryYear", e.target.value)
|
|
2775
2892
|
}
|
|
2776
|
-
)), /* @__PURE__ */
|
|
2893
|
+
)), /* @__PURE__ */ import_react14.default.createElement("div", { className: "security-digit form-group" }, /* @__PURE__ */ import_react14.default.createElement(
|
|
2777
2894
|
"input",
|
|
2778
2895
|
{
|
|
2779
2896
|
"data-token": "cvv",
|
|
@@ -2785,7 +2902,7 @@ function GetPaymentPage(props) {
|
|
|
2785
2902
|
value: (cardData == null ? void 0 : cardData.cvv) || "",
|
|
2786
2903
|
onChange: (e) => handleCardChange("cvv", e.target.value)
|
|
2787
2904
|
}
|
|
2788
|
-
)))), (cardError == null ? void 0 : cardError.cardNumber) && /* @__PURE__ */
|
|
2905
|
+
)))), (cardError == null ? void 0 : cardError.cardNumber) && /* @__PURE__ */ import_react14.default.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.cardNumber), /* @__PURE__ */ import_react14.default.createElement("p", { style: { margin: "0" } }, (cardError == null ? void 0 : cardError.expiryMonth) || (cardError == null ? void 0 : cardError.expiryYear) ? /* @__PURE__ */ import_react14.default.createElement("span", { className: "error-span", style: { paddingRight: "4px" } }, cardError == null ? void 0 : cardError.expiryMonth) : "", (cardError == null ? void 0 : cardError.cvv) && /* @__PURE__ */ import_react14.default.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.cvv)))), /* @__PURE__ */ import_react14.default.createElement("div", { className: "form-group" }, /* @__PURE__ */ import_react14.default.createElement("label", { htmlFor: "OrderId" }, "Order ID / Description"), /* @__PURE__ */ import_react14.default.createElement(
|
|
2789
2906
|
"input",
|
|
2790
2907
|
{
|
|
2791
2908
|
type: "text",
|
|
@@ -2796,7 +2913,7 @@ function GetPaymentPage(props) {
|
|
|
2796
2913
|
value: (_c = props == null ? void 0 : props.orderID) != null ? _c : "",
|
|
2797
2914
|
style: { background: "#F6F6F7", color: "#727272" }
|
|
2798
2915
|
}
|
|
2799
|
-
)), /* @__PURE__ */
|
|
2916
|
+
)), /* @__PURE__ */ import_react14.default.createElement("div", { className: "form-group" }, /* @__PURE__ */ import_react14.default.createElement("label", { htmlFor: "zip" }, "ZIP"), /* @__PURE__ */ import_react14.default.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__ */ import_react14.default.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.zipCode)), (props == null ? void 0 : props.customerId) && /* @__PURE__ */ import_react14.default.createElement("div", { className: "form-group" }, /* @__PURE__ */ import_react14.default.createElement("div", { style: { display: "flex", alignItems: "center", gap: "10px", paddingTop: "10px" } }, /* @__PURE__ */ import_react14.default.createElement(
|
|
2800
2917
|
"input",
|
|
2801
2918
|
{
|
|
2802
2919
|
type: "checkbox",
|
|
@@ -2805,10 +2922,10 @@ function GetPaymentPage(props) {
|
|
|
2805
2922
|
checked: saveCardInfo,
|
|
2806
2923
|
onChange: (e) => setSaveCardInfo(e.target.checked)
|
|
2807
2924
|
}
|
|
2808
|
-
), /* @__PURE__ */
|
|
2925
|
+
), /* @__PURE__ */ import_react14.default.createElement("label", { htmlFor: "save_card", className: "toggle-label" }), /* @__PURE__ */ import_react14.default.createElement("label", { htmlFor: "save_card" }, "Save card for future payments "), /* @__PURE__ */ import_react14.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, /* @__PURE__ */ import_react14.default.createElement("g", { clipPath: "url(#clip0_12420_50192)" }, /* @__PURE__ */ import_react14.default.createElement("rect", { width: "20", height: "20", fill: "white" }), /* @__PURE__ */ import_react14.default.createElement("circle", { cx: "10", cy: "10", r: "10", fill: "#E0DFE2" }), /* @__PURE__ */ import_react14.default.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__ */ import_react14.default.createElement("defs", null, /* @__PURE__ */ import_react14.default.createElement("clipPath", { id: "clip0_12420_50192" }, /* @__PURE__ */ import_react14.default.createElement("rect", { width: "20", height: "20", fill: "white" }))))))), /* @__PURE__ */ import_react14.default.createElement("div", { className: "form-group", style: { marginTop: "20px", padding: "0" } }, /* @__PURE__ */ import_react14.default.createElement("button", { type: "submit", style: { margin: 0 }, className: "pay-button" }, "$", props == null ? void 0 : props.amount)))), /* @__PURE__ */ import_react14.default.createElement("div", { id: "ach", style: { display: activetab === "ach" ? "block" : "none" }, className: "tabcontent" }, /* @__PURE__ */ import_react14.default.createElement("form", { id: "ACHPaymentForm", style: { textAlign: "start" }, onSubmit: submitFunc }, /* @__PURE__ */ import_react14.default.createElement("div", { className: "ach-scrl", style: {
|
|
2809
2926
|
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",
|
|
2810
2927
|
maxHeight: (paymentData == null ? void 0 : paymentData.isSkyFiAccount) && (cardList == null ? void 0 : cardList.length) > 0 ? "358px" : (cardList == null ? void 0 : cardList.length) > 0 ? "380px" : "380px"
|
|
2811
|
-
} }, /* @__PURE__ */
|
|
2928
|
+
} }, /* @__PURE__ */ import_react14.default.createElement("div", { className: "form-group mb-4" }, /* @__PURE__ */ import_react14.default.createElement("label", { htmlFor: "nameonaccount" }, "Name on account"), /* @__PURE__ */ import_react14.default.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__ */ import_react14.default.createElement("span", { className: "error-span" }, achError == null ? void 0 : achError.name)), /* @__PURE__ */ import_react14.default.createElement("div", { className: "form-group mb-4" }, /* @__PURE__ */ import_react14.default.createElement("label", { htmlFor: "routingnumber" }, "Routing number"), /* @__PURE__ */ import_react14.default.createElement(
|
|
2812
2929
|
"input",
|
|
2813
2930
|
{
|
|
2814
2931
|
type: "text",
|
|
@@ -2820,7 +2937,7 @@ function GetPaymentPage(props) {
|
|
|
2820
2937
|
value: (_f = achData == null ? void 0 : achData.routingNumber) != null ? _f : "",
|
|
2821
2938
|
onChange: handleChangeAch
|
|
2822
2939
|
}
|
|
2823
|
-
), (achError == null ? void 0 : achError.routingNumber) && /* @__PURE__ */
|
|
2940
|
+
), (achError == null ? void 0 : achError.routingNumber) && /* @__PURE__ */ import_react14.default.createElement("span", { className: "error-span" }, achError == null ? void 0 : achError.routingNumber)), /* @__PURE__ */ import_react14.default.createElement("div", { className: "form-group mb-4" }, /* @__PURE__ */ import_react14.default.createElement("label", { htmlFor: "accountnumber" }, "Account number"), /* @__PURE__ */ import_react14.default.createElement(
|
|
2824
2941
|
"input",
|
|
2825
2942
|
{
|
|
2826
2943
|
type: "text",
|
|
@@ -2832,7 +2949,7 @@ function GetPaymentPage(props) {
|
|
|
2832
2949
|
value: (_g = achData == null ? void 0 : achData.accountNumber) != null ? _g : "",
|
|
2833
2950
|
onChange: handleChangeAch
|
|
2834
2951
|
}
|
|
2835
|
-
), (achError == null ? void 0 : achError.accountNumber) && /* @__PURE__ */
|
|
2952
|
+
), (achError == null ? void 0 : achError.accountNumber) && /* @__PURE__ */ import_react14.default.createElement("span", { className: "error-span" }, achError == null ? void 0 : achError.accountNumber)), /* @__PURE__ */ import_react14.default.createElement("div", { className: "form-group mb-4" }, /* @__PURE__ */ import_react14.default.createElement("label", { htmlFor: "confirmaccountnumber" }, "Confirm account number"), /* @__PURE__ */ import_react14.default.createElement(
|
|
2836
2953
|
"input",
|
|
2837
2954
|
{
|
|
2838
2955
|
type: "text",
|
|
@@ -2844,7 +2961,7 @@ function GetPaymentPage(props) {
|
|
|
2844
2961
|
value: (_h = achData == null ? void 0 : achData.confirmAccountNumber) != null ? _h : "",
|
|
2845
2962
|
onChange: handleChangeAch
|
|
2846
2963
|
}
|
|
2847
|
-
), (achError == null ? void 0 : achError.confirmAccountNumber) && /* @__PURE__ */
|
|
2964
|
+
), (achError == null ? void 0 : achError.confirmAccountNumber) && /* @__PURE__ */ import_react14.default.createElement("span", { className: "error-span" }, achError == null ? void 0 : achError.confirmAccountNumber)), /* @__PURE__ */ import_react14.default.createElement("div", { className: "form-group mb-4" }, /* @__PURE__ */ import_react14.default.createElement("label", { htmlFor: "bankname" }, "Bank name"), /* @__PURE__ */ import_react14.default.createElement(
|
|
2848
2965
|
"input",
|
|
2849
2966
|
{
|
|
2850
2967
|
type: "text",
|
|
@@ -2856,41 +2973,36 @@ function GetPaymentPage(props) {
|
|
|
2856
2973
|
value: (_i = achData == null ? void 0 : achData.bankName) != null ? _i : "",
|
|
2857
2974
|
onChange: handleChangeAch
|
|
2858
2975
|
}
|
|
2859
|
-
), (achError == null ? void 0 : achError.bankName) && /* @__PURE__ */
|
|
2976
|
+
), (achError == null ? void 0 : achError.bankName) && /* @__PURE__ */ import_react14.default.createElement("span", { className: "error-span" }, achError == null ? void 0 : achError.bankName)), /* @__PURE__ */ import_react14.default.createElement("div", { className: "form-group mb-4" }, /* @__PURE__ */ import_react14.default.createElement("label", { htmlFor: "accounttype" }, "Select account type"), /* @__PURE__ */ import_react14.default.createElement("select", { name: "accountType", id: "accounttype", className: "form-control", value: (_j = achData == null ? void 0 : achData.accountType) != null ? _j : "", onChange: handleChangeAch }, /* @__PURE__ */ import_react14.default.createElement("option", { value: "" }, "Select account"), /* @__PURE__ */ import_react14.default.createElement("option", { value: "Personal Saving" }, "Personal Saving"), /* @__PURE__ */ import_react14.default.createElement("option", { value: "Business Saving" }, "Business Saving"), /* @__PURE__ */ import_react14.default.createElement("option", { value: "Personal Checking" }, "Personal Checking"), /* @__PURE__ */ import_react14.default.createElement("option", { value: "Business Checking" }, "Business Checking"))), /* @__PURE__ */ import_react14.default.createElement("div", { className: "form-group mb-4 save-ach-div", style: { paddingTop: "5px" } }, /* @__PURE__ */ import_react14.default.createElement("input", { type: "checkbox", id: "saveACH", className: "", maxLength: 100, placeholder: "My Bank", checked: saveACHinfo, onChange: (e) => setSaveACHinfo(e.target.checked) }), /* @__PURE__ */ import_react14.default.createElement("label", { htmlFor: "saveACH" }, "Save ACH")), saveACHinfo && /* @__PURE__ */ import_react14.default.createElement("div", { className: "form-group mb-4", style: { fontSize: "12px", color: "#727272" } }, /* @__PURE__ */ import_react14.default.createElement("p", null, "If checked, I agree for ", /* @__PURE__ */ import_react14.default.createElement("b", null, "ecommerce"), " to have my permission to charge this credit card for agreed upon purchases in the future."))), /* @__PURE__ */ import_react14.default.createElement("div", { className: "form-group " }, /* @__PURE__ */ import_react14.default.createElement("button", { className: "pay-button", style: { margin: "20px 0 0" }, type: "submit" }, "$", props == null ? void 0 : props.amount)))))))))))
|
|
2860
2977
|
)));
|
|
2861
2978
|
}
|
|
2862
2979
|
|
|
2863
2980
|
// src/app/components/PreAuthCharge/PreAuthPaymentPage.tsx
|
|
2864
|
-
var
|
|
2981
|
+
var import_react15 = __toESM(require("react"));
|
|
2865
2982
|
var import_axios4 = __toESM(require("axios"));
|
|
2866
2983
|
var import_sweetalert22 = __toESM(require("sweetalert2"));
|
|
2867
2984
|
var import_io52 = require("react-icons/io5");
|
|
2868
2985
|
function PreAuthPayment(props) {
|
|
2869
2986
|
var _a, _b, _c, _d;
|
|
2870
|
-
const [loading, setLoading] = (0,
|
|
2871
|
-
const [
|
|
2872
|
-
const [
|
|
2873
|
-
const [
|
|
2874
|
-
const [
|
|
2987
|
+
const [loading, setLoading] = (0, import_react15.useState)(false);
|
|
2988
|
+
const [error, setError] = (0, import_react15.useState)("");
|
|
2989
|
+
const [success, setSuccess] = (0, import_react15.useState)(false);
|
|
2990
|
+
const [show, setShow] = (0, import_react15.useState)(false);
|
|
2991
|
+
const [activetab, setActive] = (0, import_react15.useState)("card");
|
|
2992
|
+
const [saveCardInfo, setSaveCardInfo] = (0, import_react15.useState)(false);
|
|
2875
2993
|
const fractalpayClientKey = props.fractalpayClientKey;
|
|
2876
|
-
const [cardData, setCardData] = (0,
|
|
2877
|
-
const [cardError, setCardError] = (0,
|
|
2878
|
-
const [cardList, setCardList] = (0,
|
|
2879
|
-
const [selectedCard, setSelectedCard] = (0,
|
|
2880
|
-
const [paymentData, setPaymentData] = (0,
|
|
2881
|
-
let [tranId, setTranId] = (0,
|
|
2994
|
+
const [cardData, setCardData] = (0, import_react15.useState)();
|
|
2995
|
+
const [cardError, setCardError] = (0, import_react15.useState)({});
|
|
2996
|
+
const [cardList, setCardList] = (0, import_react15.useState)([]);
|
|
2997
|
+
const [selectedCard, setSelectedCard] = (0, import_react15.useState)();
|
|
2998
|
+
const [paymentData, setPaymentData] = (0, import_react15.useState)();
|
|
2999
|
+
let [tranId, setTranId] = (0, import_react15.useState)("");
|
|
2882
3000
|
const showLoader = () => setLoading(true);
|
|
2883
3001
|
const hideLoader = () => setLoading(false);
|
|
2884
|
-
const showError = (msz) => {
|
|
2885
|
-
import_sweetalert22.default.fire({
|
|
2886
|
-
icon: "error",
|
|
2887
|
-
title: "Oops...",
|
|
2888
|
-
text: msz
|
|
2889
|
-
});
|
|
2890
|
-
};
|
|
2891
3002
|
const handleClose = () => {
|
|
2892
3003
|
setShow(false);
|
|
2893
3004
|
setActive("card");
|
|
3005
|
+
setError("");
|
|
2894
3006
|
setSuccess(false);
|
|
2895
3007
|
setTranId("");
|
|
2896
3008
|
setCardData({
|
|
@@ -3018,7 +3130,7 @@ function PreAuthPayment(props) {
|
|
|
3018
3130
|
let tokenCallback = async function(response) {
|
|
3019
3131
|
var _a3, _b3, _c3, _d3;
|
|
3020
3132
|
if (response.Error) {
|
|
3021
|
-
|
|
3133
|
+
setError(response.Error);
|
|
3022
3134
|
hideLoader();
|
|
3023
3135
|
} else {
|
|
3024
3136
|
let name = cardData == null ? void 0 : cardData.cardName;
|
|
@@ -3051,7 +3163,7 @@ function PreAuthPayment(props) {
|
|
|
3051
3163
|
} catch (err) {
|
|
3052
3164
|
console.log(err);
|
|
3053
3165
|
hideLoader();
|
|
3054
|
-
|
|
3166
|
+
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..");
|
|
3055
3167
|
}
|
|
3056
3168
|
}
|
|
3057
3169
|
};
|
|
@@ -3126,30 +3238,30 @@ function PreAuthPayment(props) {
|
|
|
3126
3238
|
}
|
|
3127
3239
|
} catch (err) {
|
|
3128
3240
|
hideLoader();
|
|
3129
|
-
|
|
3241
|
+
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");
|
|
3130
3242
|
}
|
|
3131
3243
|
} catch (err) {
|
|
3132
3244
|
console.log(err);
|
|
3133
3245
|
hideLoader();
|
|
3134
|
-
|
|
3246
|
+
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");
|
|
3135
3247
|
}
|
|
3136
3248
|
} catch (err) {
|
|
3137
3249
|
hideLoader();
|
|
3138
|
-
|
|
3250
|
+
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");
|
|
3139
3251
|
}
|
|
3140
3252
|
} else {
|
|
3141
3253
|
DatacapWebToken.requestToken(paymentData == null ? void 0 : paymentData.dctoken, "PaymentForm", tokenCallback);
|
|
3142
3254
|
}
|
|
3143
3255
|
} catch (err) {
|
|
3144
3256
|
hideLoader();
|
|
3145
|
-
|
|
3257
|
+
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.");
|
|
3146
3258
|
}
|
|
3147
3259
|
}
|
|
3148
3260
|
}
|
|
3149
3261
|
}
|
|
3150
3262
|
};
|
|
3151
3263
|
const getPaymentDetails = async () => {
|
|
3152
|
-
var _a2, _b2, _c2, _d2, _e, _f, _g, _h, _i, _j, _k, _l, _m;
|
|
3264
|
+
var _a2, _b2, _c2, _d2, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o;
|
|
3153
3265
|
showLoader();
|
|
3154
3266
|
try {
|
|
3155
3267
|
const data = {
|
|
@@ -3161,7 +3273,7 @@ function PreAuthPayment(props) {
|
|
|
3161
3273
|
setPaymentData((_a2 = paymentData2 == null ? void 0 : paymentData2.data) == null ? void 0 : _a2.data);
|
|
3162
3274
|
if (!((_c2 = (_b2 = paymentData2 == null ? void 0 : paymentData2.data) == null ? void 0 : _b2.data) == null ? void 0 : _c2.paymentGateway)) {
|
|
3163
3275
|
handleClose();
|
|
3164
|
-
|
|
3276
|
+
setError("Something went wrong.");
|
|
3165
3277
|
}
|
|
3166
3278
|
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) {
|
|
3167
3279
|
setCardList((_j = (_i = paymentData2 == null ? void 0 : paymentData2.data) == null ? void 0 : _i.data) == null ? void 0 : _j.card_list);
|
|
@@ -3176,10 +3288,8 @@ function PreAuthPayment(props) {
|
|
|
3176
3288
|
hideLoader();
|
|
3177
3289
|
} catch (err) {
|
|
3178
3290
|
console.log(err);
|
|
3179
|
-
setActive("card");
|
|
3180
3291
|
hideLoader();
|
|
3181
|
-
|
|
3182
|
-
showError("Something went wrong , Try again later");
|
|
3292
|
+
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");
|
|
3183
3293
|
}
|
|
3184
3294
|
};
|
|
3185
3295
|
const handlechargeCustomer = async () => {
|
|
@@ -3224,19 +3334,19 @@ function PreAuthPayment(props) {
|
|
|
3224
3334
|
} catch (err) {
|
|
3225
3335
|
hideLoader();
|
|
3226
3336
|
console.log(err);
|
|
3227
|
-
|
|
3337
|
+
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");
|
|
3228
3338
|
}
|
|
3229
3339
|
} else {
|
|
3230
|
-
|
|
3340
|
+
setError("Please Select A Card/ACH");
|
|
3231
3341
|
}
|
|
3232
3342
|
} else {
|
|
3233
|
-
|
|
3343
|
+
setError("Please Select Customer");
|
|
3234
3344
|
}
|
|
3235
3345
|
} else {
|
|
3236
|
-
|
|
3346
|
+
setError("Something went wrong.");
|
|
3237
3347
|
}
|
|
3238
3348
|
};
|
|
3239
|
-
(0,
|
|
3349
|
+
(0, import_react15.useEffect)(() => {
|
|
3240
3350
|
if (show && fractalpayClientKey) {
|
|
3241
3351
|
getPaymentDetails();
|
|
3242
3352
|
}
|
|
@@ -3292,21 +3402,22 @@ function PreAuthPayment(props) {
|
|
|
3292
3402
|
}
|
|
3293
3403
|
});
|
|
3294
3404
|
};
|
|
3295
|
-
return /* @__PURE__ */
|
|
3405
|
+
return /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, /* @__PURE__ */ import_react15.default.createElement(DataScript, null), /* @__PURE__ */ import_react15.default.createElement(Chargewidgetstyles, null), /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, /* @__PURE__ */ import_react15.default.createElement(
|
|
3296
3406
|
"button",
|
|
3297
3407
|
{
|
|
3298
3408
|
className: "paymentBtn",
|
|
3299
3409
|
onClick: handleShow
|
|
3300
3410
|
},
|
|
3301
3411
|
"Pre Auth Pay"
|
|
3302
|
-
), /* @__PURE__ */
|
|
3412
|
+
), /* @__PURE__ */ import_react15.default.createElement(
|
|
3303
3413
|
CustomModal2_default,
|
|
3304
3414
|
{
|
|
3305
3415
|
open: show,
|
|
3306
3416
|
onClose: handleClose
|
|
3307
3417
|
},
|
|
3308
|
-
/* @__PURE__ */
|
|
3309
|
-
success
|
|
3418
|
+
error && /* @__PURE__ */ import_react15.default.createElement("div", { style: { maxHeight: "606px", minHeight: "60vh", padding: "40px" } }, /* @__PURE__ */ import_react15.default.createElement(ErrorCardMessage_default, { error, onClose: handleClose })),
|
|
3419
|
+
success && /* @__PURE__ */ import_react15.default.createElement(SuccessMsz, { onClose: handleClose, tranId }),
|
|
3420
|
+
!error && !success && /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, loading && /* @__PURE__ */ import_react15.default.createElement(Loader_default, { loading }), /* @__PURE__ */ import_react15.default.createElement("div", null, /* @__PURE__ */ import_react15.default.createElement("div", { className: "frac-card-payment-page frac-form" }, /* @__PURE__ */ import_react15.default.createElement("div", { className: "parent-pay-container" }, /* @__PURE__ */ import_react15.default.createElement("span", { className: "request-payment-close-popup", onClick: handleClose }, /* @__PURE__ */ import_react15.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, /* @__PURE__ */ import_react15.default.createElement("g", { clipPath: "url(#clip0_12425_52336)" }, /* @__PURE__ */ import_react15.default.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__ */ import_react15.default.createElement("defs", null, /* @__PURE__ */ import_react15.default.createElement("clipPath", { id: "clip0_12425_52336" }, /* @__PURE__ */ import_react15.default.createElement("rect", { width: "16", height: "16", fill: "white" }))))), /* @__PURE__ */ import_react15.default.createElement("div", { className: "pay-container" }, /* @__PURE__ */ import_react15.default.createElement("div", { className: "pay-header pay-conatiner-one" }, /* @__PURE__ */ import_react15.default.createElement("div", { className: "pay-conatiner-one-first" }, /* @__PURE__ */ import_react15.default.createElement("div", { className: "pay-logo-container" }, /* @__PURE__ */ import_react15.default.createElement("div", { className: "pay-main-logo" }, /* @__PURE__ */ import_react15.default.createElement("img", { src: "https://fractal-userdata-upload.s3.us-east-1.amazonaws.com/uploaded/merchant_logo/20250311131124_merchant_logo.png", id: "pay-logos" })), /* @__PURE__ */ import_react15.default.createElement("h1", { className: "pay-heading" }, "Pay"), (cardList == null ? void 0 : cardList.length) > 0 && activetab !== "cardList" && /* @__PURE__ */ import_react15.default.createElement("button", { className: "res-charge-payment-back-btn ", onClick: () => setActive("cardList") }, " ", /* @__PURE__ */ import_react15.default.createElement(import_io52.IoArrowBack, null), " Back")), /* @__PURE__ */ import_react15.default.createElement("div", { className: "amt-pay-con" }, /* @__PURE__ */ import_react15.default.createElement("div", { className: "pay-amount-conatiner" }, /* @__PURE__ */ import_react15.default.createElement("small", { className: "pay-payment-amount" }, "Payment Amount"), /* @__PURE__ */ import_react15.default.createElement("strong", { className: "pay-amount" }, "$", props == null ? void 0 : props.amount)), activetab != "ach" && /* @__PURE__ */ import_react15.default.createElement("div", { style: { display: "flex", gap: "8px", margin: "8px 0" } }, /* @__PURE__ */ import_react15.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/visa-img.svg", alt: "", width: 33 }), /* @__PURE__ */ import_react15.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/mc-img.svg", width: 33, alt: "" }), /* @__PURE__ */ import_react15.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/ae-img.svg", alt: "", width: 33 }), /* @__PURE__ */ import_react15.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/discover-img.svg", width: 33, alt: "" })))), /* @__PURE__ */ import_react15.default.createElement("div", { className: "pay-conatiner-one-last" }, /* @__PURE__ */ import_react15.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/secure-img.png", alt: "" }), /* @__PURE__ */ import_react15.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/pov-by.png", alt: "" }), "Secure payments powered by Fractal"), /* @__PURE__ */ import_react15.default.createElement("div", null)), !loading && /* @__PURE__ */ import_react15.default.createElement("div", { className: "pay-tab pay-conatiner-two" }, /* @__PURE__ */ import_react15.default.createElement("div", { className: "col-md-12" }, /* @__PURE__ */ import_react15.default.createElement("div", { id: "payment-form-div" }, activetab !== "cardList" ? /* @__PURE__ */ import_react15.default.createElement("div", null, (cardList == null ? void 0 : cardList.length) > 0 && /* @__PURE__ */ import_react15.default.createElement("button", { className: "charge-payment-back-btn ", onClick: () => setActive("cardList") }, " ", /* @__PURE__ */ import_react15.default.createElement(import_io52.IoArrowBack, null), " Back"), /* @__PURE__ */ import_react15.default.createElement("div", { className: "" }, /* @__PURE__ */ import_react15.default.createElement("div", { className: "res-pay-con" }, /* @__PURE__ */ import_react15.default.createElement("div", { className: "pay-amount-conatiner", style: { margin: 0 } }, /* @__PURE__ */ import_react15.default.createElement("small", { className: "pay-payment-amount" }, "Payment Amount"), /* @__PURE__ */ import_react15.default.createElement("strong", { className: "pay-amount" }, "$", props == null ? void 0 : props.amount)), /* @__PURE__ */ import_react15.default.createElement("div", null, /* @__PURE__ */ import_react15.default.createElement("div", null, /* @__PURE__ */ import_react15.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/visa-img.svg", alt: "", width: 35, style: { paddingRight: "5px" } }), /* @__PURE__ */ import_react15.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/mc-img.svg", width: 35, alt: "" })), /* @__PURE__ */ import_react15.default.createElement("div", null, /* @__PURE__ */ import_react15.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/ae-img.svg", alt: "", width: 35, style: { paddingRight: "5px" } }), /* @__PURE__ */ import_react15.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/discover-img.svg", width: 35, alt: "" })))))) : /* @__PURE__ */ import_react15.default.createElement("div", null, /* @__PURE__ */ import_react15.default.createElement("h6", { className: "charge-customer-name", style: { marginBottom: "16px !important" } }, " Charge ", paymentData == null ? void 0 : paymentData.customer_name), /* @__PURE__ */ import_react15.default.createElement("div", { className: "res-pay-con" }, /* @__PURE__ */ import_react15.default.createElement("div", { className: "pay-amount-conatiner", style: { margin: 0 } }, /* @__PURE__ */ import_react15.default.createElement("small", { className: "pay-payment-amount" }, "Payment Amount"), /* @__PURE__ */ import_react15.default.createElement("strong", { className: "pay-amount" }, "$", props == null ? void 0 : props.amount)), /* @__PURE__ */ import_react15.default.createElement("div", null, /* @__PURE__ */ import_react15.default.createElement("div", null, /* @__PURE__ */ import_react15.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/visa-img.svg", alt: "", width: 35, style: { paddingRight: "5px" } }), /* @__PURE__ */ import_react15.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/mc-img.svg", width: 35, alt: "" })), /* @__PURE__ */ import_react15.default.createElement("div", null, /* @__PURE__ */ import_react15.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/ae-img.svg", alt: "", width: 35, style: { paddingRight: "5px" } }), /* @__PURE__ */ import_react15.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/discover-img.svg", width: 35, alt: "" })))), /* @__PURE__ */ import_react15.default.createElement("h6", { className: "card-ach-heading", style: { marginBottom: "10px !important" } }, " Cards")), /* @__PURE__ */ import_react15.default.createElement("div", { style: { display: activetab === "cardList" ? "block" : "none" }, className: "tabcontent" }, /* @__PURE__ */ import_react15.default.createElement("div", { className: "card-lint-div-in" }, /* @__PURE__ */ import_react15.default.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__ */ import_react15.default.createElement("div", { className: "card-list-single-div", key: index }, /* @__PURE__ */ import_react15.default.createElement("div", { className: "card-number-radio" }, /* @__PURE__ */ import_react15.default.createElement(
|
|
3310
3421
|
"input",
|
|
3311
3422
|
{
|
|
3312
3423
|
type: "radio",
|
|
@@ -3316,7 +3427,7 @@ function PreAuthPayment(props) {
|
|
|
3316
3427
|
checked: selectedCard === card,
|
|
3317
3428
|
onChange: (e) => setSelectedCard(card)
|
|
3318
3429
|
}
|
|
3319
|
-
), /* @__PURE__ */
|
|
3430
|
+
), /* @__PURE__ */ import_react15.default.createElement("label", { htmlFor: "", className: "card-number-last-four" }, "**** ", card == null ? void 0 : card.cardlastfourdigit), /* @__PURE__ */ import_react15.default.createElement("h6", { className: "card-expiry-date" }, card == null ? void 0 : card.expmonth, "/", card == null ? void 0 : card.expyear)), /* @__PURE__ */ import_react15.default.createElement("div", { className: "card-number-radio" }, /* @__PURE__ */ import_react15.default.createElement("span", { className: "visa-card" }, /* @__PURE__ */ import_react15.default.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__ */ import_react15.default.createElement("span", { className: "visa-card", style: { cursor: "pointer" }, onClick: () => handleDeleteCard(card == null ? void 0 : card.id) }, /* @__PURE__ */ import_react15.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/Trash.svg", alt: "" }))))))), /* @__PURE__ */ import_react15.default.createElement("div", { className: "pay-with-other-card ", onClick: () => setActive("card") }, "Authorize With Other Card", /* @__PURE__ */ import_react15.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/card.svg", alt: "" }))), /* @__PURE__ */ import_react15.default.createElement("div", { className: "form-group" }, /* @__PURE__ */ import_react15.default.createElement("button", { className: "pay-button", style: { margin: "0px" }, type: "submit", onClick: handlechargeCustomer }, "$", props == null ? void 0 : props.amount))), /* @__PURE__ */ import_react15.default.createElement("div", { id: "card", style: { display: activetab === "card" ? "block" : "none" }, className: "tabcontent" }, /* @__PURE__ */ import_react15.default.createElement("form", { id: "PaymentForm", onSubmit: submitFunc }, /* @__PURE__ */ import_react15.default.createElement("div", { className: "ach-scrl", style: { minHeight: (cardList == null ? void 0 : cardList.length) > 0 ? "462px" : "520px", overflow: "auto", marginRight: "5px" } }, /* @__PURE__ */ import_react15.default.createElement("div", { className: "form-group" }, /* @__PURE__ */ import_react15.default.createElement("label", { htmlFor: "cardHolderName" }, "Name on Card"), /* @__PURE__ */ import_react15.default.createElement(
|
|
3320
3431
|
"input",
|
|
3321
3432
|
{
|
|
3322
3433
|
type: "text",
|
|
@@ -3330,7 +3441,7 @@ function PreAuthPayment(props) {
|
|
|
3330
3441
|
}
|
|
3331
3442
|
}
|
|
3332
3443
|
}
|
|
3333
|
-
), (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */
|
|
3444
|
+
), (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */ import_react15.default.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.cardName)), /* @__PURE__ */ import_react15.default.createElement("div", { className: "form-group" }, /* @__PURE__ */ import_react15.default.createElement("label", { htmlFor: "cardNumber" }, "Card Number"), /* @__PURE__ */ import_react15.default.createElement("div", { className: "toggle-num-wrapper" }, /* @__PURE__ */ import_react15.default.createElement(
|
|
3334
3445
|
"input",
|
|
3335
3446
|
{
|
|
3336
3447
|
className: "form-control card-number-new",
|
|
@@ -3342,7 +3453,7 @@ function PreAuthPayment(props) {
|
|
|
3342
3453
|
onChange: (e) => handleCardNumberChange(e),
|
|
3343
3454
|
"data-token": "card_number"
|
|
3344
3455
|
}
|
|
3345
|
-
), /* @__PURE__ */
|
|
3456
|
+
), /* @__PURE__ */ import_react15.default.createElement("div", { className: "card-crdi card-expiry-new" }, /* @__PURE__ */ import_react15.default.createElement("div", { className: "exp-date-year-container" }, /* @__PURE__ */ import_react15.default.createElement("div", { className: "exp-date form-group" }, /* @__PURE__ */ import_react15.default.createElement(
|
|
3346
3457
|
"input",
|
|
3347
3458
|
{
|
|
3348
3459
|
"data-token": "exp_month",
|
|
@@ -3354,7 +3465,7 @@ function PreAuthPayment(props) {
|
|
|
3354
3465
|
value: (cardData == null ? void 0 : cardData.expiryMonth) || "",
|
|
3355
3466
|
onChange: (e) => handleCardChange("expiryMonth", e.target.value)
|
|
3356
3467
|
}
|
|
3357
|
-
)), /* @__PURE__ */
|
|
3468
|
+
)), /* @__PURE__ */ import_react15.default.createElement("div", { className: "exp-year form-group" }, /* @__PURE__ */ import_react15.default.createElement(
|
|
3358
3469
|
"input",
|
|
3359
3470
|
{
|
|
3360
3471
|
"data-token": "exp_year",
|
|
@@ -3366,7 +3477,7 @@ function PreAuthPayment(props) {
|
|
|
3366
3477
|
value: (cardData == null ? void 0 : cardData.expiryYear) || "",
|
|
3367
3478
|
onChange: (e) => handleCardChange("expiryYear", e.target.value)
|
|
3368
3479
|
}
|
|
3369
|
-
)), /* @__PURE__ */
|
|
3480
|
+
)), /* @__PURE__ */ import_react15.default.createElement("div", { className: "security-digit form-group" }, /* @__PURE__ */ import_react15.default.createElement(
|
|
3370
3481
|
"input",
|
|
3371
3482
|
{
|
|
3372
3483
|
"data-token": "cvv",
|
|
@@ -3378,7 +3489,7 @@ function PreAuthPayment(props) {
|
|
|
3378
3489
|
value: (cardData == null ? void 0 : cardData.cvv) || "",
|
|
3379
3490
|
onChange: (e) => handleCardChange("cvv", e.target.value)
|
|
3380
3491
|
}
|
|
3381
|
-
)))), (cardError == null ? void 0 : cardError.cardNumber) && /* @__PURE__ */
|
|
3492
|
+
)))), (cardError == null ? void 0 : cardError.cardNumber) && /* @__PURE__ */ import_react15.default.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.cardNumber), /* @__PURE__ */ import_react15.default.createElement("p", { style: { margin: "0" } }, (cardError == null ? void 0 : cardError.expiryMonth) || (cardError == null ? void 0 : cardError.expiryYear) ? /* @__PURE__ */ import_react15.default.createElement("span", { className: "error-span", style: { paddingRight: "4px" } }, cardError == null ? void 0 : cardError.expiryMonth) : "", (cardError == null ? void 0 : cardError.cvv) && /* @__PURE__ */ import_react15.default.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.cvv)))), /* @__PURE__ */ import_react15.default.createElement("div", { className: "form-group" }, /* @__PURE__ */ import_react15.default.createElement("label", { htmlFor: "OrderId" }, "Order ID / Description"), /* @__PURE__ */ import_react15.default.createElement(
|
|
3382
3493
|
"input",
|
|
3383
3494
|
{
|
|
3384
3495
|
type: "text",
|
|
@@ -3390,7 +3501,7 @@ function PreAuthPayment(props) {
|
|
|
3390
3501
|
onChange: (e) => handleCardChange("orderId", e.target.value),
|
|
3391
3502
|
style: { background: "#F6F6F7", color: "#727272" }
|
|
3392
3503
|
}
|
|
3393
|
-
)), /* @__PURE__ */
|
|
3504
|
+
)), /* @__PURE__ */ import_react15.default.createElement("div", { className: "form-group" }, /* @__PURE__ */ import_react15.default.createElement("label", { htmlFor: "zip" }, "ZIP"), /* @__PURE__ */ import_react15.default.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__ */ import_react15.default.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.zipCode)), (props == null ? void 0 : props.customerId) && /* @__PURE__ */ import_react15.default.createElement("div", { className: "form-group" }, /* @__PURE__ */ import_react15.default.createElement("div", { style: { display: "flex", alignItems: "center", gap: "10px", paddingTop: "10px" } }, /* @__PURE__ */ import_react15.default.createElement(
|
|
3394
3505
|
"input",
|
|
3395
3506
|
{
|
|
3396
3507
|
type: "checkbox",
|
|
@@ -3399,23 +3510,23 @@ function PreAuthPayment(props) {
|
|
|
3399
3510
|
checked: saveCardInfo,
|
|
3400
3511
|
onChange: (e) => setSaveCardInfo(e.target.checked)
|
|
3401
3512
|
}
|
|
3402
|
-
), /* @__PURE__ */
|
|
3513
|
+
), /* @__PURE__ */ import_react15.default.createElement("label", { htmlFor: "save_card", className: "toggle-label" }), /* @__PURE__ */ import_react15.default.createElement("label", { htmlFor: "save_card" }, "Save card for future payments "), /* @__PURE__ */ import_react15.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, /* @__PURE__ */ import_react15.default.createElement("g", { clipPath: "url(#clip0_12420_50192)" }, /* @__PURE__ */ import_react15.default.createElement("rect", { width: "20", height: "20", fill: "white" }), /* @__PURE__ */ import_react15.default.createElement("circle", { cx: "10", cy: "10", r: "10", fill: "#E0DFE2" }), /* @__PURE__ */ import_react15.default.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__ */ import_react15.default.createElement("defs", null, /* @__PURE__ */ import_react15.default.createElement("clipPath", { id: "clip0_12420_50192" }, /* @__PURE__ */ import_react15.default.createElement("rect", { width: "20", height: "20", fill: "white" }))))))), /* @__PURE__ */ import_react15.default.createElement("div", { className: "form-group", style: { marginTop: "20px", padding: 0 } }, /* @__PURE__ */ import_react15.default.createElement("button", { type: "submit", style: { margin: 0 }, className: "pay-button" }, "$", props == null ? void 0 : props.amount))))))))))))
|
|
3403
3514
|
)));
|
|
3404
3515
|
}
|
|
3405
3516
|
|
|
3406
3517
|
// src/app/components/AddCard/AddCard.tsx
|
|
3407
|
-
var
|
|
3518
|
+
var import_react20 = __toESM(require("react"));
|
|
3408
3519
|
var import_sweetalert23 = __toESM(require("sweetalert2"));
|
|
3409
3520
|
var import_axios5 = __toESM(require("axios"));
|
|
3410
3521
|
|
|
3411
3522
|
// src/app/components/AddCard/AddCardStyles.tsx
|
|
3412
|
-
var
|
|
3523
|
+
var import_react16 = __toESM(require("react"));
|
|
3413
3524
|
function AddCardStyle() {
|
|
3414
3525
|
const primarycolor = "#000";
|
|
3415
3526
|
const primarybgcolor = "#fff";
|
|
3416
3527
|
const primarybodycolor = "#212529";
|
|
3417
3528
|
const primarybordercolor = "#dee2e6";
|
|
3418
|
-
return /* @__PURE__ */
|
|
3529
|
+
return /* @__PURE__ */ import_react16.default.createElement("style", null, `
|
|
3419
3530
|
.add-card {
|
|
3420
3531
|
max-width:380px;
|
|
3421
3532
|
padding: 0 20px
|
|
@@ -3678,14 +3789,14 @@ function AddCardStyle() {
|
|
|
3678
3789
|
}
|
|
3679
3790
|
|
|
3680
3791
|
// src/app/components/CustomModal/CustomModal.tsx
|
|
3681
|
-
var
|
|
3792
|
+
var import_react17 = __toESM(require("react"));
|
|
3682
3793
|
var CustomModal = ({
|
|
3683
3794
|
open,
|
|
3684
3795
|
onClose,
|
|
3685
3796
|
children
|
|
3686
3797
|
}) => {
|
|
3687
3798
|
if (!open) return null;
|
|
3688
|
-
return /* @__PURE__ */
|
|
3799
|
+
return /* @__PURE__ */ import_react17.default.createElement("div", { style: {
|
|
3689
3800
|
position: "fixed",
|
|
3690
3801
|
top: 0,
|
|
3691
3802
|
left: 0,
|
|
@@ -3696,17 +3807,17 @@ var CustomModal = ({
|
|
|
3696
3807
|
display: "flex",
|
|
3697
3808
|
justifyContent: "center",
|
|
3698
3809
|
alignItems: "center"
|
|
3699
|
-
} }, /* @__PURE__ */
|
|
3810
|
+
} }, /* @__PURE__ */ import_react17.default.createElement("div", { style: { background: "white", padding: "20px", borderRadius: "8px", minWidth: "300px" } }, /* @__PURE__ */ import_react17.default.createElement("div", { className: "", style: { display: "flex", justifyContent: "end" } }, /* @__PURE__ */ import_react17.default.createElement("button", { onClick: onClose, style: { border: "none", background: "transparent", color: "black" } }, "X")), /* @__PURE__ */ import_react17.default.createElement("div", null, children)));
|
|
3700
3811
|
};
|
|
3701
3812
|
var CustomModal_default = CustomModal;
|
|
3702
3813
|
|
|
3703
3814
|
// src/app/components/SuccessCardMessage/SuccessCardMsz.tsx
|
|
3704
|
-
var
|
|
3815
|
+
var import_react19 = __toESM(require("react"));
|
|
3705
3816
|
|
|
3706
3817
|
// src/app/components/SuccessCardMessage/SuccessCardMszStyle.tsx
|
|
3707
|
-
var
|
|
3818
|
+
var import_react18 = __toESM(require("react"));
|
|
3708
3819
|
function SuccessCardMszStyle() {
|
|
3709
|
-
return /* @__PURE__ */
|
|
3820
|
+
return /* @__PURE__ */ import_react18.default.createElement("style", null, `
|
|
3710
3821
|
.card-success .logo-container {
|
|
3711
3822
|
display: flex;
|
|
3712
3823
|
justify-content: center;
|
|
@@ -3799,19 +3910,19 @@ function SuccessCardMszStyle() {
|
|
|
3799
3910
|
|
|
3800
3911
|
// src/app/components/SuccessCardMessage/SuccessCardMsz.tsx
|
|
3801
3912
|
var SuccessCardMsz = ({ onClose }) => {
|
|
3802
|
-
return /* @__PURE__ */
|
|
3913
|
+
return /* @__PURE__ */ import_react19.default.createElement(import_react19.default.Fragment, null, /* @__PURE__ */ import_react19.default.createElement(SuccessCardMszStyle, null), /* @__PURE__ */ import_react19.default.createElement("div", { className: "card-success" }, /* @__PURE__ */ import_react19.default.createElement("div", { className: "payment-success-container" }, /* @__PURE__ */ import_react19.default.createElement("div", { className: "success-icon" }, /* @__PURE__ */ import_react19.default.createElement("div", { className: "circle" }, /* @__PURE__ */ import_react19.default.createElement("i", { className: "fa fa-check-circle", "aria-hidden": "true" })), /* @__PURE__ */ import_react19.default.createElement("div", { className: "success-text" }, /* @__PURE__ */ import_react19.default.createElement("div", { className: "payment-success-text" }, "Your card was added successfully."), /* @__PURE__ */ import_react19.default.createElement("div", { className: "thank-you-text" }, "Thank you "))))));
|
|
3803
3914
|
};
|
|
3804
3915
|
var SuccessCardMsz_default = SuccessCardMsz;
|
|
3805
3916
|
|
|
3806
3917
|
// src/app/components/AddCard/AddCard.tsx
|
|
3807
3918
|
function AddCard(props) {
|
|
3808
3919
|
var _a;
|
|
3809
|
-
const [loading, setLoading] = (0,
|
|
3810
|
-
const [success, setSuccess] = (0,
|
|
3811
|
-
const [show, setShow] = (0,
|
|
3812
|
-
const [cardData, setCardData] = (0,
|
|
3813
|
-
const [cardError, setCardError] = (0,
|
|
3814
|
-
const [paymentData, setPaymentData] = (0,
|
|
3920
|
+
const [loading, setLoading] = (0, import_react20.useState)(false);
|
|
3921
|
+
const [success, setSuccess] = (0, import_react20.useState)(false);
|
|
3922
|
+
const [show, setShow] = (0, import_react20.useState)(false);
|
|
3923
|
+
const [cardData, setCardData] = (0, import_react20.useState)();
|
|
3924
|
+
const [cardError, setCardError] = (0, import_react20.useState)({});
|
|
3925
|
+
const [paymentData, setPaymentData] = (0, import_react20.useState)();
|
|
3815
3926
|
const showLoader = () => setLoading(true);
|
|
3816
3927
|
const hideLoader = () => setLoading(false);
|
|
3817
3928
|
const showError = (msz) => {
|
|
@@ -3941,7 +4052,7 @@ function AddCard(props) {
|
|
|
3941
4052
|
showError("Something went wrong , Try again later");
|
|
3942
4053
|
}
|
|
3943
4054
|
};
|
|
3944
|
-
(0,
|
|
4055
|
+
(0, import_react20.useEffect)(() => {
|
|
3945
4056
|
if (show && props.fractalpayClientKey) {
|
|
3946
4057
|
getPaymentDetails();
|
|
3947
4058
|
}
|
|
@@ -4086,27 +4197,27 @@ function AddCard(props) {
|
|
|
4086
4197
|
}
|
|
4087
4198
|
}
|
|
4088
4199
|
};
|
|
4089
|
-
return /* @__PURE__ */
|
|
4200
|
+
return /* @__PURE__ */ import_react20.default.createElement(import_react20.default.Fragment, null, /* @__PURE__ */ import_react20.default.createElement(DataScript, null), /* @__PURE__ */ import_react20.default.createElement(AddCardStyle, null), /* @__PURE__ */ import_react20.default.createElement(
|
|
4090
4201
|
"button",
|
|
4091
4202
|
{
|
|
4092
4203
|
className: "paymentBtn",
|
|
4093
4204
|
onClick: handleShow
|
|
4094
4205
|
},
|
|
4095
4206
|
"Add Card"
|
|
4096
|
-
), /* @__PURE__ */
|
|
4207
|
+
), /* @__PURE__ */ import_react20.default.createElement(
|
|
4097
4208
|
CustomModal_default,
|
|
4098
4209
|
{
|
|
4099
4210
|
open: show,
|
|
4100
4211
|
onClose: handleClose
|
|
4101
4212
|
},
|
|
4102
|
-
/* @__PURE__ */
|
|
4103
|
-
success ? /* @__PURE__ */
|
|
4213
|
+
/* @__PURE__ */ import_react20.default.createElement(Loader_default, { loading }),
|
|
4214
|
+
success ? /* @__PURE__ */ import_react20.default.createElement(SuccessCardMsz_default, { onClose: handleClose }) : /* @__PURE__ */ import_react20.default.createElement(
|
|
4104
4215
|
"div",
|
|
4105
4216
|
{
|
|
4106
4217
|
className: "container-creditcard add-card modal-content frac-form",
|
|
4107
4218
|
id: "add-credit-card-panel"
|
|
4108
4219
|
},
|
|
4109
|
-
/* @__PURE__ */
|
|
4220
|
+
/* @__PURE__ */ import_react20.default.createElement("form", { id: "creditCardForm", onSubmit: addCardFunc }, /* @__PURE__ */ import_react20.default.createElement("div", { className: "form-group", style: { marginTop: "0", marginBottom: "10px" } }, /* @__PURE__ */ import_react20.default.createElement("label", { htmlFor: "cardNumber" }, "Card Number"), /* @__PURE__ */ import_react20.default.createElement(
|
|
4110
4221
|
"input",
|
|
4111
4222
|
{
|
|
4112
4223
|
type: "text",
|
|
@@ -4117,7 +4228,7 @@ function AddCard(props) {
|
|
|
4117
4228
|
value: (cardData == null ? void 0 : cardData.cardNumber) || "",
|
|
4118
4229
|
onChange: (e) => handleCardNumberChange(e)
|
|
4119
4230
|
}
|
|
4120
|
-
), (cardError == null ? void 0 : cardError.cardNumber) && /* @__PURE__ */
|
|
4231
|
+
), (cardError == null ? void 0 : cardError.cardNumber) && /* @__PURE__ */ import_react20.default.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.cardNumber)), /* @__PURE__ */ import_react20.default.createElement("div", { className: "card-dtl" }, /* @__PURE__ */ import_react20.default.createElement("div", { className: "exp-cvc-container" }, /* @__PURE__ */ import_react20.default.createElement("div", { className: "form-group", style: { marginTop: "0", marginBottom: "10px" } }, /* @__PURE__ */ import_react20.default.createElement("label", { htmlFor: "expMonth" }, "MM"), /* @__PURE__ */ import_react20.default.createElement(
|
|
4121
4232
|
"input",
|
|
4122
4233
|
{
|
|
4123
4234
|
"data-token": "exp_month",
|
|
@@ -4128,7 +4239,7 @@ function AddCard(props) {
|
|
|
4128
4239
|
value: (cardData == null ? void 0 : cardData.expiryMonth) || "",
|
|
4129
4240
|
onChange: (e) => handleCardChange("expiryMonth", e.target.value)
|
|
4130
4241
|
}
|
|
4131
|
-
), (cardError == null ? void 0 : cardError.expiryMonth) && /* @__PURE__ */
|
|
4242
|
+
), (cardError == null ? void 0 : cardError.expiryMonth) && /* @__PURE__ */ import_react20.default.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.expiryMonth)), /* @__PURE__ */ import_react20.default.createElement("div", { className: "form-group", style: { marginTop: "0", marginBottom: "10px" } }, /* @__PURE__ */ import_react20.default.createElement("label", { htmlFor: "expYear" }, "YYYY"), /* @__PURE__ */ import_react20.default.createElement(
|
|
4132
4243
|
"input",
|
|
4133
4244
|
{
|
|
4134
4245
|
"data-token": "exp_year",
|
|
@@ -4139,7 +4250,7 @@ function AddCard(props) {
|
|
|
4139
4250
|
value: (cardData == null ? void 0 : cardData.expiryYear) || "",
|
|
4140
4251
|
onChange: (e) => handleCardChange("expiryYear", e.target.value)
|
|
4141
4252
|
}
|
|
4142
|
-
), (cardError == null ? void 0 : cardError.expiryYear) && /* @__PURE__ */
|
|
4253
|
+
), (cardError == null ? void 0 : cardError.expiryYear) && /* @__PURE__ */ import_react20.default.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.expiryYear)), /* @__PURE__ */ import_react20.default.createElement("div", { className: "form-group", style: { marginTop: "0", marginBottom: "10px" } }, /* @__PURE__ */ import_react20.default.createElement("label", { htmlFor: "cvc" }, "CVC"), /* @__PURE__ */ import_react20.default.createElement(
|
|
4143
4254
|
"input",
|
|
4144
4255
|
{
|
|
4145
4256
|
"data-token": "cvv",
|
|
@@ -4150,7 +4261,7 @@ function AddCard(props) {
|
|
|
4150
4261
|
value: (cardData == null ? void 0 : cardData.cvv) || "",
|
|
4151
4262
|
onChange: (e) => handleCardChange("cvv", e.target.value)
|
|
4152
4263
|
}
|
|
4153
|
-
), (cardError == null ? void 0 : cardError.cvv) && /* @__PURE__ */
|
|
4264
|
+
), (cardError == null ? void 0 : cardError.cvv) && /* @__PURE__ */ import_react20.default.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.cvv)))), /* @__PURE__ */ import_react20.default.createElement("div", { className: "form-group", style: { marginTop: "0", marginBottom: "10px" } }, /* @__PURE__ */ import_react20.default.createElement("label", { htmlFor: "cardholderName" }, "Name on card"), /* @__PURE__ */ import_react20.default.createElement(
|
|
4154
4265
|
"input",
|
|
4155
4266
|
{
|
|
4156
4267
|
type: "text",
|
|
@@ -4165,7 +4276,7 @@ function AddCard(props) {
|
|
|
4165
4276
|
}
|
|
4166
4277
|
}
|
|
4167
4278
|
}
|
|
4168
|
-
), (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */
|
|
4279
|
+
), (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */ import_react20.default.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.cardName)), /* @__PURE__ */ import_react20.default.createElement("div", { className: "form-group", style: { marginBottom: "20px" } }, /* @__PURE__ */ import_react20.default.createElement("label", { htmlFor: "zipcode" }, "Zip"), /* @__PURE__ */ import_react20.default.createElement(
|
|
4169
4280
|
"input",
|
|
4170
4281
|
{
|
|
4171
4282
|
type: "text",
|
|
@@ -4175,7 +4286,7 @@ function AddCard(props) {
|
|
|
4175
4286
|
value: (_a = cardData == null ? void 0 : cardData.zipCode) != null ? _a : "",
|
|
4176
4287
|
onChange: (e) => handleCardChange("zipCode", e.target.value)
|
|
4177
4288
|
}
|
|
4178
|
-
), (cardError == null ? void 0 : cardError.zipCode) && /* @__PURE__ */
|
|
4289
|
+
), (cardError == null ? void 0 : cardError.zipCode) && /* @__PURE__ */ import_react20.default.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.zipCode)), /* @__PURE__ */ import_react20.default.createElement(
|
|
4179
4290
|
"input",
|
|
4180
4291
|
{
|
|
4181
4292
|
type: "submit",
|
|
@@ -4188,17 +4299,18 @@ function AddCard(props) {
|
|
|
4188
4299
|
}
|
|
4189
4300
|
|
|
4190
4301
|
// src/app/components/AddCard/AddCardEasyPay.tsx
|
|
4191
|
-
var
|
|
4302
|
+
var import_react21 = __toESM(require("react"));
|
|
4192
4303
|
var import_sweetalert24 = __toESM(require("sweetalert2"));
|
|
4193
4304
|
var import_axios6 = __toESM(require("axios"));
|
|
4194
4305
|
function AddCardEasyPay(props) {
|
|
4195
4306
|
var _a;
|
|
4196
|
-
const [loading, setLoading] = (0,
|
|
4197
|
-
const [success, setSuccess] = (0,
|
|
4198
|
-
const [
|
|
4199
|
-
const [
|
|
4200
|
-
const [
|
|
4201
|
-
const [
|
|
4307
|
+
const [loading, setLoading] = (0, import_react21.useState)(false);
|
|
4308
|
+
const [success, setSuccess] = (0, import_react21.useState)(false);
|
|
4309
|
+
const [error, setError] = (0, import_react21.useState)("");
|
|
4310
|
+
const [show, setShow] = (0, import_react21.useState)(false);
|
|
4311
|
+
const [cardData, setCardData] = (0, import_react21.useState)();
|
|
4312
|
+
const [cardError, setCardError] = (0, import_react21.useState)({});
|
|
4313
|
+
const [paymentData, setPaymentData] = (0, import_react21.useState)();
|
|
4202
4314
|
const showLoader = () => setLoading(true);
|
|
4203
4315
|
const hideLoader = () => setLoading(false);
|
|
4204
4316
|
const showError = (msz) => {
|
|
@@ -4213,6 +4325,7 @@ function AddCardEasyPay(props) {
|
|
|
4213
4325
|
const handleClose = () => {
|
|
4214
4326
|
setShow(false);
|
|
4215
4327
|
setSuccess(false);
|
|
4328
|
+
setError("");
|
|
4216
4329
|
setCardData({
|
|
4217
4330
|
cardName: "",
|
|
4218
4331
|
cardNumber: "",
|
|
@@ -4322,17 +4435,17 @@ function AddCardEasyPay(props) {
|
|
|
4322
4435
|
setPaymentData((_a2 = paymentData2 == null ? void 0 : paymentData2.data) == null ? void 0 : _a2.data);
|
|
4323
4436
|
if (!((_c = (_b = paymentData2 == null ? void 0 : paymentData2.data) == null ? void 0 : _b.data) == null ? void 0 : _c.paymentGateway)) {
|
|
4324
4437
|
handleClose();
|
|
4325
|
-
|
|
4438
|
+
setError("Something went wrong.");
|
|
4326
4439
|
}
|
|
4327
4440
|
hideLoader();
|
|
4328
4441
|
} catch (err) {
|
|
4329
4442
|
console.log(err);
|
|
4330
4443
|
hideLoader();
|
|
4331
4444
|
handleClose();
|
|
4332
|
-
|
|
4445
|
+
setError("Something went wrong.");
|
|
4333
4446
|
}
|
|
4334
4447
|
};
|
|
4335
|
-
(0,
|
|
4448
|
+
(0, import_react21.useEffect)(() => {
|
|
4336
4449
|
if (props.fractalpayClientKey) {
|
|
4337
4450
|
getPaymentDetails();
|
|
4338
4451
|
}
|
|
@@ -4361,7 +4474,7 @@ function AddCardEasyPay(props) {
|
|
|
4361
4474
|
console.log(token);
|
|
4362
4475
|
if (token.Error) {
|
|
4363
4476
|
console.log(token == null ? void 0 : token.Error);
|
|
4364
|
-
|
|
4477
|
+
setError(token.Error);
|
|
4365
4478
|
hideLoader();
|
|
4366
4479
|
} else {
|
|
4367
4480
|
const reqData = {
|
|
@@ -4400,12 +4513,12 @@ function AddCardEasyPay(props) {
|
|
|
4400
4513
|
} catch (err) {
|
|
4401
4514
|
console.log(err);
|
|
4402
4515
|
hideLoader();
|
|
4403
|
-
|
|
4516
|
+
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.");
|
|
4404
4517
|
}
|
|
4405
4518
|
} catch (err) {
|
|
4406
4519
|
console.log(err);
|
|
4407
4520
|
hideLoader();
|
|
4408
|
-
|
|
4521
|
+
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.");
|
|
4409
4522
|
}
|
|
4410
4523
|
}
|
|
4411
4524
|
};
|
|
@@ -4465,15 +4578,15 @@ function AddCardEasyPay(props) {
|
|
|
4465
4578
|
}
|
|
4466
4579
|
} catch (err) {
|
|
4467
4580
|
hideLoader();
|
|
4468
|
-
|
|
4581
|
+
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.");
|
|
4469
4582
|
}
|
|
4470
4583
|
} catch (err) {
|
|
4471
4584
|
hideLoader();
|
|
4472
|
-
|
|
4585
|
+
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.");
|
|
4473
4586
|
}
|
|
4474
4587
|
} catch (err) {
|
|
4475
4588
|
hideLoader();
|
|
4476
|
-
|
|
4589
|
+
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.");
|
|
4477
4590
|
}
|
|
4478
4591
|
} else {
|
|
4479
4592
|
if (typeof DatacapWebToken !== "undefined") {
|
|
@@ -4482,19 +4595,19 @@ function AddCardEasyPay(props) {
|
|
|
4482
4595
|
}
|
|
4483
4596
|
} catch (err) {
|
|
4484
4597
|
hideLoader();
|
|
4485
|
-
|
|
4598
|
+
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.");
|
|
4486
4599
|
}
|
|
4487
4600
|
}
|
|
4488
4601
|
}
|
|
4489
4602
|
};
|
|
4490
|
-
return /* @__PURE__ */
|
|
4603
|
+
return /* @__PURE__ */ import_react21.default.createElement(import_react21.default.Fragment, null, /* @__PURE__ */ import_react21.default.createElement(DataScript, null), /* @__PURE__ */ import_react21.default.createElement(AddCardStyle, null), /* @__PURE__ */ import_react21.default.createElement(Loader_default, { loading }), error && /* @__PURE__ */ import_react21.default.createElement("div", { style: { maxHeight: "606px", minHeight: "60vh", padding: "40px" } }, /* @__PURE__ */ import_react21.default.createElement(ErrorCardMessage_default, { error, onClose: handleClose })), !error && !success && /* @__PURE__ */ import_react21.default.createElement(import_react21.default.Fragment, null, success ? /* @__PURE__ */ import_react21.default.createElement(SuccessCardMsz_default, { onClose: handleCloseSeccess }) : /* @__PURE__ */ import_react21.default.createElement(
|
|
4491
4604
|
"div",
|
|
4492
4605
|
{
|
|
4493
4606
|
className: "container-creditcard add-card modal-content",
|
|
4494
4607
|
id: "add-credit-card-panel",
|
|
4495
4608
|
style: { margin: "auto" }
|
|
4496
4609
|
},
|
|
4497
|
-
/* @__PURE__ */
|
|
4610
|
+
/* @__PURE__ */ import_react21.default.createElement("form", { id: "creditCardForm", onSubmit: addCardFunc, style: { padding: "0 10px" } }, /* @__PURE__ */ import_react21.default.createElement("div", { style: { maxHeight: "350px", minHeight: "0" }, className: "card-scrl" }, /* @__PURE__ */ import_react21.default.createElement("div", { className: "form-group", style: { marginTop: "0", marginBottom: "10px" } }, /* @__PURE__ */ import_react21.default.createElement("label", { htmlFor: "cardNumber" }, "Card Number"), /* @__PURE__ */ import_react21.default.createElement(
|
|
4498
4611
|
"input",
|
|
4499
4612
|
{
|
|
4500
4613
|
type: "text",
|
|
@@ -4505,7 +4618,7 @@ function AddCardEasyPay(props) {
|
|
|
4505
4618
|
value: (cardData == null ? void 0 : cardData.cardNumber) || "",
|
|
4506
4619
|
onChange: (e) => handleCardNumberChange(e)
|
|
4507
4620
|
}
|
|
4508
|
-
), (cardError == null ? void 0 : cardError.cardNumber) && /* @__PURE__ */
|
|
4621
|
+
), (cardError == null ? void 0 : cardError.cardNumber) && /* @__PURE__ */ import_react21.default.createElement("span", { className: "error-span", style: { color: "red", fontSize: "12px" } }, cardError == null ? void 0 : cardError.cardNumber), /* @__PURE__ */ import_react21.default.createElement("br", null)), /* @__PURE__ */ import_react21.default.createElement("div", { className: "card-dtl" }, /* @__PURE__ */ import_react21.default.createElement("div", { className: "exp-cvc-container", style: { margin: "0" } }, /* @__PURE__ */ import_react21.default.createElement("div", { className: "form-group", style: { marginTop: "0" } }, /* @__PURE__ */ import_react21.default.createElement("label", { htmlFor: "expMonth" }, "MM"), /* @__PURE__ */ import_react21.default.createElement(
|
|
4509
4622
|
"input",
|
|
4510
4623
|
{
|
|
4511
4624
|
"data-token": "exp_month",
|
|
@@ -4516,7 +4629,7 @@ function AddCardEasyPay(props) {
|
|
|
4516
4629
|
value: (cardData == null ? void 0 : cardData.expiryMonth) || "",
|
|
4517
4630
|
onChange: (e) => handleCardChange("expiryMonth", e.target.value)
|
|
4518
4631
|
}
|
|
4519
|
-
), (cardError == null ? void 0 : cardError.expiryMonth) && /* @__PURE__ */
|
|
4632
|
+
), (cardError == null ? void 0 : cardError.expiryMonth) && /* @__PURE__ */ import_react21.default.createElement("span", { className: "error-span", style: { color: "red", fontSize: "12px" } }, cardError == null ? void 0 : cardError.expiryMonth)), /* @__PURE__ */ import_react21.default.createElement("div", { className: "form-group", style: { marginTop: "0" } }, /* @__PURE__ */ import_react21.default.createElement("label", { htmlFor: "expYear" }, "YYYY"), /* @__PURE__ */ import_react21.default.createElement(
|
|
4520
4633
|
"input",
|
|
4521
4634
|
{
|
|
4522
4635
|
"data-token": "exp_year",
|
|
@@ -4527,7 +4640,7 @@ function AddCardEasyPay(props) {
|
|
|
4527
4640
|
value: (cardData == null ? void 0 : cardData.expiryYear) || "",
|
|
4528
4641
|
onChange: (e) => handleCardChange("expiryYear", e.target.value)
|
|
4529
4642
|
}
|
|
4530
|
-
), (cardError == null ? void 0 : cardError.expiryYear) && /* @__PURE__ */
|
|
4643
|
+
), (cardError == null ? void 0 : cardError.expiryYear) && /* @__PURE__ */ import_react21.default.createElement("span", { className: "error-span", style: { color: "red", fontSize: "12px" } }, cardError == null ? void 0 : cardError.expiryYear)), /* @__PURE__ */ import_react21.default.createElement("div", { className: "form-group", style: { marginTop: "0" } }, /* @__PURE__ */ import_react21.default.createElement("label", { htmlFor: "cvc" }, "CVC"), /* @__PURE__ */ import_react21.default.createElement(
|
|
4531
4644
|
"input",
|
|
4532
4645
|
{
|
|
4533
4646
|
"data-token": "cvv",
|
|
@@ -4538,7 +4651,7 @@ function AddCardEasyPay(props) {
|
|
|
4538
4651
|
value: (cardData == null ? void 0 : cardData.cvv) || "",
|
|
4539
4652
|
onChange: (e) => handleCardChange("cvv", e.target.value)
|
|
4540
4653
|
}
|
|
4541
|
-
), (cardError == null ? void 0 : cardError.cvv) && /* @__PURE__ */
|
|
4654
|
+
), (cardError == null ? void 0 : cardError.cvv) && /* @__PURE__ */ import_react21.default.createElement("span", { className: "error-span", style: { color: "red", fontSize: "12px" } }, cardError == null ? void 0 : cardError.cvv)))), /* @__PURE__ */ import_react21.default.createElement("div", { className: "form-group", style: { marginTop: "0" } }, /* @__PURE__ */ import_react21.default.createElement("label", { htmlFor: "cardholderName" }, "Name on card"), /* @__PURE__ */ import_react21.default.createElement(
|
|
4542
4655
|
"input",
|
|
4543
4656
|
{
|
|
4544
4657
|
type: "text",
|
|
@@ -4553,7 +4666,7 @@ function AddCardEasyPay(props) {
|
|
|
4553
4666
|
}
|
|
4554
4667
|
}
|
|
4555
4668
|
}
|
|
4556
|
-
), (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */
|
|
4669
|
+
), (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */ import_react21.default.createElement("span", { className: "error-span", style: { color: "red", fontSize: "12px" } }, cardError == null ? void 0 : cardError.cardName)), /* @__PURE__ */ import_react21.default.createElement("div", { className: "form-group", style: { marginTop: "0" } }, /* @__PURE__ */ import_react21.default.createElement("label", { htmlFor: "zipcode" }, "Zip"), /* @__PURE__ */ import_react21.default.createElement(
|
|
4557
4670
|
"input",
|
|
4558
4671
|
{
|
|
4559
4672
|
type: "text",
|
|
@@ -4563,7 +4676,7 @@ function AddCardEasyPay(props) {
|
|
|
4563
4676
|
value: (_a = cardData == null ? void 0 : cardData.zipCode) != null ? _a : "",
|
|
4564
4677
|
onChange: (e) => handleCardChange("zipCode", e.target.value)
|
|
4565
4678
|
}
|
|
4566
|
-
), (cardError == null ? void 0 : cardError.zipCode) && /* @__PURE__ */
|
|
4679
|
+
), (cardError == null ? void 0 : cardError.zipCode) && /* @__PURE__ */ import_react21.default.createElement("span", { className: "error-span", style: { color: "red", fontSize: "12px" } }, cardError == null ? void 0 : cardError.zipCode))), /* @__PURE__ */ import_react21.default.createElement(
|
|
4567
4680
|
"input",
|
|
4568
4681
|
{
|
|
4569
4682
|
type: "submit",
|
|
@@ -4571,7 +4684,7 @@ function AddCardEasyPay(props) {
|
|
|
4571
4684
|
defaultValue: "Submit"
|
|
4572
4685
|
}
|
|
4573
4686
|
))
|
|
4574
|
-
));
|
|
4687
|
+
)));
|
|
4575
4688
|
}
|
|
4576
4689
|
// Annotate the CommonJS export names for ESM import in node:
|
|
4577
4690
|
0 && (module.exports = {
|