andry/EMS-ESP32
1
0
Fork 0
mirror of https://github.com/emsesp/EMS-ESP32.git synced 2025-12-07 08:19:52 +03:00
Code Issues Packages Projects Releases Wiki Activity

alova implementation, testing

Browse Source
This commit is contained in:
proddy
2023-06-04 15:22:09 +02:00
parent 02c386d76f
commit 2e63d60273
11 changed files with 280 additions and 144 deletions
Download Patch File Download Diff File Expand all files Collapse all files

135
interface/src/project/DashboardDevices.tsx
View File

@@ -30,6 +30,7 @@ import { useRowSelect } from '@table-library/react-table-library/select';
import { useSort, SortToggleType } from '@table-library/react-table-library/sort';
import { Table, Header, HeaderRow, HeaderCell, Body, Row, Cell } from '@table-library/react-table-library/table';
import { useTheme } from '@table-library/react-table-library/theme';
import { useRequest } from 'alova';
import { useState, useContext, useEffect, useCallback, useLayoutEffect } from 'react';
import { IconContext } from 'react-icons';
@@ -54,17 +55,45 @@ const DashboardDevices: FC = () => {
const [size, setSize] = useState([0, 0]);
const { me } = useContext(AuthenticatedContext);
const { LL } = useI18nContext();
const [deviceData, setDeviceData] = useState<DeviceData>({ data: [] });
const [selectedDeviceValue, setSelectedDeviceValue] = useState<DeviceValue>();
const [onlyFav, setOnlyFav] = useState(false);
const [deviceValueDialogOpen, setDeviceValueDialogOpen] = useState(false);
const [showDeviceInfo, setShowDeviceInfo] = useState<boolean>(false);
const [selectedDevice, setSelectedDevice] = useState<number>();
const [coreData, setCoreData] = useState<CoreData>({
connected: true,
devices: []
// TODO remove
// const [deviceData, setDeviceData] = useState<DeviceData>({ data: [] });
// const [coreData, setCoreData] = useState<CoreData>({
// connected: true,
// devices: []
// });
const { data: coreData, send: readCoreData } = useRequest(() => EMSESP.readCoreData(), {
initialData: {
connected: true,
devices: []
},
force: true,
immediate: false
});
// TODO prevent firing when page is loaded
const { data: deviceData, send: readDeviceData } = useRequest((id) => EMSESP.readDeviceData(id), {
initialData: {
data: []
},
force: true,
immediate: false
});
// TODO prevent firing when page is loaded
const { loading: submitting, send: writeDeviceValue } = useRequest(
(id: number, deviceValue: DeviceValue) => EMSESP.writeDeviceValue(id, deviceValue),
{
immediate: false
}
);
useLayoutEffect(() => {
function updateSize() {
setSize([window.innerWidth, window.innerHeight]);
@@ -212,19 +241,21 @@ const DashboardDevices: FC = () => {
}
);
const fetchDeviceData = async (id: number) => {
try {
setDeviceData((await EMSESP.readDeviceData({ id })).data);
} catch (error) {
toast.error(extractErrorMessage(error, LL.PROBLEM_LOADING()));
}
};
// TODO remove
// const fetchDeviceData = async (id: number) => {
// try {
// setDeviceData((await EMSESP.readDeviceData({ id })).data);
// } catch (error) {
// toast.error(extractErrorMessage(error, LL.PROBLEM_LOADING()));
// }
// };
function onSelectChange(action: any, state: any) {
setDeviceData({ data: [] });
async function onSelectChange(action: any, state: any) {
// TODO check if still needed
// setDeviceData({ data: [] });
setSelectedDevice(state.id);
if (action.type === 'ADD_BY_ID_EXCLUSIVELY') {
void fetchDeviceData(state.id);
await readDeviceData(state.id);
}
}
@@ -257,27 +288,29 @@ const DashboardDevices: FC = () => {
};
}, [escFunction]);
const fetchCoreData = useCallback(async () => {
try {
setSelectedDevice(undefined);
setCoreData((await EMSESP.readCoreData()).data);
} catch (error) {
toast.error(extractErrorMessage(error, LL.PROBLEM_LOADING()));
}
}, [LL]);
// TODO remove
// const fetchCoreData = useCallback(async () => {
// try {
// setSelectedDevice(undefined);
// setCoreData((await EMSESP.readCoreData()).data);
// } catch (error) {
// toast.error(extractErrorMessage(error, LL.PROBLEM_LOADING()));
// }
// }, [LL]);
useEffect(() => {
void fetchCoreData();
}, [fetchCoreData]);
// TODO remove
// useEffect(() => {
// void fetchCoreData2();
// }, [fetchCoreData2]);
const refreshData = () => {
if (deviceValueDialogOpen) {
return;
}
if (selectedDevice) {
void fetchDeviceData(selectedDevice);
void readDeviceData(selectedDevice);
} else {
void fetchCoreData();
void readCoreData();
}
};
@@ -348,25 +381,32 @@ const DashboardDevices: FC = () => {
const deviceValueDialogSave = async (dv: DeviceValue) => {
const selectedDeviceID = Number(device_select.state.id);
try {
const response = await EMSESP.writeDeviceValue({
id: selectedDeviceID,
devicevalue: dv
});
if (response.status === 204) {
toast.error(LL.WRITE_CMD_FAILED());
} else if (response.status === 403) {
toast.error(LL.ACCESS_DENIED());
} else {
toast.success(LL.WRITE_CMD_SENT());
}
} catch (error) {
toast.error(extractErrorMessage(error, LL.PROBLEM_UPDATING()));
} finally {
setDeviceValueDialogOpen(false);
await fetchDeviceData(selectedDeviceID);
setSelectedDeviceValue(undefined);
}
// TODO For all Push, do error handling?
const response = await writeDeviceValue(selectedDeviceID, dv);
console.log(response);
setDeviceValueDialogOpen(false);
await readDeviceData(selectedDeviceID);
setSelectedDeviceValue(undefined);
// try {
// const response = await EMSESP.writeDeviceValue({
// id: selectedDeviceID,
// devicevalue: dv
// });
// if (response.status === 204) {
// toast.error(LL.WRITE_CMD_FAILED());
// } else if (response.status === 403) {
// toast.error(LL.ACCESS_DENIED());
// } else {
// toast.success(LL.WRITE_CMD_SENT());
// }
// } catch (error) {
// toast.error(extractErrorMessage(error, LL.PROBLEM_UPDATING()));
// } finally {
// setDeviceValueDialogOpen(false);
// await readDeviceData(selectedDeviceID);
// setSelectedDeviceValue(undefined);
// }
};
const renderDeviceDetails = () => {
@@ -457,7 +497,7 @@ const DashboardDevices: FC = () => {
};
const renderDeviceData = () => {
if (!selectedDevice) {
if (!selectedDevice || deviceData.data === undefined) {
return;
}
@@ -612,6 +652,7 @@ const DashboardDevices: FC = () => {
!hasMask(selectedDeviceValue.id, DeviceEntityMask.DV_READONLY)
}
validator={deviceValueItemValidation(selectedDeviceValue)}
progress={submitting}
/>
)}
<ButtonRow>

32
interface/src/project/DashboardDevicesDialog.tsx
View File

@@ -13,8 +13,10 @@ import {
FormHelperText,
Grid,
Box,
Typography
Typography,
CircularProgress
} from '@mui/material';
import { green } from '@mui/material/colors';
import { useState, useEffect } from 'react';
import { DeviceValueUOM, DeviceValueUOM_s } from './types';
@@ -22,7 +24,7 @@ import type { DeviceValue } from './types';
import type Schema from 'async-validator';
import type { ValidateFieldsError } from 'async-validator';
import { ValidatedTextField } from 'components';
import { ButtonRow, ValidatedTextField } from 'components';
import { useI18nContext } from 'i18n/i18n-react';
import { updateValue } from 'utils';
@@ -35,6 +37,7 @@ type DashboardDevicesDialogProps = {
selectedItem: DeviceValue;
writeable: boolean;
validator: Schema;
progress: boolean;
};
const DashboarDevicesDialog = ({
@@ -43,7 +46,8 @@ const DashboarDevicesDialog = ({
onSave,
selectedItem,
writeable,
validator
validator,
progress
}: DashboardDevicesDialogProps) => {
const { LL } = useI18nContext();
const [editItem, setEditItem] = useState<DeviceValue>(selectedItem);
@@ -184,14 +188,32 @@ const DashboarDevicesDialog = ({
<DialogActions>
{writeable ? (
<>
<Box
sx={{
'& button, & a, & .MuiCard-root': {
mx: 0.6
},
position: 'relative'
}}
>
<Button startIcon={<CancelIcon />} variant="outlined" onClick={close} color="secondary">
{LL.CANCEL()}
</Button>
<Button startIcon={<WarningIcon color="warning" />} variant="contained" onClick={save} color="info">
{selectedItem.v === '' && selectedItem.c ? LL.EXECUTE() : LL.UPDATE()}
</Button>
</>
{progress && (
<CircularProgress
size={24}
sx={{
color: green[500],
position: 'absolute',
right: '20%',
marginTop: '6px'
}}
/>
)}
</Box>
) : (
<Button variant="outlined" onClick={close} color="secondary">
{LL.CLOSE()}

45
interface/src/project/api.ts
View File

@@ -1,3 +1,4 @@
import { unpack } from '../api/unpack';
import type {
BoardProfile,
BoardProfileName,
@@ -15,10 +16,28 @@ import type {
WriteAnalogSensor,
SensorData,
Schedule,
Entities
Entities,
DeviceValue
} from './types';
import type { AxiosPromise } from 'axios';
import { AXIOS, AXIOS_API, AXIOS_BIN } from 'api/endpoints';
import { AXIOS, AXIOS_API, AXIOS_BIN, alovaInstance } from 'api/endpoints';
export const readCoreData = () => alovaInstance.Get<CoreData>(`/coreData`);
// uses msgpack
export const readDeviceData = (id: number) =>
alovaInstance.Get<DeviceData>('/deviceData', {
params: { id },
responseType: 'arraybuffer',
transformData(data) {
return unpack(data);
}
});
export const writeDeviceValue = (id: number, devicevalue: DeviceValue) =>
alovaInstance.Post('/writeDeviceValue', { id, devicevalue });
// TODO to change to alova
export function restart(): AxiosPromise<void> {
return AXIOS.post('/restart');
@@ -29,9 +48,10 @@ export function readSettings(): AxiosPromise<Settings> {
}
export function writeSettings(settings: Settings): AxiosPromise<Settings> {
return AXIOS.post('/settings', settings);
return AXIOS.post('/settings', settings); // call command
}
// TODO change to GET
export function getBoardProfile(boardProfile: BoardProfileName): AxiosPromise<BoardProfile> {
return AXIOS.post('/boardProfile', boardProfile);
}
@@ -40,26 +60,19 @@ export function readStatus(): AxiosPromise<Status> {
return AXIOS.get('/status');
}
export function readCoreData(): AxiosPromise<CoreData> {
return AXIOS.get('/coreData');
}
export function readDevices(): AxiosPromise<Devices> {
return AXIOS.get('/devices');
}
export function scanDevices(): AxiosPromise<void> {
return AXIOS.post('/scanDevices');
}
export function readDeviceData(unique_id: UniqueID): AxiosPromise<DeviceData> {
return AXIOS_BIN.post('/deviceData', unique_id);
return AXIOS.post('/scanDevices'); // call command
}
export function readSensorData(): AxiosPromise<SensorData> {
return AXIOS.get('/sensorData');
}
// TODO change to GET
export function readDeviceEntities(unique_id: UniqueID): AxiosPromise<DeviceEntity[]> {
return AXIOS_BIN.post('/deviceEntities', unique_id);
}
@@ -68,10 +81,6 @@ export function writeCustomEntities(customEntities: CustomEntities): AxiosPromis
return AXIOS.post('/customEntities', customEntities);
}
export function writeDeviceValue(dv: WriteDeviceValue): AxiosPromise<void> {
return AXIOS.post('/writeDeviceValue', dv);
}
export function writeTemperatureSensor(ts: WriteTemperatureSensor): AxiosPromise<void> {
return AXIOS.post('/writeTemperatureSensor', ts);
}
@@ -81,11 +90,11 @@ export function writeAnalogSensor(as: WriteAnalogSensor): AxiosPromise<void> {
}
export function resetCustomizations(): AxiosPromise<void> {
return AXIOS.post('/resetCustomizations');
return AXIOS.post('/resetCustomizations'); // command
}
export function API(apiCall: APIcall): AxiosPromise<void> {
return AXIOS_API.post('/', apiCall);
return AXIOS_API.post('/', apiCall); // command
}
export function getSettings(): AxiosPromise<void> {

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

@@ -156,6 +156,7 @@ export interface CustomEntities {
entity_ids: string[];
}
// TODO can be removed?
export interface UniqueID {
id: number;
}
@@ -279,6 +280,7 @@ export interface APIcall {
id: any;
}
// TODO can be removed?
export interface WriteDeviceValue {
id: number;
devicevalue: DeviceValue;