mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-25 02:06:42 +00:00
Show feedback for setting Z-Wave JS config parameters (#8956)
This commit is contained in:
parent
33703a3b53
commit
73bb346c00
@ -29,6 +29,10 @@ export interface ZWaveJSNode {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export interface ZWaveJSNodeConfigParams {
|
export interface ZWaveJSNodeConfigParams {
|
||||||
|
[key: string]: ZWaveJSNodeConfigParam;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface ZWaveJSNodeConfigParam {
|
||||||
property: number;
|
property: number;
|
||||||
value: any;
|
value: any;
|
||||||
configuration_value_type: string;
|
configuration_value_type: string;
|
||||||
@ -56,6 +60,12 @@ export interface ZWaveJSSetConfigParamData {
|
|||||||
value: string | number;
|
value: string | number;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export interface ZWaveJSSetConfigParamResult {
|
||||||
|
value_id?: string;
|
||||||
|
status?: string;
|
||||||
|
error?: string;
|
||||||
|
}
|
||||||
|
|
||||||
export interface ZWaveJSDataCollectionStatus {
|
export interface ZWaveJSDataCollectionStatus {
|
||||||
enabled: boolean;
|
enabled: boolean;
|
||||||
opted_in: boolean;
|
opted_in: boolean;
|
||||||
@ -115,7 +125,7 @@ export const fetchNodeConfigParameters = (
|
|||||||
hass: HomeAssistant,
|
hass: HomeAssistant,
|
||||||
entry_id: string,
|
entry_id: string,
|
||||||
node_id: number
|
node_id: number
|
||||||
): Promise<ZWaveJSNodeConfigParams[]> =>
|
): Promise<ZWaveJSNodeConfigParams> =>
|
||||||
hass.callWS({
|
hass.callWS({
|
||||||
type: "zwave_js/get_config_parameters",
|
type: "zwave_js/get_config_parameters",
|
||||||
entry_id,
|
entry_id,
|
||||||
@ -129,7 +139,7 @@ export const setNodeConfigParameter = (
|
|||||||
property: number,
|
property: number,
|
||||||
value: number,
|
value: number,
|
||||||
property_key?: number
|
property_key?: number
|
||||||
): Promise<unknown> => {
|
): Promise<ZWaveJSSetConfigParamResult> => {
|
||||||
const data: ZWaveJSSetConfigParamData = {
|
const data: ZWaveJSSetConfigParamData = {
|
||||||
type: "zwave_js/set_config_parameter",
|
type: "zwave_js/set_config_parameter",
|
||||||
entry_id,
|
entry_id,
|
||||||
|
@ -1,3 +1,9 @@
|
|||||||
|
import {
|
||||||
|
mdiCheckCircle,
|
||||||
|
mdiCircle,
|
||||||
|
mdiProgressClock,
|
||||||
|
mdiCloseCircle,
|
||||||
|
} from "@mdi/js";
|
||||||
import "../../../../../components/ha-settings-row";
|
import "../../../../../components/ha-settings-row";
|
||||||
import "@polymer/paper-item/paper-item";
|
import "@polymer/paper-item/paper-item";
|
||||||
import "@polymer/paper-listbox/paper-listbox";
|
import "@polymer/paper-listbox/paper-listbox";
|
||||||
@ -24,6 +30,7 @@ import {
|
|||||||
fetchNodeConfigParameters,
|
fetchNodeConfigParameters,
|
||||||
setNodeConfigParameter,
|
setNodeConfigParameter,
|
||||||
ZWaveJSNodeConfigParams,
|
ZWaveJSNodeConfigParams,
|
||||||
|
ZWaveJSSetConfigParamResult,
|
||||||
} from "../../../../../data/zwave_js";
|
} from "../../../../../data/zwave_js";
|
||||||
import "../../../../../layouts/hass-tabs-subpage";
|
import "../../../../../layouts/hass-tabs-subpage";
|
||||||
import { haStyle } from "../../../../../resources/styles";
|
import { haStyle } from "../../../../../resources/styles";
|
||||||
@ -38,6 +45,13 @@ import {
|
|||||||
import { SubscribeMixin } from "../../../../../mixins/subscribe-mixin";
|
import { SubscribeMixin } from "../../../../../mixins/subscribe-mixin";
|
||||||
import { UnsubscribeFunc } from "home-assistant-js-websocket";
|
import { UnsubscribeFunc } from "home-assistant-js-websocket";
|
||||||
import memoizeOne from "memoize-one";
|
import memoizeOne from "memoize-one";
|
||||||
|
import { classMap } from "lit-html/directives/class-map";
|
||||||
|
|
||||||
|
const icons = {
|
||||||
|
accepted: mdiCheckCircle,
|
||||||
|
queued: mdiProgressClock,
|
||||||
|
error: mdiCloseCircle,
|
||||||
|
};
|
||||||
|
|
||||||
const getDevice = memoizeOne(
|
const getDevice = memoizeOne(
|
||||||
(
|
(
|
||||||
@ -77,7 +91,12 @@ class ZWaveJSNodeConfig extends SubscribeMixin(LitElement) {
|
|||||||
@property({ type: Array })
|
@property({ type: Array })
|
||||||
private _deviceRegistryEntries?: DeviceRegistryEntry[];
|
private _deviceRegistryEntries?: DeviceRegistryEntry[];
|
||||||
|
|
||||||
@internalProperty() private _config?: ZWaveJSNodeConfigParams[];
|
@internalProperty() private _config?: ZWaveJSNodeConfigParams;
|
||||||
|
|
||||||
|
@internalProperty() private _results: Record<
|
||||||
|
string,
|
||||||
|
ZWaveJSSetConfigParamResult
|
||||||
|
> = {};
|
||||||
|
|
||||||
@internalProperty() private _error?: string;
|
@internalProperty() private _error?: string;
|
||||||
|
|
||||||
@ -178,6 +197,7 @@ class ZWaveJSNodeConfig extends SubscribeMixin(LitElement) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
private _generateConfigBox(id, item): TemplateResult {
|
private _generateConfigBox(id, item): TemplateResult {
|
||||||
|
const result = this._results[id];
|
||||||
const labelAndDescription = html`
|
const labelAndDescription = html`
|
||||||
<span slot="heading">${item.metadata.label}</span>
|
<span slot="heading">${item.metadata.label}</span>
|
||||||
<span slot="description">
|
<span slot="description">
|
||||||
@ -192,6 +212,26 @@ class ZWaveJSNodeConfig extends SubscribeMixin(LitElement) {
|
|||||||
)}
|
)}
|
||||||
</em>`
|
</em>`
|
||||||
: ""}
|
: ""}
|
||||||
|
${result?.status
|
||||||
|
? html` <p
|
||||||
|
class="result ${classMap({
|
||||||
|
[result.status]: true,
|
||||||
|
})}"
|
||||||
|
>
|
||||||
|
<ha-svg-icon
|
||||||
|
.path=${icons[result.status] ? icons[result.status] : mdiCircle}
|
||||||
|
class="result-icon"
|
||||||
|
slot="item-icon"
|
||||||
|
></ha-svg-icon>
|
||||||
|
${this.hass.localize(
|
||||||
|
"ui.panel.config.zwave_js.node_config.set_param_" +
|
||||||
|
result.status
|
||||||
|
)}
|
||||||
|
${result.status === "error" && result.error
|
||||||
|
? html` <br /><em>${result.error}</em> `
|
||||||
|
: ""}
|
||||||
|
</p>`
|
||||||
|
: ""}
|
||||||
</span>
|
</span>
|
||||||
`;
|
`;
|
||||||
|
|
||||||
@ -293,6 +333,7 @@ class ZWaveJSNodeConfig extends SubscribeMixin(LitElement) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
private _switchToggled(ev) {
|
private _switchToggled(ev) {
|
||||||
|
this.setResult(ev.target.key, undefined);
|
||||||
this._updateConfigParameter(ev.target, ev.target.checked ? 1 : 0);
|
this._updateConfigParameter(ev.target, ev.target.checked ? 1 : 0);
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -303,6 +344,7 @@ class ZWaveJSNodeConfig extends SubscribeMixin(LitElement) {
|
|||||||
if (this._config![ev.target.key].value === ev.target.selected) {
|
if (this._config![ev.target.key].value === ev.target.selected) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
this.setResult(ev.target.key, undefined);
|
||||||
|
|
||||||
this._updateConfigParameter(ev.target, Number(ev.target.selected));
|
this._updateConfigParameter(ev.target, Number(ev.target.selected));
|
||||||
}
|
}
|
||||||
@ -321,20 +363,41 @@ class ZWaveJSNodeConfig extends SubscribeMixin(LitElement) {
|
|||||||
if (Number(this._config![ev.target.key].value) === value) {
|
if (Number(this._config![ev.target.key].value) === value) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
this.setResult(ev.target.key, undefined);
|
||||||
this.debouncedUpdate(ev.target, value);
|
this.debouncedUpdate(ev.target, value);
|
||||||
}
|
}
|
||||||
|
|
||||||
private _updateConfigParameter(target, value) {
|
private async _updateConfigParameter(target, value) {
|
||||||
const nodeId = getNodeId(this._device!);
|
const nodeId = getNodeId(this._device!);
|
||||||
setNodeConfigParameter(
|
try {
|
||||||
this.hass,
|
const result = await setNodeConfigParameter(
|
||||||
this.configEntryId!,
|
this.hass,
|
||||||
nodeId!,
|
this.configEntryId!,
|
||||||
target.property,
|
nodeId!,
|
||||||
value,
|
target.property,
|
||||||
target.propertyKey ? target.propertyKey : undefined
|
value,
|
||||||
);
|
target.propertyKey ? target.propertyKey : undefined
|
||||||
this._config![target.key].value = value;
|
);
|
||||||
|
this._config![target.key].value = value;
|
||||||
|
|
||||||
|
this.setResult(target.key, result.status);
|
||||||
|
} catch (error) {
|
||||||
|
this.setError(target.key, error.message);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private setResult(key: string, value: string | undefined) {
|
||||||
|
if (value === undefined) {
|
||||||
|
delete this._results[key];
|
||||||
|
this.requestUpdate();
|
||||||
|
} else {
|
||||||
|
this._results = { ...this._results, [key]: { status: value } };
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private setError(key: string, message: string) {
|
||||||
|
const errorParam = { status: "error", error: message };
|
||||||
|
this._results = { ...this._results, [key]: errorParam };
|
||||||
}
|
}
|
||||||
|
|
||||||
private get _device(): DeviceRegistryEntry | undefined {
|
private get _device(): DeviceRegistryEntry | undefined {
|
||||||
@ -369,6 +432,18 @@ class ZWaveJSNodeConfig extends SubscribeMixin(LitElement) {
|
|||||||
return [
|
return [
|
||||||
haStyle,
|
haStyle,
|
||||||
css`
|
css`
|
||||||
|
.accepted {
|
||||||
|
color: var(--success-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
.queued {
|
||||||
|
color: var(--warning-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
.error {
|
||||||
|
color: var(--error-color);
|
||||||
|
}
|
||||||
|
|
||||||
.secondary {
|
.secondary {
|
||||||
color: var(--secondary-text-color);
|
color: var(--secondary-text-color);
|
||||||
}
|
}
|
||||||
|
@ -2606,7 +2606,10 @@
|
|||||||
"zwave_js_device_database": "Z-Wave JS Device Database",
|
"zwave_js_device_database": "Z-Wave JS Device Database",
|
||||||
"battery_device_notice": "Battery devices must be awake to update their config. Please refer to your device manual for instructions on how to wake the device.",
|
"battery_device_notice": "Battery devices must be awake to update their config. Please refer to your device manual for instructions on how to wake the device.",
|
||||||
"parameter_is_read_only": "This parameter is read-only.",
|
"parameter_is_read_only": "This parameter is read-only.",
|
||||||
"error_device_not_found": "Device not found"
|
"error_device_not_found": "Device not found",
|
||||||
|
"set_param_accepted": "The parameter has been updated.",
|
||||||
|
"set_param_queued": "The parameter change has been queued, and will be updated when the device wakes up.",
|
||||||
|
"set_param_error": "An error occurred."
|
||||||
},
|
},
|
||||||
"node_status": {
|
"node_status": {
|
||||||
"unknown": "Unknown",
|
"unknown": "Unknown",
|
||||||
|
Loading…
x
Reference in New Issue
Block a user