Change name of entity within WebUI #612

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

View File

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

View File

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

View File

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

View File

@@ -40,7 +40,7 @@ import { ButtonRow, FormLoader, ValidatedTextField, SectionContent } from '../co
import * as EMSESP from './api';
import { extractErrorMessage } from '../utils';
import { extractErrorMessage, updateValue } from '../utils';
import { DeviceShort, Devices, DeviceEntity, DeviceEntityMask } from './types';
@@ -57,6 +57,9 @@ const SettingsCustomization: FC = () => {
const [devices, setDevices] = useState<Devices>();
const [errorMessage, setErrorMessage] = useState<string>();
const [selectedDevice, setSelectedDevice] = useState<number>(-1);
const [selectedEntity, setSelectedEntity] = useState<DeviceEntity>();
const [confirmReset, setConfirmReset] = useState<boolean>(false);
const [selectedFilters, setSelectedFilters] = useState<number>(0);
const [search, setSearch] = useState('');
@@ -96,6 +99,7 @@ const SettingsCustomization: FC = () => {
Row: `
background-color: #1e1e1e;
position: relative;
cursor: pointer;
.td {
border-top: 1px solid #565656;
@@ -108,6 +112,11 @@ const SettingsCustomization: FC = () => {
font-weight: normal;
}
&:hover .td {
border-top: 1px solid #177ac9;
border-bottom: 1px solid #177ac9;
}
&:nth-of-type(odd) .td {
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 = () => {
if (devices?.devices.length === 0 || deviceEntities[0].id === '') {
return;
@@ -444,7 +466,7 @@ const SettingsCustomization: FC = () => {
</Header>
<Body>
{tableList.map((de: DeviceEntity) => (
<Row key={de.id} item={de}>
<Row key={de.id} item={de} onClick={() => editEntity(de)}>
<Cell stiff>
<ToggleButtonGroup
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 (
<SectionContent title={LL.USER_CUSTOMIZATION()} titleGutter>
{renderEditEntity()}
{content()}
</SectionContent>
);

View File

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

View File

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

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
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
if (!has_cmd) {

View File

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

View File

@@ -153,6 +153,7 @@ class DeviceValue {
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 * fullname; // used in Web and Console, is translated
const __FlashStringHelper * const custom_fullname; // optional, from customization
uint8_t uom; // DeviceValueUOM::*
bool has_cmd; // true if there is a Console/MQTT command which matches the short_name
int16_t min; // min range
@@ -168,6 +169,7 @@ class DeviceValue {
int8_t numeric_operator,
const __FlashStringHelper * const short_name,
const __FlashStringHelper * const * fullname,
const __FlashStringHelper * const custom_fullname,
uint8_t uom,
bool has_cmd,
int16_t min,