diff options
Diffstat (limited to 'modern/src/reports/components/ReportFilter.js')
-rw-r--r-- | modern/src/reports/components/ReportFilter.js | 53 |
1 files changed, 40 insertions, 13 deletions
diff --git a/modern/src/reports/components/ReportFilter.js b/modern/src/reports/components/ReportFilter.js index 29d53dd0..100dab90 100644 --- a/modern/src/reports/components/ReportFilter.js +++ b/modern/src/reports/components/ReportFilter.js @@ -7,20 +7,23 @@ import moment from 'moment'; import { useTranslation } from '../../common/components/LocalizationProvider'; import useReportStyles from '../common/useReportStyles'; -const ReportFilter = ({ - children, handleSubmit, showOnly, ignoreDevice, -}) => { +const ReportFilter = ({ children, handleSubmit, showOnly, ignoreDevice, multiDevice }) => { const classes = useReportStyles(); const t = useTranslation(); const devices = useSelector((state) => state.devices.items); + const groups = useSelector((state) => state.groups.items); const selectedDeviceId = useSelector((state) => state.devices.selectedId); const [deviceId, setDeviceId] = useState(selectedDeviceId); + const [deviceIds, setDeviceIds] = useState(selectedDeviceId ? [selectedDeviceId] : []); + const [groupIds, setGroupIds] = useState([]); const [period, setPeriod] = useState('today'); const [from, setFrom] = useState(moment().subtract(1, 'hour')); const [to, setTo] = useState(moment()); + const disabled = !ignoreDevice && !deviceId && !deviceIds.length && !groupIds.length; + const handleClick = (mail, json) => { let selectedFrom; let selectedTo; @@ -56,13 +59,15 @@ const ReportFilter = ({ } const accept = json ? 'application/json' : 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'; - handleSubmit( + handleSubmit({ deviceId, - selectedFrom.toISOString(), - selectedTo.toISOString(), + deviceIds, + groupIds, + from: selectedFrom.toISOString(), + to: selectedTo.toISOString(), mail, - { Accept: accept }, - ); + headers: { Accept: accept }, + }); }; return ( @@ -70,8 +75,13 @@ const ReportFilter = ({ {!ignoreDevice && ( <div className={classes.filterItem}> <FormControl fullWidth> - <InputLabel>{t('reportDevice')}</InputLabel> - <Select label={t('reportDevice')} value={deviceId || ''} onChange={(e) => setDeviceId(e.target.value)}> + <InputLabel>{t(multiDevice ? 'deviceTitle' : 'reportDevice')}</InputLabel> + <Select + label={t(multiDevice ? 'deviceTitle' : 'reportDevice')} + value={multiDevice ? deviceIds : deviceId || ''} + onChange={(e) => (multiDevice ? setDeviceIds(e.target.value) : setDeviceId(e.target.value))} + multiple={multiDevice} + > {Object.values(devices).map((device) => ( <MenuItem key={device.id} value={device.id}>{device.name}</MenuItem> ))} @@ -79,6 +89,23 @@ const ReportFilter = ({ </FormControl> </div> )} + {multiDevice && ( + <div className={classes.filterItem}> + <FormControl fullWidth> + <InputLabel>{t('settingsGroups')}</InputLabel> + <Select + label={t('settingsGroups')} + value={groupIds} + onChange={(e) => setGroupIds(e.target.value)} + multiple + > + {Object.values(groups).map((group) => ( + <MenuItem key={group.id} value={group.id}>{group.name}</MenuItem> + ))} + </Select> + </FormControl> + </div> + )} <div className={classes.filterItem}> <FormControl fullWidth> <InputLabel>{t('reportPeriod')}</InputLabel> @@ -122,7 +149,7 @@ const ReportFilter = ({ variant="outlined" color="secondary" className={classes.filterButton} - disabled={!ignoreDevice && !deviceId} + disabled={disabled} > {t('reportShow')} </Button> @@ -132,7 +159,7 @@ const ReportFilter = ({ variant="outlined" color="secondary" className={classes.filterButton} - disabled={!ignoreDevice && !deviceId} + disabled={disabled} > {t('reportExport')} </Button> @@ -143,7 +170,7 @@ const ReportFilter = ({ variant="outlined" color="secondary" className={classes.filterButton} - disabled={!ignoreDevice && !deviceId} + disabled={disabled} > <Typography variant="button" noWrap>{t('reportEmail')}</Typography> </Button> |