TPS
/
halkbank_shahsyotag_frontend
4
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

fetch post request in AcceptStage prepared

This commit is contained in:
Kakabay 2024-03-28 18:25:10 +05:00
parent 6a08746e6f
commit 616fdb04ea
6 changed files with 408 additions and 142 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/App.js
View File

@ -42,9 +42,11 @@ const App = () => {
const [locale, setLocale] = useState(
localStorage.getItem('userLanguage') ? localStorage.getItem('userLanguage') : 'TKM',
);
const [loaderActive, setLoaderActive] = useState(false);
const providerValue = useMemo(() => ({ user, setUser }), [user, setUser]);
const languageValue = useMemo(() => ({ locale, setLocale }), [locale, setLocale]);
useEffect(() => {
const userLanguage = localStorage.getItem('userLanguage');
const userToken = localStorage.getItem('userToken');

186
src/components/ImmediateCreditsStages/AcceptStage.js
View File

@ -1,6 +1,7 @@
// IMPORT MODULES
import React, { useState, useContext } from 'react';
import { LanguageContext } from '../../backend/LanguageContext';
import { UserContext } from '../../backend/UserContext';
import { useForm } from 'react-hook-form';
import { z } from 'zod';
import { zodResolver } from '@hookform/resolvers/zod';
@ -18,15 +19,21 @@ const AcceptStage = ({
setStage,
recepientAmount,
creditDuration,
phoneNumber,
setPhoneNumber,
cardDetails,
setCardDetails,
borrowerData,
guaranterData,
isGuranter,
}) => {
const { locale } = useContext(LanguageContext);
const handlePhoneNumber = (e) => {
setPhoneNumber(e.target.value);
const handleCardDetails = (e) => {
setCardDetails(e.target.value);
};
const [isLoading, setIsLoading] = useState(false);
const [error, setError] = useState(false);
const {
register,
handleSubmit,
@ -39,10 +46,145 @@ const AcceptStage = ({
},
});
console.log(borrowerData);
const fetchData = async () => {
try {
setIsLoading(true);
// const response = await fetch(
// `http://shahsyotag.halkbank.gov.tm/onlineloancre-services/api/loancre`,
// {
// method: 'POST',
// headers: {
// 'Content-Type': 'application/json',
// },
// body: JSON.stringify({
// clientRecipient: {
// idSeria: 'I-AŞ',
// idNo: '478992',
// accountNo: '23908934160170143144000',
// name: 'BATYROVA',
// surname: 'Sulgun',
// availableAmount: 40900,
// clientType: 'recipient',
// signRecipient: {
// key1: '6SQbdKd6qWdP8Wa11rF2CVLfo+0H6a0RUZOfyTFBeiWmoQAIC2+zip5SD0xBAlKqE4rRUt+WDBBOasVG3EEC3ANA+yXkrVUXT4OPJBxDGg==',
// key2: 'AAECAwQFBgcICQoLDA0ODw==',
// },
// },
// clientGuarantor: {
// idSeria: 'I-AH',
// idNo: '435937',
// accountNo: '23908934160170851604201',
// name: 'Kirtow',
// surname: 'Mämmetniýaz',
// availableAmount: 40900,
// clientType: 'guarantor',
// signGuarantor: {
// key1: '6SQbdKd6qWdP8Wa11rF2CVLfLkcA66wbX5OewzhJey+hpAcOCmm0gppXCk1BBFKraKHicumzDoWrVN1Pz1oFYuv6t01fz2E9C1oLE6a2Ta0RsRo=',
// key2: 'AAECAwQFBgcICQoLDA0ODw==',
// },
// },
// availableAmount: 40900,
// creditCardAccountNumber: '23908934160170770960000',
// mrtIsInsuarance: 0,
// termInYears: 1,
// }),
// },
// );
const response = await fetch(
`http://shahsyotag.halkbank.gov.tm/onlineloancre-services/api/loancre`,
{
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
clientRecipient: {
idSeria: borrowerData.idSeria,
idNo: borrowerData.idNo,
accountNo: borrowerData.accountNo,
name: borrowerData.name,
surname: borrowerData.surname,
availableAmount: borrowerData.availableAmount,
clientType: 'recipient',
signRecipient: borrowerData.signRecipient,
},
clientGuarantor: isGuranter
? {
idSeria: guaranterData.idSeria,
idNo: guaranterData.idNo,
accountNo: guaranterData.accountNo,
name: guaranterData.name,
surname: guaranterData.surname,
availableAmount: guaranterData.availableAmount,
clientType: 'guarantor',
signRecipient: guaranterData.signRecipient,
}
: null,
availableAmount: recepientAmount,
creditCardAccountNumber: cardDetails,
mrtIsInsuarance: isGuranter ? 1 : 0,
termInYears: creditDuration,
}),
},
);
if (!response.ok) {
throw new Error(`HTTP error! Status: ${response.status}`);
}
const responseJson = await response.json();
console.log(responseJson);
setIsLoading(false);
} catch (error) {
console.error(error.toString());
// Handle errors as needed
setError(true);
}
};
const onSubmit = (data) => {
fetchData();
// console.log(data);
};
if (error) {
return (
<section className="imm-cs-1">
<h1 className="cs-2-title">Error...</h1>
<div className="cu-bottom cd-2-title">
<button type="button" className="sign-btn reg-btn" onClick={() => setStage(7)}>
<div>
<div className="btn-img">
<img src={next_reverse} alt="logout" />
</div>
<h3>
{locale === 'TKM'
? 'Yza'
: locale === 'РУС'
? 'Назад'
: locale === 'ENG'
? 'Back'
: 'Yza'}
</h3>
</div>
</button>
</div>
</section>
);
}
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)}>
@ -83,26 +225,24 @@ const AcceptStage = ({
{errors.duration && <span>{errors.duration.message}</span>}
</div>
<div className="input-block">
<label htmlFor="phone-number">
<label htmlFor="code">
{locale === 'TKM'
? 'Hasaba almak'
? 'At'
: locale === 'РУС'
? 'Номер телефона'
? 'Номер карты'
: locale === 'ENG'
? 'Sign up'
: 'Hasaba almak'}
? 'amount'
: 'At'}
</label>
<div className="phone-starter">
<span>+993</span>
<input
type="number"
id="phone-number"
value={phoneNumber}
onChange={handlePhoneNumber}
placeholder="61324165"
/>
</div>
{/* {errors.phoneNumber && <span>{errors.phoneNumber.message}</span>} */}
<input
value={cardDetails}
onChange={handleCardDetails}
type="text"
id="code"
placeholder="6435980023168745"
/>
<span className="another-option">Оформить карту</span>
{/* {errors.code && <span>{errors.code.message}</span>} */}
</div>
</div>
<div className="cu-bottom cd-2-title">
@ -123,10 +263,10 @@ const AcceptStage = ({
</div>
</button>
<button
type="button"
type="submit"
className="sign-btn cu-btn"
disabled={phoneNumber.length !== 8 ? true : false}
onClick={() => setStage(9)}>
disabled={cardDetails.length !== 16 && !isLoading ? true : false}
onClick={onSubmit}>
<div>
<h3>
{locale === 'TKM'

17
src/components/ImmediateCreditsStages/BorrowerInfo.js
View File

@ -7,6 +7,7 @@ import { zodResolver } from '@hookform/resolvers/zod';
// IMPORT IMAGES
import next from '../../icons/next.svg';
import next_reverse from '../../icons/next-reverse.svg';
import { UserContext } from '../../backend/UserContext';
// import arrow from "../../icons/arrow.svg";
// const schema = z.object({
@ -28,6 +29,7 @@ import next_reverse from '../../icons/next-reverse.svg';
const BorrowerInfo = ({ setStage, isGuranter, borrowerData }) => {
const { locale } = useContext(LanguageContext);
const { user } = useContext(UserContext);
const {
register,
@ -41,6 +43,7 @@ const BorrowerInfo = ({ setStage, isGuranter, borrowerData }) => {
passportSerial: borrowerData.idSeria ? borrowerData.idSeria : 'Loading',
passportNumber: borrowerData.idNo ? borrowerData.idNo : 'Loading',
bankAccount: borrowerData.accountNo ? borrowerData.accountNo : 'Loading',
phoneNumber: user.mobile_phone,
},
});
@ -136,6 +139,20 @@ const BorrowerInfo = ({ setStage, isGuranter, borrowerData }) => {
/>
{errors.bankAccount && <span>{errors.bankAccount.message}</span>}
</div>
<div className="input-block">
<label htmlFor="phone-number">
{locale === 'TKM'
? 'Hasaba almak'
: locale === 'РУС'
? 'Номер телефона'
: locale === 'ENG'
? 'Sign up'
: 'Hasaba almak'}
</label>
<input disabled type="text" id="phone-number" {...register('phoneNumber')} />
{errors.phoneNumber && <span>{errors.phoneNumber.message}</span>}
</div>
</div>
<div className="cu-bottom cd-2-title">

109
src/components/ImmediateCreditsStages/PhoneAccept.js
View File

@ -17,6 +17,9 @@ const schema = z.object({
const PhoneAccept = ({ setStage }) => {
const { locale } = useContext(LanguageContext);
const [isLoading, setIsLoading] = useState(false);
const [error, setError] = useState(false);
const [codeValue, setPhoneValue] = useState('');
const handleCodeChange = (e) => {
@ -27,10 +30,104 @@ const PhoneAccept = ({ setStage }) => {
resolver: zodResolver(schema),
});
const onSubmit = (data) => {
// console.log(data);
const fetchData = async () => {
try {
setIsLoading(true);
const response = await fetch(
`http://shahsyotag.halkbank.gov.tm/onlineloancre-services/api/loancre`,
{
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
clientRecipient: {
idSeria: 'I-AŞ',
idNo: '478992',
accountNo: '23908934160170143144000',
name: 'BATYROVA',
surname: 'Sulgun',
availableAmount: 40900,
clientType: 'recipient',
signRecipient: {
key1: '6SQbdKd6qWdP8Wa11rF2CVLfo+0H6a0RUZOfyTFBeiWmoQAIC2+zip5SD0xBAlKqE4rRUt+WDBBOasVG3EEC3ANA+yXkrVUXT4OPJBxDGg==',
key2: 'AAECAwQFBgcICQoLDA0ODw==',
},
},
clientGuarantor: {
idSeria: 'I-AH',
idNo: '435937',
accountNo: '23908934160170851604201',
name: 'Kirtow',
surname: 'Mämmetniýaz',
availableAmount: 40900,
clientType: 'guarantor',
signGuarantor: {
key1: '6SQbdKd6qWdP8Wa11rF2CVLfLkcA66wbX5OewzhJey+hpAcOCmm0gppXCk1BBFKraKHicumzDoWrVN1Pz1oFYuv6t01fz2E9C1oLE6a2Ta0RsRo=',
key2: 'AAECAwQFBgcICQoLDA0ODw==',
},
},
availableAmount: 40900,
creditCardAccountNumber: '23908934160170770960000',
mrtIsInsuarance: 0,
termInYears: 1,
}),
},
);
if (!response.ok) {
throw new Error(`HTTP error! Status: ${response.status}`);
}
const responseJson = await response.json();
console.log(responseJson);
setIsLoading(false);
} catch (error) {
console.error(error.toString());
// Handle errors as needed
setError(true);
}
};
const onSubmit = (data) => {
console.log('fetch');
fetchData();
};
if (isLoading) {
return (
<section className="imm-cs-1">
<h1 className="cs-2-title">Loading...</h1>
</section>
);
}
if (error) {
return (
<section className="imm-cs-1">
<h1 className="cs-2-title">Error...</h1>
<button type="button" className="sign-btn reg-btn" onClick={() => setStage(8)}>
<div>
<div className="btn-img">
<img src={next_reverse} alt="logout" />
</div>
<h3>
{locale === 'TKM'
? 'Yza'
: locale === 'РУС'
? 'Назад'
: locale === 'ENG'
? 'Back'
: 'Yza'}
</h3>
</div>
</button>
</section>
);
}
return (
<section className="imm-cs-1">
<form onSubmit={handleSubmit(onSubmit)}>
@ -77,10 +174,10 @@ const PhoneAccept = ({ setStage }) => {
</div>
</button>
<button
disabled={codeValue.length !== 6 ? true : false}
type="button"
className="sign-btn cu-btn"
onClick={() => setStage(10)}>
disabled={codeValue.length !== 6 && !isLoading ? true : false}
type="submit"
onClick={onSubmit}
className="sign-btn cu-btn">
<div>
<h3>
{locale === 'TKM'

17
src/components/immediateCredits/ImmediateCreditModal.js
View File

@ -46,6 +46,7 @@ const ImmediateCreditModal = ({
const [borrowerData, setBorrowerData] = useState();
const [guaranterData, setGuaranterData] = useState();
const [signRecipient, setSignRecipient] = useState();
const [sighGuaranter, setSignGuaranter] = useState();
const [maxAmount, setMaxAmount] = useState();
@ -54,6 +55,8 @@ const ImmediateCreditModal = ({
const [phoneNumber, setPhoneNumber] = useState('');
const [cardDetails, setCardDetails] = useState('');
console.log(borrowerData);
const userToken = localStorage.getItem('userToken');
return (
@ -321,14 +324,20 @@ const ImmediateCreditModal = ({
creditDuration={creditDuration}
setPhoneNumber={setPhoneNumber}
phoneNumber={phoneNumber}
setCardDetails={setCardDetails}
cardDetails={cardDetails}
borrowerData={borrowerData}
guaranterData={guaranterData}
isGuranter={isGuranter}
/>
) : stage === 9 ? (
<PhoneAccept setStage={setStage} />
) : stage === 10 ? (
<CardDetails
<PhoneAccept
setStage={setStage}
borrowerData={borrowerData}
guaranterData={guaranterData}
cardDetails={cardDetails}
setCardDetails={setCardDetails}
recepientAmount={recepientAmount}
creditDuration={creditDuration}
/>
) : (
''

219
src/pages/Profile.js
View File

@ -1,21 +1,22 @@
// IMPORT MODULES
import React, { useState, useContext } from "react";
import { UserContext } from "../backend/UserContext";
import { LanguageContext } from "../backend/LanguageContext";
import React, { useState, useContext } from 'react';
import { UserContext } from '../backend/UserContext';
import { LanguageContext } from '../backend/LanguageContext';
// IMPORT COMPONENTS
import Breadcrumb from "../components/global/Breadcrumb";
import Breadcrumb from '../components/global/Breadcrumb';
// IMPORT VALIDATORS
import { ValidateEmail } from "../validators/ValidateEmail";
import { ValidatePhoneNumber } from "../validators/ValidatePhoneNumber";
import { ValidateEmail } from '../validators/ValidateEmail';
import { ValidatePhoneNumber } from '../validators/ValidatePhoneNumber';
// IMPORT IMAGES
import userImg from "../icons/user-black.svg";
import userImg from '../icons/user-black.svg';
const Profile = () => {
const { locale } = useContext(LanguageContext);
const { user } = useContext(UserContext);
const [inputValid, setInputValid] = useState({
surname: true,
name: true,
@ -33,15 +34,15 @@ const Profile = () => {
<section className="profile">
<Breadcrumb
image={userImg}
link={"/home/profile"}
link={'/home/profile'}
linkTitle={
locale === "TKM"
? "Profiliň maglumaty"
: locale === "РУС"
? "Данные профиля"
: locale === "ENG"
? "Profile information"
: "Profiliň maglumaty"
locale === 'TKM'
? 'Profiliň maglumaty'
: locale === 'РУС'
? 'Данные профиля'
: locale === 'ENG'
? 'Profile information'
: 'Profiliň maglumaty'
}
/>
<div className="container">
@ -50,34 +51,34 @@ const Profile = () => {
<div className="form-top">
<div className="cu-bottom profile-title">
<h2 className="profile-title">
{locale === "TKM"
? "Profiliň maglumaty"
: locale === "РУС"
? "Данные профиля"
: locale === "ENG"
? "Profile information"
: "Profiliň maglumaty"}
{locale === 'TKM'
? 'Profiliň maglumaty'
: locale === 'РУС'
? 'Данные профиля'
: locale === 'ENG'
? 'Profile information'
: 'Profiliň maglumaty'}
</h2>
</div>
</div>
<div className="form-bottom">
<div className="input-block">
<label htmlFor="surname">
{locale === "TKM"
? "Hasaba almak"
: locale === "РУС"
? "Регистрация"
: locale === "ENG"
? "Sign up"
: "Hasaba almak"}
{locale === 'TKM'
? 'Hasaba almak'
: locale === 'РУС'
? 'Регистрация'
: locale === 'ENG'
? 'Sign up'
: 'Hasaba almak'}
</label>
<input
readOnly
type="text"
id="surname"
defaultValue={user ? user.surname : ""}
defaultValue={user ? user.surname : ''}
onChange={(e) => {
if (e.target.value !== "") {
if (e.target.value !== '') {
setInputValid({ ...inputValid, surname: true });
} else {
setInputValid({ ...inputValid, surname: false });
@ -87,21 +88,21 @@ const Profile = () => {
</div>
<div className="input-block">
<label htmlFor="name">
{locale === "TKM"
? "Ady"
: locale === "РУС"
? "Имя"
: locale === "ENG"
? "First name"
: "Ady"}
{locale === 'TKM'
? 'Ady'
: locale === 'РУС'
? 'Имя'
: locale === 'ENG'
? 'First name'
: 'Ady'}
</label>
<input
readOnly
type="text"
id="name"
defaultValue={user ? user.name : ""}
defaultValue={user ? user.name : ''}
onChange={(e) => {
if (e.target.value !== "") {
if (e.target.value !== '') {
setInputValid({ ...inputValid, name: true });
} else {
setInputValid({ ...inputValid, name: false });
@ -111,21 +112,21 @@ const Profile = () => {
</div>
<div className="input-block">
<label htmlFor="fathers">
{locale === "TKM"
? "Atasynyň ady"
: locale === "РУС"
? "Отчество"
: locale === "ENG"
? "Middle name"
: "Atasynyň ady"}
{locale === 'TKM'
? 'Atasynyň ady'
: locale === 'РУС'
? 'Отчество'
: locale === 'ENG'
? 'Middle name'
: 'Atasynyň ady'}
</label>
<input
readOnly
type="text"
id="fathers"
defaultValue={user ? user.middle_name : ""}
defaultValue={user ? user.middle_name : ''}
onChange={(e) => {
if (e.target.value !== "") {
if (e.target.value !== '') {
setInputValid({ ...inputValid, fathers: true });
} else {
setInputValid({ ...inputValid, fathers: false });
@ -135,21 +136,21 @@ const Profile = () => {
</div>
<div className="input-block">
<label htmlFor="date">
{locale === "TKM"
? "Doglan senesi"
: locale === "РУС"
? "Дата рождения"
: locale === "ENG"
? "Date of birth"
: "Doglan senesi"}
{locale === 'TKM'
? 'Doglan senesi'
: locale === 'РУС'
? 'Дата рождения'
: locale === 'ENG'
? 'Date of birth'
: 'Doglan senesi'}
</label>
<input
readOnly
type="date"
id="date"
defaultValue={user ? user.date_birth : ""}
defaultValue={user ? user.date_birth : ''}
onChange={(e) => {
if (e.target.value !== "") {
if (e.target.value !== '') {
setInputValid({ ...inputValid, date: true });
} else {
setInputValid({ ...inputValid, date: false });
@ -159,21 +160,21 @@ const Profile = () => {
</div>
<div className="input-block">
<label htmlFor="passport">
{locale === "TKM"
? "Pasport maglumatlary"
: locale === "РУС"
? "Паспортные данные"
: locale === "ENG"
? "Passport information"
: "Pasport maglumatlary"}
{locale === 'TKM'
? 'Pasport maglumatlary'
: locale === 'РУС'
? 'Паспортные данные'
: locale === 'ENG'
? 'Passport information'
: 'Pasport maglumatlary'}
</label>
<input
readOnly
type="text"
id="passport"
defaultValue={user ? user.passport : ""}
defaultValue={user ? user.passport : ''}
onChange={(e) => {
if (e.target.value !== "") {
if (e.target.value !== '') {
setInputValid({ ...inputValid, passport: true });
} else {
setInputValid({ ...inputValid, passport: false });
@ -183,21 +184,21 @@ const Profile = () => {
</div>
<div className="input-block">
<label htmlFor="p-address">
{locale === "TKM"
? "Pasportyň berlen ýeri"
: locale === "РУС"
? "Место выдачи паспорта"
: locale === "ENG"
? "Place of passport issuance"
: "Pasportyň berlen ýeri"}
{locale === 'TKM'
? 'Pasportyň berlen ýeri'
: locale === 'РУС'
? 'Место выдачи паспорта'
: locale === 'ENG'
? 'Place of passport issuance'
: 'Pasportyň berlen ýeri'}
</label>
<input
readOnly
type="text"
id="p-address"
defaultValue={user ? user.place_passport : ""}
defaultValue={user ? user.place_passport : ''}
onChange={(e) => {
if (e.target.value !== "") {
if (e.target.value !== '') {
setInputValid({ ...inputValid, p_address: true });
} else {
setInputValid({ ...inputValid, p_address: false });
@ -207,21 +208,21 @@ const Profile = () => {
</div>
<div className="input-block">
<label htmlFor="address">
{locale === "TKM"
? "Ýaşaýan salgysy"
: locale === "РУС"
? "Адрес проживания"
: locale === "ENG"
? "Address of residence"
: "Ýaşaýan salgysy"}
{locale === 'TKM'
? 'Ýaşaýan salgysy'
: locale === 'РУС'
? 'Адрес проживания'
: locale === 'ENG'
? 'Address of residence'
: 'Ýaşaýan salgysy'}
</label>
<input
readOnly
type="text"
id="address"
defaultValue={user ? user.address_residence : ""}
defaultValue={user ? user.address_residence : ''}
onChange={(e) => {
if (e.target.value !== "") {
if (e.target.value !== '') {
setInputValid({ ...inputValid, address: true });
} else {
setInputValid({ ...inputValid, address: false });
@ -231,19 +232,19 @@ const Profile = () => {
</div>
<div className="input-block">
<label htmlFor="mail">
{locale === "TKM"
? "Email"
: locale === "РУС"
? "Электронная почта"
: locale === "ENG"
? "Email"
: "Email"}
{locale === 'TKM'
? 'Email'
: locale === 'РУС'
? 'Электронная почта'
: locale === 'ENG'
? 'Email'
: 'Email'}
</label>
<input
readOnly
type="email"
id="mail"
defaultValue={user ? user.email : ""}
defaultValue={user ? user.email : ''}
onChange={(e) => {
if (ValidateEmail(e.target.value)) {
setInputValid({ ...inputValid, mail: true });
@ -255,19 +256,19 @@ const Profile = () => {
</div>
<div className="input-block">
<label htmlFor="mobile">
{locale === "TKM"
? "Mobil telefon"
: locale === "РУС"
? "Мобильный телефон"
: locale === "ENG"
? "Phone number"
: "Mobil telefon"}
{locale === 'TKM'
? 'Mobil telefon'
: locale === 'РУС'
? 'Мобильный телефон'
: locale === 'ENG'
? 'Phone number'
: 'Mobil telefon'}
</label>
<input
readOnly
type="text"
id="mobile"
defaultValue={user ? user.mobile_phone : ""}
defaultValue={user ? user.mobile_phone : ''}
onChange={(e) => {
if (ValidatePhoneNumber(e.target.value)) {
setInputValid({ ...inputValid, mobile: true });
@ -279,19 +280,19 @@ const Profile = () => {
</div>
<div className="input-block">
<label htmlFor="homeTel">
{locale === "TKM"
? "Öý telefon"
: locale === "РУС"
? "Домашний телефон"
: locale === "ENG"
? "Home phone number"
: "Öý telefon"}
{locale === 'TKM'
? 'Öý telefon'
: locale === 'РУС'
? 'Домашний телефон'
: locale === 'ENG'
? 'Home phone number'
: 'Öý telefon'}
</label>
<input
readOnly
type="text"
id="homeTel"
defaultValue={user ? user.home_phone : ""}
defaultValue={user ? user.home_phone : ''}
onChange={(e) => {
if (ValidatePhoneNumber(e.target.value)) {
setInputValid({ ...inputValid, home: true });