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

Add buttons to move entities (#3499)

Browse Source
This commit is contained in:
Thomas Lovén 2019-08-19 23:17:49 +02:00 committed by Paulus Schoutsen
parent c542b242fe
commit 6c109c15ef
1 changed files with 55 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

62
src/panels/lovelace/components/hui-entity-editor.ts
View File

@ -7,6 +7,7 @@ import {
css, css,
CSSResult, CSSResult,
} from "lit-element"; } from "lit-element";
import "@polymer/paper-icon-button/paper-icon-button";
import { HomeAssistant } from "../../../types"; import { HomeAssistant } from "../../../types";
import { fireEvent } from "../../../common/dom/fire_event"; import { fireEvent } from "../../../common/dom/fire_event";
@ -31,13 +32,29 @@ export class HuiEntityEditor extends LitElement {
<div class="entities"> <div class="entities">
${this.entities.map((entityConf, index) => { ${this.entities.map((entityConf, index) => {
return html` return html`
<ha-entity-picker <div class="entity">
.hass="${this.hass}" <ha-entity-picker
.value="${entityConf.entity}" .hass="${this.hass}"
.index="${index}" .value="${entityConf.entity}"
@change="${this._valueChanged}" .index="${index}"
allow-custom-entity @change="${this._valueChanged}"
></ha-entity-picker> allow-custom-entity
></ha-entity-picker>
<paper-icon-button
title="Move entity down"
icon="hass:arrow-down"
.index="${index}"
@click="${this._entityDown}"
?disabled="${index === this.entities!.length - 1}"
></paper-icon-button>
<paper-icon-button
title="Move entity up"
icon="hass:arrow-up"
.index="${index}"
@click="${this._entityUp}"
?disabled="${index === 0}"
></paper-icon-button>
</div>
`; `;
})} })}
<ha-entity-picker <ha-entity-picker
@ -60,6 +77,30 @@ export class HuiEntityEditor extends LitElement {
fireEvent(this, "entities-changed", { entities: newConfigEntities }); fireEvent(this, "entities-changed", { entities: newConfigEntities });
} }
private _entityUp(ev: Event): void {
const target = ev.target! as EditorTarget;
const newEntities = this.entities!.concat();
[newEntities[target.index! - 1], newEntities[target.index!]] = [
newEntities[target.index!],
newEntities[target.index! - 1],
];
fireEvent(this, "entities-changed", { entities: newEntities });
}
private _entityDown(ev: Event): void {
const target = ev.target! as EditorTarget;
const newEntities = this.entities!.concat();
[newEntities[target.index! + 1], newEntities[target.index!]] = [
newEntities[target.index!],
newEntities[target.index! + 1],
];
fireEvent(this, "entities-changed", { entities: newEntities });
}
private _valueChanged(ev: Event): void { private _valueChanged(ev: Event): void {
const target = ev.target! as EditorTarget; const target = ev.target! as EditorTarget;
const newConfigEntities = this.entities!.concat(); const newConfigEntities = this.entities!.concat();
@ -81,6 +122,13 @@ export class HuiEntityEditor extends LitElement {
.entities { .entities {
padding-left: 20px; padding-left: 20px;
} }
.entity {
display: flex;
align-items: flex-end;
}
.entity ha-entity-picker {
flex-grow: 1;
}
`; `;
} }
} }