TPS
/
exchange-client
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
index.html
View File

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

28
src/components/Header.jsx
View File

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

4
src/pages/Finance.jsx
View File

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

6
src/pages/Home.jsx
View File

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

7
src/pages/Normative.jsx
View File

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