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

Created resource categories close #9

Browse Source
This commit is contained in:
Hawk
2020-04-25 03:16:55 +02:00
parent aca0b1fc78
commit 81564bb5a7
2 changed files with 178 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -2,11 +2,12 @@ import React from 'react';
import { makeStyles } from '@material-ui/core/styles';
import Grid from '@material-ui/core/Grid';
import ResourceCard from './resourceCard';
import Typography from '@material-ui/core/Typography';
const useStyles = makeStyles(theme => ({
card: {
grid: {
display: "flex"
}
}));
@@ -15,29 +16,193 @@ const construct = [101, 102, 103, 104, 105, 107, 108, 109, 110, 111]
const fashion = [41, 46, 60, 61, 62, 63, 64, 65, 70, 71]
const energy = [10, 11, 12, 1, 73, 74, 83]
const electronics = [20, 21, 22, 23, 24, 25, 26, 27, 28, 79, 98]
const auto = [47, 48, 49, 50, 51, 52, 53, 54, 55, 56, 57, 112]
const aero = [77, 78, 80, 81, 82, 84, 85, 86, 87, 88, 89]
const resource = [2, 13, 14, 15, 16, 17, 18, 19, 42, 43, 44, 45, 68, 69, 75, 76]
const research = [29, 30, 31, 32, 33, 34, 35, 58, 59, 100, 113]
export default function SelectResource() {
const classes = useStyles();
const [resources, setResources] = React.useState(null);
const [resources, setResources] = React.useState([]);
const loadResources = async () => {
var resourceJSON = await fetch("/simcompanies/API/resourcelist");
resourceJSON = await resourceJSON.json();
let rArr = [];
let rArr = [[], [], [], [], [], [], [], [], [], []];
for (let i = 0; i < resourceJSON.length; i++) {
rArr.push(<ResourceCard resource={resourceJSON[i]}></ResourceCard>);
if (agri.includes(resourceJSON[i]["db_letter"])) {
rArr[0].push(<ResourceCard resource={resourceJSON[i]}></ResourceCard>);
} else if (construct.includes(resourceJSON[i]["db_letter"])) {
rArr[1].push(<ResourceCard resource={resourceJSON[i]}></ResourceCard>);
} else if (fashion.includes(resourceJSON[i]["db_letter"])) {
rArr[2].push(<ResourceCard resource={resourceJSON[i]}></ResourceCard>);
} else if (energy.includes(resourceJSON[i]["db_letter"])) {
rArr[3].push(<ResourceCard resource={resourceJSON[i]}></ResourceCard>);
} else if (electronics.includes(resourceJSON[i]["db_letter"])) {
rArr[4].push(<ResourceCard resource={resourceJSON[i]}></ResourceCard>);
} else if (auto.includes(resourceJSON[i]["db_letter"])) {
rArr[5].push(<ResourceCard resource={resourceJSON[i]}></ResourceCard>);
} else if (aero.includes(resourceJSON[i]["db_letter"])) {
rArr[6].push(<ResourceCard resource={resourceJSON[i]}></ResourceCard>);
} else if (resource.includes(resourceJSON[i]["db_letter"])) {
rArr[7].push(<ResourceCard resource={resourceJSON[i]}></ResourceCard>);
} else if (research.includes(resourceJSON[i]["db_letter"])) {
rArr[8].push(<ResourceCard resource={resourceJSON[i]}></ResourceCard>);
} else {
rArr[9].push(<ResourceCard resource={resourceJSON[i]}></ResourceCard>);
}
}
setResources(rArr);
}
if (resources === null)
if (resources.length === 0)
loadResources();
return (
<Grid container spacing={2}>
{resources}
<Grid container spacing={2} >
<Grid item xs={12} className={classes.grid}>
<Grid container spacing={2} >
<Grid item xs={12}>
<Typography variant="h4">
Agriculture & Food
</Typography>
</Grid>
<Grid item xs={12} className={classes.grid}>
<Grid container spacing={1} >
{resources[0]}
</Grid>
</Grid>
</Grid>
</Grid>
<Grid item xs={12} className={classes.grid}>
<Grid container spacing={2} >
<Grid item xs={12}>
<Typography variant="h4">
Construction
</Typography>
</Grid>
<Grid item xs={12} className={classes.grid}>
<Grid container spacing={1} >
{resources[1]}
</Grid>
</Grid>
</Grid>
</Grid>
<Grid item xs={12} className={classes.grid}>
<Grid container spacing={2} >
<Grid item xs={12}>
<Typography variant="h4">
Fashion
</Typography>
</Grid>
<Grid item xs={12} className={classes.grid}>
<Grid container spacing={1} >
{resources[2]}
</Grid>
</Grid>
</Grid>
</Grid>
<Grid item xs={12} className={classes.grid}>
<Grid container spacing={2} >
<Grid item xs={12}>
<Typography variant="h4">
Energy
</Typography>
</Grid>
<Grid item xs={12} className={classes.grid}>
<Grid container spacing={1} >
{resources[3]}
</Grid>
</Grid>
</Grid>
</Grid>
<Grid item xs={12} className={classes.grid}>
<Grid container spacing={2} >
<Grid item xs={12}>
<Typography variant="h4">
Electronics
</Typography>
</Grid>
<Grid item xs={12} className={classes.grid}>
<Grid container spacing={1} >
{resources[4]}
</Grid>
</Grid>
</Grid>
</Grid>
<Grid item xs={12} className={classes.grid}>
<Grid container spacing={2} >
<Grid item xs={12}>
<Typography variant="h4">
Automotive
</Typography>
</Grid>
<Grid item xs={12} className={classes.grid}>
<Grid container spacing={1} >
{resources[5]}
</Grid>
</Grid>
</Grid>
</Grid>
<Grid item xs={12} className={classes.grid}>
<Grid container spacing={2} >
<Grid item xs={12}>
<Typography variant="h4">
Aerospace
</Typography>
</Grid>
<Grid item xs={12} className={classes.grid}>
<Grid container spacing={1} >
{resources[6]}
</Grid>
</Grid>
</Grid>
</Grid>
<Grid item xs={12} className={classes.grid}>
<Grid container spacing={2} >
<Grid item xs={12}>
<Typography variant="h4">
Resources
</Typography>
</Grid>
<Grid item xs={12} className={classes.grid}>
<Grid container spacing={1} >
{resources[7]}
</Grid>
</Grid>
</Grid>
</Grid>
<Grid item xs={12} className={classes.grid}>
<Grid container spacing={2} >
<Grid item xs={12}>
<Typography variant="h4">
Research
</Typography>
</Grid>
<Grid item xs={12} className={classes.grid}>
<Grid container spacing={1} >
{resources[8]}
</Grid>
</Grid>
</Grid>
</Grid>
<Grid item xs={12} className={classes.grid}>
<Grid container spacing={2} >
<Grid item xs={12}>
<Typography variant="h4">
Others
</Typography>
</Grid>
<Grid item xs={12} className={classes.grid}>
<Grid container spacing={1} >
{resources[9]}
</Grid>
</Grid>
</Grid>
</Grid>
</Grid>
);

7
frontend/src/components/selectResource/resourceCard.js
View File

@@ -8,7 +8,7 @@ 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 ListItemIcon from '@material-ui/core/ListItemIcon';
const useStyles = makeStyles(theme => ({
@@ -46,7 +46,10 @@ export default function ResourceCard(props) {
<Card >
<CardContent style={{ padding: 0 }}>
<ListItemLink to={"/resourcechart/" + props.resource["db_letter"]} component={Link}>
<img src={picture} alt={props.resource["name"]} style={{ width: 50, height: 50 }} />
<ListItemIcon>
<img src={picture} alt={props.resource["name"]} style={{ width: 50, height: 50 }} />
</ListItemIcon>
<ListItemText primary={props.resource["name"]} />
</ListItemLink>
</CardContent>