Files
dashboard/frontend/src/components/selectResource/index.js

62 lines
1.7 KiB
JavaScript

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';
const useStyles = makeStyles(theme => ({
card: {
}
}));
function CreateResourceCard(resource, classes) {
function ListItemLink(props) {
return <ListItem button component={Link1} {...props} />;
}
return (
<Grid item xs={4} lg={2} >
<Card >
<CardContent style={{ padding: 0 }}>
<ListItemLink to={"/resourcechart/" + resource["db_letter"]} component={Link}>
<ListItemText primary={resource["name"]} />
</ListItemLink>
</CardContent>
</Card>
</Grid>
)
}
export default function SelectResource() {
const classes = useStyles();
const [resources, setResources] = React.useState(null);
const loadResources = async () => {
var resourceJSON = await fetch("/API/resourcelist");
resourceJSON = await resourceJSON.json();
let rArr = [];
for (let i = 0; i < resourceJSON.length; i++) {
rArr.push(CreateResourceCard(resourceJSON[i], classes));
}
setResources(rArr);
}
if (resources === null)
loadResources();
return (
<Grid container spacing={2}>
{resources}
</Grid>
);
}