diff options
-rw-r--r-- | modern/src/reports/EventReportPage.js | 23 | ||||
-rw-r--r-- | modern/src/reports/ReplayPage.js | 6 | ||||
-rw-r--r-- | modern/src/reports/ReportFilter.js | 23 | ||||
-rw-r--r-- | modern/src/reports/ReportLayoutPage.js | 6 | ||||
-rw-r--r-- | modern/src/reports/RouteReportPage.js | 18 | ||||
-rw-r--r-- | modern/src/reports/StopReportPage.js | 18 | ||||
-rw-r--r-- | modern/src/reports/SummaryReportPage.js | 18 | ||||
-rw-r--r-- | modern/src/reports/TripReportPage.js | 18 |
8 files changed, 87 insertions, 43 deletions
diff --git a/modern/src/reports/EventReportPage.js b/modern/src/reports/EventReportPage.js index b11933a3..13e081e2 100644 --- a/modern/src/reports/EventReportPage.js +++ b/modern/src/reports/EventReportPage.js @@ -6,16 +6,23 @@ import { formatPosition } from '../common/formatter'; import ReportFilter from './ReportFilter'; import ReportLayoutPage from './ReportLayoutPage'; -const ReportFilterForm = ({ onResult }) => { +const ReportFilterForm = ({ setItems }) => { - const [eventType, setEventType] = useState(['allEvents']); + const [eventTypes, setEventTypes] = useState(['allEvents']); - const handleSubmit = async (deviceId, from, to) => { - const query = new URLSearchParams({ deviceId, from, to }); - eventType.forEach(it => query.append('type', it)); - const response = await fetch(`/api/reports/events?${query.toString()}`, { headers: { Accept: 'application/json' } }); + const handleSubmit = async (deviceId, from, to, mail, headers) => { + const query = new URLSearchParams({ deviceId, from, to, mail }); + eventTypes.forEach(it => query.append('type', it)); + const response = await fetch(`/api/reports/events?${query.toString()}`, { headers }); if (response.ok) { - onResult(await response.json()); + const contentType = response.headers.get('content-type'); + if (contentType) { + if (contentType === 'application/json') { + setItems(await response.json()); + } else { + window.location.assign(window.URL.createObjectURL(await response.blob())); + } + } } }; @@ -23,7 +30,7 @@ const ReportFilterForm = ({ onResult }) => { <ReportFilter handleSubmit={handleSubmit}> <FormControl variant="filled" margin="normal" fullWidth> <InputLabel>{t('reportEventTypes')}</InputLabel> - <Select value={eventType} onChange={e => setEventType(e.target.value)} multiple> + <Select value={eventTypes} onChange={e => setEventTypes(e.target.value)} multiple> <MenuItem value="allEvents">{t('eventAll')}</MenuItem> <MenuItem value="deviceOnline">{t('eventDeviceOnline')}</MenuItem> <MenuItem value="deviceUnknown">{t('eventDeviceUnknown')}</MenuItem> diff --git a/modern/src/reports/ReplayPage.js b/modern/src/reports/ReplayPage.js index 5c27cb52..dfa99997 100644 --- a/modern/src/reports/ReplayPage.js +++ b/modern/src/reports/ReplayPage.js @@ -46,9 +46,9 @@ const ReplayPage = () => { const [positions, setPositions] = useState([]); const [index, setIndex] = useState(0); - const handleSubmit = async (deviceId, from, to) => { + const handleSubmit = async (deviceId, from, to, _, headers) => { const query = new URLSearchParams({ deviceId, from, to }); - const response = await fetch(`/api/positions?${query.toString()}`, { headers: { 'Accept': 'application/json' } }); + const response = await fetch(`/api/positions?${query.toString()}`, { headers }); if (response.ok) { setIndex(0); setPositions(await response.json()); @@ -88,7 +88,7 @@ const ReplayPage = () => { </Typography> </AccordionSummary> <AccordionDetails className={classes.configForm}> - <ReportFilter handleSubmit={handleSubmit} />; + <ReportFilter handleSubmit={handleSubmit} showOnly /> </AccordionDetails> </Accordion> </div> diff --git a/modern/src/reports/ReportFilter.js b/modern/src/reports/ReportFilter.js index 9bc88bb2..164dbf9b 100644 --- a/modern/src/reports/ReportFilter.js +++ b/modern/src/reports/ReportFilter.js @@ -1,17 +1,17 @@ import React, { useState } from 'react'; -import { FormControl, InputLabel, Select, MenuItem, Button, TextField } from '@material-ui/core'; +import { FormControl, InputLabel, Select, MenuItem, Button, TextField, ButtonGroup } from '@material-ui/core'; import t from '../common/localization'; import { useSelector } from 'react-redux'; import moment from 'moment'; -const ReportFilter = ({ children, handleSubmit }) => { +const ReportFilter = ({ children, handleSubmit, showOnly }) => { const devices = useSelector(state => Object.values(state.devices.items)); const [deviceId, setDeviceId] = useState(); const [period, setPeriod] = useState('today'); const [from, setFrom] = useState(moment().subtract(1, 'hour')); const [to, setTo] = useState(moment()); - const handleShow = () => { + const handleClick = (mail, json) => { let selectedFrom; let selectedTo; switch (period) { @@ -45,7 +45,14 @@ const ReportFilter = ({ children, handleSubmit }) => { break; } - handleSubmit(deviceId, selectedFrom.toISOString(), selectedTo.toISOString()); + const accept = json ? 'application/json' : 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'; + handleSubmit( + deviceId, + selectedFrom.toISOString(), + selectedTo.toISOString(), + mail, + { Accept: accept } + ); } return ( @@ -92,9 +99,11 @@ const ReportFilter = ({ children, handleSubmit }) => { )} {children} <FormControl margin="normal" fullWidth> - <Button type="button" color="primary" variant="contained" disabled={!deviceId} onClick={handleShow}> - {t('reportShow')} - </Button> + <ButtonGroup color="primary" orientation="vertical" disabled={!deviceId}> + <Button onClick={() => handleClick(false, true)}>{t('reportShow')}</Button> + {!showOnly && <Button onClick={() => handleClick(false, false)}>{t('reportExport')}</Button>} + {!showOnly && <Button onClick={() => handleClick(true, false)}>{t('reportEmail')}</Button>} + </ButtonGroup> </FormControl> </> ); diff --git a/modern/src/reports/ReportLayoutPage.js b/modern/src/reports/ReportLayoutPage.js index 296b7c66..ddc7325b 100644 --- a/modern/src/reports/ReportLayoutPage.js +++ b/modern/src/reports/ReportLayoutPage.js @@ -20,10 +20,6 @@ const useStyles = makeStyles(theme => ({ const ReportLayoutPage = ({ reportFilterForm:ReportFilterForm, setItems, children }) => { const classes = useStyles(); - - const onResult = (data) => { - setItems(data); - } return ( <div className={classes.root}> <MainToolbar /> @@ -31,7 +27,7 @@ const ReportLayoutPage = ({ reportFilterForm:ReportFilterForm, setItems, childre <Grid container spacing={2}> <Grid item xs={12} md={3} lg={2}> <Paper className={classes.form}> - <ReportFilterForm onResult={ onResult } /> + <ReportFilterForm setItems={ setItems } /> </Paper> </Grid> <Grid item xs={12} md={9} lg={10}> diff --git a/modern/src/reports/RouteReportPage.js b/modern/src/reports/RouteReportPage.js index 7ff5d409..43d310be 100644 --- a/modern/src/reports/RouteReportPage.js +++ b/modern/src/reports/RouteReportPage.js @@ -5,15 +5,23 @@ import { formatPosition } from '../common/formatter'; import ReportFilter from './ReportFilter'; import ReportLayoutPage from './ReportLayoutPage'; -const ReportFilterForm = ({ onResult }) => { +const ReportFilterForm = ({ setItems }) => { - const handleSubmit = async (deviceId, from, to) => { - const query = new URLSearchParams({ deviceId, from, to }); - const response = await fetch(`/api/reports/route?${query.toString()}`, { headers: { Accept: 'application/json' } }); + const handleSubmit = async (deviceId, from, to, mail, headers) => { + const query = new URLSearchParams({ deviceId, from, to, mail }); + const response = await fetch(`/api/reports/route?${query.toString()}`, { headers }); if (response.ok) { - onResult(await response.json()); + const contentType = response.headers.get('content-type'); + if (contentType) { + if (contentType === 'application/json') { + setItems(await response.json()); + } else { + window.location.assign(window.URL.createObjectURL(await response.blob())); + } + } } } + return <ReportFilter handleSubmit={handleSubmit} />; }; diff --git a/modern/src/reports/StopReportPage.js b/modern/src/reports/StopReportPage.js index ec4c1990..77d3dfa7 100644 --- a/modern/src/reports/StopReportPage.js +++ b/modern/src/reports/StopReportPage.js @@ -6,15 +6,23 @@ import ReportFilter from './ReportFilter'; import ReportLayoutPage from './ReportLayoutPage'; import { useAttributePreference } from '../common/preferences'; -const ReportFilterForm = ({ onResult }) => { +const ReportFilterForm = ({ setItems }) => { - const handleSubmit = async (deviceId, from, to) => { - const query = new URLSearchParams({ deviceId, from, to }); - const response = await fetch(`/api/reports/stops?${query.toString()}`, { headers: { Accept: 'application/json' } }); + const handleSubmit = async (deviceId, from, to, mail, headers) => { + const query = new URLSearchParams({ deviceId, from, to, mail }); + const response = await fetch(`/api/reports/stops?${query.toString()}`, { headers }); if (response.ok) { - onResult(await response.json()); + const contentType = response.headers.get('content-type'); + if (contentType) { + if (contentType === 'application/json') { + setItems(await response.json()); + } else { + window.location.assign(window.URL.createObjectURL(await response.blob())); + } + } } } + return <ReportFilter handleSubmit={handleSubmit} />; }; diff --git a/modern/src/reports/SummaryReportPage.js b/modern/src/reports/SummaryReportPage.js index 4cb37aaa..dcd3323c 100644 --- a/modern/src/reports/SummaryReportPage.js +++ b/modern/src/reports/SummaryReportPage.js @@ -6,17 +6,25 @@ import ReportFilter from './ReportFilter'; import ReportLayoutPage from './ReportLayoutPage'; import { useAttributePreference } from '../common/preferences'; -const ReportFilterForm = ({ onResult }) => { +const ReportFilterForm = ({ setItems }) => { const [daily, setDaily] = useState(false); - const handleSubmit = async (deviceId, from, to) => { - const query = new URLSearchParams({ deviceId, from, to, daily }); - const response = await fetch(`/api/reports/summary?${query.toString()}`, { headers: { Accept: 'application/json' } }); + const handleSubmit = async (deviceId, from, to, mail, headers) => { + const query = new URLSearchParams({ deviceId, from, to, daily, mail }); + const response = await fetch(`/api/reports/summary?${query.toString()}`, { headers }); if (response.ok) { - onResult(await response.json()); + const contentType = response.headers.get('content-type'); + if (contentType) { + if (contentType === 'application/json') { + setItems(await response.json()); + } else { + window.location.assign(window.URL.createObjectURL(await response.blob())); + } + } } } + return ( <ReportFilter handleSubmit={handleSubmit}> <FormControlLabel diff --git a/modern/src/reports/TripReportPage.js b/modern/src/reports/TripReportPage.js index bb987e1b..10f1c464 100644 --- a/modern/src/reports/TripReportPage.js +++ b/modern/src/reports/TripReportPage.js @@ -6,15 +6,23 @@ import ReportFilter from './ReportFilter'; import ReportLayoutPage from './ReportLayoutPage'; import { useAttributePreference } from '../common/preferences'; -const ReportFilterForm = ({ onResult }) => { +const ReportFilterForm = ({ setItems }) => { - const handleSubmit = async (deviceId, from, to) => { - const query = new URLSearchParams({ deviceId, from, to }); - const response = await fetch(`/api/reports/trips?${query.toString()}`, { headers: { Accept: 'application/json' } }); + const handleSubmit = async (deviceId, from, to, mail, headers) => { + const query = new URLSearchParams({ deviceId, from, to, mail }); + const response = await fetch(`/api/reports/trips?${query.toString()}`, { headers }); if (response.ok) { - onResult(await response.json()); + const contentType = response.headers.get('content-type'); + if (contentType) { + if (contentType === 'application/json') { + setItems(await response.json()); + } else { + window.location.assign(window.URL.createObjectURL(await response.blob())); + } + } } } + return <ReportFilter handleSubmit={handleSubmit} />; } |