mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-11 11:26:35 +00:00
Update script editor (#8919)
This commit is contained in:
parent
1ce17e2847
commit
841c8ab1f1
@ -176,7 +176,11 @@ export class HaScriptEditor extends KeyboardShortcutMixin(LitElement) {
|
|||||||
${this.narrow
|
${this.narrow
|
||||||
? html` <span slot="header">${this._config?.alias}</span> `
|
? html` <span slot="header">${this._config?.alias}</span> `
|
||||||
: ""}
|
: ""}
|
||||||
<div class="content">
|
<div
|
||||||
|
class="content ${classMap({
|
||||||
|
"yaml-mode": this._mode === "yaml",
|
||||||
|
})}"
|
||||||
|
>
|
||||||
${this._errors
|
${this._errors
|
||||||
? html` <div class="errors">${this._errors}</div> `
|
? html` <div class="errors">${this._errors}</div> `
|
||||||
: ""}
|
: ""}
|
||||||
@ -350,44 +354,43 @@ export class HaScriptEditor extends KeyboardShortcutMixin(LitElement) {
|
|||||||
`
|
`
|
||||||
: this._mode === "yaml"
|
: this._mode === "yaml"
|
||||||
? html`
|
? html`
|
||||||
<ha-config-section vertical .isWide=${false}>
|
${!this.narrow
|
||||||
${!this.narrow
|
? html`
|
||||||
? html`<span slot="header">${this._config?.alias}</span>`
|
<ha-card
|
||||||
: ``}
|
><div class="card-header">
|
||||||
<ha-card>
|
${this._config?.alias}
|
||||||
<div class="card-content">
|
</div>
|
||||||
<ha-yaml-editor
|
<div
|
||||||
.defaultValue=${this._preprocessYaml()}
|
class="card-actions layout horizontal justified center"
|
||||||
@value-changed=${this._yamlChanged}
|
>
|
||||||
></ha-yaml-editor>
|
<mwc-button
|
||||||
<mwc-button @click=${this._copyYaml}>
|
@click=${this._runScript}
|
||||||
${this.hass.localize(
|
title="${this.hass.localize(
|
||||||
"ui.panel.config.automation.editor.copy_to_clipboard"
|
"ui.panel.config.script.picker.run_script"
|
||||||
)}
|
)}"
|
||||||
</mwc-button>
|
?disabled=${this._dirty}
|
||||||
</div>
|
|
||||||
${this.scriptEntityId
|
|
||||||
? html`
|
|
||||||
<div
|
|
||||||
class="card-actions layout horizontal justified center"
|
|
||||||
>
|
>
|
||||||
<span></span>
|
${this.hass.localize(
|
||||||
<mwc-button
|
"ui.panel.config.script.picker.run_script"
|
||||||
@click=${this._runScript}
|
)}
|
||||||
title="${this.hass.localize(
|
</mwc-button>
|
||||||
"ui.panel.config.script.picker.run_script"
|
</div>
|
||||||
)}"
|
</ha-card>
|
||||||
?disabled=${this._dirty}
|
`
|
||||||
>
|
: ``}
|
||||||
${this.hass.localize(
|
<ha-yaml-editor
|
||||||
"ui.panel.config.script.picker.run_script"
|
.defaultValue=${this._preprocessYaml()}
|
||||||
)}
|
@value-changed=${this._yamlChanged}
|
||||||
</mwc-button>
|
></ha-yaml-editor>
|
||||||
</div>
|
<ha-card
|
||||||
`
|
><div class="card-actions">
|
||||||
: ``}
|
<mwc-button @click=${this._copyYaml}>
|
||||||
</ha-card>
|
${this.hass.localize(
|
||||||
</ha-config-section>
|
"ui.panel.config.automation.editor.copy_to_clipboard"
|
||||||
|
)}
|
||||||
|
</mwc-button>
|
||||||
|
</div>
|
||||||
|
</ha-card>
|
||||||
`
|
`
|
||||||
: ``}
|
: ``}
|
||||||
</div>
|
</div>
|
||||||
@ -532,7 +535,12 @@ export class HaScriptEditor extends KeyboardShortcutMixin(LitElement) {
|
|||||||
if ((this._config![name] || "") === newVal) {
|
if ((this._config![name] || "") === newVal) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
this._config = { ...this._config!, [name]: newVal };
|
if (!newVal) {
|
||||||
|
delete this._config![name];
|
||||||
|
this._config = { ...this._config! };
|
||||||
|
} else {
|
||||||
|
this._config = { ...this._config!, [name]: newVal };
|
||||||
|
}
|
||||||
this._dirty = true;
|
this._dirty = true;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -693,6 +701,22 @@ export class HaScriptEditor extends KeyboardShortcutMixin(LitElement) {
|
|||||||
.content {
|
.content {
|
||||||
padding-bottom: 20px;
|
padding-bottom: 20px;
|
||||||
}
|
}
|
||||||
|
.yaml-mode {
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
padding-bottom: 0;
|
||||||
|
}
|
||||||
|
ha-yaml-editor {
|
||||||
|
flex-grow: 1;
|
||||||
|
--code-mirror-height: 100%;
|
||||||
|
min-height: 0;
|
||||||
|
}
|
||||||
|
.yaml-mode ha-card {
|
||||||
|
overflow: initial;
|
||||||
|
--ha-card-border-radius: 0;
|
||||||
|
border-bottom: 1px solid var(--divider-color);
|
||||||
|
}
|
||||||
span[slot="introduction"] a {
|
span[slot="introduction"] a {
|
||||||
color: var(--primary-color);
|
color: var(--primary-color);
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user