diff --git a/frontend/package-lock.json b/frontend/package-lock.json index 17dd696..482ba0f 100644 --- a/frontend/package-lock.json +++ b/frontend/package-lock.json @@ -10783,6 +10783,22 @@ "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.12.0.tgz", "integrity": "sha512-rPCkf/mWBtKc97aLL9/txD8DZdemK0vkA3JMLShjlJB3Pj3s+lpf1KaBzMfQrAmhMQB0n1cU/SUGgKKBCe837Q==" }, + "react-lifecycles-compat": { + "version": "3.0.4", + "resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz", + "integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA==" + }, + "react-resize-detector": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/react-resize-detector/-/react-resize-detector-2.3.0.tgz", + "integrity": "sha512-oCAddEWWeFWYH5FAcHdBYcZjAw9fMzRUK9sWSx6WvSSOPVRxcHd5zTIGy/mOus+AhN/u6T4TMiWxvq79PywnJQ==", + "requires": { + "lodash.debounce": "^4.0.8", + "lodash.throttle": "^4.1.1", + "prop-types": "^15.6.0", + "resize-observer-polyfill": "^1.5.0" + } + }, "react-router": { "version": "5.1.2", "resolved": "https://registry.npmjs.org/react-router/-/react-router-5.1.2.tgz", @@ -10889,6 +10905,38 @@ "workbox-webpack-plugin": "4.3.1" } }, + "react-smooth": { + "version": "1.0.5", + "resolved": "https://registry.npmjs.org/react-smooth/-/react-smooth-1.0.5.tgz", + "integrity": "sha512-eW057HT0lFgCKh8ilr0y2JaH2YbNcuEdFpxyg7Gf/qDKk9hqGMyXryZJ8iMGJEuKH0+wxS0ccSsBBB3W8yCn8w==", + "requires": { + "lodash": "~4.17.4", + "prop-types": "^15.6.0", + "raf": "^3.4.0", + "react-transition-group": "^2.5.0" + }, + "dependencies": { + "dom-helpers": { + "version": "3.4.0", + "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-3.4.0.tgz", + "integrity": "sha512-LnuPJ+dwqKDIyotW1VzmOZ5TONUN7CwkCR5hrgawTUbkBGYdeoNLZo6nNfGkCrjtE1nXXaj7iMMpDa8/d9WoIA==", + "requires": { + "@babel/runtime": "^7.1.2" + } + }, + "react-transition-group": { + "version": "2.9.0", + "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-2.9.0.tgz", + "integrity": "sha512-+HzNTCHpeQyl4MJ/bdE0u6XRMe9+XG/+aL4mCxVN4DnPBQ0/5bfHWPDuOZUzYdMj94daZaZdCCc1Dzt9R/xSSg==", + "requires": { + "dom-helpers": "^3.4.0", + "loose-envify": "^1.4.0", + "prop-types": "^15.6.2", + "react-lifecycles-compat": "^3.0.4" + } + } + } + }, "react-transition-group": { "version": "4.3.0", "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.3.0.tgz", @@ -15069,4 +15117,4 @@ } } } -} \ No newline at end of file +} diff --git a/frontend/package.json b/frontend/package.json index 081f8bc..4c0b458 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -37,4 +37,4 @@ ] }, "proxy": "http://127.0.0.1:3001" -} \ No newline at end of file +} diff --git a/frontend/src/components/content.js b/frontend/src/components/content.js index cb9bc29..99fdf6c 100644 --- a/frontend/src/components/content.js +++ b/frontend/src/components/content.js @@ -4,6 +4,8 @@ import Overview from "./overview/overview"; import { Route, } from "react-router-dom"; +import SelectResource from './selectResource'; +import ResourceChart from './resourcechart/resourcechart'; const useStyles = makeStyles(theme => ({ root: { @@ -19,7 +21,9 @@ export default function Content() { return (
- + + + } />
); diff --git a/frontend/src/components/navigation.js b/frontend/src/components/navigation.js index 2046bd5..e7ad7b5 100644 --- a/frontend/src/components/navigation.js +++ b/frontend/src/components/navigation.js @@ -190,7 +190,7 @@ export default function Navigation() { - {['Overview'].map((text, index) => ( + {['Resources'].map((text, index) => ( diff --git a/frontend/src/components/overview/overview.js b/frontend/src/components/overview/overview.js index e1911b7..ab86f95 100644 --- a/frontend/src/components/overview/overview.js +++ b/frontend/src/components/overview/overview.js @@ -1,5 +1,6 @@ import React from 'react'; import { makeStyles } from '@material-ui/core/styles'; +import Typography from '@material-ui/core/Typography'; const useStyles = makeStyles(theme => ({ root: { @@ -15,7 +16,12 @@ export default function Overview() { return (
- Hallo i bims 1 nicer Overview + + Welcome! + + + This is the official unofficial Dashboard for Sim Companies +
); diff --git a/frontend/src/components/resourcechart/resourcechart.js b/frontend/src/components/resourcechart/resourcechart.js index 2d7d047..26472ef 100644 --- a/frontend/src/components/resourcechart/resourcechart.js +++ b/frontend/src/components/resourcechart/resourcechart.js @@ -2,13 +2,17 @@ import React from 'react'; import { LineChart, Line, XAxis, YAxis, CartesianGrid, Tooltip, Legend, } from 'recharts'; +import { + useParams +} from "react-router-dom"; -export default function (day, kind) { +export default function ResourceChart(props) { const [data, setData] = React.useState(null); - + let { id } = useParams(); const loadData = async () => { - let nextData = await fetch(`/API/day?date=${day}&kind=${kind}`); + console.log(id) + let nextData = await fetch(`/API/day?date=${props["day"]}&kind=${id}`); nextData = await nextData.json(); for (let i = 0; i < nextData.length; i++) { nextData[i]["time"] = new Date(nextData[i]["time"]); @@ -38,4 +42,4 @@ export default function (day, kind) { ); -} \ No newline at end of file +} diff --git a/frontend/src/components/selectResource/index.js b/frontend/src/components/selectResource/index.js index 93b1bf8..c241c4b 100644 --- a/frontend/src/components/selectResource/index.js +++ b/frontend/src/components/selectResource/index.js @@ -24,7 +24,7 @@ function CreateResourceCard(resource, classes) { - +