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

new api integrations

This commit is contained in:
VividTruthKeeper 2022-04-09 17:14:30 +05:00
parent d9178da8cb
commit daa8517b1a
6 changed files with 102 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/components/CardStages/CardStage1.js
View File

@ -9,9 +9,9 @@ import CustomSelect from "../global/CustomSelect";
import credit from "../../images/credit-card.jpg";
import next from "../../icons/next.svg";
const CardStage1 = ({ setStage, data, setData, cardData }) => {
const CardStage1 = ({ setStage, data, setData, cardData, req, setReq }) => {
const { locale } = useContext(LanguageContext);
// const [price, setPrice] = useState(0);
const [price, setPrice] = useState(0);
const [inputValid, setInputValid] = useState(
data.selected_card ? data.selected_card : false
);
@ -27,7 +27,12 @@ const CardStage1 = ({ setStage, data, setData, cardData }) => {
)
) {
setId(el.id);
// setPrice(el.card_cost);
setPrice(el.card_cost);
setReq({
...req,
tuk: el.documents,
rus: JSON.parse(el.translations[0].attribute_data).documents,
});
}
});
}
@ -154,7 +159,7 @@ const CardStage1 = ({ setStage, data, setData, cardData }) => {
onClick={() => {
setStage(2);
setData({ ...data, selected_card: inputValid });
setData({ ...data, price: id });
setData({ ...data, price: price });
}}
>
<div>

19
src/components/CardStages/CardStage4.js
View File

@ -8,12 +8,13 @@ import next from "../../icons/next.svg";
import arrow from "../../icons/arrow.svg";
import next_reverse from "../../icons/next-reverse.svg";
const CardStage4 = ({ setStage, data, setData }) => {
const CardStage4 = ({ setStage, data, setData, req, setReq }) => {
const { locale } = useContext(LanguageContext);
const [files, setFiles] = useState(data.file ? data.file : []);
const [btnEnabled, setBtnEnabled] = useState(false);
const [dropdown, setDropdown] = useState(false);
const parser = new DOMParser();
useEffect(() => {
if (files.length > 0) {
@ -52,9 +53,19 @@ const CardStage4 = ({ setStage, data, setData }) => {
dropdown ? "data-dropdown docs active" : "data-dropdown docs"
}
>
<h5>Lorem ipsum dolor sit.</h5>
<h5 className="left right">Lorem ipsum dolor sit.</h5>
<h5>Lorem ipsum dolor sit.</h5>
<div className="text-block">
{locale === "TUK"
? parser
.parseFromString(req.tuk, "text/html")
.getElementsByTagName("p")[0]
.innerText.split(". ")
.map((el, i) => <p key={i}>- {el}</p>)
: parser
.parseFromString(req.rus, "text/html")
.getElementsByTagName("p")[0]
.innerText.split(". ")
.map((el, i) => <p key={i}>- {el}</p>)}
</div>
</div>
</div>
</div>

28
src/components/CreditStages/CreditStage1.js
View File

@ -11,11 +11,16 @@ import next from "../../icons/next.svg";
const CreditStage1 = ({ setStage, data, setData, creditData, id, setId }) => {
const { locale } = useContext(LanguageContext);
const [req, setReq] = useState({
rus: "",
tuk: "",
});
const [input, setInput] = useState(data.type ? data.type : null);
const [dropdown, setDropdown] = useState({
one: true,
two: false,
});
const parser = new DOMParser();
useEffect(() => {
if (input !== "" && creditData) {
@ -29,6 +34,11 @@ const CreditStage1 = ({ setStage, data, setData, creditData, id, setId }) => {
).includes(input)
) {
setId(el.id);
setReq({
...req,
tuk: el.documents,
rus: JSON.parse(el.translations[0].attribute_data).documents,
});
}
});
}
@ -216,9 +226,21 @@ const CreditStage1 = ({ setStage, data, setData, creditData, id, setId }) => {
: "data-dropdown docs"
}
>
<h5>Lorem ipsum dolor sit.</h5>
<h5 className="left right">Lorem ipsum dolor sit.</h5>
<h5>Lorem ipsum dolor sit.</h5>
<div className="text-block">
{
locale === "TUK"
? parser
.parseFromString(req.tuk, "text/html")
.getElementsByTagName("p")[0]
: // .innerText.split(". ")
// .map((el, i) => <p key={i}>- {el}</p>)
parser
.parseFromString(req.rus, "text/html")
.getElementsByTagName("p")[0]
// .innerText.split(". ")
// .map((el, i) => <p key={i}>- {el}</p>)
}
</div>
</div>
</div>
</div>

14
src/components/cards/ModalForm.js
View File

@ -35,6 +35,10 @@ const ModalForm = ({
const window = useRef();
const { locale } = useContext(LanguageContext);
const [data, setData] = useState({});
const [req, setReq] = useState({
rus: "",
tuk: "",
});
const [cardData, setCardData] = useState();
useEffect(() => {
@ -200,13 +204,21 @@ const ModalForm = ({
data={data}
setData={setData}
cardData={cardData}
req={req}
setReq={setReq}
/>
) : stage === 2 ? (
<CardStage2 setStage={setStage} data={data} setData={setData} />
) : stage === 3 ? (
<CardStage3 setStage={setStage} data={data} setData={setData} />
) : stage === 4 ? (
<CardStage4 setStage={setStage} data={data} setData={setData} />
<CardStage4
setStage={setStage}
data={data}
setData={setData}
req={req}
setReq={setReq}
/>
) : stage === 5 ? (
<CardStage6
setStage={setStage}

1
src/components/credits/CreditModal.js
View File

@ -33,6 +33,7 @@ const CreditModal = ({
const { locale } = useContext(LanguageContext);
const window = useRef();
const [data, setData] = useState({});
const [id, setId] = useState(1);
return (
<section

66
src/scss/_credit-modal.scss
View File

@ -46,15 +46,16 @@
}
.data-dropdown {
display: grid;
grid-template-columns: repeat(3, 1fr);
.text-block {
padding: 4rem 2rem;
}
background: #f2f2f2;
border-radius: 0.5rem;
border-top: none;
border: none;
max-height: 0;
transition: 0.4s all ease;
overflow: hidden;
overflow: auto;
&.active {
max-height: 50rem;
@ -105,22 +106,13 @@
}
.data-dropdown {
p {
font-size: 1.6rem;
display: block;
}
&.docs {
&.active {
max-height: 10rem;
}
h5 {
padding: 3rem;
font-size: 1.6rem;
text-align: center;
font-weight: normal;
&.right {
border-right: 0.1rem solid #e5e5e5;
}
&.left {
border-left: 0.1rem solid #e5e5e5;
}
max-height: 50rem;
}
}
}
@ -303,17 +295,27 @@
gap: 1rem;
}
.data-dropdown {
display: grid;
grid-template-columns: 1fr;
gap: 1rem;
background: none;
.text-block {
padding: 3rem 2rem;
}
gap: 1rem;
margin-top: 1rem;
p {
font-size: 1.4rem;
}
&.active {
max-height: 70rem;
}
}
.dropdown-inner {
border: 0.1rem solid #e5e5e5;
border: 0.1rem solid #e5e5e5 !important;
border-radius: 0.5rem;
height: 100%;
padding: 1.5rem 1rem;
@ -323,6 +325,12 @@
h2 {
font-size: 1.6rem;
}
&.right,
&.left,
&.bottom {
border: none;
}
}
.cs-2 form {
display: flex;
@ -330,10 +338,6 @@
}
.data-dropdown.docs {
h5 {
border: 0.1rem solid #e5e5e5;
border-radius: 0.5rem;
}
&.active {
max-height: 40rem;
}
@ -382,12 +386,20 @@
.cs-1 form {
gap: 2rem;
}
.data-dropdown.active {
border: none;
.dropdown-inner {
h2 {
font-size: 1.4rem;
}
}
.data-dropdown.docs h5 {
font-size: 1.2rem;
padding: 2rem 1rem;
.data-dropdown.docs {
.text-block {
padding: 2rem 1rem;
}
p {
font-size: 1.2rem;
}
}
}