mirror of
https://github.com/emsesp/EMS-ESP32.git
synced 2025-12-06 15:59:52 +03:00
more tables
This commit is contained in:
@@ -1,6 +1,6 @@
|
|||||||
import { FC, useContext, useState } from 'react';
|
import { FC, useContext, useState } from 'react';
|
||||||
|
|
||||||
import { Button, IconButton, Table, TableBody, TableCell, TableFooter, TableHead, TableRow } from '@mui/material';
|
import { Button, IconButton, Box } from '@mui/material';
|
||||||
import SaveIcon from '@mui/icons-material/Save';
|
import SaveIcon from '@mui/icons-material/Save';
|
||||||
import DeleteIcon from '@mui/icons-material/Delete';
|
import DeleteIcon from '@mui/icons-material/Delete';
|
||||||
import PersonAddIcon from '@mui/icons-material/PersonAdd';
|
import PersonAddIcon from '@mui/icons-material/PersonAdd';
|
||||||
@@ -9,6 +9,10 @@ import CheckIcon from '@mui/icons-material/Check';
|
|||||||
import CloseIcon from '@mui/icons-material/Close';
|
import CloseIcon from '@mui/icons-material/Close';
|
||||||
import VpnKeyIcon from '@mui/icons-material/VpnKey';
|
import VpnKeyIcon from '@mui/icons-material/VpnKey';
|
||||||
|
|
||||||
|
import { Table } from '@table-library/react-table-library/table';
|
||||||
|
import { useTheme } from '@table-library/react-table-library/theme';
|
||||||
|
import { Header, HeaderRow, HeaderCell, Body, Row, Cell } from '@table-library/react-table-library/table';
|
||||||
|
|
||||||
import * as SecurityApi from '../../api/security';
|
import * as SecurityApi from '../../api/security';
|
||||||
import { SecuritySettings, User } from '../../types';
|
import { SecuritySettings, User } from '../../types';
|
||||||
import { ButtonRow, FormLoader, MessageBox, SectionContent } from '../../components';
|
import { ButtonRow, FormLoader, MessageBox, SectionContent } from '../../components';
|
||||||
@@ -19,16 +23,6 @@ import { AuthenticatedContext } from '../../contexts/authentication';
|
|||||||
import GenerateToken from './GenerateToken';
|
import GenerateToken from './GenerateToken';
|
||||||
import UserForm from './UserForm';
|
import UserForm from './UserForm';
|
||||||
|
|
||||||
function compareUsers(a: User, b: User) {
|
|
||||||
if (a.username < b.username) {
|
|
||||||
return -1;
|
|
||||||
}
|
|
||||||
if (a.username > b.username) {
|
|
||||||
return 1;
|
|
||||||
}
|
|
||||||
return 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
const ManageUsersForm: FC = () => {
|
const ManageUsersForm: FC = () => {
|
||||||
const { loadData, saving, data, setData, saveData, errorMessage } = useRest<SecuritySettings>({
|
const { loadData, saving, data, setData, saveData, errorMessage } = useRest<SecuritySettings>({
|
||||||
read: SecurityApi.readSecuritySettings,
|
read: SecurityApi.readSecuritySettings,
|
||||||
@@ -40,6 +34,45 @@ const ManageUsersForm: FC = () => {
|
|||||||
const [generatingToken, setGeneratingToken] = useState<string>();
|
const [generatingToken, setGeneratingToken] = useState<string>();
|
||||||
const authenticatedContext = useContext(AuthenticatedContext);
|
const authenticatedContext = useContext(AuthenticatedContext);
|
||||||
|
|
||||||
|
const table_theme = useTheme({
|
||||||
|
BaseRow: `
|
||||||
|
font-size: 14px;
|
||||||
|
color: white;
|
||||||
|
`,
|
||||||
|
HeaderRow: `
|
||||||
|
text-transform: uppercase;
|
||||||
|
background-color: black;
|
||||||
|
color: #90CAF9;
|
||||||
|
border-bottom: 1px solid #e0e0e0;
|
||||||
|
`,
|
||||||
|
Row: `
|
||||||
|
&:nth-of-type(odd) {
|
||||||
|
background-color: #303030;
|
||||||
|
}
|
||||||
|
&:nth-of-type(even) {
|
||||||
|
background-color: #1e1e1e;
|
||||||
|
}
|
||||||
|
border-top: 1px solid #565656;
|
||||||
|
border-bottom: 1px solid #565656;
|
||||||
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
|
&:not(:last-of-type) {
|
||||||
|
margin-bottom: -1px;
|
||||||
|
}
|
||||||
|
&:not(:first-of-type) {
|
||||||
|
margin-top: -1px;
|
||||||
|
}
|
||||||
|
&:hover {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
`,
|
||||||
|
BaseCell: `
|
||||||
|
border-top: 1px solid transparent;
|
||||||
|
border-right: 1px solid transparent;
|
||||||
|
border-bottom: 1px solid transparent;
|
||||||
|
`
|
||||||
|
});
|
||||||
|
|
||||||
const content = () => {
|
const content = () => {
|
||||||
if (!data) {
|
if (!data) {
|
||||||
return <FormLoader onRetry={loadData} errorMessage={errorMessage} />;
|
return <FormLoader onRetry={loadData} errorMessage={errorMessage} />;
|
||||||
@@ -48,13 +81,14 @@ const ManageUsersForm: FC = () => {
|
|||||||
const noAdminConfigured = () => !data.users.find((u) => u.admin);
|
const noAdminConfigured = () => !data.users.find((u) => u.admin);
|
||||||
|
|
||||||
const removeUser = (toRemove: User) => {
|
const removeUser = (toRemove: User) => {
|
||||||
const users = data.users.filter((u) => u.username !== toRemove.username);
|
const users = data.users.filter((u) => u.id !== toRemove.id);
|
||||||
setData({ ...data, users });
|
setData({ ...data, users });
|
||||||
};
|
};
|
||||||
|
|
||||||
const createUser = () => {
|
const createUser = () => {
|
||||||
setCreating(true);
|
setCreating(true);
|
||||||
setUser({
|
setUser({
|
||||||
|
id: '',
|
||||||
username: '',
|
username: '',
|
||||||
password: '',
|
password: '',
|
||||||
admin: true
|
admin: true
|
||||||
@@ -72,7 +106,7 @@ const ManageUsersForm: FC = () => {
|
|||||||
|
|
||||||
const doneEditingUser = () => {
|
const doneEditingUser = () => {
|
||||||
if (user) {
|
if (user) {
|
||||||
const users = [...data.users.filter((u) => u.username !== user.username), user];
|
const users = [...data.users.filter((u) => u.id !== user.id), user];
|
||||||
setData({ ...data, users });
|
setData({ ...data, users });
|
||||||
setUser(undefined);
|
setUser(undefined);
|
||||||
}
|
}
|
||||||
@@ -82,8 +116,8 @@ const ManageUsersForm: FC = () => {
|
|||||||
setGeneratingToken(undefined);
|
setGeneratingToken(undefined);
|
||||||
};
|
};
|
||||||
|
|
||||||
const generateToken = (username: string) => {
|
const generateToken = (id: string) => {
|
||||||
setGeneratingToken(username);
|
setGeneratingToken(id);
|
||||||
};
|
};
|
||||||
|
|
||||||
const onSubmit = async () => {
|
const onSubmit = async () => {
|
||||||
@@ -93,66 +127,71 @@ const ManageUsersForm: FC = () => {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Table size="small">
|
<Table data={{ nodes: data.users }} theme={table_theme}>
|
||||||
<TableHead>
|
{(tableList: any) => (
|
||||||
<TableRow>
|
<>
|
||||||
<TableCell>Username</TableCell>
|
<Header>
|
||||||
<TableCell align="center">is Admin?</TableCell>
|
<HeaderRow>
|
||||||
<TableCell />
|
<HeaderCell>USERNAME</HeaderCell>
|
||||||
</TableRow>
|
<HeaderCell>IS ADMIN</HeaderCell>
|
||||||
</TableHead>
|
<HeaderCell />
|
||||||
<TableBody>
|
</HeaderRow>
|
||||||
{data.users.sort(compareUsers).map((u) => (
|
</Header>
|
||||||
<TableRow key={u.username}>
|
<Body>
|
||||||
<TableCell component="th" scope="row">
|
{tableList.map((u: User, index: number) => (
|
||||||
{u.username}
|
<Row key={u.id} item={u}>
|
||||||
</TableCell>
|
<Cell>{u.id}</Cell>
|
||||||
<TableCell align="center">{u.admin ? <CheckIcon /> : <CloseIcon />}</TableCell>
|
<Cell>{u.admin ? <CheckIcon /> : <CloseIcon />}</Cell>
|
||||||
<TableCell align="center">
|
<Cell>
|
||||||
<IconButton
|
<IconButton
|
||||||
size="small"
|
size="small"
|
||||||
disabled={!authenticatedContext.me.admin}
|
disabled={!authenticatedContext.me.admin}
|
||||||
aria-label="Generate Token"
|
aria-label="Generate Token"
|
||||||
onClick={() => generateToken(u.username)}
|
onClick={() => generateToken(u.id)}
|
||||||
>
|
>
|
||||||
<VpnKeyIcon />
|
<VpnKeyIcon />
|
||||||
</IconButton>
|
</IconButton>
|
||||||
<IconButton size="small" aria-label="Delete" onClick={() => removeUser(u)}>
|
<IconButton size="small" aria-label="Delete" onClick={() => removeUser(u)}>
|
||||||
<DeleteIcon />
|
<DeleteIcon />
|
||||||
</IconButton>
|
</IconButton>
|
||||||
<IconButton size="small" aria-label="Edit" onClick={() => editUser(u)}>
|
<IconButton size="small" aria-label="Edit" onClick={() => editUser(u)}>
|
||||||
<EditIcon />
|
<EditIcon />
|
||||||
</IconButton>
|
</IconButton>
|
||||||
</TableCell>
|
</Cell>
|
||||||
</TableRow>
|
</Row>
|
||||||
))}
|
))}
|
||||||
</TableBody>
|
</Body>
|
||||||
<TableFooter>
|
</>
|
||||||
<TableRow>
|
)}
|
||||||
<TableCell colSpan={2} />
|
|
||||||
<TableCell align="center">
|
|
||||||
<Button startIcon={<PersonAddIcon />} variant="outlined" color="secondary" onClick={createUser}>
|
|
||||||
Add
|
|
||||||
</Button>
|
|
||||||
</TableCell>
|
|
||||||
</TableRow>
|
|
||||||
</TableFooter>
|
|
||||||
</Table>
|
</Table>
|
||||||
|
|
||||||
{noAdminConfigured() && (
|
{noAdminConfigured() && (
|
||||||
<MessageBox level="warning" message="You must have at least one admin user configured" my={2} />
|
<MessageBox level="warning" message="You must have at least one admin user configured" my={2} />
|
||||||
)}
|
)}
|
||||||
<ButtonRow>
|
|
||||||
<Button
|
<Box display="flex" flexWrap="wrap">
|
||||||
startIcon={<SaveIcon />}
|
<Box flexGrow={1} sx={{ '& button': { mt: 2 } }}>
|
||||||
disabled={saving || noAdminConfigured()}
|
<Button
|
||||||
variant="outlined"
|
startIcon={<SaveIcon />}
|
||||||
color="primary"
|
disabled={saving || noAdminConfigured()}
|
||||||
type="submit"
|
variant="outlined"
|
||||||
onClick={onSubmit}
|
color="primary"
|
||||||
>
|
type="submit"
|
||||||
Save
|
onClick={onSubmit}
|
||||||
</Button>
|
>
|
||||||
</ButtonRow>
|
Save
|
||||||
|
</Button>
|
||||||
|
</Box>
|
||||||
|
|
||||||
|
<Box flexWrap="nowrap" whiteSpace="nowrap">
|
||||||
|
<ButtonRow>
|
||||||
|
<Button startIcon={<PersonAddIcon />} variant="outlined" color="secondary" onClick={createUser}>
|
||||||
|
Add
|
||||||
|
</Button>
|
||||||
|
</ButtonRow>
|
||||||
|
</Box>
|
||||||
|
</Box>
|
||||||
|
|
||||||
<GenerateToken username={generatingToken} onClose={closeGenerateToken} />
|
<GenerateToken username={generatingToken} onClose={closeGenerateToken} />
|
||||||
<UserForm
|
<UserForm
|
||||||
user={user}
|
user={user}
|
||||||
|
|||||||
@@ -3,25 +3,23 @@ import { useSnackbar } from 'notistack';
|
|||||||
import {
|
import {
|
||||||
Avatar,
|
Avatar,
|
||||||
Button,
|
Button,
|
||||||
Table,
|
|
||||||
TableContainer,
|
|
||||||
TableBody,
|
|
||||||
TableCell,
|
|
||||||
TableHead,
|
|
||||||
TableRow,
|
|
||||||
List,
|
List,
|
||||||
ListItem,
|
ListItem,
|
||||||
ListItemAvatar,
|
ListItemAvatar,
|
||||||
ListItemText,
|
ListItemText,
|
||||||
Theme,
|
|
||||||
useTheme,
|
|
||||||
Box,
|
Box,
|
||||||
Dialog,
|
Dialog,
|
||||||
DialogActions,
|
DialogActions,
|
||||||
DialogContent,
|
DialogContent,
|
||||||
DialogTitle
|
DialogTitle,
|
||||||
|
Theme,
|
||||||
|
useTheme
|
||||||
} from '@mui/material';
|
} from '@mui/material';
|
||||||
|
|
||||||
|
import { Table } from '@table-library/react-table-library/table';
|
||||||
|
import { useTheme as tableTheme } from '@table-library/react-table-library/theme';
|
||||||
|
import { Header, HeaderRow, HeaderCell, Body, Row, Cell } from '@table-library/react-table-library/table';
|
||||||
|
|
||||||
import DeviceHubIcon from '@mui/icons-material/DeviceHub';
|
import DeviceHubIcon from '@mui/icons-material/DeviceHub';
|
||||||
import RefreshIcon from '@mui/icons-material/Refresh';
|
import RefreshIcon from '@mui/icons-material/Refresh';
|
||||||
import PermScanWifiIcon from '@mui/icons-material/PermScanWifi';
|
import PermScanWifiIcon from '@mui/icons-material/PermScanWifi';
|
||||||
@@ -32,14 +30,12 @@ import { AuthenticatedContext } from '../contexts/authentication';
|
|||||||
|
|
||||||
import { ButtonRow, FormLoader, SectionContent } from '../components';
|
import { ButtonRow, FormLoader, SectionContent } from '../components';
|
||||||
|
|
||||||
import { Status, busConnectionStatus } from './types';
|
import { Status, busConnectionStatus, Stat } from './types';
|
||||||
|
|
||||||
import { formatDurationSec, pluralize } from '../utils';
|
import { formatDurationSec, pluralize, extractErrorMessage, useRest } from '../utils';
|
||||||
|
|
||||||
import * as EMSESP from './api';
|
import * as EMSESP from './api';
|
||||||
|
|
||||||
import { extractErrorMessage, useRest } from '../utils';
|
|
||||||
|
|
||||||
export const isConnected = ({ status }: Status) => status !== busConnectionStatus.BUS_STATUS_OFFLINE;
|
export const isConnected = ({ status }: Status) => status !== busConnectionStatus.BUS_STATUS_OFFLINE;
|
||||||
|
|
||||||
const busStatusHighlight = ({ status }: Status, theme: Theme) => {
|
const busStatusHighlight = ({ status }: Status, theme: Theme) => {
|
||||||
@@ -60,7 +56,7 @@ const busStatus = ({ status }: Status) => {
|
|||||||
case busConnectionStatus.BUS_STATUS_CONNECTED:
|
case busConnectionStatus.BUS_STATUS_CONNECTED:
|
||||||
return 'Connected';
|
return 'Connected';
|
||||||
case busConnectionStatus.BUS_STATUS_TX_ERRORS:
|
case busConnectionStatus.BUS_STATUS_TX_ERRORS:
|
||||||
return 'Tx issues - try a different Tx-Mode';
|
return 'Tx issues - try a different Tx Mode';
|
||||||
case busConnectionStatus.BUS_STATUS_OFFLINE:
|
case busConnectionStatus.BUS_STATUS_OFFLINE:
|
||||||
return 'Disconnected';
|
return 'Disconnected';
|
||||||
default:
|
default:
|
||||||
@@ -68,41 +64,17 @@ const busStatus = ({ status }: Status) => {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
const formatRow = (name: string, success: number, fail: number, quality: number) => {
|
const showQuality = (stat: Stat) => {
|
||||||
if (success === 0 && fail === 0) {
|
if (stat.q === 0 || stat.s + stat.f === 0) {
|
||||||
return (
|
return;
|
||||||
<TableRow>
|
|
||||||
<TableCell sx={{ color: 'gray' }}>{name}</TableCell>
|
|
||||||
<TableCell />
|
|
||||||
<TableCell />
|
|
||||||
<TableCell />
|
|
||||||
</TableRow>
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
|
if (stat.q === 100) {
|
||||||
return (
|
return <div style={{ color: '#00FF7F' }}>{stat.q}%</div>;
|
||||||
<TableRow>
|
|
||||||
<TableCell>{name}</TableCell>
|
|
||||||
<TableCell>{Intl.NumberFormat().format(success)}</TableCell>
|
|
||||||
<TableCell>{Intl.NumberFormat().format(fail)}</TableCell>
|
|
||||||
{showQuality(quality)}
|
|
||||||
</TableRow>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
const showQuality = (quality: number) => {
|
|
||||||
if (quality === 0) {
|
|
||||||
return <TableCell />;
|
|
||||||
}
|
}
|
||||||
|
if (stat.q >= 95) {
|
||||||
if (quality === 100) {
|
return <div style={{ color: 'orange' }}>{stat.q}%</div>;
|
||||||
return <TableCell sx={{ color: '#00FF7F' }}>{quality}%</TableCell>;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (quality >= 95) {
|
|
||||||
return <TableCell sx={{ color: 'orange' }}>{quality}%</TableCell>;
|
|
||||||
} else {
|
} else {
|
||||||
return <TableCell sx={{ color: 'red' }}>{quality}%</TableCell>;
|
return <div style={{ color: 'red' }}>{stat.q}%</div>;
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -115,6 +87,48 @@ const DashboardStatus: FC = () => {
|
|||||||
|
|
||||||
const { me } = useContext(AuthenticatedContext);
|
const { me } = useContext(AuthenticatedContext);
|
||||||
|
|
||||||
|
const stats_theme = tableTheme({
|
||||||
|
BaseRow: `
|
||||||
|
font-size: 14px;
|
||||||
|
color: white;
|
||||||
|
`,
|
||||||
|
HeaderRow: `
|
||||||
|
text-transform: uppercase;
|
||||||
|
background-color: black;
|
||||||
|
color: #90CAF9;
|
||||||
|
border-bottom: 1px solid #e0e0e0;
|
||||||
|
`,
|
||||||
|
Row: `
|
||||||
|
&:nth-of-type(odd) {
|
||||||
|
background-color: #303030;
|
||||||
|
}
|
||||||
|
&:nth-of-type(even) {
|
||||||
|
background-color: #1e1e1e;
|
||||||
|
}
|
||||||
|
border-top: 1px solid #565656;
|
||||||
|
border-bottom: 1px solid #565656;
|
||||||
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
|
&:not(:last-of-type) {
|
||||||
|
margin-bottom: -1px;
|
||||||
|
}
|
||||||
|
&:not(:first-of-type) {
|
||||||
|
margin-top: -1px;
|
||||||
|
}
|
||||||
|
&:hover {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
`,
|
||||||
|
BaseCell: `
|
||||||
|
border-top: 1px solid transparent;
|
||||||
|
border-right: 1px solid transparent;
|
||||||
|
border-bottom: 1px solid transparent;
|
||||||
|
&:nth-of-type(1) {
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
`
|
||||||
|
});
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const timer = setInterval(() => loadData(), 30000);
|
const timer = setInterval(() => loadData(), 30000);
|
||||||
return () => {
|
return () => {
|
||||||
@@ -183,27 +197,30 @@ const DashboardStatus: FC = () => {
|
|||||||
/>
|
/>
|
||||||
</ListItem>
|
</ListItem>
|
||||||
<Box m={3}></Box>
|
<Box m={3}></Box>
|
||||||
<TableContainer>
|
<Table data={{ nodes: data.stats }} theme={stats_theme} layout={{ custom: true }}>
|
||||||
<Table size="small">
|
{(tableList: any) => (
|
||||||
<TableHead>
|
<>
|
||||||
<TableRow>
|
<Header>
|
||||||
<TableCell></TableCell>
|
<HeaderRow>
|
||||||
<TableCell>SUCCESS</TableCell>
|
<HeaderCell></HeaderCell>
|
||||||
<TableCell>FAIL</TableCell>
|
<HeaderCell>SUCCESS</HeaderCell>
|
||||||
<TableCell>QUALITY</TableCell>
|
<HeaderCell>FAIL</HeaderCell>
|
||||||
</TableRow>
|
<HeaderCell>QUALITY</HeaderCell>
|
||||||
</TableHead>
|
</HeaderRow>
|
||||||
<TableBody>
|
</Header>
|
||||||
{formatRow('EMS Telegrams Received (Rx)', data.rx_received, data.rx_fails, data.rx_quality)}
|
<Body>
|
||||||
{formatRow('EMS Reads (Tx)', data.tx_reads, data.tx_read_fails, data.tx_read_quality)}
|
{tableList.map((stat: Stat, index: number) => (
|
||||||
{formatRow('EMS Writes (Tx)', data.tx_writes, data.tx_write_fails, data.tx_write_quality)}
|
<Row key={stat.id} item={stat}>
|
||||||
{formatRow('Temperature Sensor Reads', data.sensor_reads, data.sensor_fails, data.sensor_quality)}
|
<Cell>{stat.id}</Cell>
|
||||||
{formatRow('Analog Sensor Reads', data.analog_reads, data.analog_fails, data.analog_quality)}
|
<Cell>{Intl.NumberFormat().format(stat.s)}</Cell>
|
||||||
{formatRow('MQTT Publishes', data.mqtt_count, data.mqtt_fails, data.mqtt_quality)}
|
<Cell>{Intl.NumberFormat().format(stat.f)}</Cell>
|
||||||
{formatRow('API Calls', data.api_calls, data.api_fails, data.api_quality)}
|
<Cell>{showQuality(stat)}</Cell>
|
||||||
</TableBody>
|
</Row>
|
||||||
</Table>
|
))}
|
||||||
</TableContainer>
|
</Body>
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
</Table>
|
||||||
</List>
|
</List>
|
||||||
{renderScanDialog()}
|
{renderScanDialog()}
|
||||||
<Box display="flex" flexWrap="wrap">
|
<Box display="flex" flexWrap="wrap">
|
||||||
|
|||||||
@@ -38,36 +38,21 @@ export enum busConnectionStatus {
|
|||||||
BUS_STATUS_OFFLINE = 2
|
BUS_STATUS_OFFLINE = 2
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export interface Stat {
|
||||||
|
id: string; // name
|
||||||
|
s: number; // success
|
||||||
|
f: number; // fail
|
||||||
|
q: number; // quality
|
||||||
|
}
|
||||||
export interface Status {
|
export interface Status {
|
||||||
status: busConnectionStatus;
|
status: busConnectionStatus;
|
||||||
tx_mode: number;
|
tx_mode: number;
|
||||||
rx_received: number;
|
uptime: number;
|
||||||
tx_reads: number;
|
|
||||||
tx_writes: number;
|
|
||||||
rx_quality: number;
|
|
||||||
tx_read_quality: number;
|
|
||||||
tx_write_quality: number;
|
|
||||||
tx_read_fails: number;
|
|
||||||
tx_write_fails: number;
|
|
||||||
rx_fails: number;
|
|
||||||
sensor_fails: number;
|
|
||||||
sensor_reads: number;
|
|
||||||
sensor_quality: number;
|
|
||||||
analog_fails: number;
|
|
||||||
analog_reads: number;
|
|
||||||
analog_quality: number;
|
|
||||||
mqtt_count: number;
|
|
||||||
mqtt_fails: number;
|
|
||||||
mqtt_quality: number;
|
|
||||||
api_calls: number;
|
|
||||||
api_fails: number;
|
|
||||||
api_quality: number;
|
|
||||||
num_devices: number;
|
num_devices: number;
|
||||||
num_sensors: number;
|
num_sensors: number;
|
||||||
num_analogs: number;
|
num_analogs: number;
|
||||||
uptime: number;
|
stats: Stat[];
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface Device {
|
export interface Device {
|
||||||
id: string; // id index
|
id: string; // id index
|
||||||
t: string; // type
|
t: string; // type
|
||||||
|
|||||||
@@ -1,4 +1,5 @@
|
|||||||
export interface User {
|
export interface User {
|
||||||
|
id: string; // needed for Table
|
||||||
username: string;
|
username: string;
|
||||||
password: string;
|
password: string;
|
||||||
admin: boolean;
|
admin: boolean;
|
||||||
|
|||||||
@@ -43,6 +43,7 @@ class SecuritySettings {
|
|||||||
JsonArray users = root.createNestedArray("users");
|
JsonArray users = root.createNestedArray("users");
|
||||||
for (User user : settings.users) {
|
for (User user : settings.users) {
|
||||||
JsonObject userRoot = users.createNestedObject();
|
JsonObject userRoot = users.createNestedObject();
|
||||||
|
userRoot["id"] = user.username; // for React Table
|
||||||
userRoot["username"] = user.username;
|
userRoot["username"] = user.username;
|
||||||
userRoot["password"] = user.password;
|
userRoot["password"] = user.password;
|
||||||
userRoot["admin"] = user.admin;
|
userRoot["admin"] = user.admin;
|
||||||
|
|||||||
@@ -270,8 +270,8 @@ const system_status = {
|
|||||||
security_settings = {
|
security_settings = {
|
||||||
jwt_secret: 'naughty!',
|
jwt_secret: 'naughty!',
|
||||||
users: [
|
users: [
|
||||||
{ username: 'admin', password: 'admin', admin: true },
|
{ id: 'admin', username: 'admin', password: 'admin', admin: true },
|
||||||
{ username: 'guest', password: 'guest', admin: false },
|
{ id: 'guest', username: 'guest', password: 'guest', admin: false },
|
||||||
],
|
],
|
||||||
}
|
}
|
||||||
const features = {
|
const features = {
|
||||||
@@ -417,33 +417,21 @@ const emsesp_sensordata = {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const status = {
|
const status = {
|
||||||
analog_fails: 0,
|
|
||||||
analog_quality: 100,
|
|
||||||
analog_reads: 203,
|
|
||||||
api_calls: 4,
|
|
||||||
api_fails: 0,
|
|
||||||
api_quality: 100,
|
|
||||||
mqtt_count: 40243,
|
|
||||||
mqtt_fails: 0,
|
|
||||||
mqtt_quality: 100,
|
|
||||||
num_analogs: 1,
|
|
||||||
num_devices: 2,
|
|
||||||
num_sensors: 1,
|
|
||||||
rx_fails: 11,
|
|
||||||
rx_quality: 100,
|
|
||||||
rx_received: 56506,
|
|
||||||
sensor_fails: 0,
|
|
||||||
sensor_quality: 100,
|
|
||||||
sensor_reads: 15438,
|
|
||||||
status: 0,
|
status: 0,
|
||||||
tx_mode: 1,
|
tx_mode: 1,
|
||||||
tx_read_fails: 0,
|
|
||||||
tx_read_quality: 100,
|
|
||||||
tx_reads: 9026,
|
|
||||||
tx_write_fails: 2,
|
|
||||||
tx_write_quality: 95,
|
|
||||||
tx_writes: 33,
|
|
||||||
uptime: 77186,
|
uptime: 77186,
|
||||||
|
num_devices: 2,
|
||||||
|
num_sensors: 1,
|
||||||
|
num_analogs: 1,
|
||||||
|
stats: [
|
||||||
|
{ id: 'EMS Telegrams Received (Rx)', s: 56506, f: 11, q: 100 },
|
||||||
|
{ id: 'EMS Reads (Tx)', s: 9026, f: 0, q: 100 },
|
||||||
|
{ id: 'EMS Writes (Tx)', s: 33, f: 2, q: 95 },
|
||||||
|
{ id: 'Temperature Sensor Reads', s: 56506, f: 11, q: 100 },
|
||||||
|
{ id: 'Analog Sensor Reads', s: 0, f: 0, q: 100 },
|
||||||
|
{ id: 'MQTT Publishes', s: 12, f: 10, q: 20 },
|
||||||
|
{ id: 'API Calls', s: 0, f: 0, q: 0 },
|
||||||
|
],
|
||||||
}
|
}
|
||||||
|
|
||||||
// Dashboard data
|
// Dashboard data
|
||||||
|
|||||||
@@ -176,11 +176,12 @@ void WebDataService::device_data(AsyncWebServerRequest * request, JsonVariant &
|
|||||||
emsdevice->generate_values_web(output);
|
emsdevice->generate_values_web(output);
|
||||||
#endif
|
#endif
|
||||||
|
|
||||||
#ifdef EMSESP_USE_SERIAL
|
// #ifdef EMSESP_USE_SERIAL
|
||||||
#ifdef EMSESP_DEBUG
|
// #ifdef EMSESP_DEBUG
|
||||||
serializeJson(output, Serial);
|
// serializeJson(output, Serial);
|
||||||
#endif
|
// #endif
|
||||||
#endif
|
// #endif
|
||||||
|
|
||||||
response->setLength();
|
response->setLength();
|
||||||
request->send(response);
|
request->send(response);
|
||||||
return;
|
return;
|
||||||
|
|||||||
@@ -129,34 +129,57 @@ void WebStatusService::webStatusService(AsyncWebServerRequest * request) {
|
|||||||
auto * response = new AsyncJsonResponse(false, EMSESP_JSON_SIZE_MEDIUM_DYN);
|
auto * response = new AsyncJsonResponse(false, EMSESP_JSON_SIZE_MEDIUM_DYN);
|
||||||
JsonObject root = response->getRoot();
|
JsonObject root = response->getRoot();
|
||||||
|
|
||||||
root["status"] = EMSESP::bus_status(); // 0, 1 or 2
|
root["status"] = EMSESP::bus_status(); // 0, 1 or 2
|
||||||
root["num_devices"] = EMSESP::count_devices(); // excluding Controller
|
root["tx_mode"] = EMSESP::txservice_.tx_mode();
|
||||||
root["num_sensors"] = EMSESP::dallassensor_.no_sensors();
|
root["uptime"] = EMSbus::bus_uptime();
|
||||||
root["num_analogs"] = EMSESP::analogsensor_.no_sensors();
|
root["num_devices"] = EMSESP::count_devices(); // excluding Controller
|
||||||
root["tx_mode"] = EMSESP::txservice_.tx_mode();
|
root["num_sensors"] = EMSESP::dallassensor_.no_sensors();
|
||||||
root["rx_received"] = EMSESP::rxservice_.telegram_count();
|
root["num_analogs"] = EMSESP::analogsensor_.no_sensors();
|
||||||
root["tx_reads"] = EMSESP::txservice_.telegram_read_count();
|
|
||||||
root["tx_writes"] = EMSESP::txservice_.telegram_write_count();
|
JsonArray statsJson = root.createNestedArray("stats");
|
||||||
root["rx_quality"] = EMSESP::rxservice_.quality();
|
JsonObject statJson;
|
||||||
root["tx_read_quality"] = EMSESP::txservice_.read_quality();
|
|
||||||
root["tx_write_quality"] = EMSESP::txservice_.write_quality();
|
statJson = statsJson.createNestedObject();
|
||||||
root["rx_fails"] = EMSESP::rxservice_.telegram_error_count();
|
statJson["id"] = "EMS Telegrams Received (Rx)";
|
||||||
root["tx_read_fails"] = EMSESP::txservice_.telegram_read_fail_count();
|
statJson["s"] = EMSESP::rxservice_.telegram_count();
|
||||||
root["tx_write_fails"] = EMSESP::txservice_.telegram_write_fail_count();
|
statJson["f"] = EMSESP::rxservice_.telegram_error_count();
|
||||||
root["sensor_fails"] = EMSESP::dallassensor_.fails();
|
statJson["q"] = EMSESP::rxservice_.quality();
|
||||||
root["sensor_reads"] = EMSESP::dallassensor_.reads();
|
|
||||||
root["sensor_quality"] = EMSESP::dallassensor_.reads() == 0 ? 100 : 100 - (uint8_t)((100 * EMSESP::dallassensor_.fails()) / EMSESP::dallassensor_.reads());
|
statJson = statsJson.createNestedObject();
|
||||||
root["analog_fails"] = EMSESP::analogsensor_.fails();
|
statJson["id"] = "EMS Reads (Tx)";
|
||||||
root["analog_reads"] = EMSESP::analogsensor_.reads();
|
statJson["s"] = EMSESP::txservice_.telegram_read_count();
|
||||||
root["analog_quality"] = EMSESP::analogsensor_.reads() == 0 ? 100 : 100 - (uint8_t)((100 * EMSESP::analogsensor_.fails()) / EMSESP::analogsensor_.reads());
|
statJson["f"] = EMSESP::txservice_.telegram_read_fail_count();
|
||||||
root["mqtt_fails"] = Mqtt::publish_fails();
|
statJson["q"] = EMSESP::txservice_.read_quality();
|
||||||
root["mqtt_count"] = Mqtt::publish_count();
|
|
||||||
root["mqtt_quality"] = Mqtt::publish_count() == 0 ? 100 : 100 - (Mqtt::publish_fails() * 100) / (Mqtt::publish_count() + Mqtt::publish_fails());
|
statJson = statsJson.createNestedObject();
|
||||||
root["api_calls"] = WebAPIService::api_count(); // + WebAPIService::api_fails();
|
statJson["id"] = "EMS Writes (Tx)";
|
||||||
root["api_fails"] = WebAPIService::api_fails();
|
statJson["s"] = EMSESP::txservice_.telegram_write_count();
|
||||||
root["api_quality"] =
|
statJson["f"] = EMSESP::txservice_.telegram_write_fail_count();
|
||||||
WebAPIService::api_count() == 0 ? 100 : 100 - (WebAPIService::api_fails() * 100) / (WebAPIService::api_count() + WebAPIService::api_fails());
|
statJson["q"] = EMSESP::txservice_.write_quality();
|
||||||
root["uptime"] = EMSbus::bus_uptime();
|
|
||||||
|
statJson = statsJson.createNestedObject();
|
||||||
|
statJson["id"] = "Temperature Sensor Reads";
|
||||||
|
statJson["s"] = EMSESP::dallassensor_.reads();
|
||||||
|
statJson["f"] = EMSESP::dallassensor_.fails();
|
||||||
|
statJson["q"] = EMSESP::dallassensor_.reads() == 0 ? 100 : 100 - (uint8_t)((100 * EMSESP::dallassensor_.fails()) / EMSESP::dallassensor_.reads());
|
||||||
|
|
||||||
|
statJson = statsJson.createNestedObject();
|
||||||
|
statJson["id"] = "Analog Sensor Reads";
|
||||||
|
statJson["s"] = EMSESP::analogsensor_.reads();
|
||||||
|
statJson["f"] = EMSESP::analogsensor_.fails();
|
||||||
|
statJson["q"] = EMSESP::analogsensor_.reads() == 0 ? 100 : 100 - (uint8_t)((100 * EMSESP::analogsensor_.fails()) / EMSESP::analogsensor_.reads());
|
||||||
|
|
||||||
|
statJson = statsJson.createNestedObject();
|
||||||
|
statJson["id"] = "MQTT Publishes";
|
||||||
|
statJson["s"] = Mqtt::publish_count();
|
||||||
|
statJson["f"] = Mqtt::publish_fails();
|
||||||
|
statJson["q"] = Mqtt::publish_count() == 0 ? 100 : 100 - (Mqtt::publish_fails() * 100) / (Mqtt::publish_count() + Mqtt::publish_fails());
|
||||||
|
|
||||||
|
statJson = statsJson.createNestedObject();
|
||||||
|
statJson["id"] = "API Calls";
|
||||||
|
statJson["s"] = WebAPIService::api_count(); // + WebAPIService::api_fails();
|
||||||
|
statJson["f"] = WebAPIService::api_fails();
|
||||||
|
statJson["q"] = WebAPIService::api_count() == 0 ? 100 : 100 - (WebAPIService::api_fails() * 100) / (WebAPIService::api_count() + WebAPIService::api_fails());
|
||||||
|
|
||||||
response->setLength();
|
response->setLength();
|
||||||
request->send(response);
|
request->send(response);
|
||||||
|
|||||||
Reference in New Issue
Block a user