aboutsummaryrefslogtreecommitdiff
path: root/modern/src
diff options
context:
space:
mode:
Diffstat (limited to 'modern/src')
-rw-r--r--modern/src/MainToolbar.js51
-rw-r--r--modern/src/components/reports/ReportNavbar.js16
-rw-r--r--modern/src/components/reports/ReportSidebar.js9
-rw-r--r--modern/src/reports/ChartReportPage.js16
-rw-r--r--modern/src/reports/Graph.js28
-rw-r--r--modern/src/reports/ReportLayoutPage.js14
6 files changed, 37 insertions, 97 deletions
diff --git a/modern/src/MainToolbar.js b/modern/src/MainToolbar.js
index 702a7e50..63d8efec 100644
--- a/modern/src/MainToolbar.js
+++ b/modern/src/MainToolbar.js
@@ -22,12 +22,7 @@ import PeopleIcon from '@material-ui/icons/People';
import StorageIcon from '@material-ui/icons/Storage';
import PersonIcon from '@material-ui/icons/Person';
import NotificationsIcon from '@material-ui/icons/Notifications';
-import TimelineIcon from '@material-ui/icons/Timeline';
-import PauseCircleFilledIcon from '@material-ui/icons/PauseCircleFilled';
-import PlayCircleFilledIcon from '@material-ui/icons/PlayCircleFilled';
-import NotificationsActiveIcon from '@material-ui/icons/NotificationsActive';
-import FormatListBulletedIcon from '@material-ui/icons/FormatListBulleted';
-import TrendingUpIcon from '@material-ui/icons/TrendingUp';
+import DescriptionIcon from '@material-ui/icons/Description';
import FolderIcon from '@material-ui/icons/Folder';
import ReplayIcon from '@material-ui/icons/Replay';
import BuildIcon from '@material-ui/icons/Build';
@@ -104,50 +99,12 @@ const MainToolbar = () => {
</ListItemIcon>
<ListItemText primary={t('reportReplay')} />
</ListItem>
- </List>
- <Divider />
- <List
- subheader={
- <ListSubheader>
- {t('reportTitle')}
- </ListSubheader>
- }>
<ListItem button onClick={() => history.push('/reports/route')}>
<ListItemIcon>
- <TimelineIcon />
- </ListItemIcon>
- <ListItemText primary={t('reportRoute')} />
- </ListItem>
- <ListItem button onClick={() => history.push('/reports/event')}>
- <ListItemIcon>
- <NotificationsActiveIcon />
+ <DescriptionIcon />
</ListItemIcon>
- <ListItemText primary={t('reportEvents')} />
- </ListItem>
- <ListItem button onClick={() => history.push('/reports/trip')}>
- <ListItemIcon>
- <PlayCircleFilledIcon />
- </ListItemIcon>
- <ListItemText primary={t('reportTrips')} />
- </ListItem>
- <ListItem button onClick={() => history.push('/reports/stop')}>
- <ListItemIcon>
- <PauseCircleFilledIcon />
- </ListItemIcon>
- <ListItemText primary={t('reportStops')} />
- </ListItem>
- <ListItem button onClick={() => history.push('/reports/summary')}>
- <ListItemIcon>
- <FormatListBulletedIcon />
- </ListItemIcon>
- <ListItemText primary={t('reportSummary')} />
- </ListItem>
- <ListItem button onClick={() => history.push('/reports/chart')}>
- <ListItemIcon>
- <TrendingUpIcon />
- </ListItemIcon>
- <ListItemText primary={t('reportChart')} />
- </ListItem>
+ <ListItemText primary={t('reportTitle')} />
+ </ListItem>
</List>
<Divider />
<List
diff --git a/modern/src/components/reports/ReportNavbar.js b/modern/src/components/reports/ReportNavbar.js
index 93c01a06..674db3a4 100644
--- a/modern/src/components/reports/ReportNavbar.js
+++ b/modern/src/components/reports/ReportNavbar.js
@@ -1,16 +1,9 @@
import React from 'react';
-import { AppBar, Toolbar, Typography, List, ListItem, ListItemText, ListItemIcon, Divider, Drawer, makeStyles, IconButton, Hidden } from '@material-ui/core';
-
+import { AppBar, Toolbar, Typography, IconButton } from '@material-ui/core';
import MenuIcon from '@material-ui/icons/Menu';
import t from '../../common/localization';
-const useStyles = makeStyles(theme => ({
- menuButton: {
- }
-}));
-const ReportNavbar = ({ openDrawer, setOpenDrawer, reportName }) => {
-
- const classes = useStyles();
+const ReportNavbar = ({ openDrawer, setOpenDrawer }) => {
return (
<AppBar position="fixed" color="inherit">
@@ -19,12 +12,11 @@ const ReportNavbar = ({ openDrawer, setOpenDrawer, reportName }) => {
color="inherit"
aria-label="open drawer"
edge="start"
- onClick={() => setOpenDrawer(!openDrawer)}
- className={classes.menuButton}>
+ onClick={() => setOpenDrawer(!openDrawer)}>
<MenuIcon />
</IconButton>
<Typography variant="h6" noWrap>
- {t('reportTitle')} / {reportName}
+ {t('reportTitle')}
</Typography>
</Toolbar>
</AppBar>
diff --git a/modern/src/components/reports/ReportSidebar.js b/modern/src/components/reports/ReportSidebar.js
index e42c36ee..a71ac4b1 100644
--- a/modern/src/components/reports/ReportSidebar.js
+++ b/modern/src/components/reports/ReportSidebar.js
@@ -1,8 +1,8 @@
import React from 'react';
-import { AppBar, Toolbar, Typography, List, ListItem, ListItemText, ListItemIcon, Divider, Drawer, makeStyles, IconButton, Hidden } from '@material-ui/core';
-import { Link, useHistory, useLocation } from 'react-router-dom';
+import { List, ListItem, ListItemText, ListItemIcon } from '@material-ui/core';
+import { Link, useLocation } from 'react-router-dom';
-const ReportNavbar = ({ routes, setReportName }) => {
+const ReportNavbar = ({ routes }) => {
const location = useLocation();
@@ -15,8 +15,7 @@ const ReportNavbar = ({ routes, setReportName }) => {
key={`${route}${index}`}
button
to={route.href}
- selected={route.href === location.pathname}
- onClick={() => setReportName(route.name)}>
+ selected={route.href === location.pathname}>
<ListItemIcon>
{route.icon}
</ListItemIcon>
diff --git a/modern/src/reports/ChartReportPage.js b/modern/src/reports/ChartReportPage.js
index c75c9b71..0a5c8e18 100644
--- a/modern/src/reports/ChartReportPage.js
+++ b/modern/src/reports/ChartReportPage.js
@@ -61,15 +61,13 @@ const ChartReportPage = () => {
const [type, setType] = useState('speed');
return (
- <>
- <ReportLayoutPage filter={
- <Filter setItems={setItems}>
- <ChartType type={type} setType={setType} />
- </Filter>
- }>
- <Graph items={items} type={type} />
- </ReportLayoutPage>
- </>
+ <ReportLayoutPage filter={
+ <Filter setItems={setItems}>
+ <ChartType type={type} setType={setType} />
+ </Filter>
+ }>
+ <Graph items={items} type={type} />
+ </ReportLayoutPage>
)
}
diff --git a/modern/src/reports/Graph.js b/modern/src/reports/Graph.js
index af54e10e..b785e06f 100644
--- a/modern/src/reports/Graph.js
+++ b/modern/src/reports/Graph.js
@@ -3,6 +3,10 @@ import { Box, Paper } from '@material-ui/core';
import {LineChart, Line, XAxis, YAxis, CartesianGrid, Tooltip, Legend, ResponsiveContainer } from 'recharts';
const CustomizedAxisTick = ({ x, y, payload }) =>{
+ console.log('inside customized tick ', payload.value)
+ if(!payload.value) {
+ return payload.value;
+ }
const parts = payload.value.split(' ');
return (
<g transform={`translate(${x},${y})`}>
@@ -15,20 +19,16 @@ const CustomizedAxisTick = ({ x, y, payload }) =>{
const Graph = ({ type, items }) => {
return (
- <Paper>
- <Box height={400}>
- <ResponsiveContainer>
- <LineChart data={items}>
- <XAxis dataKey="fixTime" tick={<CustomizedAxisTick/>} height={60} />
- <YAxis />
- <CartesianGrid strokeDasharray="3 3" />
- <Tooltip />
- <Legend />
- <Line type="natural" dataKey={type} />
- </LineChart>
- </ResponsiveContainer>
- </Box>
- </Paper>
+ <ResponsiveContainer height={400} width={500}>
+ <LineChart data={items}>
+ <XAxis dataKey="fixTime" tick={<CustomizedAxisTick/>} height={60} />
+ <YAxis />
+ <CartesianGrid strokeDasharray="3 3" />
+ <Tooltip />
+ <Legend />
+ <Line type="natural" dataKey={type} />
+ </LineChart>
+ </ResponsiveContainer>
);
}
diff --git a/modern/src/reports/ReportLayoutPage.js b/modern/src/reports/ReportLayoutPage.js
index 23ac6d71..ed7fe544 100644
--- a/modern/src/reports/ReportLayoutPage.js
+++ b/modern/src/reports/ReportLayoutPage.js
@@ -1,5 +1,6 @@
import React, { useState } from 'react';
-import { Grid, Box, Typography, Divider, Drawer, makeStyles, IconButton, Hidden } from '@material-ui/core';
+import { useHistory } from 'react-router-dom';
+import { Grid, Typography, Divider, Drawer, makeStyles, IconButton, Hidden } from '@material-ui/core';
import TimelineIcon from '@material-ui/icons/Timeline';
import PauseCircleFilledIcon from '@material-ui/icons/PauseCircleFilled';
import PlayCircleFilledIcon from '@material-ui/icons/PlayCircleFilled';
@@ -10,9 +11,6 @@ import ArrowBackIcon from '@material-ui/icons/ArrowBack';
import ReportSidebar from '../components/reports/ReportSidebar'
import ReportNavbar from '../components/reports/ReportNavbar'
-
-import { Link, useHistory, useLocation } from 'react-router-dom';
-
import t from '../common/localization';
const useStyles = makeStyles(theme => ({
@@ -60,7 +58,7 @@ const routes = [
{ name: t('reportChart'), href: '/reports/chart', icon: <TrendingUpIcon /> },
];
-const ReportLayoutPage = ({ children, filter }) => {
+const ReportLayoutPage = ({ children, filter, }) => {
const classes = useStyles();
const history = useHistory();
const [openDrawer, setOpenDrawer] = useState(false);
@@ -102,11 +100,7 @@ const ReportLayoutPage = ({ children, filter }) => {
<div className={classes.toolbar} />
<Grid container direction="column" spacing={2}>
<Grid item>{filter}</Grid>
- <Grid item>
- <Box sx={{ minWidth: 1050 }}>
- {children}
- </Box>
- </Grid>
+ <Grid item>{children}</Grid>
</Grid>
</div>
</div>