@pinerohit11/testwidget 0.1.90 → 0.1.92
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 +274 -60
- package/dist/index.mjs +275 -61
- package/package.json +1 -1
package/dist/index.js
CHANGED
@@ -22,6 +22,18 @@ var __spreadValues = (a, b) => {
|
|
22
22
|
return a;
|
23
23
|
};
|
24
24
|
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
25
|
+
var __objRest = (source, exclude) => {
|
26
|
+
var target = {};
|
27
|
+
for (var prop in source)
|
28
|
+
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
29
|
+
target[prop] = source[prop];
|
30
|
+
if (source != null && __getOwnPropSymbols)
|
31
|
+
for (var prop of __getOwnPropSymbols(source)) {
|
32
|
+
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
33
|
+
target[prop] = source[prop];
|
34
|
+
}
|
35
|
+
return target;
|
36
|
+
};
|
25
37
|
var __export = (target, all) => {
|
26
38
|
for (var name in all)
|
27
39
|
__defProp(target, name, { get: all[name], enumerable: true });
|
@@ -156,8 +168,8 @@ var Loader = (props) => {
|
|
156
168
|
var Loader_default = Loader;
|
157
169
|
|
158
170
|
// src/app/components/baseurl.ts
|
171
|
+
var baseUrl = "http://192.168.1.62:8082/";
|
159
172
|
var masterBaseUrl = "https://dev-sky-node.fractalpay.com/";
|
160
|
-
var baseUrl = "https://dev-widget.fractalpay.com/";
|
161
173
|
|
162
174
|
// src/app/components/Errortext.ts
|
163
175
|
var ErrorText = {
|
@@ -1972,12 +1984,28 @@ function DataScript() {
|
|
1972
1984
|
console.log("\u2139\uFE0F Script already in DOM, waiting for Datacap...");
|
1973
1985
|
}
|
1974
1986
|
}, []);
|
1987
|
+
(0, import_react11.useEffect)(() => {
|
1988
|
+
const scriptId = "forge-cdn-script";
|
1989
|
+
if (!document.getElementById(scriptId)) {
|
1990
|
+
const forgeScript = document.createElement("script");
|
1991
|
+
forgeScript.src = "https://cdn.jsdelivr.net/npm/node-forge@1.0.0/dist/forge.min.js";
|
1992
|
+
forgeScript.id = scriptId;
|
1993
|
+
forgeScript.async = true;
|
1994
|
+
document.head.appendChild(forgeScript);
|
1995
|
+
}
|
1996
|
+
return () => {
|
1997
|
+
const existingScript = document.getElementById(scriptId);
|
1998
|
+
if (existingScript) {
|
1999
|
+
document.head.removeChild(existingScript);
|
2000
|
+
}
|
2001
|
+
};
|
2002
|
+
}, []);
|
1975
2003
|
return null;
|
1976
2004
|
}
|
1977
2005
|
|
1978
2006
|
// src/app/components/Charge/GetPaymentPage.tsx
|
1979
2007
|
function GetPaymentPage(props) {
|
1980
|
-
var _a, _b, _c, _d, _e, _f, _g, _h;
|
2008
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
|
1981
2009
|
const [loading, setLoading] = (0, import_react12.useState)(false);
|
1982
2010
|
const [success, setSuccess] = (0, import_react12.useState)(false);
|
1983
2011
|
const [show, setShow] = (0, import_react12.useState)(false);
|
@@ -1989,21 +2017,9 @@ function GetPaymentPage(props) {
|
|
1989
2017
|
const [cardError, setCardError] = (0, import_react12.useState)({});
|
1990
2018
|
const [achData, setAchData] = (0, import_react12.useState)();
|
1991
2019
|
const [achError, setAchError] = (0, import_react12.useState)({});
|
1992
|
-
const [cardList, setCardList] = (0, import_react12.useState)([
|
1993
|
-
|
1994
|
-
|
1995
|
-
{ cardNumber: "9876789878999874", expMonth: "11", expYear: "2028", cardType: "visa" },
|
1996
|
-
{ cardNumber: "9876789878999873", expMonth: "08", expYear: "2029", cardType: "visa" },
|
1997
|
-
{ cardNumber: "9876789878999345", expMonth: "10", expYear: "2026", cardType: "visa" },
|
1998
|
-
{ cardNumber: "9876789878999434", expMonth: "05", expYear: "2028", cardType: "visa" },
|
1999
|
-
{ cardNumber: "9876789878999852", expMonth: "07", expYear: "2027", cardType: "visa" },
|
2000
|
-
{ cardNumber: "9876789878994546", expMonth: "04", expYear: "2029", cardType: "visa" },
|
2001
|
-
{ cardNumber: "9876789878999743", expMonth: "09", expYear: "2026", cardType: "visa" },
|
2002
|
-
{ cardNumber: "9876789878997323", expMonth: "12", expYear: "2028", cardType: "visa" },
|
2003
|
-
{ cardNumber: "9876789878998979", expMonth: "07", expYear: "2027", cardType: "visa" },
|
2004
|
-
{ cardNumber: "9876789878992348", expMonth: "03", expYear: "2029", cardType: "visa" },
|
2005
|
-
{ cardNumber: "9876789878999465", expMonth: "01", expYear: "2026", cardType: "visa" }
|
2006
|
-
]);
|
2020
|
+
const [cardList, setCardList] = (0, import_react12.useState)([]);
|
2021
|
+
const [selectedCard, setSelectedCard] = (0, import_react12.useState)();
|
2022
|
+
const [paymentData, setPaymentData] = (0, import_react12.useState)();
|
2007
2023
|
const showLoader = () => setLoading(true);
|
2008
2024
|
const hideLoader = () => setLoading(false);
|
2009
2025
|
const showError = (msz) => {
|
@@ -2122,7 +2138,7 @@ function GetPaymentPage(props) {
|
|
2122
2138
|
return Object.keys(errors).length > 0;
|
2123
2139
|
};
|
2124
2140
|
const validateAchData = () => {
|
2125
|
-
var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2,
|
2141
|
+
var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2;
|
2126
2142
|
const errors = {};
|
2127
2143
|
const data = achData;
|
2128
2144
|
if (!((_a2 = data == null ? void 0 : data.name) == null ? void 0 : _a2.trim())) errors.name = "Name is required";
|
@@ -2131,7 +2147,7 @@ function GetPaymentPage(props) {
|
|
2131
2147
|
if (!((_f2 = data == null ? void 0 : data.bankName) == null ? void 0 : _f2.trim())) errors.bankName = "Bank name is required";
|
2132
2148
|
if (!((_g2 = data == null ? void 0 : data.routingNumber) == null ? void 0 : _g2.trim())) errors.routingNumber = "Routing Number is required";
|
2133
2149
|
if ((data == null ? void 0 : data.routingNumber) && ((_h2 = data == null ? void 0 : data.routingNumber) == null ? void 0 : _h2.length) !== 9) errors.routingNumber = "Routing number must be 9 digits";
|
2134
|
-
if (((
|
2150
|
+
if (((_i2 = data == null ? void 0 : data.routingNumber) == null ? void 0 : _i2.length) == 9) {
|
2135
2151
|
let routingNumber = data == null ? void 0 : data.routingNumber;
|
2136
2152
|
const weights = [3, 7, 1];
|
2137
2153
|
let sum = 0;
|
@@ -2147,7 +2163,7 @@ function GetPaymentPage(props) {
|
|
2147
2163
|
return Object.keys(errors).length > 0;
|
2148
2164
|
};
|
2149
2165
|
const submitFunc = async (e) => {
|
2150
|
-
var _a2, _b2, _c2, _d2, _e2;
|
2166
|
+
var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
|
2151
2167
|
e.preventDefault();
|
2152
2168
|
if (activetab !== "ach") {
|
2153
2169
|
const hasError = validateCardData();
|
@@ -2166,13 +2182,14 @@ function GetPaymentPage(props) {
|
|
2166
2182
|
try {
|
2167
2183
|
const formData = __spreadProps(__spreadValues({}, cardData), {
|
2168
2184
|
amount: `${props.amount || 0}`,
|
2169
|
-
// fractalpayClientKey : fractalpayClientKey,
|
2170
2185
|
fractalpayPublicKey: fractalpayClientKey
|
2171
2186
|
});
|
2172
2187
|
const result = await import_axios3.default.post(`${baseUrl}create-widget-order`, formData);
|
2173
2188
|
console.log(result);
|
2174
2189
|
let tokenCallback = async function(response) {
|
2190
|
+
var _a3, _b3;
|
2175
2191
|
if (response.Error) {
|
2192
|
+
console.log(response == null ? void 0 : response.Error);
|
2176
2193
|
showError(response.Error);
|
2177
2194
|
hideLoader();
|
2178
2195
|
} else {
|
@@ -2200,22 +2217,94 @@ function GetPaymentPage(props) {
|
|
2200
2217
|
} catch (err) {
|
2201
2218
|
console.log(err);
|
2202
2219
|
hideLoader();
|
2203
|
-
showError("
|
2220
|
+
showError(((_b3 = (_a3 = err == null ? void 0 : err.response) == null ? void 0 : _a3.data) == null ? void 0 : _b3.message) || (err == null ? void 0 : err.message) || "Something went wrong..");
|
2204
2221
|
}
|
2205
2222
|
}
|
2206
2223
|
};
|
2207
|
-
if (
|
2208
|
-
|
2224
|
+
if ((paymentData == null ? void 0 : paymentData.paymentGateway) === 32) {
|
2225
|
+
const requestOptions = {
|
2226
|
+
method: "POST",
|
2227
|
+
redirect: "follow"
|
2228
|
+
};
|
2229
|
+
try {
|
2230
|
+
let sesionResult = await import_axios3.default.post(`${masterBaseUrl}api/v1/widget/generate-session`, requestOptions);
|
2231
|
+
let expYear = Number(cardData == null ? void 0 : cardData.expiryYear) % 100;
|
2232
|
+
let cardNumber = cardData == null ? void 0 : cardData.cardNumber;
|
2233
|
+
cardNumber = cardNumber == null ? void 0 : cardNumber.replace(/\s+/g, "");
|
2234
|
+
let track2_data = `${cardNumber}=${expYear}${cardData == null ? void 0 : cardData.expiryMonth} ${cardData == null ? void 0 : cardData.cvv}`;
|
2235
|
+
const publicKey = forge.pki.publicKeyFromPem((_b2 = (_a2 = sesionResult == null ? void 0 : sesionResult.data) == null ? void 0 : _a2.data) == null ? void 0 : _b2.publicKeyPem);
|
2236
|
+
const encrypted = publicKey.encrypt(track2_data, "RSA-OAEP", {
|
2237
|
+
md: forge.md.sha1.create(),
|
2238
|
+
mgf1: {
|
2239
|
+
md: forge.md.sha1.create()
|
2240
|
+
}
|
2241
|
+
});
|
2242
|
+
const encryptedBase64 = forge.util.encode64(encrypted);
|
2243
|
+
const myHeaders = {
|
2244
|
+
"Content-Type": "application/json",
|
2245
|
+
"x-app-session-key": (_d2 = (_c2 = sesionResult.data) == null ? void 0 : _c2.data) == null ? void 0 : _d2.session_key
|
2246
|
+
};
|
2247
|
+
const raw = JSON.stringify({
|
2248
|
+
"enc_track2_data": `${encryptedBase64}`,
|
2249
|
+
"algorithm": "RSAES_OAEP_SHA_1",
|
2250
|
+
session_key: `${(_f2 = (_e2 = sesionResult == null ? void 0 : sesionResult.data) == null ? void 0 : _e2.data) == null ? void 0 : _f2.session_key}`
|
2251
|
+
});
|
2252
|
+
try {
|
2253
|
+
const tokenizeData = await import_axios3.default.post("https://api-dev.merchant-trends.com/tokenizer/tokenize", raw, { headers: myHeaders });
|
2254
|
+
const reqData = JSON.stringify(__spreadProps(__spreadValues({}, (_g2 = tokenizeData == null ? void 0 : tokenizeData.data) == null ? void 0 : _g2.data), {
|
2255
|
+
isSaveCardChecked: saveCardInfo,
|
2256
|
+
name: cardData == null ? void 0 : cardData.cardName,
|
2257
|
+
postal_code: cardData == null ? void 0 : cardData.zipCode,
|
2258
|
+
customer_id: props == null ? void 0 : props.customerId
|
2259
|
+
}));
|
2260
|
+
const reqData2 = {
|
2261
|
+
"pre_sales_id": `${(_i2 = (_h2 = result == null ? void 0 : result.data) == null ? void 0 : _h2.data) == null ? void 0 : _i2.posSalesIdEncode}`,
|
2262
|
+
"token": `${(_j2 = tokenizeData == null ? void 0 : tokenizeData.data) == null ? void 0 : _j2.data.token}`,
|
2263
|
+
"json_response": `${reqData}`
|
2264
|
+
};
|
2265
|
+
let myHeaders2 = {
|
2266
|
+
"Content-Type": "application/json"
|
2267
|
+
};
|
2268
|
+
const requestOptions2 = __spreadProps(__spreadValues({}, reqData2), {
|
2269
|
+
isChargeviafractal: true
|
2270
|
+
});
|
2271
|
+
try {
|
2272
|
+
let paymentRes = await import_axios3.default.post(
|
2273
|
+
`${masterBaseUrl}api/v1/payment-gateway/charge`,
|
2274
|
+
requestOptions2,
|
2275
|
+
{
|
2276
|
+
headers: myHeaders2
|
2277
|
+
}
|
2278
|
+
);
|
2279
|
+
console.log(paymentRes);
|
2280
|
+
if ((_k = paymentRes == null ? void 0 : paymentRes.data) == null ? void 0 : _k.result) {
|
2281
|
+
setSuccess(true);
|
2282
|
+
hideLoader();
|
2283
|
+
}
|
2284
|
+
} catch (err) {
|
2285
|
+
hideLoader();
|
2286
|
+
showError(((_m = (_l = err == null ? void 0 : err.response) == null ? void 0 : _l.data) == null ? void 0 : _m.message) || (err == null ? void 0 : err.message) || "something wrong..s");
|
2287
|
+
}
|
2288
|
+
} catch (err) {
|
2289
|
+
hideLoader();
|
2290
|
+
showError(((_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 wrong..s");
|
2291
|
+
}
|
2292
|
+
} catch (err) {
|
2293
|
+
hideLoader();
|
2294
|
+
showError(((_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 wrong..s");
|
2295
|
+
}
|
2296
|
+
} else {
|
2297
|
+
if (typeof DatacapWebToken !== "undefined") {
|
2298
|
+
DatacapWebToken.requestToken(result == null ? void 0 : result.data.data.dctoken, "PaymentForm", tokenCallback);
|
2299
|
+
}
|
2209
2300
|
}
|
2210
2301
|
} catch (err) {
|
2211
|
-
console.log(err);
|
2212
2302
|
hideLoader();
|
2213
|
-
showError("
|
2303
|
+
showError(((_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 wrong..s");
|
2214
2304
|
}
|
2215
2305
|
}
|
2216
2306
|
}
|
2217
2307
|
} else {
|
2218
|
-
console.log(achData);
|
2219
2308
|
const hasError = validateAchData();
|
2220
2309
|
if (hasError) return;
|
2221
2310
|
else {
|
@@ -2243,13 +2332,13 @@ function GetPaymentPage(props) {
|
|
2243
2332
|
import_sweetalert2.default.fire({
|
2244
2333
|
icon: "success",
|
2245
2334
|
title: "Congrats...",
|
2246
|
-
text: (
|
2335
|
+
text: (_t = result == null ? void 0 : result.data) == null ? void 0 : _t.message
|
2247
2336
|
});
|
2248
2337
|
} catch (error) {
|
2249
2338
|
if (import_axios3.default.isAxiosError(error)) {
|
2250
2339
|
console.log(error);
|
2251
2340
|
hideLoader();
|
2252
|
-
showError((
|
2341
|
+
showError((_x = (_w = (_v = (_u = error.response) == null ? void 0 : _u.data) == null ? void 0 : _v.message) == null ? void 0 : _w.error) != null ? _x : "Something went wrong");
|
2253
2342
|
} else {
|
2254
2343
|
console.error("Unexpected error", error);
|
2255
2344
|
}
|
@@ -2257,6 +2346,142 @@ function GetPaymentPage(props) {
|
|
2257
2346
|
}
|
2258
2347
|
}
|
2259
2348
|
};
|
2349
|
+
const getPaymentDetails = async () => {
|
2350
|
+
var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2;
|
2351
|
+
showLoader();
|
2352
|
+
try {
|
2353
|
+
const data = {
|
2354
|
+
fractalpayPublicKey: fractalpayClientKey,
|
2355
|
+
"customer_id": props == null ? void 0 : props.customerId
|
2356
|
+
};
|
2357
|
+
let paymentData2 = await import_axios3.default.post(`${baseUrl}get-payment-details`, data);
|
2358
|
+
console.log(paymentData2);
|
2359
|
+
setPaymentData((_a2 = paymentData2 == null ? void 0 : paymentData2.data) == null ? void 0 : _a2.data);
|
2360
|
+
if (((_c2 = (_b2 = paymentData2 == null ? void 0 : paymentData2.data) == null ? void 0 : _b2.data) == null ? void 0 : _c2.card_list) && ((_f2 = (_e2 = (_d2 = paymentData2 == null ? void 0 : paymentData2.data) == null ? void 0 : _d2.data) == null ? void 0 : _e2.card_list) == null ? void 0 : _f2.length) > 0) {
|
2361
|
+
setCardList((_h2 = (_g2 = paymentData2 == null ? void 0 : paymentData2.data) == null ? void 0 : _g2.data) == null ? void 0 : _h2.card_list);
|
2362
|
+
} else {
|
2363
|
+
setActive("card");
|
2364
|
+
}
|
2365
|
+
hideLoader();
|
2366
|
+
} catch (err) {
|
2367
|
+
console.log(err);
|
2368
|
+
setActive("card");
|
2369
|
+
hideLoader();
|
2370
|
+
}
|
2371
|
+
};
|
2372
|
+
const handlechargeCustomer = async () => {
|
2373
|
+
var _b2, _c2, _d2, _e2, _f2;
|
2374
|
+
console.log("selected", selectedCard);
|
2375
|
+
let customer_id = props == null ? void 0 : props.customerId;
|
2376
|
+
let discount = props == null ? void 0 : props.discount;
|
2377
|
+
let surcharge = props == null ? void 0 : props.surcharge;
|
2378
|
+
let tax = props == null ? void 0 : props.tax;
|
2379
|
+
let fractalpayPublicKey = props == null ? void 0 : props.fractalpayClientKey;
|
2380
|
+
let order_id = props == null ? void 0 : props.orderID;
|
2381
|
+
let amount = props == null ? void 0 : props.amount;
|
2382
|
+
let card_id = selectedCard == null ? void 0 : selectedCard.id;
|
2383
|
+
let card_type = selectedCard == null ? void 0 : selectedCard.card_type;
|
2384
|
+
if (fractalpayPublicKey && order_id && amount) {
|
2385
|
+
if (customer_id) {
|
2386
|
+
if (card_id) {
|
2387
|
+
let chargeobj = {
|
2388
|
+
amount,
|
2389
|
+
order_id,
|
2390
|
+
customer_id,
|
2391
|
+
card_id,
|
2392
|
+
fractalpayPublicKey,
|
2393
|
+
isCardSave: saveCardInfo,
|
2394
|
+
discount,
|
2395
|
+
surcharge,
|
2396
|
+
tax
|
2397
|
+
};
|
2398
|
+
let _a2 = chargeobj, { isCardSave } = _a2, rest = __objRest(_a2, ["isCardSave"]);
|
2399
|
+
let endpoint = card_type === "Bank" ? "charge-ach" : "charge-by-card";
|
2400
|
+
let chargeurl = baseUrl + endpoint;
|
2401
|
+
const headers = {
|
2402
|
+
"Content-Type": "application/json"
|
2403
|
+
};
|
2404
|
+
showLoader();
|
2405
|
+
try {
|
2406
|
+
let result = await import_axios3.default.post(chargeurl, card_type == "Bank" ? rest : chargeobj, { headers });
|
2407
|
+
console.log(result);
|
2408
|
+
if ((_b2 = result == null ? void 0 : result.data) == null ? void 0 : _b2.result) {
|
2409
|
+
setSuccess(true);
|
2410
|
+
hideLoader();
|
2411
|
+
}
|
2412
|
+
} catch (err) {
|
2413
|
+
hideLoader();
|
2414
|
+
console.log(err);
|
2415
|
+
showError(((_d2 = (_c2 = err == null ? void 0 : err.response) == null ? void 0 : _c2.data) == null ? void 0 : _d2.message) || ((_f2 = (_e2 = err == null ? void 0 : err.response) == null ? void 0 : _e2.data) == null ? void 0 : _f2.status) || "Something went erong");
|
2416
|
+
}
|
2417
|
+
} else {
|
2418
|
+
showError("Please Select A Card/ACH");
|
2419
|
+
}
|
2420
|
+
} else {
|
2421
|
+
showError("Please Select Customer");
|
2422
|
+
}
|
2423
|
+
} else {
|
2424
|
+
showError("Something went wrong , Please try again later !!!");
|
2425
|
+
}
|
2426
|
+
};
|
2427
|
+
(0, import_react12.useEffect)(() => {
|
2428
|
+
if (show && fractalpayClientKey) {
|
2429
|
+
getPaymentDetails();
|
2430
|
+
}
|
2431
|
+
}, [fractalpayClientKey, show]);
|
2432
|
+
const handleDeleteCard = async (cardId) => {
|
2433
|
+
import_sweetalert2.default.fire({
|
2434
|
+
icon: "warning",
|
2435
|
+
text: "Do you want to delete the card?",
|
2436
|
+
showCancelButton: true,
|
2437
|
+
confirmButtonText: "Yes",
|
2438
|
+
cancelButtonText: "No",
|
2439
|
+
reverseButtons: true,
|
2440
|
+
buttonsStyling: false,
|
2441
|
+
customClass: {
|
2442
|
+
confirmButton: "swal2-confirm btn btn-dark",
|
2443
|
+
cancelButton: "swal2-cancel btn btn-dark",
|
2444
|
+
popup: "custom-swal-popup",
|
2445
|
+
icon: "custom-swal-icon"
|
2446
|
+
}
|
2447
|
+
}).then(async (result) => {
|
2448
|
+
if (result.isConfirmed) {
|
2449
|
+
showLoader();
|
2450
|
+
try {
|
2451
|
+
let obj = {
|
2452
|
+
card_id: cardId,
|
2453
|
+
customer_id: props == null ? void 0 : props.customerId,
|
2454
|
+
fractalpayPublicKey: props == null ? void 0 : props.fractalpayClientKey
|
2455
|
+
};
|
2456
|
+
const res = await import_axios3.default.post(`${baseUrl}delete-customer-card`, obj);
|
2457
|
+
hideLoader();
|
2458
|
+
getPaymentDetails();
|
2459
|
+
console.log("Deleted:", res);
|
2460
|
+
import_sweetalert2.default.fire({
|
2461
|
+
icon: "success",
|
2462
|
+
title: "Deleted!",
|
2463
|
+
text: "The card has been deleted.",
|
2464
|
+
confirmButtonText: "OK",
|
2465
|
+
customClass: {
|
2466
|
+
confirmButton: "btn btn-dark"
|
2467
|
+
}
|
2468
|
+
});
|
2469
|
+
} catch (err) {
|
2470
|
+
hideLoader();
|
2471
|
+
console.error("Error:", err);
|
2472
|
+
import_sweetalert2.default.fire({
|
2473
|
+
icon: "error",
|
2474
|
+
title: "Error!",
|
2475
|
+
text: "Failed to delete the card.",
|
2476
|
+
confirmButtonText: "OK",
|
2477
|
+
customClass: {
|
2478
|
+
confirmButton: "btn btn-dark"
|
2479
|
+
}
|
2480
|
+
});
|
2481
|
+
}
|
2482
|
+
}
|
2483
|
+
});
|
2484
|
+
};
|
2260
2485
|
return /* @__PURE__ */ import_react12.default.createElement(import_react12.default.Fragment, null, /* @__PURE__ */ import_react12.default.createElement(DataScript, null), /* @__PURE__ */ import_react12.default.createElement(Chargewidgetstyles, null), /* @__PURE__ */ import_react12.default.createElement(import_react12.default.Fragment, null, /* @__PURE__ */ import_react12.default.createElement(
|
2261
2486
|
"button",
|
2262
2487
|
{
|
@@ -2271,32 +2496,21 @@ function GetPaymentPage(props) {
|
|
2271
2496
|
onClose: handleClose
|
2272
2497
|
},
|
2273
2498
|
/* @__PURE__ */ import_react12.default.createElement(Loader_default, { loading }),
|
2274
|
-
success ? /* @__PURE__ */ import_react12.default.createElement(SuccessMsz, { onClose: handleCloseSeccess }) : /* @__PURE__ */ import_react12.default.createElement("div", null, /* @__PURE__ */ import_react12.default.createElement("div", null, /* @__PURE__ */ import_react12.default.createElement("span", { className: "request-payment-close-popup", onClick: handleClose }, /* @__PURE__ */ import_react12.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, /* @__PURE__ */ import_react12.default.createElement("g", { "clip-path": "url(#clip0_12425_52336)" }, /* @__PURE__ */ import_react12.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_react12.default.createElement("defs", null, /* @__PURE__ */ import_react12.default.createElement("clipPath", { id: "clip0_12425_52336" }, /* @__PURE__ */ import_react12.default.createElement("rect", { width: "16", height: "16", fill: "white" }))))), /* @__PURE__ */ import_react12.default.createElement("div", { className: "pay-container" }, /* @__PURE__ */ import_react12.default.createElement("div", { className: "pay-header pay-conatiner-one" }, /* @__PURE__ */ import_react12.default.createElement("div", { className: "pay-logo-container" }, /* @__PURE__ */ import_react12.default.createElement("div", { className: "pay-main-logo" }, /* @__PURE__ */ import_react12.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_react12.default.createElement("h1", { className: "pay-heading" }, "Pay")), /* @__PURE__ */ import_react12.default.createElement("div", { className: "pay-amount-conatiner" }, /* @__PURE__ */ import_react12.default.createElement("small", { className: "pay-payment-amount" }, "Payment Amount"), /* @__PURE__ */ import_react12.default.createElement("strong", { className: "pay-amount" }, "$1.35")), activetab != "ach" && /* @__PURE__ */ import_react12.default.createElement("div", { style: { display: "flex", gap: "8px", margin: "8px 0" } }, /* @__PURE__ */ import_react12.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/visa-img.svg", alt: "", width: 33 }), /* @__PURE__ */ import_react12.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/mc-img.svg", width: 33, alt: "" }), /* @__PURE__ */ import_react12.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/ae-img.svg", alt: "", width: 33 }), /* @__PURE__ */ import_react12.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/discover-img.svg", width: 33, alt: "" }))), /* @__PURE__ */ import_react12.default.createElement("div", { className: "pay-tab pay-conatiner-two" }, /* @__PURE__ */ import_react12.default.createElement("div", { className: "col-md-12" }, /* @__PURE__ */ import_react12.default.createElement("div", { id: "payment-form-div" }, activetab !== "cardList" ? /* @__PURE__ */ import_react12.default.createElement("div", null, /* @__PURE__ */ import_react12.default.createElement("button", { className: "charge-payment-back-btn ", onClick: () => setActive("cardList") }, " ", /* @__PURE__ */ import_react12.default.createElement(import_io5.IoArrowBack, null), " Back"), /* @__PURE__ */ import_react12.default.createElement("div", { className: "tab" }, /* @__PURE__ */ import_react12.default.createElement("button", { className: "tablinks", onClick: (e) => {
|
2499
|
+
success ? /* @__PURE__ */ import_react12.default.createElement(SuccessMsz, { onClose: handleCloseSeccess }) : /* @__PURE__ */ import_react12.default.createElement("div", null, /* @__PURE__ */ import_react12.default.createElement("div", null, /* @__PURE__ */ import_react12.default.createElement("span", { className: "request-payment-close-popup", onClick: handleClose }, /* @__PURE__ */ import_react12.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, /* @__PURE__ */ import_react12.default.createElement("g", { "clip-path": "url(#clip0_12425_52336)" }, /* @__PURE__ */ import_react12.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_react12.default.createElement("defs", null, /* @__PURE__ */ import_react12.default.createElement("clipPath", { id: "clip0_12425_52336" }, /* @__PURE__ */ import_react12.default.createElement("rect", { width: "16", height: "16", fill: "white" }))))), /* @__PURE__ */ import_react12.default.createElement("div", { className: "pay-container" }, /* @__PURE__ */ import_react12.default.createElement("div", { className: "pay-header pay-conatiner-one" }, /* @__PURE__ */ import_react12.default.createElement("div", { className: "pay-logo-container" }, /* @__PURE__ */ import_react12.default.createElement("div", { className: "pay-main-logo" }, /* @__PURE__ */ import_react12.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_react12.default.createElement("h1", { className: "pay-heading" }, "Pay")), /* @__PURE__ */ import_react12.default.createElement("div", { className: "pay-amount-conatiner" }, /* @__PURE__ */ import_react12.default.createElement("small", { className: "pay-payment-amount" }, "Payment Amount"), /* @__PURE__ */ import_react12.default.createElement("strong", { className: "pay-amount" }, "$1.35")), activetab != "ach" && /* @__PURE__ */ import_react12.default.createElement("div", { style: { display: "flex", gap: "8px", margin: "8px 0" } }, /* @__PURE__ */ import_react12.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/visa-img.svg", alt: "", width: 33 }), /* @__PURE__ */ import_react12.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/mc-img.svg", width: 33, alt: "" }), /* @__PURE__ */ import_react12.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/ae-img.svg", alt: "", width: 33 }), /* @__PURE__ */ import_react12.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/discover-img.svg", width: 33, alt: "" }))), /* @__PURE__ */ import_react12.default.createElement("div", { className: "pay-tab pay-conatiner-two" }, /* @__PURE__ */ import_react12.default.createElement("div", { className: "col-md-12" }, /* @__PURE__ */ import_react12.default.createElement("div", { id: "payment-form-div" }, activetab !== "cardList" ? /* @__PURE__ */ import_react12.default.createElement("div", null, (cardList == null ? void 0 : cardList.length) > 0 && /* @__PURE__ */ import_react12.default.createElement("button", { className: "charge-payment-back-btn ", onClick: () => setActive("cardList") }, " ", /* @__PURE__ */ import_react12.default.createElement(import_io5.IoArrowBack, null), " Back"), /* @__PURE__ */ import_react12.default.createElement("div", { className: "tab" }, /* @__PURE__ */ import_react12.default.createElement("button", { className: "tablinks", onClick: (e) => {
|
2275
2500
|
handletabchange("card");
|
2276
2501
|
}, style: { backgroundColor: activetab === "card" ? "#fff" : "inherit" } }, "Card"), /* @__PURE__ */ import_react12.default.createElement("button", { className: "tablinks", onClick: (e) => {
|
2277
2502
|
handletabchange("ach");
|
2278
|
-
}, style: { backgroundColor: activetab === "ach" ? "#fff" : "inherit" } }, "ACH"))) : /* @__PURE__ */ import_react12.default.createElement("div", null, /* @__PURE__ */ import_react12.default.createElement("p", { className: "charge-customer-name" }, " Charge
|
2279
|
-
|
2280
|
-
|
2281
|
-
|
2282
|
-
|
2283
|
-
|
2284
|
-
|
2285
|
-
|
2286
|
-
|
2287
|
-
|
2288
|
-
|
2289
|
-
buttonsStyling: false,
|
2290
|
-
// disables default styling
|
2291
|
-
customClass: {
|
2292
|
-
confirmButton: "swal2-confirm btn btn-dark",
|
2293
|
-
cancelButton: "swal2-cancel btn btn-dark",
|
2294
|
-
popup: "custom-swal-popup",
|
2295
|
-
icon: "custom-swal-icon"
|
2296
|
-
}
|
2297
|
-
});
|
2298
|
-
} }, /* @__PURE__ */ import_react12.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/Trash.svg", alt: "" }))));
|
2299
|
-
})), /* @__PURE__ */ import_react12.default.createElement("div", { className: "pay-with-other-card ", onClick: () => setActive("card") }, "Pay With Other Card", /* @__PURE__ */ import_react12.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/card.svg", alt: "" }))), /* @__PURE__ */ import_react12.default.createElement("div", { className: "form-group" }, /* @__PURE__ */ import_react12.default.createElement("button", { className: "pay-button", style: { margin: "0px" }, type: "submit" }, "$1.35"))), /* @__PURE__ */ import_react12.default.createElement("div", { id: "card", style: { display: activetab === "card" ? "block" : "none" }, className: "tabcontent" }, /* @__PURE__ */ import_react12.default.createElement("form", { id: "PaymentForm", onSubmit: submitFunc }, /* @__PURE__ */ import_react12.default.createElement("div", { className: "form-group" }, /* @__PURE__ */ import_react12.default.createElement("label", { htmlFor: "cardHolderName" }, "Name on Card"), /* @__PURE__ */ import_react12.default.createElement("input", { type: "text", className: "form-control", maxLength: 100, placeholder: "John Doe", value: cardData == null ? void 0 : cardData.cardName, onChange: (e) => handleCardChange("cardName", e.target.value) }), (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */ import_react12.default.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.cardName)), /* @__PURE__ */ import_react12.default.createElement("div", { className: "form-group" }, /* @__PURE__ */ import_react12.default.createElement("label", { htmlFor: "cardNumber" }, "Card Number"), /* @__PURE__ */ import_react12.default.createElement("div", { className: "toggle-num-wrapper" }, /* @__PURE__ */ import_react12.default.createElement(
|
2503
|
+
}, style: { backgroundColor: activetab === "ach" ? "#fff" : "inherit" } }, "ACH"))) : /* @__PURE__ */ import_react12.default.createElement("div", null, /* @__PURE__ */ import_react12.default.createElement("p", { className: "charge-customer-name" }, " Charge ", paymentData == null ? void 0 : paymentData.customer_name), /* @__PURE__ */ import_react12.default.createElement("p", { className: "card-ach-heading" }, " Cards/ACH")), /* @__PURE__ */ import_react12.default.createElement("div", { id: "ach", style: { display: activetab === "cardList" ? "block" : "none" }, className: "tabcontent" }, /* @__PURE__ */ import_react12.default.createElement("div", { className: "card-lint-div-in" }, /* @__PURE__ */ import_react12.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_react12.default.createElement("div", { className: "card-list-single-div", key: index }, /* @__PURE__ */ import_react12.default.createElement("div", { className: "card-number-radio" }, /* @__PURE__ */ import_react12.default.createElement(
|
2504
|
+
"input",
|
2505
|
+
{
|
2506
|
+
type: "radio",
|
2507
|
+
className: "cardRadio",
|
2508
|
+
name: "selected_card",
|
2509
|
+
id: "",
|
2510
|
+
checked: selectedCard === card,
|
2511
|
+
onChange: (e) => setSelectedCard(card)
|
2512
|
+
}
|
2513
|
+
), /* @__PURE__ */ import_react12.default.createElement("label", { htmlFor: "", className: "card-number-last-four" }, "**** ", card == null ? void 0 : card.cardlastfourdigit), /* @__PURE__ */ import_react12.default.createElement("h6", { className: "card-expiry-date" }, card == null ? void 0 : card.expmonth, "/", card == null ? void 0 : card.expyear)), /* @__PURE__ */ import_react12.default.createElement("div", { className: "card-number-radio" }, /* @__PURE__ */ import_react12.default.createElement("span", { className: "visa-card" }, /* @__PURE__ */ import_react12.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_react12.default.createElement("span", { className: "visa-card", style: { cursor: "pointer" }, onClick: () => handleDeleteCard(card == null ? void 0 : card.id) }, /* @__PURE__ */ import_react12.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/Trash.svg", alt: "" }))))))), /* @__PURE__ */ import_react12.default.createElement("div", { className: "pay-with-other-card ", onClick: () => setActive("card") }, "Pay With Other Card", /* @__PURE__ */ import_react12.default.createElement("img", { src: "https://dev-widget.fractalpay.com/images/card.svg", alt: "" }))), /* @__PURE__ */ import_react12.default.createElement("div", { className: "form-group" }, /* @__PURE__ */ import_react12.default.createElement("button", { className: "pay-button", style: { margin: "0px" }, type: "submit", onClick: handlechargeCustomer }, "$1.35"))), /* @__PURE__ */ import_react12.default.createElement("div", { id: "card", style: { display: activetab === "card" ? "block" : "none" }, className: "tabcontent" }, /* @__PURE__ */ import_react12.default.createElement("form", { id: "PaymentForm", onSubmit: submitFunc }, /* @__PURE__ */ import_react12.default.createElement("div", { className: "ach-scrl", style: { maxHeight: "380px", overflow: "auto", marginRight: "5px" } }, /* @__PURE__ */ import_react12.default.createElement("div", { className: "form-group" }, /* @__PURE__ */ import_react12.default.createElement("label", { htmlFor: "cardHolderName" }, "Name on Card"), /* @__PURE__ */ import_react12.default.createElement("input", { type: "text", className: "form-control", maxLength: 100, placeholder: "John Doe", value: cardData == null ? void 0 : cardData.cardName, onChange: (e) => handleCardChange("cardName", e.target.value) }), (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */ import_react12.default.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.cardName)), /* @__PURE__ */ import_react12.default.createElement("div", { className: "form-group" }, /* @__PURE__ */ import_react12.default.createElement("label", { htmlFor: "cardNumber" }, "Card Number"), /* @__PURE__ */ import_react12.default.createElement("div", { className: "toggle-num-wrapper" }, /* @__PURE__ */ import_react12.default.createElement(
|
2300
2514
|
"input",
|
2301
2515
|
{
|
2302
2516
|
className: "form-control card-number-new",
|
@@ -2349,11 +2563,11 @@ function GetPaymentPage(props) {
|
|
2349
2563
|
maxLength: 100,
|
2350
2564
|
placeholder: "OID123456",
|
2351
2565
|
disabled: true,
|
2352
|
-
value: (
|
2566
|
+
value: (_c = cardData == null ? void 0 : cardData.orderId) != null ? _c : "OID123456",
|
2353
2567
|
onChange: (e) => handleCardChange("orderId", e.target.value),
|
2354
2568
|
style: { background: "#F6F6F7", color: "#727272" }
|
2355
2569
|
}
|
2356
|
-
)), /* @__PURE__ */ import_react12.default.createElement("div", { className: "form-group" }, /* @__PURE__ */ import_react12.default.createElement("label", { htmlFor: "zip" }, "ZIP"), /* @__PURE__ */ import_react12.default.createElement("input", { type: "text", className: "form-control", maxLength: 100, placeholder: "000000", value: (
|
2570
|
+
)), /* @__PURE__ */ import_react12.default.createElement("div", { className: "form-group" }, /* @__PURE__ */ import_react12.default.createElement("label", { htmlFor: "zip" }, "ZIP"), /* @__PURE__ */ import_react12.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_react12.default.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.zipCode)), /* @__PURE__ */ import_react12.default.createElement("div", { className: "form-group" }, /* @__PURE__ */ import_react12.default.createElement("div", { style: { display: "flex", alignItems: "center", gap: "10px", paddingTop: "10px" } }, /* @__PURE__ */ import_react12.default.createElement(
|
2357
2571
|
"input",
|
2358
2572
|
{
|
2359
2573
|
type: "checkbox",
|
@@ -2362,7 +2576,7 @@ function GetPaymentPage(props) {
|
|
2362
2576
|
checked: saveCardInfo,
|
2363
2577
|
onChange: (e) => setSaveCardInfo(e.target.checked)
|
2364
2578
|
}
|
2365
|
-
), /* @__PURE__ */ import_react12.default.createElement("label", { htmlFor: "save_card", className: "toggle-label" }), /* @__PURE__ */ import_react12.default.createElement("label", { htmlFor: "save_card" }, "Save card for future payments"))), /* @__PURE__ */ import_react12.default.createElement("div", { className: "form-group", style: { marginTop: "20px" } }, /* @__PURE__ */ import_react12.default.createElement("button", { type: "submit", style: { margin: 0 }, className: "pay-button" }, "$1.35")))), /* @__PURE__ */ import_react12.default.createElement("div", { id: "ach", style: { display: activetab === "ach" ? "block" : "none" }, className: "tabcontent" }, /* @__PURE__ */ import_react12.default.createElement("form", { id: "ACHPaymentForm", onSubmit: submitFunc }, /* @__PURE__ */ import_react12.default.createElement("div", { className: "ach-scrl" }, /* @__PURE__ */ import_react12.default.createElement("div", { className: "form-group mb-4" }, /* @__PURE__ */ import_react12.default.createElement("label", { htmlFor: "nameonaccount" }, "Name on account"), /* @__PURE__ */ import_react12.default.createElement("input", { type: "text", id: "nameonaccount", className: "form-control", maxLength: 100, placeholder: "John Doe", name: "name", value: (
|
2579
|
+
), /* @__PURE__ */ import_react12.default.createElement("label", { htmlFor: "save_card", className: "toggle-label" }), /* @__PURE__ */ import_react12.default.createElement("label", { htmlFor: "save_card" }, "Save card for future payments")))), /* @__PURE__ */ import_react12.default.createElement("div", { className: "form-group", style: { marginTop: "20px" } }, /* @__PURE__ */ import_react12.default.createElement("button", { type: "submit", style: { margin: 0 }, className: "pay-button" }, "$1.35")))), /* @__PURE__ */ import_react12.default.createElement("div", { id: "ach", style: { display: activetab === "ach" ? "block" : "none" }, className: "tabcontent" }, /* @__PURE__ */ import_react12.default.createElement("form", { id: "ACHPaymentForm", onSubmit: submitFunc }, /* @__PURE__ */ import_react12.default.createElement("div", { className: "ach-scrl" }, /* @__PURE__ */ import_react12.default.createElement("div", { className: "form-group mb-4" }, /* @__PURE__ */ import_react12.default.createElement("label", { htmlFor: "nameonaccount" }, "Name on account"), /* @__PURE__ */ import_react12.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_react12.default.createElement("span", { className: "error-span" }, achError == null ? void 0 : achError.name)), /* @__PURE__ */ import_react12.default.createElement("div", { className: "form-group mb-4" }, /* @__PURE__ */ import_react12.default.createElement("label", { htmlFor: "routingnumber" }, "Routing number"), /* @__PURE__ */ import_react12.default.createElement(
|
2366
2580
|
"input",
|
2367
2581
|
{
|
2368
2582
|
type: "text",
|
@@ -2371,7 +2585,7 @@ function GetPaymentPage(props) {
|
|
2371
2585
|
maxLength: 9,
|
2372
2586
|
placeholder: "000000000",
|
2373
2587
|
name: "routingNumber",
|
2374
|
-
value: (
|
2588
|
+
value: (_f = achData == null ? void 0 : achData.routingNumber) != null ? _f : "",
|
2375
2589
|
onChange: handleChangeAch
|
2376
2590
|
}
|
2377
2591
|
), (achError == null ? void 0 : achError.routingNumber) && /* @__PURE__ */ import_react12.default.createElement("span", { className: "error-span" }, achError == null ? void 0 : achError.routingNumber)), /* @__PURE__ */ import_react12.default.createElement("div", { className: "form-group mb-4" }, /* @__PURE__ */ import_react12.default.createElement("label", { htmlFor: "accountnumber" }, "Account number"), /* @__PURE__ */ import_react12.default.createElement(
|
@@ -2383,7 +2597,7 @@ function GetPaymentPage(props) {
|
|
2383
2597
|
maxLength: 16,
|
2384
2598
|
placeholder: "0000000000",
|
2385
2599
|
name: "accountNumber",
|
2386
|
-
value: (
|
2600
|
+
value: (_g = achData == null ? void 0 : achData.accountNumber) != null ? _g : "",
|
2387
2601
|
onChange: handleChangeAch
|
2388
2602
|
}
|
2389
2603
|
), (achError == null ? void 0 : achError.accountNumber) && /* @__PURE__ */ import_react12.default.createElement("span", { className: "error-span" }, achError == null ? void 0 : achError.accountNumber)), /* @__PURE__ */ import_react12.default.createElement("div", { className: "form-group mb-4" }, /* @__PURE__ */ import_react12.default.createElement("label", { htmlFor: "confirmaccountnumber" }, "Confirm account number"), /* @__PURE__ */ import_react12.default.createElement(
|
@@ -2395,7 +2609,7 @@ function GetPaymentPage(props) {
|
|
2395
2609
|
maxLength: 16,
|
2396
2610
|
placeholder: "0000000000",
|
2397
2611
|
name: "confirmAccountNumber",
|
2398
|
-
value: (
|
2612
|
+
value: (_h = achData == null ? void 0 : achData.confirmAccountNumber) != null ? _h : "",
|
2399
2613
|
onChange: handleChangeAch
|
2400
2614
|
}
|
2401
2615
|
), (achError == null ? void 0 : achError.confirmAccountNumber) && /* @__PURE__ */ import_react12.default.createElement("span", { className: "error-span" }, achError == null ? void 0 : achError.confirmAccountNumber)), /* @__PURE__ */ import_react12.default.createElement("div", { className: "form-group mb-4" }, /* @__PURE__ */ import_react12.default.createElement("label", { htmlFor: "bankname" }, "Bank name"), /* @__PURE__ */ import_react12.default.createElement(
|
@@ -2407,10 +2621,10 @@ function GetPaymentPage(props) {
|
|
2407
2621
|
maxLength: 100,
|
2408
2622
|
placeholder: "My Bank",
|
2409
2623
|
name: "bankName",
|
2410
|
-
value: (
|
2624
|
+
value: (_i = achData == null ? void 0 : achData.bankName) != null ? _i : "",
|
2411
2625
|
onChange: handleChangeAch
|
2412
2626
|
}
|
2413
|
-
), (achError == null ? void 0 : achError.bankName) && /* @__PURE__ */ import_react12.default.createElement("span", { className: "error-span" }, achError == null ? void 0 : achError.bankName)), /* @__PURE__ */ import_react12.default.createElement("div", { className: "form-group mb-4" }, /* @__PURE__ */ import_react12.default.createElement("label", { htmlFor: "accounttype" }, "Select account type"), /* @__PURE__ */ import_react12.default.createElement("select", { name: "accountType", id: "accounttype", className: "form-control", value: (
|
2627
|
+
), (achError == null ? void 0 : achError.bankName) && /* @__PURE__ */ import_react12.default.createElement("span", { className: "error-span" }, achError == null ? void 0 : achError.bankName)), /* @__PURE__ */ import_react12.default.createElement("div", { className: "form-group mb-4" }, /* @__PURE__ */ import_react12.default.createElement("label", { htmlFor: "accounttype" }, "Select account type"), /* @__PURE__ */ import_react12.default.createElement("select", { name: "accountType", id: "accounttype", className: "form-control", value: (_j = achData == null ? void 0 : achData.accountType) != null ? _j : "", onChange: handleChangeAch }, /* @__PURE__ */ import_react12.default.createElement("option", { value: "" }, "Select account"), /* @__PURE__ */ import_react12.default.createElement("option", { value: "Personal Saving" }, "Personal Saving"), /* @__PURE__ */ import_react12.default.createElement("option", { value: "Business Saving" }, "Business Saving"), /* @__PURE__ */ import_react12.default.createElement("option", { value: "Personal Checking" }, "Personal Checking"), /* @__PURE__ */ import_react12.default.createElement("option", { value: "Business Checking" }, "Business Checking"))), /* @__PURE__ */ import_react12.default.createElement("div", { className: "form-group mb-4", style: { paddingTop: "5px" } }, /* @__PURE__ */ import_react12.default.createElement("input", { type: "checkbox", id: "saveACH", className: "", maxLength: 100, placeholder: "My Bank", checked: saveACHinfo, onChange: (e) => setSaveACHinfo(e.target.checked) }), /* @__PURE__ */ import_react12.default.createElement("label", { htmlFor: "saveACH" }, "Save ACH")), saveACHinfo && /* @__PURE__ */ import_react12.default.createElement("div", { className: "form-group mb-4", style: { fontSize: "12px", color: "#727272" } }, /* @__PURE__ */ import_react12.default.createElement("p", null, "If checked, I agree for ", /* @__PURE__ */ import_react12.default.createElement("b", null, "ecommerce"), " to have my permission to charge this credit card for agreed upon purchases in the future."))), /* @__PURE__ */ import_react12.default.createElement("div", { className: "form-group" }, /* @__PURE__ */ import_react12.default.createElement("button", { className: "pay-button", style: { margin: "20px 0 0" }, type: "submit" }, "$1.35"))))))))))
|
2414
2628
|
)));
|
2415
2629
|
}
|
2416
2630
|
// Annotate the CommonJS export names for ESM import in node:
|
package/dist/index.mjs
CHANGED
@@ -17,6 +17,18 @@ var __spreadValues = (a, b) => {
|
|
17
17
|
return a;
|
18
18
|
};
|
19
19
|
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
20
|
+
var __objRest = (source, exclude) => {
|
21
|
+
var target = {};
|
22
|
+
for (var prop in source)
|
23
|
+
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
24
|
+
target[prop] = source[prop];
|
25
|
+
if (source != null && __getOwnPropSymbols)
|
26
|
+
for (var prop of __getOwnPropSymbols(source)) {
|
27
|
+
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
28
|
+
target[prop] = source[prop];
|
29
|
+
}
|
30
|
+
return target;
|
31
|
+
};
|
20
32
|
|
21
33
|
// src/app/components/RequestPayment/RequestPayment.tsx
|
22
34
|
import "bootstrap/dist/js/bootstrap.bundle.min.js";
|
@@ -121,8 +133,8 @@ var Loader = (props) => {
|
|
121
133
|
var Loader_default = Loader;
|
122
134
|
|
123
135
|
// src/app/components/baseurl.ts
|
136
|
+
var baseUrl = "http://192.168.1.62:8082/";
|
124
137
|
var masterBaseUrl = "https://dev-sky-node.fractalpay.com/";
|
125
|
-
var baseUrl = "https://dev-widget.fractalpay.com/";
|
126
138
|
|
127
139
|
// src/app/components/Errortext.ts
|
128
140
|
var ErrorText = {
|
@@ -1147,7 +1159,7 @@ function RequestPreAuthPayment(props) {
|
|
1147
1159
|
}
|
1148
1160
|
|
1149
1161
|
// src/app/components/Charge/GetPaymentPage.tsx
|
1150
|
-
import React11, { useState as useState3 } from "react";
|
1162
|
+
import React11, { useEffect as useEffect4, useState as useState3 } from "react";
|
1151
1163
|
|
1152
1164
|
// src/app/components/Charge/Chargewidgetstyles.tsx
|
1153
1165
|
import React8 from "react";
|
@@ -1937,12 +1949,28 @@ function DataScript() {
|
|
1937
1949
|
console.log("\u2139\uFE0F Script already in DOM, waiting for Datacap...");
|
1938
1950
|
}
|
1939
1951
|
}, []);
|
1952
|
+
useEffect3(() => {
|
1953
|
+
const scriptId = "forge-cdn-script";
|
1954
|
+
if (!document.getElementById(scriptId)) {
|
1955
|
+
const forgeScript = document.createElement("script");
|
1956
|
+
forgeScript.src = "https://cdn.jsdelivr.net/npm/node-forge@1.0.0/dist/forge.min.js";
|
1957
|
+
forgeScript.id = scriptId;
|
1958
|
+
forgeScript.async = true;
|
1959
|
+
document.head.appendChild(forgeScript);
|
1960
|
+
}
|
1961
|
+
return () => {
|
1962
|
+
const existingScript = document.getElementById(scriptId);
|
1963
|
+
if (existingScript) {
|
1964
|
+
document.head.removeChild(existingScript);
|
1965
|
+
}
|
1966
|
+
};
|
1967
|
+
}, []);
|
1940
1968
|
return null;
|
1941
1969
|
}
|
1942
1970
|
|
1943
1971
|
// src/app/components/Charge/GetPaymentPage.tsx
|
1944
1972
|
function GetPaymentPage(props) {
|
1945
|
-
var _a, _b, _c, _d, _e, _f, _g, _h;
|
1973
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
|
1946
1974
|
const [loading, setLoading] = useState3(false);
|
1947
1975
|
const [success, setSuccess] = useState3(false);
|
1948
1976
|
const [show, setShow] = useState3(false);
|
@@ -1954,21 +1982,9 @@ function GetPaymentPage(props) {
|
|
1954
1982
|
const [cardError, setCardError] = useState3({});
|
1955
1983
|
const [achData, setAchData] = useState3();
|
1956
1984
|
const [achError, setAchError] = useState3({});
|
1957
|
-
const [cardList, setCardList] = useState3([
|
1958
|
-
|
1959
|
-
|
1960
|
-
{ cardNumber: "9876789878999874", expMonth: "11", expYear: "2028", cardType: "visa" },
|
1961
|
-
{ cardNumber: "9876789878999873", expMonth: "08", expYear: "2029", cardType: "visa" },
|
1962
|
-
{ cardNumber: "9876789878999345", expMonth: "10", expYear: "2026", cardType: "visa" },
|
1963
|
-
{ cardNumber: "9876789878999434", expMonth: "05", expYear: "2028", cardType: "visa" },
|
1964
|
-
{ cardNumber: "9876789878999852", expMonth: "07", expYear: "2027", cardType: "visa" },
|
1965
|
-
{ cardNumber: "9876789878994546", expMonth: "04", expYear: "2029", cardType: "visa" },
|
1966
|
-
{ cardNumber: "9876789878999743", expMonth: "09", expYear: "2026", cardType: "visa" },
|
1967
|
-
{ cardNumber: "9876789878997323", expMonth: "12", expYear: "2028", cardType: "visa" },
|
1968
|
-
{ cardNumber: "9876789878998979", expMonth: "07", expYear: "2027", cardType: "visa" },
|
1969
|
-
{ cardNumber: "9876789878992348", expMonth: "03", expYear: "2029", cardType: "visa" },
|
1970
|
-
{ cardNumber: "9876789878999465", expMonth: "01", expYear: "2026", cardType: "visa" }
|
1971
|
-
]);
|
1985
|
+
const [cardList, setCardList] = useState3([]);
|
1986
|
+
const [selectedCard, setSelectedCard] = useState3();
|
1987
|
+
const [paymentData, setPaymentData] = useState3();
|
1972
1988
|
const showLoader = () => setLoading(true);
|
1973
1989
|
const hideLoader = () => setLoading(false);
|
1974
1990
|
const showError = (msz) => {
|
@@ -2087,7 +2103,7 @@ function GetPaymentPage(props) {
|
|
2087
2103
|
return Object.keys(errors).length > 0;
|
2088
2104
|
};
|
2089
2105
|
const validateAchData = () => {
|
2090
|
-
var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2,
|
2106
|
+
var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2;
|
2091
2107
|
const errors = {};
|
2092
2108
|
const data = achData;
|
2093
2109
|
if (!((_a2 = data == null ? void 0 : data.name) == null ? void 0 : _a2.trim())) errors.name = "Name is required";
|
@@ -2096,7 +2112,7 @@ function GetPaymentPage(props) {
|
|
2096
2112
|
if (!((_f2 = data == null ? void 0 : data.bankName) == null ? void 0 : _f2.trim())) errors.bankName = "Bank name is required";
|
2097
2113
|
if (!((_g2 = data == null ? void 0 : data.routingNumber) == null ? void 0 : _g2.trim())) errors.routingNumber = "Routing Number is required";
|
2098
2114
|
if ((data == null ? void 0 : data.routingNumber) && ((_h2 = data == null ? void 0 : data.routingNumber) == null ? void 0 : _h2.length) !== 9) errors.routingNumber = "Routing number must be 9 digits";
|
2099
|
-
if (((
|
2115
|
+
if (((_i2 = data == null ? void 0 : data.routingNumber) == null ? void 0 : _i2.length) == 9) {
|
2100
2116
|
let routingNumber = data == null ? void 0 : data.routingNumber;
|
2101
2117
|
const weights = [3, 7, 1];
|
2102
2118
|
let sum = 0;
|
@@ -2112,7 +2128,7 @@ function GetPaymentPage(props) {
|
|
2112
2128
|
return Object.keys(errors).length > 0;
|
2113
2129
|
};
|
2114
2130
|
const submitFunc = async (e) => {
|
2115
|
-
var _a2, _b2, _c2, _d2, _e2;
|
2131
|
+
var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
|
2116
2132
|
e.preventDefault();
|
2117
2133
|
if (activetab !== "ach") {
|
2118
2134
|
const hasError = validateCardData();
|
@@ -2131,13 +2147,14 @@ function GetPaymentPage(props) {
|
|
2131
2147
|
try {
|
2132
2148
|
const formData = __spreadProps(__spreadValues({}, cardData), {
|
2133
2149
|
amount: `${props.amount || 0}`,
|
2134
|
-
// fractalpayClientKey : fractalpayClientKey,
|
2135
2150
|
fractalpayPublicKey: fractalpayClientKey
|
2136
2151
|
});
|
2137
2152
|
const result = await axios3.post(`${baseUrl}create-widget-order`, formData);
|
2138
2153
|
console.log(result);
|
2139
2154
|
let tokenCallback = async function(response) {
|
2155
|
+
var _a3, _b3;
|
2140
2156
|
if (response.Error) {
|
2157
|
+
console.log(response == null ? void 0 : response.Error);
|
2141
2158
|
showError(response.Error);
|
2142
2159
|
hideLoader();
|
2143
2160
|
} else {
|
@@ -2165,22 +2182,94 @@ function GetPaymentPage(props) {
|
|
2165
2182
|
} catch (err) {
|
2166
2183
|
console.log(err);
|
2167
2184
|
hideLoader();
|
2168
|
-
showError("
|
2185
|
+
showError(((_b3 = (_a3 = err == null ? void 0 : err.response) == null ? void 0 : _a3.data) == null ? void 0 : _b3.message) || (err == null ? void 0 : err.message) || "Something went wrong..");
|
2169
2186
|
}
|
2170
2187
|
}
|
2171
2188
|
};
|
2172
|
-
if (
|
2173
|
-
|
2189
|
+
if ((paymentData == null ? void 0 : paymentData.paymentGateway) === 32) {
|
2190
|
+
const requestOptions = {
|
2191
|
+
method: "POST",
|
2192
|
+
redirect: "follow"
|
2193
|
+
};
|
2194
|
+
try {
|
2195
|
+
let sesionResult = await axios3.post(`${masterBaseUrl}api/v1/widget/generate-session`, requestOptions);
|
2196
|
+
let expYear = Number(cardData == null ? void 0 : cardData.expiryYear) % 100;
|
2197
|
+
let cardNumber = cardData == null ? void 0 : cardData.cardNumber;
|
2198
|
+
cardNumber = cardNumber == null ? void 0 : cardNumber.replace(/\s+/g, "");
|
2199
|
+
let track2_data = `${cardNumber}=${expYear}${cardData == null ? void 0 : cardData.expiryMonth} ${cardData == null ? void 0 : cardData.cvv}`;
|
2200
|
+
const publicKey = forge.pki.publicKeyFromPem((_b2 = (_a2 = sesionResult == null ? void 0 : sesionResult.data) == null ? void 0 : _a2.data) == null ? void 0 : _b2.publicKeyPem);
|
2201
|
+
const encrypted = publicKey.encrypt(track2_data, "RSA-OAEP", {
|
2202
|
+
md: forge.md.sha1.create(),
|
2203
|
+
mgf1: {
|
2204
|
+
md: forge.md.sha1.create()
|
2205
|
+
}
|
2206
|
+
});
|
2207
|
+
const encryptedBase64 = forge.util.encode64(encrypted);
|
2208
|
+
const myHeaders = {
|
2209
|
+
"Content-Type": "application/json",
|
2210
|
+
"x-app-session-key": (_d2 = (_c2 = sesionResult.data) == null ? void 0 : _c2.data) == null ? void 0 : _d2.session_key
|
2211
|
+
};
|
2212
|
+
const raw = JSON.stringify({
|
2213
|
+
"enc_track2_data": `${encryptedBase64}`,
|
2214
|
+
"algorithm": "RSAES_OAEP_SHA_1",
|
2215
|
+
session_key: `${(_f2 = (_e2 = sesionResult == null ? void 0 : sesionResult.data) == null ? void 0 : _e2.data) == null ? void 0 : _f2.session_key}`
|
2216
|
+
});
|
2217
|
+
try {
|
2218
|
+
const tokenizeData = await axios3.post("https://api-dev.merchant-trends.com/tokenizer/tokenize", raw, { headers: myHeaders });
|
2219
|
+
const reqData = JSON.stringify(__spreadProps(__spreadValues({}, (_g2 = tokenizeData == null ? void 0 : tokenizeData.data) == null ? void 0 : _g2.data), {
|
2220
|
+
isSaveCardChecked: saveCardInfo,
|
2221
|
+
name: cardData == null ? void 0 : cardData.cardName,
|
2222
|
+
postal_code: cardData == null ? void 0 : cardData.zipCode,
|
2223
|
+
customer_id: props == null ? void 0 : props.customerId
|
2224
|
+
}));
|
2225
|
+
const reqData2 = {
|
2226
|
+
"pre_sales_id": `${(_i2 = (_h2 = result == null ? void 0 : result.data) == null ? void 0 : _h2.data) == null ? void 0 : _i2.posSalesIdEncode}`,
|
2227
|
+
"token": `${(_j2 = tokenizeData == null ? void 0 : tokenizeData.data) == null ? void 0 : _j2.data.token}`,
|
2228
|
+
"json_response": `${reqData}`
|
2229
|
+
};
|
2230
|
+
let myHeaders2 = {
|
2231
|
+
"Content-Type": "application/json"
|
2232
|
+
};
|
2233
|
+
const requestOptions2 = __spreadProps(__spreadValues({}, reqData2), {
|
2234
|
+
isChargeviafractal: true
|
2235
|
+
});
|
2236
|
+
try {
|
2237
|
+
let paymentRes = await axios3.post(
|
2238
|
+
`${masterBaseUrl}api/v1/payment-gateway/charge`,
|
2239
|
+
requestOptions2,
|
2240
|
+
{
|
2241
|
+
headers: myHeaders2
|
2242
|
+
}
|
2243
|
+
);
|
2244
|
+
console.log(paymentRes);
|
2245
|
+
if ((_k = paymentRes == null ? void 0 : paymentRes.data) == null ? void 0 : _k.result) {
|
2246
|
+
setSuccess(true);
|
2247
|
+
hideLoader();
|
2248
|
+
}
|
2249
|
+
} catch (err) {
|
2250
|
+
hideLoader();
|
2251
|
+
showError(((_m = (_l = err == null ? void 0 : err.response) == null ? void 0 : _l.data) == null ? void 0 : _m.message) || (err == null ? void 0 : err.message) || "something wrong..s");
|
2252
|
+
}
|
2253
|
+
} catch (err) {
|
2254
|
+
hideLoader();
|
2255
|
+
showError(((_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 wrong..s");
|
2256
|
+
}
|
2257
|
+
} catch (err) {
|
2258
|
+
hideLoader();
|
2259
|
+
showError(((_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 wrong..s");
|
2260
|
+
}
|
2261
|
+
} else {
|
2262
|
+
if (typeof DatacapWebToken !== "undefined") {
|
2263
|
+
DatacapWebToken.requestToken(result == null ? void 0 : result.data.data.dctoken, "PaymentForm", tokenCallback);
|
2264
|
+
}
|
2174
2265
|
}
|
2175
2266
|
} catch (err) {
|
2176
|
-
console.log(err);
|
2177
2267
|
hideLoader();
|
2178
|
-
showError("
|
2268
|
+
showError(((_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 wrong..s");
|
2179
2269
|
}
|
2180
2270
|
}
|
2181
2271
|
}
|
2182
2272
|
} else {
|
2183
|
-
console.log(achData);
|
2184
2273
|
const hasError = validateAchData();
|
2185
2274
|
if (hasError) return;
|
2186
2275
|
else {
|
@@ -2208,13 +2297,13 @@ function GetPaymentPage(props) {
|
|
2208
2297
|
Swal.fire({
|
2209
2298
|
icon: "success",
|
2210
2299
|
title: "Congrats...",
|
2211
|
-
text: (
|
2300
|
+
text: (_t = result == null ? void 0 : result.data) == null ? void 0 : _t.message
|
2212
2301
|
});
|
2213
2302
|
} catch (error) {
|
2214
2303
|
if (axios3.isAxiosError(error)) {
|
2215
2304
|
console.log(error);
|
2216
2305
|
hideLoader();
|
2217
|
-
showError((
|
2306
|
+
showError((_x = (_w = (_v = (_u = error.response) == null ? void 0 : _u.data) == null ? void 0 : _v.message) == null ? void 0 : _w.error) != null ? _x : "Something went wrong");
|
2218
2307
|
} else {
|
2219
2308
|
console.error("Unexpected error", error);
|
2220
2309
|
}
|
@@ -2222,6 +2311,142 @@ function GetPaymentPage(props) {
|
|
2222
2311
|
}
|
2223
2312
|
}
|
2224
2313
|
};
|
2314
|
+
const getPaymentDetails = async () => {
|
2315
|
+
var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2;
|
2316
|
+
showLoader();
|
2317
|
+
try {
|
2318
|
+
const data = {
|
2319
|
+
fractalpayPublicKey: fractalpayClientKey,
|
2320
|
+
"customer_id": props == null ? void 0 : props.customerId
|
2321
|
+
};
|
2322
|
+
let paymentData2 = await axios3.post(`${baseUrl}get-payment-details`, data);
|
2323
|
+
console.log(paymentData2);
|
2324
|
+
setPaymentData((_a2 = paymentData2 == null ? void 0 : paymentData2.data) == null ? void 0 : _a2.data);
|
2325
|
+
if (((_c2 = (_b2 = paymentData2 == null ? void 0 : paymentData2.data) == null ? void 0 : _b2.data) == null ? void 0 : _c2.card_list) && ((_f2 = (_e2 = (_d2 = paymentData2 == null ? void 0 : paymentData2.data) == null ? void 0 : _d2.data) == null ? void 0 : _e2.card_list) == null ? void 0 : _f2.length) > 0) {
|
2326
|
+
setCardList((_h2 = (_g2 = paymentData2 == null ? void 0 : paymentData2.data) == null ? void 0 : _g2.data) == null ? void 0 : _h2.card_list);
|
2327
|
+
} else {
|
2328
|
+
setActive("card");
|
2329
|
+
}
|
2330
|
+
hideLoader();
|
2331
|
+
} catch (err) {
|
2332
|
+
console.log(err);
|
2333
|
+
setActive("card");
|
2334
|
+
hideLoader();
|
2335
|
+
}
|
2336
|
+
};
|
2337
|
+
const handlechargeCustomer = async () => {
|
2338
|
+
var _b2, _c2, _d2, _e2, _f2;
|
2339
|
+
console.log("selected", selectedCard);
|
2340
|
+
let customer_id = props == null ? void 0 : props.customerId;
|
2341
|
+
let discount = props == null ? void 0 : props.discount;
|
2342
|
+
let surcharge = props == null ? void 0 : props.surcharge;
|
2343
|
+
let tax = props == null ? void 0 : props.tax;
|
2344
|
+
let fractalpayPublicKey = props == null ? void 0 : props.fractalpayClientKey;
|
2345
|
+
let order_id = props == null ? void 0 : props.orderID;
|
2346
|
+
let amount = props == null ? void 0 : props.amount;
|
2347
|
+
let card_id = selectedCard == null ? void 0 : selectedCard.id;
|
2348
|
+
let card_type = selectedCard == null ? void 0 : selectedCard.card_type;
|
2349
|
+
if (fractalpayPublicKey && order_id && amount) {
|
2350
|
+
if (customer_id) {
|
2351
|
+
if (card_id) {
|
2352
|
+
let chargeobj = {
|
2353
|
+
amount,
|
2354
|
+
order_id,
|
2355
|
+
customer_id,
|
2356
|
+
card_id,
|
2357
|
+
fractalpayPublicKey,
|
2358
|
+
isCardSave: saveCardInfo,
|
2359
|
+
discount,
|
2360
|
+
surcharge,
|
2361
|
+
tax
|
2362
|
+
};
|
2363
|
+
let _a2 = chargeobj, { isCardSave } = _a2, rest = __objRest(_a2, ["isCardSave"]);
|
2364
|
+
let endpoint = card_type === "Bank" ? "charge-ach" : "charge-by-card";
|
2365
|
+
let chargeurl = baseUrl + endpoint;
|
2366
|
+
const headers = {
|
2367
|
+
"Content-Type": "application/json"
|
2368
|
+
};
|
2369
|
+
showLoader();
|
2370
|
+
try {
|
2371
|
+
let result = await axios3.post(chargeurl, card_type == "Bank" ? rest : chargeobj, { headers });
|
2372
|
+
console.log(result);
|
2373
|
+
if ((_b2 = result == null ? void 0 : result.data) == null ? void 0 : _b2.result) {
|
2374
|
+
setSuccess(true);
|
2375
|
+
hideLoader();
|
2376
|
+
}
|
2377
|
+
} catch (err) {
|
2378
|
+
hideLoader();
|
2379
|
+
console.log(err);
|
2380
|
+
showError(((_d2 = (_c2 = err == null ? void 0 : err.response) == null ? void 0 : _c2.data) == null ? void 0 : _d2.message) || ((_f2 = (_e2 = err == null ? void 0 : err.response) == null ? void 0 : _e2.data) == null ? void 0 : _f2.status) || "Something went erong");
|
2381
|
+
}
|
2382
|
+
} else {
|
2383
|
+
showError("Please Select A Card/ACH");
|
2384
|
+
}
|
2385
|
+
} else {
|
2386
|
+
showError("Please Select Customer");
|
2387
|
+
}
|
2388
|
+
} else {
|
2389
|
+
showError("Something went wrong , Please try again later !!!");
|
2390
|
+
}
|
2391
|
+
};
|
2392
|
+
useEffect4(() => {
|
2393
|
+
if (show && fractalpayClientKey) {
|
2394
|
+
getPaymentDetails();
|
2395
|
+
}
|
2396
|
+
}, [fractalpayClientKey, show]);
|
2397
|
+
const handleDeleteCard = async (cardId) => {
|
2398
|
+
Swal.fire({
|
2399
|
+
icon: "warning",
|
2400
|
+
text: "Do you want to delete the card?",
|
2401
|
+
showCancelButton: true,
|
2402
|
+
confirmButtonText: "Yes",
|
2403
|
+
cancelButtonText: "No",
|
2404
|
+
reverseButtons: true,
|
2405
|
+
buttonsStyling: false,
|
2406
|
+
customClass: {
|
2407
|
+
confirmButton: "swal2-confirm btn btn-dark",
|
2408
|
+
cancelButton: "swal2-cancel btn btn-dark",
|
2409
|
+
popup: "custom-swal-popup",
|
2410
|
+
icon: "custom-swal-icon"
|
2411
|
+
}
|
2412
|
+
}).then(async (result) => {
|
2413
|
+
if (result.isConfirmed) {
|
2414
|
+
showLoader();
|
2415
|
+
try {
|
2416
|
+
let obj = {
|
2417
|
+
card_id: cardId,
|
2418
|
+
customer_id: props == null ? void 0 : props.customerId,
|
2419
|
+
fractalpayPublicKey: props == null ? void 0 : props.fractalpayClientKey
|
2420
|
+
};
|
2421
|
+
const res = await axios3.post(`${baseUrl}delete-customer-card`, obj);
|
2422
|
+
hideLoader();
|
2423
|
+
getPaymentDetails();
|
2424
|
+
console.log("Deleted:", res);
|
2425
|
+
Swal.fire({
|
2426
|
+
icon: "success",
|
2427
|
+
title: "Deleted!",
|
2428
|
+
text: "The card has been deleted.",
|
2429
|
+
confirmButtonText: "OK",
|
2430
|
+
customClass: {
|
2431
|
+
confirmButton: "btn btn-dark"
|
2432
|
+
}
|
2433
|
+
});
|
2434
|
+
} catch (err) {
|
2435
|
+
hideLoader();
|
2436
|
+
console.error("Error:", err);
|
2437
|
+
Swal.fire({
|
2438
|
+
icon: "error",
|
2439
|
+
title: "Error!",
|
2440
|
+
text: "Failed to delete the card.",
|
2441
|
+
confirmButtonText: "OK",
|
2442
|
+
customClass: {
|
2443
|
+
confirmButton: "btn btn-dark"
|
2444
|
+
}
|
2445
|
+
});
|
2446
|
+
}
|
2447
|
+
}
|
2448
|
+
});
|
2449
|
+
};
|
2225
2450
|
return /* @__PURE__ */ React11.createElement(React11.Fragment, null, /* @__PURE__ */ React11.createElement(DataScript, null), /* @__PURE__ */ React11.createElement(Chargewidgetstyles, null), /* @__PURE__ */ React11.createElement(React11.Fragment, null, /* @__PURE__ */ React11.createElement(
|
2226
2451
|
"button",
|
2227
2452
|
{
|
@@ -2236,32 +2461,21 @@ function GetPaymentPage(props) {
|
|
2236
2461
|
onClose: handleClose
|
2237
2462
|
},
|
2238
2463
|
/* @__PURE__ */ React11.createElement(Loader_default, { loading }),
|
2239
|
-
success ? /* @__PURE__ */ React11.createElement(SuccessMsz, { onClose: handleCloseSeccess }) : /* @__PURE__ */ React11.createElement("div", null, /* @__PURE__ */ React11.createElement("div", null, /* @__PURE__ */ React11.createElement("span", { className: "request-payment-close-popup", onClick: handleClose }, /* @__PURE__ */ React11.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, /* @__PURE__ */ React11.createElement("g", { "clip-path": "url(#clip0_12425_52336)" }, /* @__PURE__ */ React11.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__ */ React11.createElement("defs", null, /* @__PURE__ */ React11.createElement("clipPath", { id: "clip0_12425_52336" }, /* @__PURE__ */ React11.createElement("rect", { width: "16", height: "16", fill: "white" }))))), /* @__PURE__ */ React11.createElement("div", { className: "pay-container" }, /* @__PURE__ */ React11.createElement("div", { className: "pay-header pay-conatiner-one" }, /* @__PURE__ */ React11.createElement("div", { className: "pay-logo-container" }, /* @__PURE__ */ React11.createElement("div", { className: "pay-main-logo" }, /* @__PURE__ */ React11.createElement("img", { src: "https://fractal-userdata-upload.s3.us-east-1.amazonaws.com/uploaded/merchant_logo/20250311131124_merchant_logo.png", id: "pay-logos" })), /* @__PURE__ */ React11.createElement("h1", { className: "pay-heading" }, "Pay")), /* @__PURE__ */ React11.createElement("div", { className: "pay-amount-conatiner" }, /* @__PURE__ */ React11.createElement("small", { className: "pay-payment-amount" }, "Payment Amount"), /* @__PURE__ */ React11.createElement("strong", { className: "pay-amount" }, "$1.35")), activetab != "ach" && /* @__PURE__ */ React11.createElement("div", { style: { display: "flex", gap: "8px", margin: "8px 0" } }, /* @__PURE__ */ React11.createElement("img", { src: "https://dev-widget.fractalpay.com/images/visa-img.svg", alt: "", width: 33 }), /* @__PURE__ */ React11.createElement("img", { src: "https://dev-widget.fractalpay.com/images/mc-img.svg", width: 33, alt: "" }), /* @__PURE__ */ React11.createElement("img", { src: "https://dev-widget.fractalpay.com/images/ae-img.svg", alt: "", width: 33 }), /* @__PURE__ */ React11.createElement("img", { src: "https://dev-widget.fractalpay.com/images/discover-img.svg", width: 33, alt: "" }))), /* @__PURE__ */ React11.createElement("div", { className: "pay-tab pay-conatiner-two" }, /* @__PURE__ */ React11.createElement("div", { className: "col-md-12" }, /* @__PURE__ */ React11.createElement("div", { id: "payment-form-div" }, activetab !== "cardList" ? /* @__PURE__ */ React11.createElement("div", null, /* @__PURE__ */ React11.createElement("button", { className: "charge-payment-back-btn ", onClick: () => setActive("cardList") }, " ", /* @__PURE__ */ React11.createElement(IoArrowBack, null), " Back"), /* @__PURE__ */ React11.createElement("div", { className: "tab" }, /* @__PURE__ */ React11.createElement("button", { className: "tablinks", onClick: (e) => {
|
2464
|
+
success ? /* @__PURE__ */ React11.createElement(SuccessMsz, { onClose: handleCloseSeccess }) : /* @__PURE__ */ React11.createElement("div", null, /* @__PURE__ */ React11.createElement("div", null, /* @__PURE__ */ React11.createElement("span", { className: "request-payment-close-popup", onClick: handleClose }, /* @__PURE__ */ React11.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, /* @__PURE__ */ React11.createElement("g", { "clip-path": "url(#clip0_12425_52336)" }, /* @__PURE__ */ React11.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__ */ React11.createElement("defs", null, /* @__PURE__ */ React11.createElement("clipPath", { id: "clip0_12425_52336" }, /* @__PURE__ */ React11.createElement("rect", { width: "16", height: "16", fill: "white" }))))), /* @__PURE__ */ React11.createElement("div", { className: "pay-container" }, /* @__PURE__ */ React11.createElement("div", { className: "pay-header pay-conatiner-one" }, /* @__PURE__ */ React11.createElement("div", { className: "pay-logo-container" }, /* @__PURE__ */ React11.createElement("div", { className: "pay-main-logo" }, /* @__PURE__ */ React11.createElement("img", { src: "https://fractal-userdata-upload.s3.us-east-1.amazonaws.com/uploaded/merchant_logo/20250311131124_merchant_logo.png", id: "pay-logos" })), /* @__PURE__ */ React11.createElement("h1", { className: "pay-heading" }, "Pay")), /* @__PURE__ */ React11.createElement("div", { className: "pay-amount-conatiner" }, /* @__PURE__ */ React11.createElement("small", { className: "pay-payment-amount" }, "Payment Amount"), /* @__PURE__ */ React11.createElement("strong", { className: "pay-amount" }, "$1.35")), activetab != "ach" && /* @__PURE__ */ React11.createElement("div", { style: { display: "flex", gap: "8px", margin: "8px 0" } }, /* @__PURE__ */ React11.createElement("img", { src: "https://dev-widget.fractalpay.com/images/visa-img.svg", alt: "", width: 33 }), /* @__PURE__ */ React11.createElement("img", { src: "https://dev-widget.fractalpay.com/images/mc-img.svg", width: 33, alt: "" }), /* @__PURE__ */ React11.createElement("img", { src: "https://dev-widget.fractalpay.com/images/ae-img.svg", alt: "", width: 33 }), /* @__PURE__ */ React11.createElement("img", { src: "https://dev-widget.fractalpay.com/images/discover-img.svg", width: 33, alt: "" }))), /* @__PURE__ */ React11.createElement("div", { className: "pay-tab pay-conatiner-two" }, /* @__PURE__ */ React11.createElement("div", { className: "col-md-12" }, /* @__PURE__ */ React11.createElement("div", { id: "payment-form-div" }, activetab !== "cardList" ? /* @__PURE__ */ React11.createElement("div", null, (cardList == null ? void 0 : cardList.length) > 0 && /* @__PURE__ */ React11.createElement("button", { className: "charge-payment-back-btn ", onClick: () => setActive("cardList") }, " ", /* @__PURE__ */ React11.createElement(IoArrowBack, null), " Back"), /* @__PURE__ */ React11.createElement("div", { className: "tab" }, /* @__PURE__ */ React11.createElement("button", { className: "tablinks", onClick: (e) => {
|
2240
2465
|
handletabchange("card");
|
2241
2466
|
}, style: { backgroundColor: activetab === "card" ? "#fff" : "inherit" } }, "Card"), /* @__PURE__ */ React11.createElement("button", { className: "tablinks", onClick: (e) => {
|
2242
2467
|
handletabchange("ach");
|
2243
|
-
}, style: { backgroundColor: activetab === "ach" ? "#fff" : "inherit" } }, "ACH"))) : /* @__PURE__ */ React11.createElement("div", null, /* @__PURE__ */ React11.createElement("p", { className: "charge-customer-name" }, " Charge
|
2244
|
-
|
2245
|
-
|
2246
|
-
|
2247
|
-
|
2248
|
-
|
2249
|
-
|
2250
|
-
|
2251
|
-
|
2252
|
-
|
2253
|
-
|
2254
|
-
buttonsStyling: false,
|
2255
|
-
// disables default styling
|
2256
|
-
customClass: {
|
2257
|
-
confirmButton: "swal2-confirm btn btn-dark",
|
2258
|
-
cancelButton: "swal2-cancel btn btn-dark",
|
2259
|
-
popup: "custom-swal-popup",
|
2260
|
-
icon: "custom-swal-icon"
|
2261
|
-
}
|
2262
|
-
});
|
2263
|
-
} }, /* @__PURE__ */ React11.createElement("img", { src: "https://dev-widget.fractalpay.com/images/Trash.svg", alt: "" }))));
|
2264
|
-
})), /* @__PURE__ */ React11.createElement("div", { className: "pay-with-other-card ", onClick: () => setActive("card") }, "Pay With Other Card", /* @__PURE__ */ React11.createElement("img", { src: "https://dev-widget.fractalpay.com/images/card.svg", alt: "" }))), /* @__PURE__ */ React11.createElement("div", { className: "form-group" }, /* @__PURE__ */ React11.createElement("button", { className: "pay-button", style: { margin: "0px" }, type: "submit" }, "$1.35"))), /* @__PURE__ */ React11.createElement("div", { id: "card", style: { display: activetab === "card" ? "block" : "none" }, className: "tabcontent" }, /* @__PURE__ */ React11.createElement("form", { id: "PaymentForm", onSubmit: submitFunc }, /* @__PURE__ */ React11.createElement("div", { className: "form-group" }, /* @__PURE__ */ React11.createElement("label", { htmlFor: "cardHolderName" }, "Name on Card"), /* @__PURE__ */ React11.createElement("input", { type: "text", className: "form-control", maxLength: 100, placeholder: "John Doe", value: cardData == null ? void 0 : cardData.cardName, onChange: (e) => handleCardChange("cardName", e.target.value) }), (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */ React11.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.cardName)), /* @__PURE__ */ React11.createElement("div", { className: "form-group" }, /* @__PURE__ */ React11.createElement("label", { htmlFor: "cardNumber" }, "Card Number"), /* @__PURE__ */ React11.createElement("div", { className: "toggle-num-wrapper" }, /* @__PURE__ */ React11.createElement(
|
2468
|
+
}, style: { backgroundColor: activetab === "ach" ? "#fff" : "inherit" } }, "ACH"))) : /* @__PURE__ */ React11.createElement("div", null, /* @__PURE__ */ React11.createElement("p", { className: "charge-customer-name" }, " Charge ", paymentData == null ? void 0 : paymentData.customer_name), /* @__PURE__ */ React11.createElement("p", { className: "card-ach-heading" }, " Cards/ACH")), /* @__PURE__ */ React11.createElement("div", { id: "ach", style: { display: activetab === "cardList" ? "block" : "none" }, className: "tabcontent" }, /* @__PURE__ */ React11.createElement("div", { className: "card-lint-div-in" }, /* @__PURE__ */ React11.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__ */ React11.createElement("div", { className: "card-list-single-div", key: index }, /* @__PURE__ */ React11.createElement("div", { className: "card-number-radio" }, /* @__PURE__ */ React11.createElement(
|
2469
|
+
"input",
|
2470
|
+
{
|
2471
|
+
type: "radio",
|
2472
|
+
className: "cardRadio",
|
2473
|
+
name: "selected_card",
|
2474
|
+
id: "",
|
2475
|
+
checked: selectedCard === card,
|
2476
|
+
onChange: (e) => setSelectedCard(card)
|
2477
|
+
}
|
2478
|
+
), /* @__PURE__ */ React11.createElement("label", { htmlFor: "", className: "card-number-last-four" }, "**** ", card == null ? void 0 : card.cardlastfourdigit), /* @__PURE__ */ React11.createElement("h6", { className: "card-expiry-date" }, card == null ? void 0 : card.expmonth, "/", card == null ? void 0 : card.expyear)), /* @__PURE__ */ React11.createElement("div", { className: "card-number-radio" }, /* @__PURE__ */ React11.createElement("span", { className: "visa-card" }, /* @__PURE__ */ React11.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__ */ React11.createElement("span", { className: "visa-card", style: { cursor: "pointer" }, onClick: () => handleDeleteCard(card == null ? void 0 : card.id) }, /* @__PURE__ */ React11.createElement("img", { src: "https://dev-widget.fractalpay.com/images/Trash.svg", alt: "" }))))))), /* @__PURE__ */ React11.createElement("div", { className: "pay-with-other-card ", onClick: () => setActive("card") }, "Pay With Other Card", /* @__PURE__ */ React11.createElement("img", { src: "https://dev-widget.fractalpay.com/images/card.svg", alt: "" }))), /* @__PURE__ */ React11.createElement("div", { className: "form-group" }, /* @__PURE__ */ React11.createElement("button", { className: "pay-button", style: { margin: "0px" }, type: "submit", onClick: handlechargeCustomer }, "$1.35"))), /* @__PURE__ */ React11.createElement("div", { id: "card", style: { display: activetab === "card" ? "block" : "none" }, className: "tabcontent" }, /* @__PURE__ */ React11.createElement("form", { id: "PaymentForm", onSubmit: submitFunc }, /* @__PURE__ */ React11.createElement("div", { className: "ach-scrl", style: { maxHeight: "380px", overflow: "auto", marginRight: "5px" } }, /* @__PURE__ */ React11.createElement("div", { className: "form-group" }, /* @__PURE__ */ React11.createElement("label", { htmlFor: "cardHolderName" }, "Name on Card"), /* @__PURE__ */ React11.createElement("input", { type: "text", className: "form-control", maxLength: 100, placeholder: "John Doe", value: cardData == null ? void 0 : cardData.cardName, onChange: (e) => handleCardChange("cardName", e.target.value) }), (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */ React11.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.cardName)), /* @__PURE__ */ React11.createElement("div", { className: "form-group" }, /* @__PURE__ */ React11.createElement("label", { htmlFor: "cardNumber" }, "Card Number"), /* @__PURE__ */ React11.createElement("div", { className: "toggle-num-wrapper" }, /* @__PURE__ */ React11.createElement(
|
2265
2479
|
"input",
|
2266
2480
|
{
|
2267
2481
|
className: "form-control card-number-new",
|
@@ -2314,11 +2528,11 @@ function GetPaymentPage(props) {
|
|
2314
2528
|
maxLength: 100,
|
2315
2529
|
placeholder: "OID123456",
|
2316
2530
|
disabled: true,
|
2317
|
-
value: (
|
2531
|
+
value: (_c = cardData == null ? void 0 : cardData.orderId) != null ? _c : "OID123456",
|
2318
2532
|
onChange: (e) => handleCardChange("orderId", e.target.value),
|
2319
2533
|
style: { background: "#F6F6F7", color: "#727272" }
|
2320
2534
|
}
|
2321
|
-
)), /* @__PURE__ */ React11.createElement("div", { className: "form-group" }, /* @__PURE__ */ React11.createElement("label", { htmlFor: "zip" }, "ZIP"), /* @__PURE__ */ React11.createElement("input", { type: "text", className: "form-control", maxLength: 100, placeholder: "000000", value: (
|
2535
|
+
)), /* @__PURE__ */ React11.createElement("div", { className: "form-group" }, /* @__PURE__ */ React11.createElement("label", { htmlFor: "zip" }, "ZIP"), /* @__PURE__ */ React11.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__ */ React11.createElement("span", { className: "error-span" }, cardError == null ? void 0 : cardError.zipCode)), /* @__PURE__ */ React11.createElement("div", { className: "form-group" }, /* @__PURE__ */ React11.createElement("div", { style: { display: "flex", alignItems: "center", gap: "10px", paddingTop: "10px" } }, /* @__PURE__ */ React11.createElement(
|
2322
2536
|
"input",
|
2323
2537
|
{
|
2324
2538
|
type: "checkbox",
|
@@ -2327,7 +2541,7 @@ function GetPaymentPage(props) {
|
|
2327
2541
|
checked: saveCardInfo,
|
2328
2542
|
onChange: (e) => setSaveCardInfo(e.target.checked)
|
2329
2543
|
}
|
2330
|
-
), /* @__PURE__ */ React11.createElement("label", { htmlFor: "save_card", className: "toggle-label" }), /* @__PURE__ */ React11.createElement("label", { htmlFor: "save_card" }, "Save card for future payments"))), /* @__PURE__ */ React11.createElement("div", { className: "form-group", style: { marginTop: "20px" } }, /* @__PURE__ */ React11.createElement("button", { type: "submit", style: { margin: 0 }, className: "pay-button" }, "$1.35")))), /* @__PURE__ */ React11.createElement("div", { id: "ach", style: { display: activetab === "ach" ? "block" : "none" }, className: "tabcontent" }, /* @__PURE__ */ React11.createElement("form", { id: "ACHPaymentForm", onSubmit: submitFunc }, /* @__PURE__ */ React11.createElement("div", { className: "ach-scrl" }, /* @__PURE__ */ React11.createElement("div", { className: "form-group mb-4" }, /* @__PURE__ */ React11.createElement("label", { htmlFor: "nameonaccount" }, "Name on account"), /* @__PURE__ */ React11.createElement("input", { type: "text", id: "nameonaccount", className: "form-control", maxLength: 100, placeholder: "John Doe", name: "name", value: (
|
2544
|
+
), /* @__PURE__ */ React11.createElement("label", { htmlFor: "save_card", className: "toggle-label" }), /* @__PURE__ */ React11.createElement("label", { htmlFor: "save_card" }, "Save card for future payments")))), /* @__PURE__ */ React11.createElement("div", { className: "form-group", style: { marginTop: "20px" } }, /* @__PURE__ */ React11.createElement("button", { type: "submit", style: { margin: 0 }, className: "pay-button" }, "$1.35")))), /* @__PURE__ */ React11.createElement("div", { id: "ach", style: { display: activetab === "ach" ? "block" : "none" }, className: "tabcontent" }, /* @__PURE__ */ React11.createElement("form", { id: "ACHPaymentForm", onSubmit: submitFunc }, /* @__PURE__ */ React11.createElement("div", { className: "ach-scrl" }, /* @__PURE__ */ React11.createElement("div", { className: "form-group mb-4" }, /* @__PURE__ */ React11.createElement("label", { htmlFor: "nameonaccount" }, "Name on account"), /* @__PURE__ */ React11.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__ */ React11.createElement("span", { className: "error-span" }, achError == null ? void 0 : achError.name)), /* @__PURE__ */ React11.createElement("div", { className: "form-group mb-4" }, /* @__PURE__ */ React11.createElement("label", { htmlFor: "routingnumber" }, "Routing number"), /* @__PURE__ */ React11.createElement(
|
2331
2545
|
"input",
|
2332
2546
|
{
|
2333
2547
|
type: "text",
|
@@ -2336,7 +2550,7 @@ function GetPaymentPage(props) {
|
|
2336
2550
|
maxLength: 9,
|
2337
2551
|
placeholder: "000000000",
|
2338
2552
|
name: "routingNumber",
|
2339
|
-
value: (
|
2553
|
+
value: (_f = achData == null ? void 0 : achData.routingNumber) != null ? _f : "",
|
2340
2554
|
onChange: handleChangeAch
|
2341
2555
|
}
|
2342
2556
|
), (achError == null ? void 0 : achError.routingNumber) && /* @__PURE__ */ React11.createElement("span", { className: "error-span" }, achError == null ? void 0 : achError.routingNumber)), /* @__PURE__ */ React11.createElement("div", { className: "form-group mb-4" }, /* @__PURE__ */ React11.createElement("label", { htmlFor: "accountnumber" }, "Account number"), /* @__PURE__ */ React11.createElement(
|
@@ -2348,7 +2562,7 @@ function GetPaymentPage(props) {
|
|
2348
2562
|
maxLength: 16,
|
2349
2563
|
placeholder: "0000000000",
|
2350
2564
|
name: "accountNumber",
|
2351
|
-
value: (
|
2565
|
+
value: (_g = achData == null ? void 0 : achData.accountNumber) != null ? _g : "",
|
2352
2566
|
onChange: handleChangeAch
|
2353
2567
|
}
|
2354
2568
|
), (achError == null ? void 0 : achError.accountNumber) && /* @__PURE__ */ React11.createElement("span", { className: "error-span" }, achError == null ? void 0 : achError.accountNumber)), /* @__PURE__ */ React11.createElement("div", { className: "form-group mb-4" }, /* @__PURE__ */ React11.createElement("label", { htmlFor: "confirmaccountnumber" }, "Confirm account number"), /* @__PURE__ */ React11.createElement(
|
@@ -2360,7 +2574,7 @@ function GetPaymentPage(props) {
|
|
2360
2574
|
maxLength: 16,
|
2361
2575
|
placeholder: "0000000000",
|
2362
2576
|
name: "confirmAccountNumber",
|
2363
|
-
value: (
|
2577
|
+
value: (_h = achData == null ? void 0 : achData.confirmAccountNumber) != null ? _h : "",
|
2364
2578
|
onChange: handleChangeAch
|
2365
2579
|
}
|
2366
2580
|
), (achError == null ? void 0 : achError.confirmAccountNumber) && /* @__PURE__ */ React11.createElement("span", { className: "error-span" }, achError == null ? void 0 : achError.confirmAccountNumber)), /* @__PURE__ */ React11.createElement("div", { className: "form-group mb-4" }, /* @__PURE__ */ React11.createElement("label", { htmlFor: "bankname" }, "Bank name"), /* @__PURE__ */ React11.createElement(
|
@@ -2372,10 +2586,10 @@ function GetPaymentPage(props) {
|
|
2372
2586
|
maxLength: 100,
|
2373
2587
|
placeholder: "My Bank",
|
2374
2588
|
name: "bankName",
|
2375
|
-
value: (
|
2589
|
+
value: (_i = achData == null ? void 0 : achData.bankName) != null ? _i : "",
|
2376
2590
|
onChange: handleChangeAch
|
2377
2591
|
}
|
2378
|
-
), (achError == null ? void 0 : achError.bankName) && /* @__PURE__ */ React11.createElement("span", { className: "error-span" }, achError == null ? void 0 : achError.bankName)), /* @__PURE__ */ React11.createElement("div", { className: "form-group mb-4" }, /* @__PURE__ */ React11.createElement("label", { htmlFor: "accounttype" }, "Select account type"), /* @__PURE__ */ React11.createElement("select", { name: "accountType", id: "accounttype", className: "form-control", value: (
|
2592
|
+
), (achError == null ? void 0 : achError.bankName) && /* @__PURE__ */ React11.createElement("span", { className: "error-span" }, achError == null ? void 0 : achError.bankName)), /* @__PURE__ */ React11.createElement("div", { className: "form-group mb-4" }, /* @__PURE__ */ React11.createElement("label", { htmlFor: "accounttype" }, "Select account type"), /* @__PURE__ */ React11.createElement("select", { name: "accountType", id: "accounttype", className: "form-control", value: (_j = achData == null ? void 0 : achData.accountType) != null ? _j : "", onChange: handleChangeAch }, /* @__PURE__ */ React11.createElement("option", { value: "" }, "Select account"), /* @__PURE__ */ React11.createElement("option", { value: "Personal Saving" }, "Personal Saving"), /* @__PURE__ */ React11.createElement("option", { value: "Business Saving" }, "Business Saving"), /* @__PURE__ */ React11.createElement("option", { value: "Personal Checking" }, "Personal Checking"), /* @__PURE__ */ React11.createElement("option", { value: "Business Checking" }, "Business Checking"))), /* @__PURE__ */ React11.createElement("div", { className: "form-group mb-4", style: { paddingTop: "5px" } }, /* @__PURE__ */ React11.createElement("input", { type: "checkbox", id: "saveACH", className: "", maxLength: 100, placeholder: "My Bank", checked: saveACHinfo, onChange: (e) => setSaveACHinfo(e.target.checked) }), /* @__PURE__ */ React11.createElement("label", { htmlFor: "saveACH" }, "Save ACH")), saveACHinfo && /* @__PURE__ */ React11.createElement("div", { className: "form-group mb-4", style: { fontSize: "12px", color: "#727272" } }, /* @__PURE__ */ React11.createElement("p", null, "If checked, I agree for ", /* @__PURE__ */ React11.createElement("b", null, "ecommerce"), " to have my permission to charge this credit card for agreed upon purchases in the future."))), /* @__PURE__ */ React11.createElement("div", { className: "form-group" }, /* @__PURE__ */ React11.createElement("button", { className: "pay-button", style: { margin: "20px 0 0" }, type: "submit" }, "$1.35"))))))))))
|
2379
2593
|
)));
|
2380
2594
|
}
|
2381
2595
|
export {
|