new views
This commit is contained in:
parent
543748e409
commit
3ac66b6724
17797
frontend/package-lock.json
generated
17797
frontend/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -14,6 +14,9 @@
|
||||
"@testing-library/react": "^12.1.2",
|
||||
"@testing-library/user-event": "^13.5.0",
|
||||
"d3": "^7.3.0",
|
||||
"express": "^4.17.2",
|
||||
"heroku": "^7.59.2",
|
||||
"heroku-cli": "^7.0.9",
|
||||
"react-minimal-pie-chart": "^8.2.0",
|
||||
"react-multi-carousel": "^2.6.5",
|
||||
"react-router-dom": "^6.2.1",
|
||||
|
||||
@ -2,19 +2,19 @@
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
|
||||
<link rel="icon" href="/public/favicon.ico" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<meta name="theme-color" content="#000000" />
|
||||
<meta
|
||||
name="description"
|
||||
content="Web site created using create-react-app"
|
||||
/>
|
||||
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
|
||||
<link rel="apple-touch-icon" href="/public/logo192.png" />
|
||||
<!--
|
||||
manifest.json provides metadata used when your web app is installed on a
|
||||
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
|
||||
-->
|
||||
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
|
||||
<link rel="manifest" href="/public/manifest.json" />
|
||||
<!--
|
||||
Notice the use of %PUBLIC_URL% in the tags above.
|
||||
It will be replaced with the URL of the `public` folder during the build.
|
||||
|
||||
12
frontend/server/server.js
Normal file
12
frontend/server/server.js
Normal file
@ -0,0 +1,12 @@
|
||||
const path = require('path');
|
||||
const express = require('express');
|
||||
const app = express();
|
||||
const publicPath = path.join(__dirname, '..', 'public');
|
||||
const port = process.env.PORT || 3000;
|
||||
app.use(express.static(publicPath));
|
||||
app.get('*', (req, res) => {
|
||||
res.sendFile(path.join(publicPath, 'index.html'));
|
||||
});
|
||||
app.listen(port, () => {
|
||||
console.log('Server is up!');
|
||||
});
|
||||
@ -11,7 +11,7 @@ import Avatar from '@mui/material/Avatar';
|
||||
import Button from '@mui/material/Button';
|
||||
import Tooltip from '@mui/material/Tooltip';
|
||||
import MenuItem from '@mui/material/MenuItem';
|
||||
import {useNavigate} from 'react-router-dom';
|
||||
import {useNavigate, Link} from 'react-router-dom';
|
||||
import {useCallback} from 'react';
|
||||
|
||||
//Adding new pages or settings
|
||||
@ -45,6 +45,7 @@ const ResponsiveAppBar = () => {
|
||||
<AppBar position="static" >
|
||||
<Container maxWidth="xl" style={{ background: '#000000' }}>
|
||||
<Toolbar disableGutters >
|
||||
<Link to="/home">
|
||||
<Typography
|
||||
variant="h6"
|
||||
noWrap
|
||||
@ -54,6 +55,7 @@ const ResponsiveAppBar = () => {
|
||||
>
|
||||
BITSEARCH
|
||||
</Typography>
|
||||
</Link>
|
||||
|
||||
<Box sx={{ flexGrow: 1, display: { xs: 'flex', md: 'none' } }}>
|
||||
<IconButton
|
||||
|
||||
126
frontend/src/Views/BNB3.js
Normal file
126
frontend/src/Views/BNB3.js
Normal file
@ -0,0 +1,126 @@
|
||||
import './CoinStat.css';
|
||||
import Header from '../Components/Header'
|
||||
import Container from '@mui/material/Container';
|
||||
//import DatePicker from '../components/DatePicker'
|
||||
import ImageList from '@mui/material/ImageList';
|
||||
import ImageListItem from '@mui/material/ImageListItem';
|
||||
import waluta1 from '../Assets/1.png';
|
||||
import waluta2 from '../Assets/2.png';
|
||||
import waluta3 from '../Assets/10.png';
|
||||
import waluta4 from '../Assets/4.png';
|
||||
import waluta5 from '../Assets/5.png';
|
||||
import waluta6 from '../Assets/6.png';
|
||||
import waluta7 from '../Assets/7.png';
|
||||
import waluta8 from '../Assets/8.png';
|
||||
import waluta9 from '../Assets/9.png';
|
||||
import waluta10 from '../Assets/11.png';
|
||||
import {useCallback, Component} from 'react';
|
||||
|
||||
import { Link } from "react-router-dom";
|
||||
import { PieChart } from 'react-minimal-pie-chart';
|
||||
|
||||
|
||||
export class BNB extends Component {
|
||||
componentDidMount() {
|
||||
fetch('https://bitsearch-api.azurewebsites.net/search/analise/bnb')
|
||||
.then((res) => res.json())
|
||||
.then((json) => this.setState({ pos: json.results }));
|
||||
}
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<Header/>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'right'
|
||||
}}>
|
||||
<ImageList sx={{ width: '75vw', height: 200 }} cols={10} rowHeight={164}>
|
||||
{itemData.map((item) => (
|
||||
<Link to={`/coinStat/${item.title}`}>
|
||||
<ImageListItem key={item.img}>
|
||||
<img
|
||||
src={`${item.img}?w=164&h=164&fit=crop&auto=format`}
|
||||
srcSet={`${item.img}?w=164&h=164&fit=crop&auto=format&dpr=2 2x`}
|
||||
alt={item.title}
|
||||
loading="lazy"
|
||||
/>
|
||||
</ImageListItem>
|
||||
</Link>
|
||||
))}
|
||||
</ImageList>
|
||||
</div>
|
||||
<div className = 'innerSpace'>
|
||||
<Container maxWidth="xl">
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'left'
|
||||
}}>
|
||||
<img src={waluta3} alt='currentVal' style={{
|
||||
borderWidth: 5,
|
||||
height: 200,
|
||||
width: 200
|
||||
}} />
|
||||
</div>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'left'
|
||||
}}>
|
||||
<PieChart
|
||||
viewBoxSize = {700,700}
|
||||
reveal = {100}
|
||||
data={[
|
||||
{ title: 'Positive', value: 0.1, color: '#82dd55' },
|
||||
{ title: 'Negative', value: 0.008, color: '#E23636' },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</Container>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
const itemData = [
|
||||
{
|
||||
img: waluta1,
|
||||
title: 'Dash',
|
||||
},
|
||||
{
|
||||
img: waluta2,
|
||||
title: 'Bitcoin',
|
||||
},
|
||||
{
|
||||
img: waluta3,
|
||||
title: 'BNB',
|
||||
},
|
||||
{
|
||||
img: waluta4,
|
||||
title: 'Ethereum',
|
||||
},
|
||||
{
|
||||
img: waluta5,
|
||||
title: 'TRON',
|
||||
},
|
||||
{
|
||||
img: waluta6,
|
||||
title: 'ZCash',
|
||||
},
|
||||
{
|
||||
img: waluta7,
|
||||
title: 'Steem',
|
||||
},
|
||||
{
|
||||
img: waluta8,
|
||||
title: 'Tether',
|
||||
},
|
||||
{
|
||||
img: waluta9,
|
||||
title: 'Cardano',
|
||||
},
|
||||
{
|
||||
img: waluta10,
|
||||
title: 'neo',
|
||||
},
|
||||
];
|
||||
|
||||
export default BNB;
|
||||
129
frontend/src/Views/Bitcoin2.js
Normal file
129
frontend/src/Views/Bitcoin2.js
Normal file
@ -0,0 +1,129 @@
|
||||
import './CoinStat.css';
|
||||
import Header from '../Components/Header'
|
||||
import Container from '@mui/material/Container';
|
||||
import AutoComplete from '../Components/AutoComplete'
|
||||
//import DatePicker from '../components/DatePicker'
|
||||
import ImageList from '@mui/material/ImageList';
|
||||
import ImageListItem from '@mui/material/ImageListItem';
|
||||
import waluta1 from '../Assets/1.png';
|
||||
import waluta2 from '../Assets/2.png';
|
||||
import waluta3 from '../Assets/10.png';
|
||||
import waluta4 from '../Assets/4.png';
|
||||
import waluta5 from '../Assets/5.png';
|
||||
import waluta6 from '../Assets/6.png';
|
||||
import waluta7 from '../Assets/7.png';
|
||||
import waluta8 from '../Assets/8.png';
|
||||
import waluta9 from '../Assets/9.png';
|
||||
import waluta10 from '../Assets/11.png';
|
||||
import ranking from '../Assets/ranking_vs.png';
|
||||
import logo from '../Assets/logo.png';
|
||||
import {useNavigate} from 'react-router-dom';
|
||||
import {useCallback, Component} from 'react';
|
||||
import { Link } from "react-router-dom";
|
||||
import { PieChart } from 'react-minimal-pie-chart';
|
||||
|
||||
|
||||
export class Bitcoin extends Component {
|
||||
componentDidMount() {
|
||||
fetch('https://bitsearch-api.azurewebsites.net/search/analise/btc')
|
||||
.then((res) => res.json())
|
||||
.then((json) => this.setState({ pos: json.results }));
|
||||
}
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<Header/>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'right'
|
||||
}}>
|
||||
<ImageList sx={{ width: '75vw', height: 200 }} cols={10} rowHeight={164}>
|
||||
{itemData.map((item) => (
|
||||
<Link to={`/coinStat/${item.title}`}>
|
||||
<ImageListItem key={item.img}>
|
||||
<img
|
||||
src={`${item.img}?w=164&h=164&fit=crop&auto=format`}
|
||||
srcSet={`${item.img}?w=164&h=164&fit=crop&auto=format&dpr=2 2x`}
|
||||
alt={item.title}
|
||||
loading="lazy"
|
||||
/>
|
||||
</ImageListItem>
|
||||
</Link>
|
||||
))}
|
||||
</ImageList>
|
||||
</div>
|
||||
<div className = 'innerSpace'>
|
||||
<Container maxWidth="xl">
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'left'
|
||||
}}>
|
||||
<img src={waluta2} alt='currentVal' style={{
|
||||
borderWidth: 5,
|
||||
height: 200,
|
||||
width: 200
|
||||
}} />
|
||||
</div>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'left'
|
||||
}}>
|
||||
<PieChart
|
||||
viewBoxSize = {700,700}
|
||||
reveal = {100}
|
||||
data={[
|
||||
{ title: 'Positive', value: 0.1, color: '#82dd55' },
|
||||
{ title: 'Negative', value: 0.008, color: '#E23636' },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</Container>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
const itemData = [
|
||||
{
|
||||
img: waluta1,
|
||||
title: 'Dash',
|
||||
},
|
||||
{
|
||||
img: waluta2,
|
||||
title: 'Bitcoin',
|
||||
},
|
||||
{
|
||||
img: waluta3,
|
||||
title: 'BNB',
|
||||
},
|
||||
{
|
||||
img: waluta4,
|
||||
title: 'Ethereum',
|
||||
},
|
||||
{
|
||||
img: waluta5,
|
||||
title: 'TRON',
|
||||
},
|
||||
{
|
||||
img: waluta6,
|
||||
title: 'ZCash',
|
||||
},
|
||||
{
|
||||
img: waluta7,
|
||||
title: 'Steem',
|
||||
},
|
||||
{
|
||||
img: waluta8,
|
||||
title: 'Tether',
|
||||
},
|
||||
{
|
||||
img: waluta9,
|
||||
title: 'Cardano',
|
||||
},
|
||||
{
|
||||
img: waluta10,
|
||||
title: 'neo',
|
||||
},
|
||||
];
|
||||
|
||||
export default Bitcoin;
|
||||
126
frontend/src/Views/Cardano9.js
Normal file
126
frontend/src/Views/Cardano9.js
Normal file
@ -0,0 +1,126 @@
|
||||
import './CoinStat.css';
|
||||
import Header from '../Components/Header'
|
||||
import Container from '@mui/material/Container';
|
||||
//import DatePicker from '../components/DatePicker'
|
||||
import ImageList from '@mui/material/ImageList';
|
||||
import ImageListItem from '@mui/material/ImageListItem';
|
||||
import waluta1 from '../Assets/1.png';
|
||||
import waluta2 from '../Assets/2.png';
|
||||
import waluta3 from '../Assets/10.png';
|
||||
import waluta4 from '../Assets/4.png';
|
||||
import waluta5 from '../Assets/5.png';
|
||||
import waluta6 from '../Assets/6.png';
|
||||
import waluta7 from '../Assets/7.png';
|
||||
import waluta8 from '../Assets/8.png';
|
||||
import waluta9 from '../Assets/9.png';
|
||||
import waluta10 from '../Assets/11.png';
|
||||
import {useCallback, Component} from 'react';
|
||||
|
||||
import { Link } from "react-router-dom";
|
||||
import { PieChart } from 'react-minimal-pie-chart';
|
||||
|
||||
|
||||
export class Cardano extends Component {
|
||||
componentDidMount() {
|
||||
fetch('https://bitsearch-api.azurewebsites.net/search/analise/ada')
|
||||
.then((res) => res.json())
|
||||
.then((json) => this.setState({ pos: json.results }));
|
||||
}
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<Header/>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'right'
|
||||
}}>
|
||||
<ImageList sx={{ width: '75vw', height: 200 }} cols={10} rowHeight={164}>
|
||||
{itemData.map((item) => (
|
||||
<Link to={`/coinStat/${item.title}`}>
|
||||
<ImageListItem key={item.img}>
|
||||
<img
|
||||
src={`${item.img}?w=164&h=164&fit=crop&auto=format`}
|
||||
srcSet={`${item.img}?w=164&h=164&fit=crop&auto=format&dpr=2 2x`}
|
||||
alt={item.title}
|
||||
loading="lazy"
|
||||
/>
|
||||
</ImageListItem>
|
||||
</Link>
|
||||
))}
|
||||
</ImageList>
|
||||
</div>
|
||||
<div className = 'innerSpace'>
|
||||
<Container maxWidth="xl">
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'left'
|
||||
}}>
|
||||
<img src={waluta9} alt='currentVal' style={{
|
||||
borderWidth: 5,
|
||||
height: 200,
|
||||
width: 200
|
||||
}} />
|
||||
</div>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'left'
|
||||
}}>
|
||||
<PieChart
|
||||
viewBoxSize = {700,700}
|
||||
reveal = {100}
|
||||
data={[
|
||||
{ title: 'Positive', value: 0.1, color: '#82dd55' },
|
||||
{ title: 'Negative', value: 0.008, color: '#E23636' },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</Container>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
const itemData = [
|
||||
{
|
||||
img: waluta1,
|
||||
title: 'Dash',
|
||||
},
|
||||
{
|
||||
img: waluta2,
|
||||
title: 'Bitcoin',
|
||||
},
|
||||
{
|
||||
img: waluta3,
|
||||
title: 'BNB',
|
||||
},
|
||||
{
|
||||
img: waluta4,
|
||||
title: 'Ethereum',
|
||||
},
|
||||
{
|
||||
img: waluta5,
|
||||
title: 'TRON',
|
||||
},
|
||||
{
|
||||
img: waluta6,
|
||||
title: 'ZCash',
|
||||
},
|
||||
{
|
||||
img: waluta7,
|
||||
title: 'Steem',
|
||||
},
|
||||
{
|
||||
img: waluta8,
|
||||
title: 'Tether',
|
||||
},
|
||||
{
|
||||
img: waluta9,
|
||||
title: 'Cardano',
|
||||
},
|
||||
{
|
||||
img: waluta10,
|
||||
title: 'neo',
|
||||
},
|
||||
];
|
||||
|
||||
export default Cardano;
|
||||
@ -6,5 +6,6 @@
|
||||
background: #dadada;
|
||||
border-radius: 5px;
|
||||
transition: all .3s;
|
||||
|
||||
display: 'flex';
|
||||
justify-Content: space-around;
|
||||
}
|
||||
@ -25,10 +25,11 @@ import { PieChart } from 'react-minimal-pie-chart';
|
||||
|
||||
export class CoinStat extends Component {
|
||||
componentDidMount() {
|
||||
fetch('https://localhost:62241/Search/analise/eth')
|
||||
.then((res) => res.json())
|
||||
.then((json) => this.setState({ pos: json.results }));
|
||||
fetch('https://bitsearch-api.azurewebsites.net/search/analise/btc/?format=json')
|
||||
.then(response => response.json())
|
||||
.then(data => this.setState({ data }));
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
@ -39,6 +40,7 @@ export class CoinStat extends Component {
|
||||
}}>
|
||||
<ImageList sx={{ width: '75vw', height: 200 }} cols={10} rowHeight={164}>
|
||||
{itemData.map((item) => (
|
||||
<Link to={`/coinStat/${item.title}`}>
|
||||
<ImageListItem key={item.img}>
|
||||
<img
|
||||
src={`${item.img}?w=164&h=164&fit=crop&auto=format`}
|
||||
@ -47,6 +49,7 @@ export class CoinStat extends Component {
|
||||
loading="lazy"
|
||||
/>
|
||||
</ImageListItem>
|
||||
</Link>
|
||||
))}
|
||||
</ImageList>
|
||||
</div>
|
||||
@ -54,27 +57,27 @@ export class CoinStat extends Component {
|
||||
<Container maxWidth="xl">
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'left'
|
||||
justifyContent: 'space-between'
|
||||
}}>
|
||||
<img src={waluta1} alt='currentVal' style={{
|
||||
borderWidth: 5,
|
||||
height: 200,
|
||||
width: 200
|
||||
}} />
|
||||
</div>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'left'
|
||||
}}>
|
||||
<PieChart
|
||||
viewBoxSize = {700,700}
|
||||
reveal = {100}
|
||||
style={{
|
||||
width: '80vw',
|
||||
}}
|
||||
radius = {80}
|
||||
viewBoxSize = {[500,500]}
|
||||
center = {[250,85]}
|
||||
label={({ dataEntry }) => `${Math.round(dataEntry.percentage)} %`}
|
||||
data={[
|
||||
{ title: 'Positive', value: 0.1, color: '#82dd55' },
|
||||
{ title: 'Negative', value: 0.008, color: '#E23636' },
|
||||
{ title: 'Positive', value: 25, color: '#82dd55' },
|
||||
{ title: 'Negative', value: 30, color: '#E23636' },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</Container>
|
||||
</div>
|
||||
</div>
|
||||
@ -84,43 +87,43 @@ export class CoinStat extends Component {
|
||||
const itemData = [
|
||||
{
|
||||
img: waluta1,
|
||||
title: 'Breakfast',
|
||||
title: 'Dash',
|
||||
},
|
||||
{
|
||||
img: waluta2,
|
||||
title: 'Burger',
|
||||
title: 'Bitcoin',
|
||||
},
|
||||
{
|
||||
img: waluta3,
|
||||
title: 'Camera',
|
||||
title: 'BNB',
|
||||
},
|
||||
{
|
||||
img: waluta4,
|
||||
title: 'Coffee',
|
||||
title: 'Ethereum',
|
||||
},
|
||||
{
|
||||
img: waluta5,
|
||||
title: 'Hats',
|
||||
title: 'TRON',
|
||||
},
|
||||
{
|
||||
img: waluta6,
|
||||
title: 'Honey',
|
||||
title: 'ZCash',
|
||||
},
|
||||
{
|
||||
img: waluta7,
|
||||
title: 'Basketball',
|
||||
title: 'Steem',
|
||||
},
|
||||
{
|
||||
img: waluta8,
|
||||
title: 'Fern',
|
||||
title: 'Tether',
|
||||
},
|
||||
{
|
||||
img: waluta9,
|
||||
title: 'Mushrooms',
|
||||
title: 'Cardano',
|
||||
},
|
||||
{
|
||||
img: waluta10,
|
||||
title: 'Tomato basil',
|
||||
title: 'neo',
|
||||
},
|
||||
];
|
||||
|
||||
|
||||
126
frontend/src/Views/Dash1.js
Normal file
126
frontend/src/Views/Dash1.js
Normal file
@ -0,0 +1,126 @@
|
||||
import './CoinStat.css';
|
||||
import Header from '../Components/Header'
|
||||
import Container from '@mui/material/Container';
|
||||
//import DatePicker from '../components/DatePicker'
|
||||
import ImageList from '@mui/material/ImageList';
|
||||
import ImageListItem from '@mui/material/ImageListItem';
|
||||
import waluta1 from '../Assets/1.png';
|
||||
import waluta2 from '../Assets/2.png';
|
||||
import waluta3 from '../Assets/10.png';
|
||||
import waluta4 from '../Assets/4.png';
|
||||
import waluta5 from '../Assets/5.png';
|
||||
import waluta6 from '../Assets/6.png';
|
||||
import waluta7 from '../Assets/7.png';
|
||||
import waluta8 from '../Assets/8.png';
|
||||
import waluta9 from '../Assets/9.png';
|
||||
import waluta10 from '../Assets/11.png';
|
||||
import {useCallback, Component} from 'react';
|
||||
|
||||
import { Link } from "react-router-dom";
|
||||
import { PieChart } from 'react-minimal-pie-chart';
|
||||
|
||||
|
||||
export class Dash extends Component {
|
||||
componentDidMount() {
|
||||
fetch('https://bitsearch-api.azurewebsites.net/search/analise/dash')
|
||||
.then((res) => res.json())
|
||||
.then((json) => this.setState({ pos: json.results }));
|
||||
}
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<Header/>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'right'
|
||||
}}>
|
||||
<ImageList sx={{ width: '75vw', height: 200 }} cols={10} rowHeight={164}>
|
||||
{itemData.map((item) => (
|
||||
<Link to={`/coinStat/${item.title}`}>
|
||||
<ImageListItem key={item.img}>
|
||||
<img
|
||||
src={`${item.img}?w=164&h=164&fit=crop&auto=format`}
|
||||
srcSet={`${item.img}?w=164&h=164&fit=crop&auto=format&dpr=2 2x`}
|
||||
alt={item.title}
|
||||
loading="lazy"
|
||||
/>
|
||||
</ImageListItem>
|
||||
</Link>
|
||||
))}
|
||||
</ImageList>
|
||||
</div>
|
||||
<div className = 'innerSpace'>
|
||||
<Container maxWidth="xl">
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'left'
|
||||
}}>
|
||||
<img src={waluta1} alt='currentVal' style={{
|
||||
borderWidth: 5,
|
||||
height: 200,
|
||||
width: 200
|
||||
}} />
|
||||
</div>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'left'
|
||||
}}>
|
||||
<PieChart
|
||||
viewBoxSize = {700,700}
|
||||
reveal = {100}
|
||||
data={[
|
||||
{ title: 'Positive', value: 0.1, color: '#82dd55' },
|
||||
{ title: 'Negative', value: 0.008, color: '#E23636' },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</Container>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
const itemData = [
|
||||
{
|
||||
img: waluta1,
|
||||
title: 'Dash',
|
||||
},
|
||||
{
|
||||
img: waluta2,
|
||||
title: 'Bitcoin',
|
||||
},
|
||||
{
|
||||
img: waluta3,
|
||||
title: 'BNB',
|
||||
},
|
||||
{
|
||||
img: waluta4,
|
||||
title: 'Ethereum',
|
||||
},
|
||||
{
|
||||
img: waluta5,
|
||||
title: 'TRON',
|
||||
},
|
||||
{
|
||||
img: waluta6,
|
||||
title: 'ZCash',
|
||||
},
|
||||
{
|
||||
img: waluta7,
|
||||
title: 'Steem',
|
||||
},
|
||||
{
|
||||
img: waluta8,
|
||||
title: 'Tether',
|
||||
},
|
||||
{
|
||||
img: waluta9,
|
||||
title: 'Cardano',
|
||||
},
|
||||
{
|
||||
img: waluta10,
|
||||
title: 'neo',
|
||||
},
|
||||
];
|
||||
|
||||
export default Dash;
|
||||
126
frontend/src/Views/Ethereum4.js
Normal file
126
frontend/src/Views/Ethereum4.js
Normal file
@ -0,0 +1,126 @@
|
||||
import './CoinStat.css';
|
||||
import Header from '../Components/Header'
|
||||
import Container from '@mui/material/Container';
|
||||
//import DatePicker from '../components/DatePicker'
|
||||
import ImageList from '@mui/material/ImageList';
|
||||
import ImageListItem from '@mui/material/ImageListItem';
|
||||
import waluta1 from '../Assets/1.png';
|
||||
import waluta2 from '../Assets/2.png';
|
||||
import waluta3 from '../Assets/10.png';
|
||||
import waluta4 from '../Assets/4.png';
|
||||
import waluta5 from '../Assets/5.png';
|
||||
import waluta6 from '../Assets/6.png';
|
||||
import waluta7 from '../Assets/7.png';
|
||||
import waluta8 from '../Assets/8.png';
|
||||
import waluta9 from '../Assets/9.png';
|
||||
import waluta10 from '../Assets/11.png';
|
||||
import {useCallback, Component} from 'react';
|
||||
|
||||
import { Link } from "react-router-dom";
|
||||
import { PieChart } from 'react-minimal-pie-chart';
|
||||
|
||||
|
||||
export class Ethereum extends Component {
|
||||
componentDidMount() {
|
||||
fetch('https://bitsearch-api.azurewebsites.net/search/analise/eth')
|
||||
.then((res) => res.json())
|
||||
.then((json) => this.setState({ pos: json.results }));
|
||||
}
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<Header/>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'right'
|
||||
}}>
|
||||
<ImageList sx={{ width: '75vw', height: 200 }} cols={10} rowHeight={164}>
|
||||
{itemData.map((item) => (
|
||||
<Link to={`/coinStat/${item.title}`}>
|
||||
<ImageListItem key={item.img}>
|
||||
<img
|
||||
src={`${item.img}?w=164&h=164&fit=crop&auto=format`}
|
||||
srcSet={`${item.img}?w=164&h=164&fit=crop&auto=format&dpr=2 2x`}
|
||||
alt={item.title}
|
||||
loading="lazy"
|
||||
/>
|
||||
</ImageListItem>
|
||||
</Link>
|
||||
))}
|
||||
</ImageList>
|
||||
</div>
|
||||
<div className = 'innerSpace'>
|
||||
<Container maxWidth="xl">
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'left'
|
||||
}}>
|
||||
<img src={waluta4} alt='currentVal' style={{
|
||||
borderWidth: 5,
|
||||
height: 200,
|
||||
width: 200
|
||||
}} />
|
||||
</div>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'left'
|
||||
}}>
|
||||
<PieChart
|
||||
viewBoxSize = {700,700}
|
||||
reveal = {100}
|
||||
data={[
|
||||
{ title: 'Positive', value: 0.1, color: '#82dd55' },
|
||||
{ title: 'Negative', value: 0.008, color: '#E23636' },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</Container>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
const itemData = [
|
||||
{
|
||||
img: waluta1,
|
||||
title: 'Dash',
|
||||
},
|
||||
{
|
||||
img: waluta2,
|
||||
title: 'Bitcoin',
|
||||
},
|
||||
{
|
||||
img: waluta3,
|
||||
title: 'BNB',
|
||||
},
|
||||
{
|
||||
img: waluta4,
|
||||
title: 'Ethereum',
|
||||
},
|
||||
{
|
||||
img: waluta5,
|
||||
title: 'TRON',
|
||||
},
|
||||
{
|
||||
img: waluta6,
|
||||
title: 'ZCash',
|
||||
},
|
||||
{
|
||||
img: waluta7,
|
||||
title: 'Steem',
|
||||
},
|
||||
{
|
||||
img: waluta8,
|
||||
title: 'Tether',
|
||||
},
|
||||
{
|
||||
img: waluta9,
|
||||
title: 'Cardano',
|
||||
},
|
||||
{
|
||||
img: waluta10,
|
||||
title: 'neo',
|
||||
},
|
||||
];
|
||||
|
||||
export default Ethereum;
|
||||
@ -72,7 +72,7 @@ const Home = () => {
|
||||
<div>Item 4</div>
|
||||
</Carousel>;<ImageList sx={{ width: '70vw', height: 200 }} cols={10} rowHeight={164}>
|
||||
{itemData.map((item) => (
|
||||
<Link to="/coinstat">
|
||||
<Link to={`/coinStat/${item.title}`}>
|
||||
<ImageListItem key={item.img}>
|
||||
<img
|
||||
src={`${item.img}?w=164&h=164&fit=crop&auto=format`}
|
||||
|
||||
@ -8,7 +8,7 @@ import Header from '../Components/Header';
|
||||
import Treemap from '../Components/Treemap';
|
||||
|
||||
//const heights = [500, 30, 90, 70, 110, 150, 130, 80, 50, 90, 100, 150, 30, 50, 80];
|
||||
const dataset = {"children":[{"name":"Bitcoin","children":[{"name":"tweets","group":"A","value":1000,"colname":"level3"}]},{"name":"Ethereum","children":[{"name":"tweets","group":"A","value":100,"colname":"level3"}]},{"name":"Zcash","children":[{"name":"tweets","group":"A","value":50,"colname":"level3"}]},{"name":"Tether","children":[{"name":"tweets","group":"A","value":200,"colname":"level3"}]},{"name":"TRON","children":[{"name":"tweets","group":"A","value":200,"colname":"level3"}]},{"name":"Steem","children":[{"name":"tweets","group":"A","value":200,"colname":"level3"}]},{"name":"neo","children":[{"name":"tweets","group":"A","value":200,"colname":"level3"}]},{"name":"Dash","children":[{"name":"tweets","group":"A","value":200,"colname":"level3"}]},{"name":"BNB","children":[{"name":"tweets","group":"A","value":200,"colname":"level3"}]},{"name":"Cardano","children":[{"name":"tweets","group":"A","value":200,"colname":"level3"}]}],"name":"CEO"};
|
||||
const dataset = {"children":[{"name":"Bitcoin","children":[{"name":"tweets","group":"A","value":300,"colname":"level3"}]},{"name":"Ethereum","children":[{"name":"tweets","group":"A","value":100,"colname":"level3"}]},{"name":"Zcash","children":[{"name":"tweets","group":"A","value":50,"colname":"level3"}]},{"name":"Tether","children":[{"name":"tweets","group":"A","value":200,"colname":"level3"}]},{"name":"TRON","children":[{"name":"tweets","group":"A","value":200,"colname":"level3"}]},{"name":"Steem","children":[{"name":"tweets","group":"A","value":200,"colname":"level3"}]},{"name":"neo","children":[{"name":"tweets","group":"A","value":200,"colname":"level3"}]},{"name":"Dash","children":[{"name":"tweets","group":"A","value":200,"colname":"level3"}]},{"name":"BNB","children":[{"name":"tweets","group":"A","value":200,"colname":"level3"}]},{"name":"Cardano","children":[{"name":"tweets","group":"A","value":200,"colname":"level3"}]}],"name":"CEO"};
|
||||
/*
|
||||
const Item = styled(Paper)(({ theme }) => ({
|
||||
...theme.typography.body2,
|
||||
|
||||
126
frontend/src/Views/Steem7.js
Normal file
126
frontend/src/Views/Steem7.js
Normal file
@ -0,0 +1,126 @@
|
||||
import './CoinStat.css';
|
||||
import Header from '../Components/Header'
|
||||
import Container from '@mui/material/Container';
|
||||
//import DatePicker from '../components/DatePicker'
|
||||
import ImageList from '@mui/material/ImageList';
|
||||
import ImageListItem from '@mui/material/ImageListItem';
|
||||
import waluta1 from '../Assets/1.png';
|
||||
import waluta2 from '../Assets/2.png';
|
||||
import waluta3 from '../Assets/10.png';
|
||||
import waluta4 from '../Assets/4.png';
|
||||
import waluta5 from '../Assets/5.png';
|
||||
import waluta6 from '../Assets/6.png';
|
||||
import waluta7 from '../Assets/7.png';
|
||||
import waluta8 from '../Assets/8.png';
|
||||
import waluta9 from '../Assets/9.png';
|
||||
import waluta10 from '../Assets/11.png';
|
||||
import {useCallback, Component} from 'react';
|
||||
|
||||
import { Link } from "react-router-dom";
|
||||
import { PieChart } from 'react-minimal-pie-chart';
|
||||
|
||||
|
||||
export class Steem extends Component {
|
||||
componentDidMount() {
|
||||
fetch('https://localhost:62241/Search/analise/steem')
|
||||
.then((res) => res.json())
|
||||
.then((json) => this.setState({ pos: json.results }));
|
||||
}
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<Header/>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'right'
|
||||
}}>
|
||||
<ImageList sx={{ width: '75vw', height: 200 }} cols={10} rowHeight={164}>
|
||||
{itemData.map((item) => (
|
||||
<Link to={`/coinStat/${item.title}`}>
|
||||
<ImageListItem key={item.img}>
|
||||
<img
|
||||
src={`${item.img}?w=164&h=164&fit=crop&auto=format`}
|
||||
srcSet={`${item.img}?w=164&h=164&fit=crop&auto=format&dpr=2 2x`}
|
||||
alt={item.title}
|
||||
loading="lazy"
|
||||
/>
|
||||
</ImageListItem>
|
||||
</Link>
|
||||
))}
|
||||
</ImageList>
|
||||
</div>
|
||||
<div className = 'innerSpace'>
|
||||
<Container maxWidth="xl">
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'left'
|
||||
}}>
|
||||
<img src={waluta7} alt='currentVal' style={{
|
||||
borderWidth: 5,
|
||||
height: 200,
|
||||
width: 200
|
||||
}} />
|
||||
</div>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'left'
|
||||
}}>
|
||||
<PieChart
|
||||
viewBoxSize = {700,700}
|
||||
reveal = {100}
|
||||
data={[
|
||||
{ title: 'Positive', value: 0.1, color: '#82dd55' },
|
||||
{ title: 'Negative', value: 0.008, color: '#E23636' },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</Container>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
const itemData = [
|
||||
{
|
||||
img: waluta1,
|
||||
title: 'Dash',
|
||||
},
|
||||
{
|
||||
img: waluta2,
|
||||
title: 'Bitcoin',
|
||||
},
|
||||
{
|
||||
img: waluta3,
|
||||
title: 'BNB',
|
||||
},
|
||||
{
|
||||
img: waluta4,
|
||||
title: 'Ethereum',
|
||||
},
|
||||
{
|
||||
img: waluta5,
|
||||
title: 'TRON',
|
||||
},
|
||||
{
|
||||
img: waluta6,
|
||||
title: 'ZCash',
|
||||
},
|
||||
{
|
||||
img: waluta7,
|
||||
title: 'Steem',
|
||||
},
|
||||
{
|
||||
img: waluta8,
|
||||
title: 'Tether',
|
||||
},
|
||||
{
|
||||
img: waluta9,
|
||||
title: 'Cardano',
|
||||
},
|
||||
{
|
||||
img: waluta10,
|
||||
title: 'neo',
|
||||
},
|
||||
];
|
||||
|
||||
export default Steem;
|
||||
126
frontend/src/Views/THROW5.js
Normal file
126
frontend/src/Views/THROW5.js
Normal file
@ -0,0 +1,126 @@
|
||||
import './CoinStat.css';
|
||||
import Header from '../Components/Header'
|
||||
import Container from '@mui/material/Container';
|
||||
//import DatePicker from '../components/DatePicker'
|
||||
import ImageList from '@mui/material/ImageList';
|
||||
import ImageListItem from '@mui/material/ImageListItem';
|
||||
import waluta1 from '../Assets/1.png';
|
||||
import waluta2 from '../Assets/2.png';
|
||||
import waluta3 from '../Assets/10.png';
|
||||
import waluta4 from '../Assets/4.png';
|
||||
import waluta5 from '../Assets/5.png';
|
||||
import waluta6 from '../Assets/6.png';
|
||||
import waluta7 from '../Assets/7.png';
|
||||
import waluta8 from '../Assets/8.png';
|
||||
import waluta9 from '../Assets/9.png';
|
||||
import waluta10 from '../Assets/11.png';
|
||||
import {useCallback, Component} from 'react';
|
||||
|
||||
import { Link } from "react-router-dom";
|
||||
import { PieChart } from 'react-minimal-pie-chart';
|
||||
|
||||
|
||||
export class THROW extends Component {
|
||||
componentDidMount() {
|
||||
fetch('https://bitsearch-api.azurewebsites.net/search/analise/trx')
|
||||
.then((res) => res.json())
|
||||
.then((json) => this.setState({ pos: json.results }));
|
||||
}
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<Header/>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'right'
|
||||
}}>
|
||||
<ImageList sx={{ width: '75vw', height: 200 }} cols={10} rowHeight={164}>
|
||||
{itemData.map((item) => (
|
||||
<Link to={`/coinStat/${item.title}`}>
|
||||
<ImageListItem key={item.img}>
|
||||
<img
|
||||
src={`${item.img}?w=164&h=164&fit=crop&auto=format`}
|
||||
srcSet={`${item.img}?w=164&h=164&fit=crop&auto=format&dpr=2 2x`}
|
||||
alt={item.title}
|
||||
loading="lazy"
|
||||
/>
|
||||
</ImageListItem>
|
||||
</Link>
|
||||
))}
|
||||
</ImageList>
|
||||
</div>
|
||||
<div className = 'innerSpace'>
|
||||
<Container maxWidth="xl">
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'left'
|
||||
}}>
|
||||
<img src={waluta5} alt='currentVal' style={{
|
||||
borderWidth: 5,
|
||||
height: 200,
|
||||
width: 200
|
||||
}} />
|
||||
</div>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'left'
|
||||
}}>
|
||||
<PieChart
|
||||
viewBoxSize = {700,700}
|
||||
reveal = {100}
|
||||
data={[
|
||||
{ title: 'Positive', value: 0.1, color: '#82dd55' },
|
||||
{ title: 'Negative', value: 0.008, color: '#E23636' },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</Container>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
const itemData = [
|
||||
{
|
||||
img: waluta1,
|
||||
title: 'Dash',
|
||||
},
|
||||
{
|
||||
img: waluta2,
|
||||
title: 'Bitcoin',
|
||||
},
|
||||
{
|
||||
img: waluta3,
|
||||
title: 'BNB',
|
||||
},
|
||||
{
|
||||
img: waluta4,
|
||||
title: 'Ethereum',
|
||||
},
|
||||
{
|
||||
img: waluta5,
|
||||
title: 'TRON',
|
||||
},
|
||||
{
|
||||
img: waluta6,
|
||||
title: 'ZCash',
|
||||
},
|
||||
{
|
||||
img: waluta7,
|
||||
title: 'Steem',
|
||||
},
|
||||
{
|
||||
img: waluta8,
|
||||
title: 'Tether',
|
||||
},
|
||||
{
|
||||
img: waluta9,
|
||||
title: 'Cardano',
|
||||
},
|
||||
{
|
||||
img: waluta10,
|
||||
title: 'neo',
|
||||
},
|
||||
];
|
||||
|
||||
export default THROW;
|
||||
126
frontend/src/Views/Tether8.js
Normal file
126
frontend/src/Views/Tether8.js
Normal file
@ -0,0 +1,126 @@
|
||||
import './CoinStat.css';
|
||||
import Header from '../Components/Header'
|
||||
import Container from '@mui/material/Container';
|
||||
//import DatePicker from '../components/DatePicker'
|
||||
import ImageList from '@mui/material/ImageList';
|
||||
import ImageListItem from '@mui/material/ImageListItem';
|
||||
import waluta1 from '../Assets/1.png';
|
||||
import waluta2 from '../Assets/2.png';
|
||||
import waluta3 from '../Assets/10.png';
|
||||
import waluta4 from '../Assets/4.png';
|
||||
import waluta5 from '../Assets/5.png';
|
||||
import waluta6 from '../Assets/6.png';
|
||||
import waluta7 from '../Assets/7.png';
|
||||
import waluta8 from '../Assets/8.png';
|
||||
import waluta9 from '../Assets/9.png';
|
||||
import waluta10 from '../Assets/11.png';
|
||||
import {useCallback, Component} from 'react';
|
||||
|
||||
import { Link } from "react-router-dom";
|
||||
import { PieChart } from 'react-minimal-pie-chart';
|
||||
|
||||
|
||||
export class Tether extends Component {
|
||||
componentDidMount() {
|
||||
fetch('https://localhost:62241/Search/analise/usdt')
|
||||
.then((res) => res.json())
|
||||
.then((json) => this.setState({ pos: json.results }));
|
||||
}
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<Header/>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'right'
|
||||
}}>
|
||||
<ImageList sx={{ width: '75vw', height: 200 }} cols={10} rowHeight={164}>
|
||||
{itemData.map((item) => (
|
||||
<Link to={`/coinStat/${item.title}`}>
|
||||
<ImageListItem key={item.img}>
|
||||
<img
|
||||
src={`${item.img}?w=164&h=164&fit=crop&auto=format`}
|
||||
srcSet={`${item.img}?w=164&h=164&fit=crop&auto=format&dpr=2 2x`}
|
||||
alt={item.title}
|
||||
loading="lazy"
|
||||
/>
|
||||
</ImageListItem>
|
||||
</Link>
|
||||
))}
|
||||
</ImageList>
|
||||
</div>
|
||||
<div className = 'innerSpace'>
|
||||
<Container maxWidth="xl">
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'left'
|
||||
}}>
|
||||
<img src={waluta8} alt='currentVal' style={{
|
||||
borderWidth: 5,
|
||||
height: 200,
|
||||
width: 200
|
||||
}} />
|
||||
</div>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'left'
|
||||
}}>
|
||||
<PieChart
|
||||
viewBoxSize = {700,700}
|
||||
reveal = {100}
|
||||
data={[
|
||||
{ title: 'Positive', value: 0.1, color: '#82dd55' },
|
||||
{ title: 'Negative', value: 0.008, color: '#E23636' },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</Container>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
const itemData = [
|
||||
{
|
||||
img: waluta1,
|
||||
title: 'Dash',
|
||||
},
|
||||
{
|
||||
img: waluta2,
|
||||
title: 'Bitcoin',
|
||||
},
|
||||
{
|
||||
img: waluta3,
|
||||
title: 'BNB',
|
||||
},
|
||||
{
|
||||
img: waluta4,
|
||||
title: 'Ethereum',
|
||||
},
|
||||
{
|
||||
img: waluta5,
|
||||
title: 'TRON',
|
||||
},
|
||||
{
|
||||
img: waluta6,
|
||||
title: 'ZCash',
|
||||
},
|
||||
{
|
||||
img: waluta7,
|
||||
title: 'Steem',
|
||||
},
|
||||
{
|
||||
img: waluta8,
|
||||
title: 'Tether',
|
||||
},
|
||||
{
|
||||
img: waluta9,
|
||||
title: 'Cardano',
|
||||
},
|
||||
{
|
||||
img: waluta10,
|
||||
title: 'neo',
|
||||
},
|
||||
];
|
||||
|
||||
export default Tether;
|
||||
126
frontend/src/Views/ZCash6.js
Normal file
126
frontend/src/Views/ZCash6.js
Normal file
@ -0,0 +1,126 @@
|
||||
import './CoinStat.css';
|
||||
import Header from '../Components/Header'
|
||||
import Container from '@mui/material/Container';
|
||||
//import DatePicker from '../components/DatePicker'
|
||||
import ImageList from '@mui/material/ImageList';
|
||||
import ImageListItem from '@mui/material/ImageListItem';
|
||||
import waluta1 from '../Assets/1.png';
|
||||
import waluta2 from '../Assets/2.png';
|
||||
import waluta3 from '../Assets/10.png';
|
||||
import waluta4 from '../Assets/4.png';
|
||||
import waluta5 from '../Assets/5.png';
|
||||
import waluta6 from '../Assets/6.png';
|
||||
import waluta7 from '../Assets/7.png';
|
||||
import waluta8 from '../Assets/8.png';
|
||||
import waluta9 from '../Assets/9.png';
|
||||
import waluta10 from '../Assets/11.png';
|
||||
import {useCallback, Component} from 'react';
|
||||
|
||||
import { Link } from "react-router-dom";
|
||||
import { PieChart } from 'react-minimal-pie-chart';
|
||||
|
||||
|
||||
export class ZCash extends Component {
|
||||
componentDidMount() {
|
||||
fetch('https://bitsearch-api.azurewebsites.net/search/analise/zec')
|
||||
.then((res) => res.json())
|
||||
.then((json) => this.setState({ pos: json.results }));
|
||||
}
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<Header/>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'right'
|
||||
}}>
|
||||
<ImageList sx={{ width: '75vw', height: 200 }} cols={10} rowHeight={164}>
|
||||
{itemData.map((item) => (
|
||||
<Link to={`/coinStat/${item.title}`}>
|
||||
<ImageListItem key={item.img}>
|
||||
<img
|
||||
src={`${item.img}?w=164&h=164&fit=crop&auto=format`}
|
||||
srcSet={`${item.img}?w=164&h=164&fit=crop&auto=format&dpr=2 2x`}
|
||||
alt={item.title}
|
||||
loading="lazy"
|
||||
/>
|
||||
</ImageListItem>
|
||||
</Link>
|
||||
))}
|
||||
</ImageList>
|
||||
</div>
|
||||
<div className = 'innerSpace'>
|
||||
<Container maxWidth="xl">
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'left'
|
||||
}}>
|
||||
<img src={waluta6} alt='currentVal' style={{
|
||||
borderWidth: 5,
|
||||
height: 200,
|
||||
width: 200
|
||||
}} />
|
||||
</div>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'left'
|
||||
}}>
|
||||
<PieChart
|
||||
viewBoxSize = {700,700}
|
||||
reveal = {100}
|
||||
data={[
|
||||
{ title: 'Positive', value: 0.1, color: '#82dd55' },
|
||||
{ title: 'Negative', value: 0.008, color: '#E23636' },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</Container>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
const itemData = [
|
||||
{
|
||||
img: waluta1,
|
||||
title: 'Dash',
|
||||
},
|
||||
{
|
||||
img: waluta2,
|
||||
title: 'Bitcoin',
|
||||
},
|
||||
{
|
||||
img: waluta3,
|
||||
title: 'BNB',
|
||||
},
|
||||
{
|
||||
img: waluta4,
|
||||
title: 'Ethereum',
|
||||
},
|
||||
{
|
||||
img: waluta5,
|
||||
title: 'TRON',
|
||||
},
|
||||
{
|
||||
img: waluta6,
|
||||
title: 'ZCash',
|
||||
},
|
||||
{
|
||||
img: waluta7,
|
||||
title: 'Steem',
|
||||
},
|
||||
{
|
||||
img: waluta8,
|
||||
title: 'Tether',
|
||||
},
|
||||
{
|
||||
img: waluta9,
|
||||
title: 'Cardano',
|
||||
},
|
||||
{
|
||||
img: waluta10,
|
||||
title: 'neo',
|
||||
},
|
||||
];
|
||||
|
||||
export default ZCash;
|
||||
@ -4,8 +4,18 @@ import { BrowserRouter as Router, Switch, Route, Routes, Link } from "react-rout
|
||||
// view/pages/screens
|
||||
import Login from './Login';
|
||||
import Home from './Home';
|
||||
import CoinStat from './CoinStat'
|
||||
import Ranking from './Ranking'
|
||||
import CoinStat from './CoinStat';
|
||||
import Ranking from './Ranking';
|
||||
import Dash from './Dash1';
|
||||
import Bitcoin from './Bitcoin2';
|
||||
import BNB from './BNB3';
|
||||
import Ethereum from './Ethereum4';
|
||||
import THROW from './THROW5';
|
||||
import ZCash from './ZCash6';
|
||||
import Steem from './Steem7';
|
||||
import Tether from './Tether8';
|
||||
import Cardano from './Cardano9';
|
||||
import neoC from './neo10';
|
||||
const ReactRouterSetup = () => {
|
||||
return (
|
||||
<Router>
|
||||
@ -14,6 +24,16 @@ const ReactRouterSetup = () => {
|
||||
<Route path ='/' element ={<Login />}/>
|
||||
<Route path ='/ranking' element ={<Ranking />}/>
|
||||
<Route path ='/coinstat' element ={<CoinStat />}/>
|
||||
<Route path ='/coinstat/Bitcoin' element ={<Bitcoin />}/>
|
||||
<Route path ='/coinstat/Ethereum' element ={<Ethereum />}/>
|
||||
<Route path ='/coinstat/Dash' element ={<Dash />}/>
|
||||
<Route path ='/coinstat/BNB' element ={<BNB />}/>
|
||||
<Route path ='/coinstat/THRON' element ={<THROW />}/>
|
||||
<Route path ='/coinstat/ZCash' element ={<ZCash />}/>
|
||||
<Route path ='/coinstat/Steem' element ={<Steem />}/>
|
||||
<Route path ='/coinstat/Tether' element ={<Tether />}/>
|
||||
<Route path ='/coinstat/Cardano' element ={<Cardano />}/>
|
||||
<Route path ='/coinstat/neo' element ={<neoC />}/>
|
||||
</Routes>
|
||||
</Router>
|
||||
);
|
||||
|
||||
126
frontend/src/Views/neo10.js
Normal file
126
frontend/src/Views/neo10.js
Normal file
@ -0,0 +1,126 @@
|
||||
import './CoinStat.css';
|
||||
import Header from '../Components/Header'
|
||||
import Container from '@mui/material/Container';
|
||||
//import DatePicker from '../components/DatePicker'
|
||||
import ImageList from '@mui/material/ImageList';
|
||||
import ImageListItem from '@mui/material/ImageListItem';
|
||||
import waluta1 from '../Assets/1.png';
|
||||
import waluta2 from '../Assets/2.png';
|
||||
import waluta3 from '../Assets/10.png';
|
||||
import waluta4 from '../Assets/4.png';
|
||||
import waluta5 from '../Assets/5.png';
|
||||
import waluta6 from '../Assets/6.png';
|
||||
import waluta7 from '../Assets/7.png';
|
||||
import waluta8 from '../Assets/8.png';
|
||||
import waluta9 from '../Assets/9.png';
|
||||
import waluta10 from '../Assets/11.png';
|
||||
import {useCallback, Component} from 'react';
|
||||
|
||||
import { Link } from "react-router-dom";
|
||||
import { PieChart } from 'react-minimal-pie-chart';
|
||||
|
||||
|
||||
export class neoC extends Component {
|
||||
componentDidMount() {
|
||||
fetch('https://bitsearch-api.azurewebsites.net/search/analise/neo')
|
||||
.then((res) => res.json())
|
||||
.then((json) => this.setState({ pos: json.results }));
|
||||
}
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<Header/>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'right'
|
||||
}}>
|
||||
<ImageList sx={{ width: '75vw', height: 200 }} cols={10} rowHeight={164}>
|
||||
{itemData.map((item) => (
|
||||
<Link to={`/coinStat/${item.title}`}>
|
||||
<ImageListItem key={item.img}>
|
||||
<img
|
||||
src={`${item.img}?w=164&h=164&fit=crop&auto=format`}
|
||||
srcSet={`${item.img}?w=164&h=164&fit=crop&auto=format&dpr=2 2x`}
|
||||
alt={item.title}
|
||||
loading="lazy"
|
||||
/>
|
||||
</ImageListItem>
|
||||
</Link>
|
||||
))}
|
||||
</ImageList>
|
||||
</div>
|
||||
<div className = 'innerSpace'>
|
||||
<Container maxWidth="xl">
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'left'
|
||||
}}>
|
||||
<img src={waluta10} alt='currentVal' style={{
|
||||
borderWidth: 5,
|
||||
height: 200,
|
||||
width: 200
|
||||
}} />
|
||||
</div>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'left'
|
||||
}}>
|
||||
<PieChart
|
||||
viewBoxSize = {700,700}
|
||||
reveal = {100}
|
||||
data={[
|
||||
{ title: 'Positive', value: 0.1, color: '#82dd55' },
|
||||
{ title: 'Negative', value: 0.008, color: '#E23636' },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</Container>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
const itemData = [
|
||||
{
|
||||
img: waluta1,
|
||||
title: 'Dash',
|
||||
},
|
||||
{
|
||||
img: waluta2,
|
||||
title: 'Bitcoin',
|
||||
},
|
||||
{
|
||||
img: waluta3,
|
||||
title: 'BNB',
|
||||
},
|
||||
{
|
||||
img: waluta4,
|
||||
title: 'Ethereum',
|
||||
},
|
||||
{
|
||||
img: waluta5,
|
||||
title: 'TRON',
|
||||
},
|
||||
{
|
||||
img: waluta6,
|
||||
title: 'ZCash',
|
||||
},
|
||||
{
|
||||
img: waluta7,
|
||||
title: 'Steem',
|
||||
},
|
||||
{
|
||||
img: waluta8,
|
||||
title: 'Tether',
|
||||
},
|
||||
{
|
||||
img: waluta9,
|
||||
title: 'Cardano',
|
||||
},
|
||||
{
|
||||
img: waluta10,
|
||||
title: 'neo',
|
||||
},
|
||||
];
|
||||
|
||||
export default neoC;
|
||||
Loading…
Reference in New Issue
Block a user