andry/EMS-ESP32
1
0
Fork 0
mirror of https://github.com/emsesp/EMS-ESP32.git synced 2026-01-27 00:59:10 +03:00
Code Issues Packages Projects Releases Wiki Activity

manual merge of PR 660 - https://github.com/emsesp/EMS-ESP32/pull/660/

Browse Source
This commit is contained in:
Proddy
2022-10-04 21:01:23 +02:00
parent 58a0ec9cca
commit e37bbe420c
19 changed files with 221 additions and 134 deletions
Download Patch File Download Diff File Expand all files Collapse all files

69
interface/src/framework/mqtt/MqttStatusForm.tsx
View File

@@ -5,6 +5,7 @@ import DeviceHubIcon from '@mui/icons-material/DeviceHub';
import RefreshIcon from '@mui/icons-material/Refresh';
import ReportIcon from '@mui/icons-material/Report';
import SpeakerNotesOffIcon from '@mui/icons-material/SpeakerNotesOff';
import AutoAwesomeMotionIcon from '@mui/icons-material/AutoAwesomeMotion';
import { ButtonRow, FormLoader, SectionContent } from '../../components';
import { MqttStatus, MqttDisconnectReason } from '../../types';
@@ -31,6 +32,12 @@ export const mqttPublishHighlight = ({ mqtt_fails }: MqttStatus, theme: Theme) =
return theme.palette.error.main;
};
export const mqttQueueHighlight = ({ mqtt_queued }: MqttStatus, theme: Theme) => {
if (mqtt_queued <= 1) return theme.palette.success.main;
return theme.palette.warning.main;
};
const MqttStatusForm: FC = () => {
const { loadData, data, errorMessage } = useRest<MqttStatus>({ read: MqttApi.readMqttStatus });
@@ -38,14 +45,14 @@ const MqttStatusForm: FC = () => {
const theme = useTheme();
const mqttStatus = ({ enabled, connected }: MqttStatus) => {
const mqttStatus = ({ enabled, connected, connect_count }: MqttStatus) => {
if (!enabled) {
return LL.NOT_ENABLED();
}
if (connected) {
return LL.CONNECTED();
return LL.CONNECTED() + (connect_count > 1 ? ' (' + connect_count + ')' : '');
}
return LL.DISCONNECTED();
return LL.DISCONNECTED() + (connect_count > 1 ? ' (' + connect_count + ')' : '');
};
const disconnectReason = ({ disconnect_reason }: MqttStatus) => {
@@ -77,36 +84,44 @@ const MqttStatusForm: FC = () => {
}
const renderConnectionStatus = () => {
if (data.connected) {
return (
<>
<ListItem>
<ListItemAvatar>
<Avatar>#</Avatar>
</ListItemAvatar>
<ListItemText primary="Client ID" secondary={data.client_id} />
</ListItem>
<Divider variant="inset" component="li" />
<ListItem>
<ListItemAvatar>
<Avatar sx={{ bgcolor: mqttPublishHighlight(data, theme) }}>
<SpeakerNotesOffIcon />
</Avatar>
</ListItemAvatar>
<ListItemText primary={'MQTT Publish ' + LL.ERRORS()} secondary={data.mqtt_fails} />
</ListItem>
</>
);
}
return (
<>
{!data.connected && (
<>
<ListItem>
<ListItemAvatar>
<Avatar>
<ReportIcon />
</Avatar>
</ListItemAvatar>
<ListItemText primary={LL.DISCONNECT_REASON()} secondary={disconnectReason(data)} />
</ListItem>
<Divider variant="inset" component="li" />
</>
)}
<ListItem>
<ListItemAvatar>
<Avatar>
<ReportIcon />
<Avatar>#</Avatar>
</ListItemAvatar>
<ListItemText primary="Client ID" secondary={data.client_id} />
</ListItem>
<Divider variant="inset" component="li" />
<ListItem>
<ListItemAvatar>
<Avatar sx={{ bgcolor: mqttQueueHighlight(data, theme) }}>
<AutoAwesomeMotionIcon />
</Avatar>
</ListItemAvatar>
<ListItemText primary={LL.DISCONNECT_REASON()} secondary={disconnectReason(data)} />
<ListItemText primary="MQTT Queue" secondary={data.mqtt_queued} />
</ListItem>
<Divider variant="inset" component="li" />
<ListItem>
<ListItemAvatar>
<Avatar sx={{ bgcolor: mqttPublishHighlight(data, theme) }}>
<SpeakerNotesOffIcon />
</Avatar>
</ListItemAvatar>
<ListItemText primary={'MQTT ' + LL.ERRORS()} secondary={data.mqtt_fails} />
</ListItem>
<Divider variant="inset" component="li" />
</>

2
interface/src/project/DashboardData.tsx
View File

@@ -508,7 +508,7 @@ const DashboardData: FC = () => {
<ValidatedTextField
name="v"
label={deviceValue.id.slice(2)}
value={deviceValue.u ? numberValue(deviceValue.v) : deviceValue.v}
value={typeof deviceValue.v === 'number' ? Math.round(deviceValue.v * 10) / 10 : deviceValue.v}
autoFocus
multiline={deviceValue.u ? false : true}
sx={{ width: '30ch' }}

20
interface/src/project/SettingsCustomization.tsx
View File

@@ -165,17 +165,21 @@ const SettingsCustomization: FC = () => {
}
function formatName(de: DeviceEntity) {
if (de.n === undefined || de.n === de.id) {
return de.id;
}
if (de.n[0] === '!') {
return LL.COMMAND() + ': ' + de.n.slice(1);
if (de.n === undefined) {
return (
<>
(
<Link target="_blank" href={APIURL + devices?.devices[selectedDevice].t + '/' + de.id}>
{de.id}
</Link>
)
</>
);
}
return (
<>
{de.cn !== undefined && de.cn !== '' ? de.cn : de.n}
{de.n[0] === '!' ? LL.COMMAND() + ': ' + de.n.slice(1) : de.cn !== undefined && de.cn !== '' ? de.cn : de.n}
&nbsp;(
<Link target="_blank" href={APIURL + devices?.devices[selectedDevice].t + '/' + de.id}>
{de.id}
@@ -324,7 +328,7 @@ const SettingsCustomization: FC = () => {
};
const editEntity = (de: DeviceEntity) => {
if (de.n && de.n[0] === '!') {
if (de.n === undefined || (de.n && de.n[0] === '!')) {
return;
}

2
interface/src/types/mqtt.ts
View File

@@ -15,6 +15,8 @@ export interface MqttStatus {
client_id: string;
disconnect_reason: MqttDisconnectReason;
mqtt_fails: number;
mqtt_queued: number;
connect_count: number;
}
export interface MqttSettings {