diff options
| -rw-r--r-- | modern/src/reports/LogsPage.jsx | 40 | ||||
| -rw-r--r-- | modern/src/reports/components/ReportsMenu.jsx | 2 | ||||
| -rw-r--r-- | modern/src/settings/DevicePage.jsx | 7 |
3 files changed, 47 insertions, 2 deletions
diff --git a/modern/src/reports/LogsPage.jsx b/modern/src/reports/LogsPage.jsx index 9bc04201..4b689944 100644 --- a/modern/src/reports/LogsPage.jsx +++ b/modern/src/reports/LogsPage.jsx @@ -1,14 +1,33 @@ import React, { useEffect } from 'react'; +import { useNavigate } from 'react-router-dom'; import { useDispatch, useSelector } from 'react-redux'; import { - Table, TableRow, TableCell, TableHead, TableBody, + Table, TableRow, TableCell, TableHead, TableBody, IconButton, Tooltip, } from '@mui/material'; +import makeStyles from '@mui/styles/makeStyles'; +import CheckCircleOutlineIcon from '@mui/icons-material/CheckCircleOutline'; +import HelpOutlineIcon from '@mui/icons-material/HelpOutline'; import { useTranslation } from '../common/components/LocalizationProvider'; import PageLayout from '../common/components/PageLayout'; import ReportsMenu from './components/ReportsMenu'; import { sessionActions } from '../store'; +const useStyles = makeStyles((theme) => ({ + columnAction: { + width: '1%', + paddingLeft: theme.spacing(1), + }, + success: { + color: theme.palette.success.main, + }, + error: { + color: theme.palette.error.main, + }, +})); + const LogsPage = () => { + const classes = useStyles(); + const navigate = useNavigate(); const dispatch = useDispatch(); const t = useTranslation(); @@ -19,11 +38,17 @@ const LogsPage = () => { const items = useSelector((state) => state.session.logs); + const registerDevice = (uniqueId) => { + const query = new URLSearchParams({ uniqueId }); + navigate(`/settings/device?${query.toString()}`); + } + return ( <PageLayout menu={<ReportsMenu />} breadcrumbs={['reportTitle', 'statisticsTitle']}> <Table> <TableHead> <TableRow> + <TableCell className={classes.columnAction} /> <TableCell>{t('deviceIdentifier')}</TableCell> <TableCell>{t('positionProtocol')}</TableCell> <TableCell>{t('commandData')}</TableCell> @@ -32,6 +57,19 @@ const LogsPage = () => { <TableBody> {items.map((item, index) => ( <TableRow key={index}> + <TableCell className={classes.columnAction} padding="none"> + {item.deviceId ? ( + <IconButton size="small" disabled> + <CheckCircleOutlineIcon fontSize="small" className={classes.success} /> + </IconButton> + ) : ( + <Tooltip title={t('loginRegister')}> + <IconButton size="small" onClick={() => registerDevice(item.uniqueId)}> + <HelpOutlineIcon fontSize="small" className={classes.error} /> + </IconButton> + </Tooltip> + )} + </TableCell> <TableCell>{item.uniqueId}</TableCell> <TableCell>{item.protocol}</TableCell> <TableCell>{item.data}</TableCell> diff --git a/modern/src/reports/components/ReportsMenu.jsx b/modern/src/reports/components/ReportsMenu.jsx index 76564e11..a45a4500 100644 --- a/modern/src/reports/components/ReportsMenu.jsx +++ b/modern/src/reports/components/ReportsMenu.jsx @@ -90,12 +90,14 @@ const ReportsMenu = () => { title={t('sharedLogs')} link="/reports/logs" icon={<NotesIcon />} + selected={location.pathname === '/reports/logs'} /> {!readonly && ( <MenuItem title={t('reportScheduled')} link="/reports/scheduled" icon={<EventRepeatIcon />} + selected={location.pathname === '/reports/scheduled'} /> )} {admin && ( diff --git a/modern/src/settings/DevicePage.jsx b/modern/src/settings/DevicePage.jsx index 435a48bd..d8a30cbf 100644 --- a/modern/src/settings/DevicePage.jsx +++ b/modern/src/settings/DevicePage.jsx @@ -22,6 +22,7 @@ import { useAdministrator } from '../common/util/permissions'; import SettingsMenu from './components/SettingsMenu'; import useCommonDeviceAttributes from '../common/attributes/useCommonDeviceAttributes'; import { useCatch } from '../reactHelper'; +import useQuery from '../common/util/useQuery'; const useStyles = makeStyles((theme) => ({ details: { @@ -41,7 +42,10 @@ const DevicePage = () => { const commonDeviceAttributes = useCommonDeviceAttributes(t); const deviceAttributes = useDeviceAttributes(t); - const [item, setItem] = useState(); + const query = useQuery(); + const uniqueId = query.get('uniqueId'); + + const [item, setItem] = useState(uniqueId ? { uniqueId } : null); const handleFiles = useCatch(async (files) => { if (files.length > 0) { @@ -87,6 +91,7 @@ const DevicePage = () => { onChange={(event) => setItem({ ...item, uniqueId: event.target.value })} label={t('deviceIdentifier')} helperText={t('deviceIdentifierHelp')} + disabled={Boolean(uniqueId)} /> </AccordionDetails> </Accordion> |