jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-23 17:26:42 +00:00
Code Issues Packages Projects Releases Wiki Activity

Set default value when enabling optional value (#10247)

Browse Source
This commit is contained in:
Bram Kragten 2021-10-20 06:45:41 +02:00 committed by GitHub
parent 9a4cce74f0
commit 760ead4860
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 37 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/ha-selector/ha-selector-boolean.ts
View File

@ -16,7 +16,7 @@ export class HaBooleanSelector extends LitElement {
@property({ type: Boolean }) public disabled = false; @property({ type: Boolean }) public disabled = false;
protected render() { protected render() {
return html` <ha-formfield alignEnd spaceBetween .label=${this.label}> return html`<ha-formfield alignEnd spaceBetween .label=${this.label}>
<ha-switch <ha-switch
.checked=${this.value} .checked=${this.value}
@change=${this._handleChange} @change=${this._handleChange}

54
src/components/ha-service-control.ts
View File

@ -25,6 +25,11 @@ import "./ha-settings-row";
import "./ha-yaml-editor"; import "./ha-yaml-editor";
import type { HaYamlEditor } from "./ha-yaml-editor"; import type { HaYamlEditor } from "./ha-yaml-editor";
const showOptionalToggle = (field) =>
field.selector &&
!field.required &&
!("boolean" in field.selector && field.default);
interface ExtHassService extends Omit<HassService, "fields"> { interface ExtHassService extends Omit<HassService, "fields"> {
fields: { fields: {
key: string; key: string;
@ -186,7 +191,7 @@ export class HaServiceControl extends LitElement {
const hasOptional = Boolean( const hasOptional = Boolean(
!shouldRenderServiceDataYaml && !shouldRenderServiceDataYaml &&
serviceData?.fields.some((field) => field.selector && !field.required) serviceData?.fields.some((field) => showOptionalToggle(field))
); );
return html`<ha-service-picker return html`<ha-service-picker
@ -253,14 +258,15 @@ export class HaServiceControl extends LitElement {
.defaultValue=${this._value?.data} .defaultValue=${this._value?.data}
@value-changed=${this._dataChanged} @value-changed=${this._dataChanged}
></ha-yaml-editor>` ></ha-yaml-editor>`
: serviceData?.fields.map((dataField) => : serviceData?.fields.map((dataField) => {
dataField.selector && const showOptional = showOptionalToggle(dataField);
(!dataField.advanced || return dataField.selector &&
this.showAdvanced || (!dataField.advanced ||
(this._value?.data && this.showAdvanced ||
this._value.data[dataField.key] !== undefined)) (this._value?.data &&
this._value.data[dataField.key] !== undefined))
? html`<ha-settings-row .narrow=${this.narrow}> ? html`<ha-settings-row .narrow=${this.narrow}>
${dataField.required ${!showOptional
? hasOptional ? hasOptional
? html`<div slot="prefix" class="checkbox-spacer"></div>` ? html`<div slot="prefix" class="checkbox-spacer"></div>`
: "" : ""
@ -273,9 +279,9 @@ export class HaServiceControl extends LitElement {
slot="prefix" slot="prefix"
></ha-checkbox>`} ></ha-checkbox>`}
<span slot="heading">${dataField.name || dataField.key}</span> <span slot="heading">${dataField.name || dataField.key}</span>
<span slot="description">${dataField?.description}</span <span slot="description">${dataField?.description}</span>
><ha-selector <ha-selector
.disabled=${!dataField.required && .disabled=${showOptional &&
!this._checkedKeys.has(dataField.key) && !this._checkedKeys.has(dataField.key) &&
(!this._value?.data || (!this._value?.data ||
this._value.data[dataField.key] === undefined)} this._value.data[dataField.key] === undefined)}
@ -287,23 +293,35 @@ export class HaServiceControl extends LitElement {
this._value.data[dataField.key] !== undefined this._value.data[dataField.key] !== undefined
? this._value.data[dataField.key] ? this._value.data[dataField.key]
: dataField.default} : dataField.default}
></ha-selector ></ha-selector>
></ha-settings-row>` </ha-settings-row>`
: "" : "";
)} `; })}`;
} }
private _checkboxChanged(ev) { private _checkboxChanged(ev) {
const checked = ev.currentTarget.checked; const checked = ev.currentTarget.checked;
const key = ev.currentTarget.key; const key = ev.currentTarget.key;
let data;
if (checked) { if (checked) {
this._checkedKeys.add(key); this._checkedKeys.add(key);
const defaultValue = this._getServiceInfo(
this._value?.service,
this.hass.services
)?.fields.find((field) => field.key === key)?.default;
if (defaultValue) {
data = {
...this._value?.data,
[key]: defaultValue,
};
}
} else { } else {
this._checkedKeys.delete(key); this._checkedKeys.delete(key);
const data = { ...this._value?.data }; data = { ...this._value?.data };
delete data[key]; delete data[key];
}
if (data) {
fireEvent(this, "value-changed", { fireEvent(this, "value-changed", {
value: { value: {
...this._value, ...this._value,