api class

This commit is contained in:
Kakabay 2022-11-02 18:37:58 +05:00
parent ff50bc2705
commit 1e94592641
6 changed files with 109 additions and 16 deletions

View File

@ -4,7 +4,7 @@
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite + React</title>
<title>Exchange</title>
</head>
<body>
<div id="root"></div>

View File

@ -5,14 +5,14 @@ import { Link } from 'react-router-dom';
import logo from '../assets/icons/logo.svg';
import burger from '../assets/icons/burger.svg';
import { ReactComponent as Close } from '../assets/icons/close.svg';
import { useState } from 'react';
import { useState, useEffect } from 'react';
const Header = () => {
// States
const [navActive, setNavActive] = useState(false);
const [data, setData] = useState();
// Functions
const togleNav = () => {
const toggleNav = () => {
setNavActive(!navActive);
};
@ -82,7 +82,7 @@ const Header = () => {
<Link to={'/'} className="logo">
<img src={logo} alt="logo" />
</Link>
<div className="burger" onClick={togleNav}>
<div className="burger" onClick={toggleNav}>
<img src={burger} />
</div>
</div>
@ -90,35 +90,35 @@ const Header = () => {
</div>
<nav className={`mobile-nav-content ${navActive ? 'active' : null}`}>
<div className="close-burger" onClick={togleNav}>
<div className="close-burger" onClick={toggleNav}>
<Close />
</div>
<ul className="mobile-nav-list">
<li className="mobile-nav-list-item" onClick={togleNav}>
<li className="mobile-nav-list-item" onClick={toggleNav}>
<Link to={'/gtsbt'}>ГТСБТ</Link>
</li>
<li className="mobile-nav-list-item" onClick={togleNav}>
<li className="mobile-nav-list-item" onClick={toggleNav}>
<Link to={'/norm'}>Нормативная база</Link>
</li>
<li className="mobile-nav-list-item" onClick={togleNav}>
<li className="mobile-nav-list-item" onClick={toggleNav}>
<Link to={'/'}>Новости</Link>
</li>
<li className="mobile-nav-list-item" onClick={togleNav}>
<li className="mobile-nav-list-item" onClick={toggleNav}>
<Link to={'/'}>Мультимедия</Link>
</li>
<li className="mobile-nav-list-item" onClick={togleNav}>
<li className="mobile-nav-list-item" onClick={toggleNav}>
<Link to={'/'}>Контакты</Link>
</li>
<li className="mobile-nav-list-item" onClick={togleNav}>
<li className="mobile-nav-list-item" onClick={toggleNav}>
<Link to={'/trade'}>Биржевые торги</Link>
</li>
<li className="mobile-nav-list-item" onClick={togleNav}>
<li className="mobile-nav-list-item" onClick={toggleNav}>
<Link to={'/fin'}>Финансовый мониторинг</Link>
</li>
<li className="mobile-nav-list-item" onClick={togleNav}>
<li className="mobile-nav-list-item" onClick={toggleNav}>
<Link to={'/register'}>Регистрация договоров</Link>
</li>
<li className="mobile-nav-list-item" onClick={togleNav}>
<li className="mobile-nav-list-item" onClick={toggleNav}>
<Link to={'/trade'}>Тарифы и сборы</Link>
</li>
</ul>

78
src/helpers/api.js Normal file
View File

@ -0,0 +1,78 @@
// Modules
import axios from 'axios';
import React, { SetStateAction } from 'react';
export class Api {
destination;
initialState;
setState;
setLoader;
middleware = (data) => data;
/**
*
* @param {string} destionation
* @param {any} initialState
* @param {React.Dispatch<SetStateAction<any>>} setState
* @param {React.Dispatch<SetStateAction<any>> | null} setLoader
* @param {() => any} middleware
*/
constructor(destionation, initialState, setState, setLoader, middleware) {
this.destination = destionation;
this.initialState = initialState;
this.setState = setState;
this.setLoader = setLoader;
this.middleware = middleware;
}
/**
* @param {boolean} load
*/
get(load = false) {
try {
return axios
.get(this.destination)
.then((res) => {
if (load) {
this.setLoader(true);
}
this.setState(res.data);
})
.finally(() => {
if (load) {
this.setLoader(false);
}
});
} catch (error) {
throw new Error('Bad parameters', error);
}
}
/**
* @param {FormData | Object} data
* @param {boolean} require
* @param {boolean} load
*/
post(data, require = false, load = false) {
try {
return axios
.post(this.destination, data)
.then((res) => {
if (load) {
this.setLoader(true);
}
if (require) {
this.setState(res.data);
}
})
.finally(() => {
if (load) {
this.setLoader(false);
}
});
} catch (error) {
throw new Error('Bad parameters', error);
}
}
}

View File

@ -1,6 +1,10 @@
import SectionTitle from '../components/SectionTitle';
const Finance = () => {
useEffect(() => {
window.scrollTo(0, 0);
}, []);
return (
<main>
<div className="container">

View File

@ -1,9 +1,9 @@
// Modules
import { useEffect } from 'react';
import { Link } from 'react-router-dom';
// Components
import Hero from '../components/Hero';
import SectionTitle from '../components/SectionTitle';
import Ticker from '../components/Ticker';
import NewsPost from '../components/NewsPost';
import DocumentLink from '../components/DocumentLink';
import VideoPlayer from '../components/VideoPlayer';
@ -12,6 +12,10 @@ import DataChart from '../components/DataChart';
import arrow from '../assets/icons/arrow.svg';
const Home = () => {
useEffect(() => {
window.scrollTo(0, 0);
}, []);
return (
<main className="home-main">
{/* Hero section */}

View File

@ -1,6 +1,13 @@
// Modules
import { useEffect } from 'react';
// Components
import SectionTitle from '../components/SectionTitle';
export const Normative = () => {
useEffect(() => {
window.scrollTo(0, 0);
}, []);
return (
<main>
<div className="container">