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

Fix entity drag (#6884)

Browse Source
This commit is contained in:
Bram Kragten 2020-09-09 17:23:03 +02:00 committed by GitHub
parent f7ab52fe9a
commit 432e3ba636
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 37 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -34,7 +34,9 @@ export class HuiEntityEditor extends LitElement {
@internalProperty() private _attached = false; @internalProperty() private _attached = false;
private _sortable?; @internalProperty() private _renderEmptySortable = false;
private _sortable?: Sortable;
public connectedCallback() { public connectedCallback() {
super.connectedCallback(); super.connectedCallback();
@ -60,21 +62,23 @@ export class HuiEntityEditor extends LitElement {
")"} ")"}
</h3> </h3>
<div class="entities"> <div class="entities">
${guard([this.entities], () => ${guard([this.entities, this._renderEmptySortable], () =>
this.entities!.map((entityConf, index) => { this._renderEmptySortable
return html` ? ""
<div class="entity" data-entity-id=${entityConf.entity}> : this.entities!.map((entityConf, index) => {
<ha-svg-icon .path=${mdiDrag}></ha-svg-icon> return html`
<ha-entity-picker <div class="entity" data-entity-id=${entityConf.entity}>
.hass=${this.hass} <ha-svg-icon .path=${mdiDrag}></ha-svg-icon>
.value=${entityConf.entity} <ha-entity-picker
.index=${index} .hass=${this.hass}
@change=${this._valueChanged} .value=${entityConf.entity}
allow-custom-entity .index=${index}
></ha-entity-picker> @change=${this._valueChanged}
</div> allow-custom-entity
`; ></ha-entity-picker>
}) </div>
`;
})
)} )}
</div> </div>
<ha-entity-picker <ha-entity-picker
@ -112,10 +116,16 @@ export class HuiEntityEditor extends LitElement {
} }
if (entitiesChanged) { if (entitiesChanged) {
this._sortable.sort(this.entities?.map((entity) => entity.entity)); this._handleEntitiesChanged();
} }
} }
private async _handleEntitiesChanged() {
this._renderEmptySortable = true;
await this.updateComplete;
this._renderEmptySortable = false;
}
private _createSortable() { private _createSortable() {
this._sortable = new Sortable(this.shadowRoot!.querySelector(".entities"), { this._sortable = new Sortable(this.shadowRoot!.querySelector(".entities"), {
animation: 150, animation: 150,

17
src/panels/lovelace/editor/card-editor/hui-card-editor.ts
View File

@ -5,14 +5,16 @@ import {
CSSResult, CSSResult,
customElement, customElement,
html, html,
internalProperty,
LitElement, LitElement,
property, property,
internalProperty,
TemplateResult,
query, query,
TemplateResult,
} from "lit-element"; } from "lit-element";
import { fireEvent } from "../../../../common/dom/fire_event"; import { fireEvent } from "../../../../common/dom/fire_event";
import { computeRTL } from "../../../../common/util/compute_rtl"; import { computeRTL } from "../../../../common/util/compute_rtl";
import { deepEqual } from "../../../../common/util/deep-equal";
import "../../../../components/ha-circular-progress";
import "../../../../components/ha-code-editor"; import "../../../../components/ha-code-editor";
import type { HaCodeEditor } from "../../../../components/ha-code-editor"; import type { HaCodeEditor } from "../../../../components/ha-code-editor";
import type { import type {
@ -20,14 +22,12 @@ import type {
LovelaceConfig, LovelaceConfig,
} from "../../../../data/lovelace"; } from "../../../../data/lovelace";
import type { HomeAssistant } from "../../../../types"; import type { HomeAssistant } from "../../../../types";
import { handleStructError } from "../../common/structs/handle-errors";
import { getCardElementClass } from "../../create-element/create-card-element"; import { getCardElementClass } from "../../create-element/create-card-element";
import type { EntityConfig } from "../../entity-rows/types"; import type { EntityConfig } from "../../entity-rows/types";
import type { LovelaceCardEditor } from "../../types"; import type { LovelaceCardEditor } from "../../types";
import type { GUIModeChangedEvent } from "../types";
import "../../../../components/ha-circular-progress";
import { deepEqual } from "../../../../common/util/deep-equal";
import { handleStructError } from "../../common/structs/handle-errors";
import { GUISupportError } from "../gui-support-error"; import { GUISupportError } from "../gui-support-error";
import type { GUIModeChangedEvent } from "../types";
export interface ConfigChangedEvent { export interface ConfigChangedEvent {
config: LovelaceCardConfig; config: LovelaceCardConfig;
@ -78,6 +78,9 @@ export class HuiCardEditor extends LitElement {
@query("ha-code-editor") _yamlEditor?: HaCodeEditor; @query("ha-code-editor") _yamlEditor?: HaCodeEditor;
public get yaml(): string { public get yaml(): string {
if (!this._yaml) {
this._yaml = safeDump(this._config);
}
return this._yaml || ""; return this._yaml || "";
} }
@ -101,7 +104,7 @@ export class HuiCardEditor extends LitElement {
return; return;
} }
this._config = config; this._config = config;
this._yaml = safeDump(config); this._yaml = undefined;
this._error = undefined; this._error = undefined;
this._setConfig(); this._setConfig();
} }