Merge branch 'main' of https://github.com/VividTruthKeeper/react-halkbank
This commit is contained in:
Kakabay
commit
d4ed2ec8d3
|
|
@ -1,7 +1,7 @@
|
|||
{
|
||||
"files": {
|
||||
"main.css": "/static/css/main.f916a3ad.css",
|
||||
"main.js": "/static/js/main.78b6dbba.js",
|
||||
"main.js": "/static/js/main.8d29cff7.js",
|
||||
"static/media/logo-transp.svg": "/static/media/logo-transp.66d6235f12fb5d9a6264c592bce58c5a.svg",
|
||||
"static/media/logo-bg.jpg": "/static/media/logo-bg.1d55df78b7376108f96c.jpg",
|
||||
"static/media/credit-card.jpg": "/static/media/credit-card.ff2990f7d50439a8f34d.jpg",
|
||||
|
|
@ -69,6 +69,6 @@
|
|||
},
|
||||
"entrypoints": [
|
||||
"static/css/main.f916a3ad.css",
|
||||
"static/js/main.78b6dbba.js"
|
||||
"static/js/main.8d29cff7.js"
|
||||
]
|
||||
}
|
||||
|
|
@ -1 +1 @@
|
|||
<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="/favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1"/><meta name="theme-color" content="#000000"/><meta name="Content-Security-Policy" content="default-src 'self'; script-src 'self' www.google.com www.gstatic.com; style-src 'self' https: 'unsafe-inline'; frame-src www.google.com;"/><link rel="apple-touch-icon" href="/logo192.png"/><link rel="manifest" href="/manifest.json"/><title>Shahsy Otag</title><script defer="defer" src="/static/js/main.78b6dbba.js"></script><link href="/static/css/main.f916a3ad.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div><script src="//www.google.com/recaptcha/api.js" nonce="{NONCE}" async defer="defer"></script></body></html>
|
||||
<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="/favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1"/><meta name="theme-color" content="#000000"/><meta name="Content-Security-Policy" content="default-src 'self'; script-src 'self' www.google.com www.gstatic.com; style-src 'self' https: 'unsafe-inline'; frame-src www.google.com;"/><link rel="apple-touch-icon" href="/logo192.png"/><link rel="manifest" href="/manifest.json"/><title>Shahsy Otag</title><script defer="defer" src="/static/js/main.8d29cff7.js"></script><link href="/static/css/main.f916a3ad.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div><script src="//www.google.com/recaptcha/api.js" nonce="{NONCE}" async defer="defer"></script></body></html>
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -1,24 +1,32 @@
|
|||
// IMPORT MODULES
|
||||
import React, { useState, useContext } from 'react';
|
||||
import { LanguageContext } from '../../backend/LanguageContext';
|
||||
import { useForm } from 'react-hook-form';
|
||||
import { z } from 'zod';
|
||||
import { zodResolver } from '@hookform/resolvers/zod';
|
||||
import React, { useState, useContext } from "react";
|
||||
import { LanguageContext } from "../../backend/LanguageContext";
|
||||
import { useForm } from "react-hook-form";
|
||||
import { z } from "zod";
|
||||
import { zodResolver } from "@hookform/resolvers/zod";
|
||||
// IMPORT IMAGES
|
||||
import next from '../../icons/next.svg';
|
||||
import next_reverse from '../../icons/next-reverse.svg';
|
||||
import next from "../../icons/next.svg";
|
||||
import next_reverse from "../../icons/next-reverse.svg";
|
||||
// import arrow from "../../icons/arrow.svg";
|
||||
|
||||
const schema = z.object({
|
||||
name: z.string().min(1),
|
||||
surname: z.string().min(1),
|
||||
passportSerial: z.string().min(1),
|
||||
passportNumber: z.number(),
|
||||
bankAccount: z.number(),
|
||||
// clientType: z.string(),
|
||||
});
|
||||
// const schema = z.object({
|
||||
// name: z.string().min(1),
|
||||
// surname: z.string().min(1),
|
||||
// passportSerial: z.string().min(1),
|
||||
// passportNumber: z
|
||||
// .number()
|
||||
// .int()
|
||||
// .gte(100000, { message: "Must be equal to 6 digits" })
|
||||
// .lte(999999, { message: "Must be equal to 6 digits" }),
|
||||
// bankAccount: z
|
||||
// .number()
|
||||
// .int()
|
||||
// .gte(100000, { message: "Must be equal to 6 digits" })
|
||||
// .lte(999999, { message: "Must be equal to 6 digits" }),
|
||||
// // clientType: z.string(),
|
||||
// });
|
||||
|
||||
const BorrowerInfo = ({ setStage, isGuranter }) => {
|
||||
const BorrowerInfo = ({ setStage, isGuranter, borrowerData }) => {
|
||||
const { locale } = useContext(LanguageContext);
|
||||
|
||||
const {
|
||||
|
|
@ -26,13 +34,13 @@ const BorrowerInfo = ({ setStage, isGuranter }) => {
|
|||
handleSubmit,
|
||||
formState: { errors },
|
||||
} = useForm({
|
||||
resolver: zodResolver(schema),
|
||||
// resolver: zodResolver(schema),
|
||||
defaultValues: {
|
||||
name: 'Hello',
|
||||
surname: 'Hello',
|
||||
passportSerial: 'Hello',
|
||||
passportNumber: 23,
|
||||
bankAccount: 23,
|
||||
name: borrowerData.name ? borrowerData.name : "Loading",
|
||||
surname: borrowerData.surname ? borrowerData.surname : "loading",
|
||||
passportSerial: borrowerData.idSeria ? borrowerData.idSeria : "Loading",
|
||||
passportNumber: borrowerData.idNo ? borrowerData.idNo : "Loading",
|
||||
bankAccount: borrowerData.accountNo ? borrowerData.accountNo : "Loading",
|
||||
},
|
||||
});
|
||||
|
||||
|
|
@ -40,90 +48,97 @@ const BorrowerInfo = ({ setStage, isGuranter }) => {
|
|||
console.log(data);
|
||||
};
|
||||
|
||||
console.log(isGuranter);
|
||||
|
||||
return (
|
||||
return borrowerData ? (
|
||||
<section className="imm-cs-1">
|
||||
<form onSubmit={handleSubmit(onSubmit)}>
|
||||
<h2 className="cs-2-title">
|
||||
{locale === 'TKM'
|
||||
? 'Karzyň kalkulýatory'
|
||||
: locale === 'РУС'
|
||||
? 'Подтвердите данные'
|
||||
: locale === 'ENG'
|
||||
? 'Loan calculator'
|
||||
: 'Karzyň kalkulýatory'}
|
||||
{locale === "TKM"
|
||||
? "Karzyň kalkulýatory"
|
||||
: locale === "РУС"
|
||||
? "Подтвердите данные"
|
||||
: locale === "ENG"
|
||||
? "Loan calculator"
|
||||
: "Karzyň kalkulýatory"}
|
||||
</h2>
|
||||
<div className="imm-credit-form-wrapper">
|
||||
<div className="input-block">
|
||||
<label htmlFor="name">
|
||||
{locale === 'TKM'
|
||||
? 'At'
|
||||
: locale === 'РУС'
|
||||
? 'Имя'
|
||||
: locale === 'ENG'
|
||||
? 'Name'
|
||||
: 'At'}
|
||||
{locale === "TKM"
|
||||
? "At"
|
||||
: locale === "РУС"
|
||||
? "Имя"
|
||||
: locale === "ENG"
|
||||
? "Name"
|
||||
: "At"}
|
||||
</label>
|
||||
<input {...register('name')} type="text" id="name" disabled />
|
||||
{errors.name && <span>{errors.name.message}</span>}
|
||||
<input {...register("name")} type="text" id="name" disabled />
|
||||
{/* {errors.name && <span>{errors.name.message}</span>} */}
|
||||
</div>
|
||||
<div className="input-block">
|
||||
<label htmlFor="surname">
|
||||
{locale === 'TKM'
|
||||
? 'At'
|
||||
: locale === 'РУС'
|
||||
? 'Фамилия'
|
||||
: locale === 'ENG'
|
||||
? 'Surname'
|
||||
: 'At'}
|
||||
{locale === "TKM"
|
||||
? "At"
|
||||
: locale === "РУС"
|
||||
? "Фамилия"
|
||||
: locale === "ENG"
|
||||
? "Surname"
|
||||
: "At"}
|
||||
</label>
|
||||
<input {...register('surname')} type="text" id="surname" disabled />
|
||||
{errors.surname && <span>{errors.surname.message}</span>}
|
||||
<input {...register("surname")} type="text" id="surname" disabled />
|
||||
{/* {errors.surname && <span>{errors.surname.message}</span>} */}
|
||||
</div>
|
||||
<div className="input-block">
|
||||
<label htmlFor="passport-serial">
|
||||
{locale === 'TKM'
|
||||
? 'Hasaba almak'
|
||||
: locale === 'РУС'
|
||||
? 'Серия паспорта'
|
||||
: locale === 'ENG'
|
||||
? 'Sign up'
|
||||
: 'Hasaba almak'}
|
||||
{locale === "TKM"
|
||||
? "Hasaba almak"
|
||||
: locale === "РУС"
|
||||
? "Серия паспорта"
|
||||
: locale === "ENG"
|
||||
? "Sign up"
|
||||
: "Hasaba almak"}
|
||||
</label>
|
||||
<input {...register('passportSerial')} type="text" id="passport-serial" disabled />
|
||||
{errors.passportSerial && <span>{errors.passportSerial.message}</span>}
|
||||
<input
|
||||
{...register("passportSerial")}
|
||||
type="text"
|
||||
id="passport-serial"
|
||||
disabled
|
||||
/>
|
||||
{errors.passportSerial && (
|
||||
<span>{errors.passportSerial.message}</span>
|
||||
)}
|
||||
</div>
|
||||
<div className="input-block">
|
||||
<label htmlFor="passport-number">
|
||||
{locale === 'TKM'
|
||||
? 'Hasaba almak'
|
||||
: locale === 'РУС'
|
||||
? 'Номер паспорта'
|
||||
: locale === 'ENG'
|
||||
? 'Sign up'
|
||||
: 'Hasaba almak'}
|
||||
{locale === "TKM"
|
||||
? "Hasaba almak"
|
||||
: locale === "РУС"
|
||||
? "Номер паспорта"
|
||||
: locale === "ENG"
|
||||
? "Sign up"
|
||||
: "Hasaba almak"}
|
||||
</label>
|
||||
<input
|
||||
{...register('passportNumber', { valueAsNumber: true })}
|
||||
{...register("passportNumber", { valueAsNumber: true })}
|
||||
type="number"
|
||||
id="passport-number"
|
||||
disabled
|
||||
/>
|
||||
{errors.passportNumber && <span>{errors.passportNumber.message}</span>}
|
||||
{errors.passportNumber && (
|
||||
<span>{errors.passportNumber.message}</span>
|
||||
)}
|
||||
</div>
|
||||
<div className="input-block">
|
||||
<label htmlFor="bank-acc">
|
||||
{locale === 'TKM'
|
||||
? 'Hasaba almak'
|
||||
: locale === 'РУС'
|
||||
? 'Номер банковского аккаунта'
|
||||
: locale === 'ENG'
|
||||
? 'Sign up'
|
||||
: 'Hasaba almak'}
|
||||
{locale === "TKM"
|
||||
? "Hasaba almak"
|
||||
: locale === "РУС"
|
||||
? "Номер банковского аккаунта"
|
||||
: locale === "ENG"
|
||||
? "Sign up"
|
||||
: "Hasaba almak"}
|
||||
</label>
|
||||
<input
|
||||
{...register('bankAccount', { valueAsNumber: true })}
|
||||
{...register("bankAccount", { valueAsNumber: true })}
|
||||
type="number"
|
||||
id="bank-acc"
|
||||
disabled
|
||||
|
|
@ -133,35 +148,40 @@ const BorrowerInfo = ({ setStage, isGuranter }) => {
|
|||
</div>
|
||||
|
||||
<div className="cu-bottom cd-2-title">
|
||||
<button type="button" className="sign-btn reg-btn" onClick={() => setStage(1)}>
|
||||
<button
|
||||
type="button"
|
||||
className="sign-btn reg-btn"
|
||||
onClick={() => setStage(1)}
|
||||
>
|
||||
<div>
|
||||
<div className="btn-img">
|
||||
<img src={next_reverse} alt="logout" />
|
||||
</div>
|
||||
<h3>
|
||||
{locale === 'TKM'
|
||||
? 'Yza'
|
||||
: locale === 'РУС'
|
||||
? 'Назад'
|
||||
: locale === 'ENG'
|
||||
? 'Back'
|
||||
: 'Yza'}
|
||||
{locale === "TKM"
|
||||
? "Yza"
|
||||
: locale === "РУС"
|
||||
? "Назад"
|
||||
: locale === "ENG"
|
||||
? "Back"
|
||||
: "Yza"}
|
||||
</h3>
|
||||
</div>
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
className="sign-btn cu-btn"
|
||||
onClick={() => (isGuranter ? setStage(3) : setStage(5))}>
|
||||
onClick={() => setStage(4)}
|
||||
>
|
||||
<div>
|
||||
<h3>
|
||||
{locale === 'TKM'
|
||||
? 'Dowam et'
|
||||
: locale === 'РУС'
|
||||
? 'Подтвердить '
|
||||
: locale === 'ENG'
|
||||
? 'Proceed'
|
||||
: 'Dowam et'}
|
||||
{locale === "TKM"
|
||||
? "Dowam et"
|
||||
: locale === "РУС"
|
||||
? "Подтвердить "
|
||||
: locale === "ENG"
|
||||
? "Proceed"
|
||||
: "Dowam et"}
|
||||
</h3>
|
||||
<div className="btn-img">
|
||||
<img src={next} alt="logout" />
|
||||
|
|
@ -171,6 +191,8 @@ const BorrowerInfo = ({ setStage, isGuranter }) => {
|
|||
</div>
|
||||
</form>
|
||||
</section>
|
||||
) : (
|
||||
"Loading"
|
||||
);
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -1,36 +1,59 @@
|
|||
// IMPORT MODULES
|
||||
import React, { useState, useRef, useContext, useEffect } from 'react';
|
||||
import { LanguageContext } from '../../backend/LanguageContext';
|
||||
import { useForm } from 'react-hook-form';
|
||||
import { z } from 'zod';
|
||||
import { zodResolver } from '@hookform/resolvers/zod';
|
||||
import React, { useState, useRef, useContext, useEffect } from "react";
|
||||
import { LanguageContext } from "../../backend/LanguageContext";
|
||||
import { useForm } from "react-hook-form";
|
||||
import { z } from "zod";
|
||||
import { zodResolver } from "@hookform/resolvers/zod";
|
||||
// IMPORT IMAGES
|
||||
import next from '../../icons/next.svg';
|
||||
import arrow from '../../icons/arrow-gray.svg';
|
||||
import next from "../../icons/next.svg";
|
||||
import arrow from "../../icons/arrow-gray.svg";
|
||||
|
||||
import Select from '../global/Select';
|
||||
import Select from "../global/Select";
|
||||
// import arrow from "../../icons/arrow.svg";
|
||||
|
||||
const schema = z.object({
|
||||
// passportSerial: z.string(),
|
||||
passportNumber: z.number(),
|
||||
bankAccount: z.number(),
|
||||
// clientType: z.string(),
|
||||
});
|
||||
// const schema = z.object({
|
||||
// passportNumber: z.string().refine((value) => value.length === 6, {
|
||||
// message: "Passport number must be a 6-digit value",
|
||||
// }),
|
||||
// bankAccount: z.string().refine((value) => /^\d{9,18}$/.test(value), {
|
||||
// message: "Invalid bank account number",
|
||||
// }),
|
||||
// });
|
||||
|
||||
const IDSerias = ['I-AS', 'I-AH', 'I-BN', 'I-LB', 'I-MR', 'I-DZ'];
|
||||
const IDSerias = ["I-AS", "I-AH", "I-BN", "I-LB", "I-MR", "I-DZ"];
|
||||
// 478992
|
||||
// 23908934160170143144000
|
||||
|
||||
const BorrowerStage = ({ setStage, isGuranter, setIsGuranter, stage }) => {
|
||||
const BorrowerStage = ({
|
||||
setStage,
|
||||
isGuranter,
|
||||
setIsGuranter,
|
||||
setSignRecipient,
|
||||
setBorrowerData,
|
||||
}) => {
|
||||
const { locale } = useContext(LanguageContext);
|
||||
|
||||
const [idSerial, setIdSerial] = useState('I-AS');
|
||||
const [isLoading, setIsLoading] = useState(false);
|
||||
const [err, setErr] = useState(false);
|
||||
const [errCode, setErrCode] = useState();
|
||||
|
||||
const [idSerial, setIdSerial] = useState("I-AS");
|
||||
const [passportNumber, setPassportNumber] = useState("");
|
||||
const [accNumber, setAccNumber] = useState("");
|
||||
|
||||
const handlePassportNumber = (e) => {
|
||||
setPassportNumber(e.target.value);
|
||||
};
|
||||
const handleAcctNumber = (e) => {
|
||||
setAccNumber(e.target.value);
|
||||
};
|
||||
|
||||
const isGuranterHandler = (value) => {
|
||||
setIsGuranter(value);
|
||||
};
|
||||
|
||||
const checkboxHandleChange = (e) => {
|
||||
e.target.value === 'guaranter' ? setIsGuranter(true) : setIsGuranter(false);
|
||||
e.target.value === "guaranter" ? setIsGuranter(true) : setIsGuranter(false);
|
||||
};
|
||||
|
||||
const {
|
||||
|
|
@ -38,144 +61,228 @@ const BorrowerStage = ({ setStage, isGuranter, setIsGuranter, stage }) => {
|
|||
handleSubmit,
|
||||
formState: { errors },
|
||||
} = useForm({
|
||||
resolver: zodResolver(schema),
|
||||
// resolver: zodResolver(schema),
|
||||
});
|
||||
|
||||
const onSubmit = (data) => {
|
||||
setStage(2);
|
||||
const fetchData = async (idSeria, idNo, accountNo, clientType, stage) => {
|
||||
try {
|
||||
setIsLoading(true);
|
||||
const response = await fetch(
|
||||
`https://shahsyotag.halkbank.gov.tm/onlineloan-services/api/clientinfo`,
|
||||
{
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
body: JSON.stringify({
|
||||
idSeria: idSeria,
|
||||
idNo: idNo,
|
||||
accountNo: accountNo,
|
||||
clientType: "recipient",
|
||||
}),
|
||||
}
|
||||
);
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error(`HTTP error! Status: ${response.status}`);
|
||||
}
|
||||
|
||||
const responseJson = await response.json();
|
||||
|
||||
setSignRecipient(responseJson.signRecipient);
|
||||
setErrCode(await responseJson.errCode);
|
||||
setBorrowerData(responseJson);
|
||||
|
||||
setIsLoading(false);
|
||||
// responseJson.errCode === 0 ? setStage(2) : setStage(3);
|
||||
if (responseJson.errCode === 0) {
|
||||
setStage(2);
|
||||
console.log("availabel");
|
||||
} else if (responseJson.errCode !== 0) {
|
||||
setStage(3);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error.toString());
|
||||
// Handle errors as needed
|
||||
setErr(true);
|
||||
}
|
||||
};
|
||||
|
||||
const onSubmit = (data) => {
|
||||
fetchData(idSerial, passportNumber, accNumber, isGuranter);
|
||||
};
|
||||
|
||||
console.log(
|
||||
passportNumber.length === 6 && accNumber.length === 23 ? true : false
|
||||
);
|
||||
|
||||
if (isLoading) {
|
||||
return (
|
||||
<section className="imm-cs-1">
|
||||
<h1 className="cs-2-title">Loading...</h1>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
|
||||
// if (errCode !== 0) {
|
||||
// return (
|
||||
// <section className="imm-cs-1">
|
||||
// <h1>Not a user</h1>
|
||||
// </section>
|
||||
// );
|
||||
// }
|
||||
|
||||
return (
|
||||
<section className="imm-cs-1">
|
||||
<form onSubmit={handleSubmit(onSubmit)}>
|
||||
<h2 className="cs-2-title">
|
||||
{locale === 'TKM'
|
||||
? 'Karzyň kalkulýatory'
|
||||
: locale === 'РУС'
|
||||
? 'Заполните данные'
|
||||
: locale === 'ENG'
|
||||
? 'Loan calculator'
|
||||
: 'Karzyň kalkulýatory'}
|
||||
{locale === "TKM"
|
||||
? "Karzyň kalkulýatory"
|
||||
: locale === "РУС"
|
||||
? "Заполните данные"
|
||||
: locale === "ENG"
|
||||
? "Loan calculator"
|
||||
: "Karzyň kalkulýatory"}
|
||||
</h2>
|
||||
<div className="imm-credit-form-wrapper">
|
||||
<Select
|
||||
items={IDSerias}
|
||||
customId={'card'}
|
||||
blockName={'card-1-select'}
|
||||
elName={'card-1-select-el'}
|
||||
name={'passportSerial'}
|
||||
customId={"card"}
|
||||
blockName={"card-1-select"}
|
||||
elName={"card-1-select-el"}
|
||||
name={"passportSerial"}
|
||||
eTarget={true}
|
||||
register={register}
|
||||
label={
|
||||
locale === 'TKM'
|
||||
? 'Kartyň görnüşi'
|
||||
: locale === 'РУС'
|
||||
? 'Серия паспорта'
|
||||
: locale === 'ENG'
|
||||
? 'Card type'
|
||||
: 'Kartyň görnüşi'
|
||||
locale === "TKM"
|
||||
? "Kartyň görnüşi"
|
||||
: locale === "РУС"
|
||||
? "Серия паспорта"
|
||||
: locale === "ENG"
|
||||
? "Card type"
|
||||
: "Kartyň görnüşi"
|
||||
}
|
||||
stateSetter={setIdSerial}
|
||||
/>
|
||||
|
||||
<div className="input-block">
|
||||
<label htmlFor="passport-number">
|
||||
{locale === 'TKM'
|
||||
? 'Hasaba almak'
|
||||
: locale === 'РУС'
|
||||
? 'Номер паспорта'
|
||||
: locale === 'ENG'
|
||||
? 'Sign up'
|
||||
: 'Hasaba almak'}
|
||||
{locale === "TKM"
|
||||
? "Hasaba almak"
|
||||
: locale === "РУС"
|
||||
? "Номер паспорта"
|
||||
: locale === "ENG"
|
||||
? "Sign up"
|
||||
: "Hasaba almak"}
|
||||
</label>
|
||||
<input
|
||||
{...register('passportNumber', { valueAsNumber: true })}
|
||||
// {...register("passportNumber", { valueAsNumber: true })}
|
||||
value={passportNumber}
|
||||
onChange={handlePassportNumber}
|
||||
type="number"
|
||||
id="passport-number"
|
||||
required
|
||||
/>
|
||||
{errors.passportNumber && <span>{errors.passportNumber.message}</span>}
|
||||
{/* {passportNumber.length !== 6 && <span>It should be 6 digits</span>} */}
|
||||
</div>
|
||||
<div className="input-block">
|
||||
<label htmlFor="bank-acc">
|
||||
{locale === 'TKM'
|
||||
? 'Hasaba almak'
|
||||
: locale === 'РУС'
|
||||
? 'Номер банковского аккаунта'
|
||||
: locale === 'ENG'
|
||||
? 'Sign up'
|
||||
: 'Hasaba almak'}
|
||||
{locale === "TKM"
|
||||
? "Hasaba almak"
|
||||
: locale === "РУС"
|
||||
? "Номер банковского аккаунта"
|
||||
: locale === "ENG"
|
||||
? "Sign up"
|
||||
: "Hasaba almak"}
|
||||
</label>
|
||||
<input
|
||||
{...register('bankAccount', { valueAsNumber: true })}
|
||||
// {...register("bankAccount", { valueAsNumber: true })}
|
||||
value={accNumber}
|
||||
onChange={handleAcctNumber}
|
||||
type="number"
|
||||
id="bank-acc"
|
||||
required
|
||||
/>
|
||||
{errors.bankAccount && <span>{errors.bankAccount.message}</span>}
|
||||
{/* {accNumber.length !== 23 && <span>It should be 23 digits</span>} */}
|
||||
|
||||
{/* {errors.bankAccount && <span>{errors.bankAccount.message}</span>} */}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="imm-credit-checkbox-group">
|
||||
<div className="imm-credit-checkbox-block" onClick={() => isGuranterHandler(false)}>
|
||||
<div
|
||||
className="imm-credit-checkbox-block"
|
||||
onClick={() => isGuranterHandler(false)}
|
||||
>
|
||||
<input
|
||||
type="radio"
|
||||
id="borrower"
|
||||
value={'Borrower'}
|
||||
value={"recepient"}
|
||||
name="client-type"
|
||||
checked={isGuranter ? false : true}
|
||||
onChange={checkboxHandleChange}
|
||||
{...register('clientType')}
|
||||
// {...register("clientType")}
|
||||
className="radio-button"
|
||||
/>
|
||||
<label htmlFor="borrower">
|
||||
{locale === 'TKM'
|
||||
? 'Hasaba almak'
|
||||
: locale === 'РУС'
|
||||
? 'Гос. страх'
|
||||
: locale === 'ENG'
|
||||
? 'Borrower'
|
||||
: 'Hasaba almak'}
|
||||
{locale === "TKM"
|
||||
? "Hasaba almak"
|
||||
: locale === "РУС"
|
||||
? "Гос. страх"
|
||||
: locale === "ENG"
|
||||
? "Borrower"
|
||||
: "Hasaba almak"}
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div className="imm-credit-checkbox-block" onClick={() => isGuranterHandler(true)}>
|
||||
<div
|
||||
className="imm-credit-checkbox-block"
|
||||
onClick={() => isGuranterHandler(true)}
|
||||
>
|
||||
<input
|
||||
type="radio"
|
||||
id="isGuranter"
|
||||
value={'guaranter'}
|
||||
value={"guaranter"}
|
||||
name="client-type"
|
||||
checked={isGuranter ? true : false}
|
||||
onChange={checkboxHandleChange}
|
||||
{...register('clientType')}
|
||||
// {...register("clientType")}
|
||||
className="radio-button"
|
||||
/>
|
||||
<label htmlFor="isGuranter">
|
||||
{locale === 'TKM'
|
||||
? 'Hasaba almak'
|
||||
: locale === 'РУС'
|
||||
? 'Поручитель'
|
||||
: locale === 'ENG'
|
||||
? 'guaranter'
|
||||
: 'Hasaba almak'}
|
||||
{locale === "TKM"
|
||||
? "Hasaba almak"
|
||||
: locale === "РУС"
|
||||
? "Поручитель"
|
||||
: locale === "ENG"
|
||||
? "guaranter"
|
||||
: "Hasaba almak"}
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="card-button cs-1-bottom">
|
||||
<button
|
||||
disabled={
|
||||
passportNumber.length === 6 && accNumber.length === 23
|
||||
? false
|
||||
: true
|
||||
}
|
||||
type="submit"
|
||||
className="sign-btn cd-btn"
|
||||
onClick={() => {
|
||||
// setData({ ...data, type: inputValid, type_localized: input });
|
||||
}}>
|
||||
}}
|
||||
>
|
||||
<div>
|
||||
<h3>
|
||||
{locale === 'TKM'
|
||||
? 'Dowam et'
|
||||
: locale === 'РУС'
|
||||
? 'Продолжить'
|
||||
: locale === 'ENG'
|
||||
? 'Proceed'
|
||||
: 'Dowam et'}
|
||||
{locale === "TKM"
|
||||
? "Dowam et"
|
||||
: locale === "РУС"
|
||||
? "Продолжить"
|
||||
: locale === "ENG"
|
||||
? "Proceed"
|
||||
: "Dowam et"}
|
||||
</h3>
|
||||
<div className="btn-img">
|
||||
<img src={next} alt="logout" />
|
||||
|
|
|
|||
|
|
@ -1,24 +1,32 @@
|
|||
// IMPORT MODULES
|
||||
import React, { useState, useContext } from 'react';
|
||||
import { LanguageContext } from '../../backend/LanguageContext';
|
||||
import { useForm } from 'react-hook-form';
|
||||
import { z } from 'zod';
|
||||
import { zodResolver } from '@hookform/resolvers/zod';
|
||||
import React, { useState, useContext } from "react";
|
||||
import { LanguageContext } from "../../backend/LanguageContext";
|
||||
import { useForm } from "react-hook-form";
|
||||
import { z } from "zod";
|
||||
import { zodResolver } from "@hookform/resolvers/zod";
|
||||
// IMPORT IMAGES
|
||||
import next from '../../icons/next.svg';
|
||||
import next_reverse from '../../icons/next-reverse.svg';
|
||||
import next from "../../icons/next.svg";
|
||||
import next_reverse from "../../icons/next-reverse.svg";
|
||||
// import arrow from "../../icons/arrow.svg";
|
||||
|
||||
const schema = z.object({
|
||||
name: z.string().min(1),
|
||||
surname: z.string().min(1),
|
||||
passportSerial: z.string().min(1),
|
||||
passportNumber: z.number(),
|
||||
bankAccount: z.number(),
|
||||
passportNumber: z
|
||||
.number()
|
||||
.int()
|
||||
.gte(100000, { message: "Must be equal to 6 digits" })
|
||||
.lte(999999, { message: "Must be equal to 6 digits" }),
|
||||
bankAccount: z
|
||||
.number()
|
||||
.int()
|
||||
.gte(100000, { message: "Must be equal to 6 digits" })
|
||||
.lte(999999, { message: "Must be equal to 6 digits" }),
|
||||
// clientType: z.string(),
|
||||
});
|
||||
|
||||
const GuaranterInfo = ({ setStage, isGuranter }) => {
|
||||
const GuaranterInfo = ({ setStage, isGuranter, guaranterInfo }) => {
|
||||
const { locale } = useContext(LanguageContext);
|
||||
|
||||
const {
|
||||
|
|
@ -28,11 +36,13 @@ const GuaranterInfo = ({ setStage, isGuranter }) => {
|
|||
} = useForm({
|
||||
resolver: zodResolver(schema),
|
||||
defaultValues: {
|
||||
name: 'Hello',
|
||||
surname: 'Hello',
|
||||
passportSerial: 'Hello',
|
||||
passportNumber: 23,
|
||||
bankAccount: 23,
|
||||
name: guaranterInfo.name ? guaranterInfo.name : "Loading",
|
||||
surname: guaranterInfo.surname ? guaranterInfo.surname : "loading",
|
||||
passportSerial: guaranterInfo.idSeria ? guaranterInfo.idSeria : "Loading",
|
||||
passportNumber: guaranterInfo.idNo ? guaranterInfo.idNo : "Loading",
|
||||
bankAccount: guaranterInfo.accountNo
|
||||
? guaranterInfo.accountNo
|
||||
: "Loading",
|
||||
},
|
||||
});
|
||||
|
||||
|
|
@ -46,84 +56,93 @@ const GuaranterInfo = ({ setStage, isGuranter }) => {
|
|||
<section className="imm-cs-1">
|
||||
<form onSubmit={handleSubmit(onSubmit)}>
|
||||
<h2 className="cs-2-title">
|
||||
{locale === 'TKM'
|
||||
? 'Karzyň kalkulýatory'
|
||||
: locale === 'РУС'
|
||||
? 'Подтвердите данные'
|
||||
: locale === 'ENG'
|
||||
? 'Loan calculator'
|
||||
: 'Karzyň kalkulýatory'}
|
||||
{locale === "TKM"
|
||||
? "Karzyň kalkulýatory"
|
||||
: locale === "РУС"
|
||||
? "Подтвердите данные"
|
||||
: locale === "ENG"
|
||||
? "Loan calculator"
|
||||
: "Karzyň kalkulýatory"}
|
||||
</h2>
|
||||
<div className="imm-credit-form-wrapper">
|
||||
<div className="input-block">
|
||||
<label htmlFor="name">
|
||||
{locale === 'TKM'
|
||||
? 'At'
|
||||
: locale === 'РУС'
|
||||
? 'Имя'
|
||||
: locale === 'ENG'
|
||||
? 'Name'
|
||||
: 'At'}
|
||||
{locale === "TKM"
|
||||
? "At"
|
||||
: locale === "РУС"
|
||||
? "Имя"
|
||||
: locale === "ENG"
|
||||
? "Name"
|
||||
: "At"}
|
||||
</label>
|
||||
<input {...register('name')} type="text" id="name" disabled />
|
||||
<input {...register("name")} type="text" id="name" disabled />
|
||||
{errors.name && <span>{errors.name.message}</span>}
|
||||
</div>
|
||||
<div className="input-block">
|
||||
<label htmlFor="surname">
|
||||
{locale === 'TKM'
|
||||
? 'At'
|
||||
: locale === 'РУС'
|
||||
? 'Фамилия'
|
||||
: locale === 'ENG'
|
||||
? 'Surname'
|
||||
: 'At'}
|
||||
{locale === "TKM"
|
||||
? "At"
|
||||
: locale === "РУС"
|
||||
? "Фамилия"
|
||||
: locale === "ENG"
|
||||
? "Surname"
|
||||
: "At"}
|
||||
</label>
|
||||
<input {...register('surname')} type="text" id="surname" disabled />
|
||||
<input {...register("surname")} type="text" id="surname" disabled />
|
||||
{errors.surname && <span>{errors.surname.message}</span>}
|
||||
</div>
|
||||
<div className="input-block">
|
||||
<label htmlFor="passport-serial">
|
||||
{locale === 'TKM'
|
||||
? 'Hasaba almak'
|
||||
: locale === 'РУС'
|
||||
? 'Серия паспорта'
|
||||
: locale === 'ENG'
|
||||
? 'Sign up'
|
||||
: 'Hasaba almak'}
|
||||
{locale === "TKM"
|
||||
? "Hasaba almak"
|
||||
: locale === "РУС"
|
||||
? "Серия паспорта"
|
||||
: locale === "ENG"
|
||||
? "Sign up"
|
||||
: "Hasaba almak"}
|
||||
</label>
|
||||
<input {...register('passportSerial')} type="text" id="passport-serial" disabled />
|
||||
{errors.passportSerial && <span>{errors.passportSerial.message}</span>}
|
||||
<input
|
||||
{...register("passportSerial")}
|
||||
type="text"
|
||||
id="passport-serial"
|
||||
disabled
|
||||
/>
|
||||
{errors.passportSerial && (
|
||||
<span>{errors.passportSerial.message}</span>
|
||||
)}
|
||||
</div>
|
||||
<div className="input-block">
|
||||
<label htmlFor="passport-number">
|
||||
{locale === 'TKM'
|
||||
? 'Hasaba almak'
|
||||
: locale === 'РУС'
|
||||
? 'Номер паспорта'
|
||||
: locale === 'ENG'
|
||||
? 'Sign up'
|
||||
: 'Hasaba almak'}
|
||||
{locale === "TKM"
|
||||
? "Hasaba almak"
|
||||
: locale === "РУС"
|
||||
? "Номер паспорта"
|
||||
: locale === "ENG"
|
||||
? "Sign up"
|
||||
: "Hasaba almak"}
|
||||
</label>
|
||||
<input
|
||||
{...register('passportNumber', { valueAsNumber: true })}
|
||||
{...register("passportNumber", { valueAsNumber: true })}
|
||||
type="number"
|
||||
id="passport-number"
|
||||
disabled
|
||||
/>
|
||||
{errors.passportNumber && <span>{errors.passportNumber.message}</span>}
|
||||
{errors.passportNumber && (
|
||||
<span>{errors.passportNumber.message}</span>
|
||||
)}
|
||||
</div>
|
||||
<div className="input-block">
|
||||
<label htmlFor="bank-acc">
|
||||
{locale === 'TKM'
|
||||
? 'Hasaba almak'
|
||||
: locale === 'РУС'
|
||||
? 'Номер банковского аккаунта'
|
||||
: locale === 'ENG'
|
||||
? 'Sign up'
|
||||
: 'Hasaba almak'}
|
||||
{locale === "TKM"
|
||||
? "Hasaba almak"
|
||||
: locale === "РУС"
|
||||
? "Номер банковского аккаунта"
|
||||
: locale === "ENG"
|
||||
? "Sign up"
|
||||
: "Hasaba almak"}
|
||||
</label>
|
||||
<input
|
||||
{...register('bankAccount', { valueAsNumber: true })}
|
||||
{...register("bankAccount", { valueAsNumber: true })}
|
||||
type="number"
|
||||
id="bank-acc"
|
||||
disabled
|
||||
|
|
@ -132,32 +151,40 @@ const GuaranterInfo = ({ setStage, isGuranter }) => {
|
|||
</div>
|
||||
</div>
|
||||
<div className="cu-bottom cd-2-title">
|
||||
<button type="button" className="sign-btn reg-btn" onClick={() => setStage(3)}>
|
||||
<button
|
||||
type="button"
|
||||
className="sign-btn reg-btn"
|
||||
onClick={() => setStage(3)}
|
||||
>
|
||||
<div>
|
||||
<div className="btn-img">
|
||||
<img src={next_reverse} alt="logout" />
|
||||
</div>
|
||||
<h3>
|
||||
{locale === 'TKM'
|
||||
? 'Yza'
|
||||
: locale === 'РУС'
|
||||
? 'Назад'
|
||||
: locale === 'ENG'
|
||||
? 'Back'
|
||||
: 'Yza'}
|
||||
{locale === "TKM"
|
||||
? "Yza"
|
||||
: locale === "РУС"
|
||||
? "Назад"
|
||||
: locale === "ENG"
|
||||
? "Back"
|
||||
: "Yza"}
|
||||
</h3>
|
||||
</div>
|
||||
</button>
|
||||
<button type="button" className="sign-btn cu-btn" onClick={() => setStage(4)}>
|
||||
<button
|
||||
type="button"
|
||||
className="sign-btn cu-btn"
|
||||
onClick={() => setStage(4)}
|
||||
>
|
||||
<div>
|
||||
<h3>
|
||||
{locale === 'TKM'
|
||||
? 'Dowam et'
|
||||
: locale === 'РУС'
|
||||
? 'Подтвердить '
|
||||
: locale === 'ENG'
|
||||
? 'Proceed'
|
||||
: 'Dowam et'}
|
||||
{locale === "TKM"
|
||||
? "Dowam et"
|
||||
: locale === "РУС"
|
||||
? "Подтвердить "
|
||||
: locale === "ENG"
|
||||
? "Proceed"
|
||||
: "Dowam et"}
|
||||
</h3>
|
||||
<div className="btn-img">
|
||||
<img src={next} alt="logout" />
|
||||
|
|
|
|||
|
|
@ -1,137 +1,226 @@
|
|||
// IMPORT MODULES
|
||||
import React, { useState, useContext } from 'react';
|
||||
import { LanguageContext } from '../../backend/LanguageContext';
|
||||
import { useForm } from 'react-hook-form';
|
||||
import { z } from 'zod';
|
||||
import { zodResolver } from '@hookform/resolvers/zod';
|
||||
import React, { useState, useContext } from "react";
|
||||
import { LanguageContext } from "../../backend/LanguageContext";
|
||||
import { useForm } from "react-hook-form";
|
||||
import { z } from "zod";
|
||||
import { zodResolver } from "@hookform/resolvers/zod";
|
||||
// IMPORT IMAGES
|
||||
import next from '../../icons/next.svg';
|
||||
import next_reverse from '../../icons/next-reverse.svg';
|
||||
import Select from '../global/Select';
|
||||
import next from "../../icons/next.svg";
|
||||
import next_reverse from "../../icons/next-reverse.svg";
|
||||
import Select from "../global/Select";
|
||||
|
||||
const schema = z.object({
|
||||
passportSerial: z.string().min(1),
|
||||
passportNumber: z.number(),
|
||||
bankAccount: z.number(),
|
||||
// clientType: z.string(),
|
||||
});
|
||||
// const schema = z.object({
|
||||
// passportNumber: z
|
||||
// .number()
|
||||
// .int()
|
||||
// .gte(100000, { message: "Must be equal to 6 digits" })
|
||||
// .lte(999999, { message: "Must be equal to 6 digits" }),
|
||||
// bankAccount: z
|
||||
// .number()
|
||||
// .int()
|
||||
// .gte(10000000000000000000000, { message: "Must be equal to 23 digits" })
|
||||
// .lte(99999999999999999999999, { message: "Must be equal to 23 digits" }),
|
||||
// // clientType: z.string(),
|
||||
// });
|
||||
|
||||
const IDSerias = ['I-AS', 'I-AH', 'I-BN', 'I-LB', 'I-MR', 'I-DZ'];
|
||||
const IDSerias = ["I-AS", "I-AH", "I-BN", "I-LB", "I-MR", "I-DZ"];
|
||||
|
||||
const GuaranterStage = ({ setStage }) => {
|
||||
const GuaranterStage = ({
|
||||
setStage,
|
||||
signRecipient,
|
||||
setGuaranterData,
|
||||
isGuranter,
|
||||
}) => {
|
||||
const { locale } = useContext(LanguageContext);
|
||||
|
||||
const [idSerial, setIdSerial] = useState('I-AS');
|
||||
const [isLoading, setIsLoading] = useState(false);
|
||||
const [err, setErr] = useState(false);
|
||||
const [errCode, setErrCode] = useState();
|
||||
|
||||
const [idSerial, setIdSerial] = useState("I-AS");
|
||||
const [passportNumber, setPassportNumber] = useState("");
|
||||
const [accNumber, setAccNumber] = useState("");
|
||||
|
||||
const handlePassportNumber = (e) => {
|
||||
setPassportNumber(e.target.value);
|
||||
};
|
||||
const handleAcctNumber = (e) => {
|
||||
setAccNumber(e.target.value);
|
||||
};
|
||||
|
||||
const {
|
||||
register,
|
||||
handleSubmit,
|
||||
formState: { errors },
|
||||
} = useForm({
|
||||
resolver: zodResolver(schema),
|
||||
// resolver: zodResolver(schema),
|
||||
});
|
||||
|
||||
const onSubmit = (data) => {
|
||||
console.log(data);
|
||||
setStage(3);
|
||||
const fetchData = async (idSeria, idNo, accountNo, clientType) => {
|
||||
try {
|
||||
setIsLoading(true);
|
||||
const response = await fetch(
|
||||
`https://shahsyotag.halkbank.gov.tm/onlineloan-services/api/clientinfo`,
|
||||
{
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
body: JSON.stringify({
|
||||
idSeria: idSeria,
|
||||
idNo: idNo,
|
||||
accountNo: accountNo,
|
||||
clientType: "guaranter",
|
||||
signRecipient: signRecipient,
|
||||
}),
|
||||
}
|
||||
);
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error(`HTTP error! Status: ${response.status}`);
|
||||
}
|
||||
|
||||
const responseJson = await response.json();
|
||||
|
||||
setErrCode(responseJson.errCode);
|
||||
|
||||
setGuaranterData(responseJson);
|
||||
|
||||
setIsLoading(false);
|
||||
responseJson.errCode === 0 ? setStage(5) : setStage(6);
|
||||
} catch (error) {
|
||||
console.error(error.toString());
|
||||
// Handle errors as needed
|
||||
setErr(true);
|
||||
}
|
||||
};
|
||||
|
||||
const onSubmit = (data) => {
|
||||
fetchData(idSerial, passportNumber, accNumber, isGuranter);
|
||||
};
|
||||
|
||||
if (isLoading) {
|
||||
return (
|
||||
<section className="imm-cs-1">
|
||||
<h1 className="cs-2-title">Loading...</h1>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<section className="imm-cs-1">
|
||||
<form onSubmit={handleSubmit(onSubmit)}>
|
||||
<h2 className="cs-2-title">
|
||||
{locale === 'TKM'
|
||||
? 'Karzyň kalkulýatory'
|
||||
: locale === 'РУС'
|
||||
? 'Заполните данные поручителя'
|
||||
: locale === 'ENG'
|
||||
? 'Loan calculator'
|
||||
: 'Karzyň kalkulýatory'}
|
||||
{locale === "TKM"
|
||||
? "Karzyň kalkulýatory"
|
||||
: locale === "РУС"
|
||||
? "Заполните данные поручителя"
|
||||
: locale === "ENG"
|
||||
? "Loan calculator"
|
||||
: "Karzyň kalkulýatory"}
|
||||
</h2>
|
||||
<div className="imm-credit-form-wrapper">
|
||||
<Select
|
||||
items={IDSerias}
|
||||
customId={'card'}
|
||||
blockName={'card-1-select'}
|
||||
elName={'card-1-select-el'}
|
||||
name={'passportSerial'}
|
||||
customId={"card"}
|
||||
blockName={"card-1-select"}
|
||||
elName={"card-1-select-el"}
|
||||
name={"passportSerial"}
|
||||
eTarget={true}
|
||||
register={register}
|
||||
label={
|
||||
locale === 'TKM'
|
||||
? 'Kartyň görnüşi'
|
||||
: locale === 'РУС'
|
||||
? 'Серия паспорта'
|
||||
: locale === 'ENG'
|
||||
? 'Card type'
|
||||
: 'Kartyň görnüşi'
|
||||
locale === "TKM"
|
||||
? "Kartyň görnüşi"
|
||||
: locale === "РУС"
|
||||
? "Серия паспорта"
|
||||
: locale === "ENG"
|
||||
? "Card type"
|
||||
: "Kartyň görnüşi"
|
||||
}
|
||||
stateSetter={setIdSerial}
|
||||
/>
|
||||
|
||||
<div className="input-block">
|
||||
<label htmlFor="passport-number">
|
||||
{locale === 'TKM'
|
||||
? 'Hasaba almak'
|
||||
: locale === 'РУС'
|
||||
? 'Номер паспорта'
|
||||
: locale === 'ENG'
|
||||
? 'Sign up'
|
||||
: 'Hasaba almak'}
|
||||
{locale === "TKM"
|
||||
? "Hasaba almak"
|
||||
: locale === "РУС"
|
||||
? "Номер паспорта"
|
||||
: locale === "ENG"
|
||||
? "Sign up"
|
||||
: "Hasaba almak"}
|
||||
</label>
|
||||
<input
|
||||
{...register('passportNumber', { valueAsNumber: true })}
|
||||
type="number"
|
||||
// {...register("passportNumber", { valueAsNumber: true })}
|
||||
value={passportNumber}
|
||||
onChange={handlePassportNumber}
|
||||
type="text"
|
||||
id="passport-number"
|
||||
/>
|
||||
{errors.passportNumber && <span>{errors.passportNumber.message}</span>}
|
||||
{/* {errors.passportNumber && (
|
||||
<span>{errors.passportNumber.message}</span>
|
||||
)} */}
|
||||
</div>
|
||||
<div className="input-block">
|
||||
<label htmlFor="bank-acc">
|
||||
{locale === 'TKM'
|
||||
? 'Hasaba almak'
|
||||
: locale === 'РУС'
|
||||
? 'Номер банковского аккаунта'
|
||||
: locale === 'ENG'
|
||||
? 'Sign up'
|
||||
: 'Hasaba almak'}
|
||||
{locale === "TKM"
|
||||
? "Hasaba almak"
|
||||
: locale === "РУС"
|
||||
? "Номер банковского аккаунта"
|
||||
: locale === "ENG"
|
||||
? "Sign up"
|
||||
: "Hasaba almak"}
|
||||
</label>
|
||||
<input
|
||||
{...register('bankAccount', { valueAsNumber: true })}
|
||||
type="number"
|
||||
// {...register("bankAccount", { valueAsNumber: true })}
|
||||
value={accNumber}
|
||||
onChange={handleAcctNumber}
|
||||
type="text"
|
||||
id="bank-acc"
|
||||
/>
|
||||
{errors.bankAccount && <span>{errors.bankAccount.message}</span>}
|
||||
{/* {errors.bankAccount && <span>{errors.bankAccount.message}</span>} */}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="cu-bottom cd-2-title">
|
||||
<button type="button" className="sign-btn reg-btn" onClick={() => setStage(2)}>
|
||||
<button
|
||||
type="button"
|
||||
className="sign-btn reg-btn"
|
||||
onClick={() => setStage(2)}
|
||||
>
|
||||
<div>
|
||||
<div className="btn-img">
|
||||
<img src={next_reverse} alt="logout" />
|
||||
</div>
|
||||
<h3>
|
||||
{locale === 'TKM'
|
||||
? 'Yza'
|
||||
: locale === 'РУС'
|
||||
? 'Назад'
|
||||
: locale === 'ENG'
|
||||
? 'Back'
|
||||
: 'Yza'}
|
||||
{locale === "TKM"
|
||||
? "Yza"
|
||||
: locale === "РУС"
|
||||
? "Назад"
|
||||
: locale === "ENG"
|
||||
? "Back"
|
||||
: "Yza"}
|
||||
</h3>
|
||||
</div>
|
||||
</button>
|
||||
<button type="button" className="sign-btn cu-btn" onClick={() => setStage(4)}>
|
||||
<button
|
||||
type="submit"
|
||||
disabled={
|
||||
passportNumber.length === 6 && accNumber.length === 23
|
||||
? false
|
||||
: true
|
||||
}
|
||||
className="sign-btn cu-btn"
|
||||
>
|
||||
<div>
|
||||
<h3>
|
||||
{locale === 'TKM'
|
||||
? 'Dowam et'
|
||||
: locale === 'РУС'
|
||||
? 'Подтвердить '
|
||||
: locale === 'ENG'
|
||||
? 'Proceed'
|
||||
: 'Dowam et'}
|
||||
{locale === "TKM"
|
||||
? "Dowam et"
|
||||
: locale === "РУС"
|
||||
? "Подтвердить "
|
||||
: locale === "ENG"
|
||||
? "Proceed"
|
||||
: "Dowam et"}
|
||||
</h3>
|
||||
<div className="btn-img">
|
||||
<img src={next} alt="logout" />
|
||||
|
|
|
|||
|
|
@ -0,0 +1,69 @@
|
|||
import React, { useContext } from "react";
|
||||
import { LanguageContext } from "../../backend/LanguageContext";
|
||||
|
||||
import next from "../../icons/next.svg";
|
||||
import next_reverse from "../../icons/next-reverse.svg";
|
||||
|
||||
const NotAUser = ({ setStage, stage }) => {
|
||||
const { locale } = useContext(LanguageContext);
|
||||
|
||||
return (
|
||||
<section className="imm-cs-1">
|
||||
<form>
|
||||
<h2 className="notauser-title">
|
||||
{locale === "TKM"
|
||||
? "Karzyň kalkulýatory"
|
||||
: locale === "РУС"
|
||||
? "Пользователь не обнаружен"
|
||||
: locale === "ENG"
|
||||
? "Loan calculator"
|
||||
: "Karzyň kalkulýatory"}
|
||||
</h2>
|
||||
<div className="cu-bottom cd-2-title">
|
||||
<button
|
||||
type="button"
|
||||
className="sign-btn reg-btn"
|
||||
onClick={() => setStage((stage) => stage - 2)}
|
||||
>
|
||||
<div>
|
||||
<div className="btn-img">
|
||||
<img src={next_reverse} alt="logout" />
|
||||
</div>
|
||||
<h3>
|
||||
{locale === "TKM"
|
||||
? "Yza"
|
||||
: locale === "РУС"
|
||||
? "Назад"
|
||||
: locale === "ENG"
|
||||
? "Back"
|
||||
: "Yza"}
|
||||
</h3>
|
||||
</div>
|
||||
</button>
|
||||
{/* <button
|
||||
type="button"
|
||||
className="sign-btn cu-btn"
|
||||
onClick={() => setStage(4)}
|
||||
>
|
||||
<div>
|
||||
<h3>
|
||||
{locale === "TKM"
|
||||
? "Dowam et"
|
||||
: locale === "РУС"
|
||||
? "Подтвердить "
|
||||
: locale === "ENG"
|
||||
? "Proceed"
|
||||
: "Dowam et"}
|
||||
</h3>
|
||||
<div className="btn-img">
|
||||
<img src={next} alt="logout" />
|
||||
</div>
|
||||
</div>
|
||||
</button> */}
|
||||
</div>
|
||||
</form>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
|
||||
export default NotAUser;
|
||||
|
|
@ -19,6 +19,7 @@ import BorrowerStage from '../ImmediateCreditsStages/BorrowerStage';
|
|||
import BorrowerInfo from '../ImmediateCreditsStages/BorrowerInfo';
|
||||
import GuaranterStage from '../ImmediateCreditsStages/GuaranterStage';
|
||||
import GuaranterInfo from '../ImmediateCreditsStages/GuaranterInfo';
|
||||
import NotAUser from '../ImmediateCreditsStages/NotAUser';
|
||||
|
||||
const ImmediateCreditModal = ({
|
||||
modalOpen,
|
||||
|
|
@ -39,41 +40,6 @@ const ImmediateCreditModal = ({
|
|||
const [loading, setLoading] = useState();
|
||||
const [error, setError] = useState();
|
||||
|
||||
const fetchData = async () => {
|
||||
try {
|
||||
const response = await fetch(
|
||||
`https://shahsyotag.halkbank.gov.tm/onlineloan-services/api/clientinfo`,
|
||||
// `http://217.174.226.219:443/onlineloan-services/api/clientinfo`,
|
||||
{
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify({
|
||||
idSeria: 'I-AH',
|
||||
idNo: '600898',
|
||||
accountNo: '123456',
|
||||
clientType: 'recipient',
|
||||
}),
|
||||
},
|
||||
);
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error(`HTTP error! Status: ${response.status}`);
|
||||
}
|
||||
|
||||
console.log(response);
|
||||
} catch (error) {
|
||||
console.error(error.toString());
|
||||
// Handle errors as needed
|
||||
setErr(true);
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
fetchData();
|
||||
}, [stage]);
|
||||
|
||||
return (
|
||||
<section className={modalOpen ? 'modal credit-modal active' : 'modal credit-modal'}>
|
||||
<div className="modal-container">
|
||||
|
|
@ -116,7 +82,7 @@ const ImmediateCreditModal = ({
|
|||
<Lines className="lines" />
|
||||
</div>
|
||||
|
||||
<div className={stage > 2 ? 'icon-block active' : 'icon-block'}>
|
||||
<div className={stage > 1 ? 'icon-block active' : 'icon-block'}>
|
||||
<Img3 className="modal-icon" />
|
||||
<h3 className="icon-title">
|
||||
{locale === 'TKM'
|
||||
|
|
@ -129,14 +95,14 @@ const ImmediateCreditModal = ({
|
|||
</h3>
|
||||
</div>
|
||||
|
||||
<div className={stage > 3 ? 'line-block active' : 'line-block'}>
|
||||
<div className={stage > 2 ? 'line-block active' : 'line-block'}>
|
||||
<Lines className="lines" />
|
||||
<Lines className="lines" />
|
||||
</div>
|
||||
|
||||
{isGuranter && (
|
||||
<>
|
||||
<div className={stage > 2 ? 'icon-block active' : 'icon-block'}>
|
||||
<div className={stage > 3 ? 'icon-block active' : 'icon-block'}>
|
||||
<Img4 className="modal-icon" />
|
||||
<h3 className="icon-title">
|
||||
{locale === 'TKM'
|
||||
|
|
@ -149,12 +115,12 @@ const ImmediateCreditModal = ({
|
|||
</h3>
|
||||
</div>
|
||||
|
||||
<div className={stage > 2 ? 'line-block active' : 'line-block'}>
|
||||
<div className={stage > 3 ? 'line-block active' : 'line-block'}>
|
||||
<Lines className="lines" />
|
||||
<Lines className="lines" />
|
||||
</div>
|
||||
|
||||
<div className={stage > 3 ? 'icon-block active' : 'icon-block'}>
|
||||
<div className={stage > 4 ? 'icon-block active' : 'icon-block'}>
|
||||
<Img3 className="modal-icon" />
|
||||
<h3 className="icon-title">
|
||||
{locale === 'TKM'
|
||||
|
|
@ -167,7 +133,7 @@ const ImmediateCreditModal = ({
|
|||
</h3>
|
||||
</div>
|
||||
|
||||
<div className={stage > 3 ? 'line-block active' : 'line-block'}>
|
||||
<div className={stage > 4 ? 'line-block active' : 'line-block'}>
|
||||
<Lines className="lines" />
|
||||
<Lines className="lines" />
|
||||
</div>
|
||||
|
|
@ -237,7 +203,7 @@ const ImmediateCreditModal = ({
|
|||
: 'Karz üçin maglumat'}
|
||||
</h3>
|
||||
</div>
|
||||
) : stage === 2 ? (
|
||||
) : stage >= 2 ? (
|
||||
<div className="icon-block active">
|
||||
<Img3 className="modal-icon" />
|
||||
<h3 className="icon-title">
|
||||
|
|
@ -250,7 +216,7 @@ const ImmediateCreditModal = ({
|
|||
: 'Karzyň kalkulýatory'}
|
||||
</h3>
|
||||
</div>
|
||||
) : stage === 3 && isGuranter ? (
|
||||
) : stage === 4 && isGuranter ? (
|
||||
<div className="icon-block active">
|
||||
<Img3 className="modal-icon" />
|
||||
<h3 className="icon-title">
|
||||
|
|
@ -263,7 +229,7 @@ const ImmediateCreditModal = ({
|
|||
: 'Şahsy maglumatlar'}
|
||||
</h3>
|
||||
</div>
|
||||
) : stage === 4 && isGuranter ? (
|
||||
) : stage >= 5 && isGuranter ? (
|
||||
<div className="icon-block active">
|
||||
<Img4 className="modal-icon" />
|
||||
<h3 className="icon-title">
|
||||
|
|
@ -288,16 +254,15 @@ const ImmediateCreditModal = ({
|
|||
setStage={setStage}
|
||||
isGuranter={isGuranter}
|
||||
setIsGuranter={setIsGuranter}
|
||||
// data={data}
|
||||
// setData={setData}
|
||||
// immediatCreditData={immediatCreditData}
|
||||
// id={id}
|
||||
// setId={setId}
|
||||
setBorrowerData={setBorrowerData}
|
||||
borrowerData={borrowerData}
|
||||
setSignRecipient={setSignRecipient}
|
||||
/>
|
||||
) : stage === 2 ? (
|
||||
<BorrowerInfo
|
||||
setStage={setStage}
|
||||
isGuranter={isGuranter}
|
||||
borrowerData={borrowerData}
|
||||
// data={data}
|
||||
// setData={setData}
|
||||
// immediatCreditData={immediatCreditData}
|
||||
|
|
@ -305,26 +270,34 @@ const ImmediateCreditModal = ({
|
|||
// setId={setId}
|
||||
/>
|
||||
) : stage === 3 ? (
|
||||
<NotAUser setStage={setStage} stage={stage} />
|
||||
) : stage === 4 ? (
|
||||
<GuaranterStage
|
||||
setStage={setStage}
|
||||
isGuranter={isGuranter}
|
||||
setIsGuranter={setIsGuranter}
|
||||
guaranterData={guaranterData}
|
||||
setGuaranterData={setGuaranterData}
|
||||
signRecipient={signRecipient}
|
||||
// data={data}
|
||||
// setData={setData}
|
||||
// immediatCreditData={immediatCreditData}
|
||||
// id={id}
|
||||
// setId={setId}
|
||||
/>
|
||||
) : stage === 4 ? (
|
||||
) : stage === 5 ? (
|
||||
<GuaranterInfo
|
||||
setStage={setStage}
|
||||
isGuranter={isGuranter}
|
||||
guaranterData={guaranterData}
|
||||
// data={data}
|
||||
// setData={setData}
|
||||
// immediatCreditData={immediatCreditData}
|
||||
// id={id}
|
||||
// setId={setId}
|
||||
/>
|
||||
) : stage === 6 ? (
|
||||
<NotAUser setStage={setStage} stage={stage} />
|
||||
) : (
|
||||
''
|
||||
)}
|
||||
|
|
|
|||
Loading…
Reference in New Issue