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

Change name of entity within WebUI #612

Browse Source
This commit is contained in:
proddy
2022-09-09 12:33:15 +02:00
parent 70f94322ee
commit df4aa64883
9 changed files with 115 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
interface/src/i18n/en/index.ts
View File

@@ -253,7 +253,8 @@ const en: BaseTranslation = {
NETWORK_ENABLE_IPV6: 'Enable IPv6 support', NETWORK_ENABLE_IPV6: 'Enable IPv6 support',
NETWORK_FIXED_IP: 'Use Fixed IP address', NETWORK_FIXED_IP: 'Use Fixed IP address',
ADMIN: 'Admin', ADMIN: 'Admin',
GUEST: 'Guest' GUEST: 'Guest',
NEW: 'New'
}; };
export default en; export default en;

8
interface/src/i18n/i18n-types.ts
View File

@@ -1004,6 +1004,10 @@ type RootTranslation = {
* Guest * Guest
*/ */
GUEST: string GUEST: string
/**
* New
*/
NEW: string
} }
export type TranslationFunctions = { export type TranslationFunctions = {
@@ -1985,6 +1989,10 @@ export type TranslationFunctions = {
* Guest * Guest
*/ */
GUEST: () => LocalizedString GUEST: () => LocalizedString
/**
* New
*/
NEW: () => LocalizedString
} }
export type Formatters = {} export type Formatters = {}

3
interface/src/i18n/nl/index.ts
View File

@@ -253,7 +253,8 @@ const nl: BaseTranslation = {
NETWORK_ENABLE_IPV6: 'Activeer IPv6 support', NETWORK_ENABLE_IPV6: 'Activeer IPv6 support',
NETWORK_FIXED_IP: 'Gebruik vast IP addres', NETWORK_FIXED_IP: 'Gebruik vast IP addres',
ADMIN: 'Admin', ADMIN: 'Admin',
GUEST: 'Gast' GUEST: 'Gast',
NEW: 'Nieuwe'
}; };
export default nl; export default nl;

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

@@ -40,7 +40,7 @@ import { ButtonRow, FormLoader, ValidatedTextField, SectionContent } from '../co
import * as EMSESP from './api'; import * as EMSESP from './api';
import { extractErrorMessage } from '../utils'; import { extractErrorMessage, updateValue } from '../utils';
import { DeviceShort, Devices, DeviceEntity, DeviceEntityMask } from './types'; import { DeviceShort, Devices, DeviceEntity, DeviceEntityMask } from './types';
@@ -57,6 +57,9 @@ const SettingsCustomization: FC = () => {
const [devices, setDevices] = useState<Devices>(); const [devices, setDevices] = useState<Devices>();
const [errorMessage, setErrorMessage] = useState<string>(); const [errorMessage, setErrorMessage] = useState<string>();
const [selectedDevice, setSelectedDevice] = useState<number>(-1); const [selectedDevice, setSelectedDevice] = useState<number>(-1);
const [selectedEntity, setSelectedEntity] = useState<DeviceEntity>();
const [confirmReset, setConfirmReset] = useState<boolean>(false); const [confirmReset, setConfirmReset] = useState<boolean>(false);
const [selectedFilters, setSelectedFilters] = useState<number>(0); const [selectedFilters, setSelectedFilters] = useState<number>(0);
const [search, setSearch] = useState(''); const [search, setSearch] = useState('');
@@ -96,6 +99,7 @@ const SettingsCustomization: FC = () => {
Row: ` Row: `
background-color: #1e1e1e; background-color: #1e1e1e;
position: relative; position: relative;
cursor: pointer;
.td { .td {
border-top: 1px solid #565656; border-top: 1px solid #565656;
@@ -108,6 +112,11 @@ const SettingsCustomization: FC = () => {
font-weight: normal; font-weight: normal;
} }
&:hover .td {
border-top: 1px solid #177ac9;
border-bottom: 1px solid #177ac9;
}
&:nth-of-type(odd) .td { &:nth-of-type(odd) .td {
background-color: #303030; background-color: #303030;
} }
@@ -329,6 +338,19 @@ const SettingsCustomization: FC = () => {
); );
}; };
const editEntity = (de: DeviceEntity) => {
if (de.n) {
setSelectedEntity(de);
console.log(de.n); // TODO
}
};
const updateEntity = () => {
if (selectedEntity) {
setSelectedEntity(undefined); // TODO
}
};
const renderDeviceData = () => { const renderDeviceData = () => {
if (devices?.devices.length === 0 || deviceEntities[0].id === '') { if (devices?.devices.length === 0 || deviceEntities[0].id === '') {
return; return;
@@ -444,7 +466,7 @@ const SettingsCustomization: FC = () => {
</Header> </Header>
<Body> <Body>
{tableList.map((de: DeviceEntity) => ( {tableList.map((de: DeviceEntity) => (
<Row key={de.id} item={de}> <Row key={de.id} item={de} onClick={() => editEntity(de)}>
<Cell stiff> <Cell stiff>
<ToggleButtonGroup <ToggleButtonGroup
size="small" size="small"
@@ -554,8 +576,55 @@ const SettingsCustomization: FC = () => {
); );
}; };
const renderEditEntity = () => {
if (selectedEntity) {
return (
<Dialog open={selectedEntity !== undefined} onClose={() => setSelectedEntity(undefined)}>
<DialogTitle>Rename Entity</DialogTitle>
<DialogContent dividers>
<Box color="warning.main" p={0} pl={0} pr={0} mt={0} mb={2}>
<Typography variant="body2">{selectedEntity.n}</Typography>
</Box>
<Grid container spacing={1}>
<Grid item>
<ValidatedTextField
name="cn"
label={LL.NEW() + ' ' + LL.ENTITY_NAME()}
value={selectedEntity.cn}
autoFocus
sx={{ width: '30ch' }}
onChange={updateValue(setSelectedEntity)}
/>
</Grid>
</Grid>
</DialogContent>
<DialogActions>
<Button
startIcon={<CancelIcon />}
variant="outlined"
onClick={() => setSelectedEntity(undefined)}
color="secondary"
>
{LL.CANCEL()}
</Button>
<Button
startIcon={<SaveIcon />}
variant="outlined"
type="submit"
onClick={() => updateEntity()}
color="warning"
>
{LL.SAVE()}
</Button>
</DialogActions>
</Dialog>
);
}
};
return ( return (
<SectionContent title={LL.USER_CUSTOMIZATION()} titleGutter> <SectionContent title={LL.USER_CUSTOMIZATION()} titleGutter>
{renderEditEntity()}
{content()} {content()}
</SectionContent> </SectionContent>
); );

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

@@ -137,6 +137,7 @@ export interface DeviceEntity {
id: string; // shortname id: string; // shortname
v?: any; // value, in any format, optional v?: any; // value, in any format, optional
n?: string; // fullname, optional n?: string; // fullname, optional
cn?: string; // custom fullname, optional
m: number; // mask m: number; // mask
om?: number; // original mask before edits om?: number; // original mask before edits
w: boolean; // writeable w: boolean; // writeable

20
mock-api/server.js
View File

@@ -598,19 +598,13 @@ const emsesp_deviceentities_1 = [
// m: 0, // m: 0,
// w: false, // w: false,
// }, // },
{ // {
v: 'roomTemp', // v: 18.2,
id: 'hc1/HA climate config creation', // n: 'hc1 selected room temperature',
m: 0, // id: 'hc1/seltemp',
w: false, // m: 0,
}, // w: true,
{ // },
v: 18.2,
n: 'hc1 selected room temperature',
id: 'hc1/seltemp',
m: 0,
w: true,
},
{ {
v: 22.6, v: 22.6,
n: 'hc1 current room temperature', n: 'hc1 current room temperature',

8
src/emsdevice.cpp
View File

@@ -449,8 +449,14 @@ void EMSdevice::add_device_value(uint8_t tag,
} }
}); });
// TODO
const __FlashStringHelper * custom_fullname;
custom_fullname = nullptr;
// add the device entity // add the device entity
devicevalues_.emplace_back(device_type_, tag, value_p, type, options, options_single, numeric_operator, short_name, fullname, uom, has_cmd, min, max, state); devicevalues_.emplace_back(
device_type_, tag, value_p, type, options, options_single, numeric_operator, short_name, fullname, custom_fullname, uom, has_cmd, min, max, state);
// add a new command if it has a function attached // add a new command if it has a function attached
if (!has_cmd) { if (!has_cmd) {

2
src/emsdevicevalue.cpp
View File

@@ -32,6 +32,7 @@ DeviceValue::DeviceValue(uint8_t device_type,
int8_t numeric_operator, int8_t numeric_operator,
const __FlashStringHelper * const short_name, const __FlashStringHelper * const short_name,
const __FlashStringHelper * const * fullname, const __FlashStringHelper * const * fullname,
const __FlashStringHelper * const custom_fullname,
uint8_t uom, uint8_t uom,
bool has_cmd, bool has_cmd,
int16_t min, int16_t min,
@@ -46,6 +47,7 @@ DeviceValue::DeviceValue(uint8_t device_type,
, numeric_operator(numeric_operator) , numeric_operator(numeric_operator)
, short_name(short_name) , short_name(short_name)
, fullname(fullname) , fullname(fullname)
, custom_fullname(custom_fullname)
, uom(uom) , uom(uom)
, has_cmd(has_cmd) , has_cmd(has_cmd)
, min(min) , min(min)

2
src/emsdevicevalue.h
View File

@@ -153,6 +153,7 @@ class DeviceValue {
uint8_t options_size; // number of options in the char array, calculated uint8_t options_size; // number of options in the char array, calculated
const __FlashStringHelper * const short_name; // used in MQTT and API const __FlashStringHelper * const short_name; // used in MQTT and API
const __FlashStringHelper * const * fullname; // used in Web and Console, is translated const __FlashStringHelper * const * fullname; // used in Web and Console, is translated
const __FlashStringHelper * const custom_fullname; // optional, from customization
uint8_t uom; // DeviceValueUOM::* uint8_t uom; // DeviceValueUOM::*
bool has_cmd; // true if there is a Console/MQTT command which matches the short_name bool has_cmd; // true if there is a Console/MQTT command which matches the short_name
int16_t min; // min range int16_t min; // min range
@@ -168,6 +169,7 @@ class DeviceValue {
int8_t numeric_operator, int8_t numeric_operator,
const __FlashStringHelper * const short_name, const __FlashStringHelper * const short_name,
const __FlashStringHelper * const * fullname, const __FlashStringHelper * const * fullname,
const __FlashStringHelper * const custom_fullname,
uint8_t uom, uint8_t uom,
bool has_cmd, bool has_cmd,
int16_t min, int16_t min,