SimCompanies/dashboard
2
1
Fork 0
Code Issues 17 Pull Requests Releases Activity

added loading component for prices close #22

Browse Source
This commit is contained in:
Hawk
2020-04-18 22:04:43 +02:00
parent eb7b373774
commit 76c047c26d
2 changed files with 60 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

76
frontend/src/components/resourcechart/resourcechart.js
View File

@@ -5,9 +5,47 @@ import {
import {
useParams
} from "react-router-dom";
import CircularProgress from '@material-ui/core/CircularProgress';
import Card from '@material-ui/core/Card';
import CardContent from '@material-ui/core/CardContent';
import Typography from '@material-ui/core/Typography';
import { makeStyles } from '@material-ui/core/styles';
import Grid from '@material-ui/core/Grid';
const useStyles = makeStyles((theme) => ({
root: {
display: 'flex',
},
}));
const output = (data) => {
if (data === null) {
return (
<CircularProgress color="secondary" />
)
} else {
return (
<LineChart
width={900}
height={300}
data={data}
margin={{
top: 5, right: 30, left: 20, bottom: 5,
}}
>
<CartesianGrid strokeDasharray="3 3" />
<XAxis dataKey="time" interval="2" />
<YAxis domain={['datamin', 'datamax']} />
<Tooltip />
<Legend />
<Line type="monotone" dataKey="price" stroke="#8884d8" dot={false} />
</LineChart>
)
}
}
export default function ResourceChart(props) {
const classes = useStyles();
const [data, setData] = React.useState(null);
let { id } = useParams();
const loadData = async () => {
@@ -24,21 +62,27 @@ export default function ResourceChart(props) {
loadData();
}
return (
<LineChart
width={900}
height={300}
data={data}
margin={{
top: 5, right: 30, left: 20, bottom: 5,
}}
>
<CartesianGrid strokeDasharray="3 3" />
<XAxis dataKey="time" interval="2" />
<YAxis domain={['datamin', 'datamax']} />
<Tooltip />
<Legend />
<Line type="monotone" dataKey="price" stroke="#8884d8" dot={false} />
</LineChart>
<div className={classes.root}>
<Grid container spacing={2}>
<Grid item xs={12}>
<Typography variant="h4">
Resource Chart
</Typography>
</Grid>
<Grid item xs={12}>
<Card>
<CardContent>
{output(data)}
</CardContent>
</Card>
</Grid>
</Grid>
</div>
);
}

8
frontend/src/components/selectResource/index.js
View File

@@ -1,14 +1,6 @@
import React from 'react';
import { makeStyles } from '@material-ui/core/styles';
import Card from '@material-ui/core/Card';
import CardContent from '@material-ui/core/CardContent';
import Typography from '@material-ui/core/Typography';
import Grid from '@material-ui/core/Grid';
import { Link } from 'react-router-dom';
import Link1 from '@material-ui/core/Link';
import ListItem from '@material-ui/core/ListItem';
import ListItemText from '@material-ui/core/ListItemText';
import CardMedia from '@material-ui/core/CardMedia';
import ResourceCard from './resourceCard';