|
|
@@ -30,9 +30,7 @@ class ZLockSlotsCard extends HTMLElement {
|
|
|
if (!this._config) return;
|
|
|
|
|
|
const entity = this._config.entity;
|
|
|
- const base = entity.replace(/_slots$/, "");
|
|
|
- const watched = [entity, `${base}_last_action`, `${base}_last_user`];
|
|
|
- if (prev && watched.every(e => prev.states[e] === hass.states[e])) return;
|
|
|
+ if (prev && prev.states[entity] === hass.states[entity]) return;
|
|
|
|
|
|
this._render();
|
|
|
}
|
|
|
@@ -41,12 +39,6 @@ class ZLockSlotsCard extends HTMLElement {
|
|
|
return this._hass && this._config ? this._hass.states[this._config.entity] : null;
|
|
|
}
|
|
|
|
|
|
- _sibling(suffix) {
|
|
|
- if (!this._config || !this._hass) return null;
|
|
|
- const base = this._config.entity.replace(/^sensor\./, "sensor.").replace(/_slots$/, "");
|
|
|
- return this._hass.states[`${base}_${suffix}`];
|
|
|
- }
|
|
|
-
|
|
|
_setPending(delta) {
|
|
|
this._pending = (this._pending ?? 0) + delta;
|
|
|
this.shadowRoot?.getElementById("pending-indicator")
|
|
|
@@ -67,8 +59,6 @@ class ZLockSlotsCard extends HTMLElement {
|
|
|
|
|
|
const slotsState = this._slotsEntity();
|
|
|
const slots = slotsState?.attributes?.slots ?? [];
|
|
|
- const lastAction = this._sibling("last_action")?.state ?? "—";
|
|
|
- const lastUser = this._sibling("last_user")?.state ?? "—";
|
|
|
|
|
|
this.shadowRoot.innerHTML = `
|
|
|
<style>
|
|
|
@@ -96,8 +86,7 @@ class ZLockSlotsCard extends HTMLElement {
|
|
|
input[type=number]::-webkit-outer-spin-button,
|
|
|
input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
|
|
|
input[type=number] { -moz-appearance: textfield; }
|
|
|
- .section { margin-top: 20px; }
|
|
|
- .form-row { display: flex; flex-direction: column; gap: 4px; margin-bottom: 10px; }
|
|
|
+.form-row { display: flex; flex-direction: column; gap: 4px; margin-bottom: 10px; }
|
|
|
.form-row-inline { display: flex; gap: 10px; margin-bottom: 10px; }
|
|
|
.form-row-inline .field { display: flex; flex-direction: column; gap: 4px; }
|
|
|
.form-row-inline .field.slot { width: calc(3ch + 20px); }
|
|
|
@@ -107,8 +96,7 @@ class ZLockSlotsCard extends HTMLElement {
|
|
|
input { padding: 6px 8px; border: 1px solid var(--divider-color, #ccc); border-radius: 4px; font-size: 0.9rem; background: var(--card-background-color, #fff); color: var(--primary-text-color); width: 100%; box-sizing: border-box; }
|
|
|
button.action { background: var(--primary-color, #03a9f4); color: #fff; border: none; border-radius: 4px; padding: 8px 16px; cursor: pointer; font-size: 0.9rem; }
|
|
|
button.action:hover { opacity: 0.85; }
|
|
|
- .status-row { display: flex; gap: 24px; font-size: 0.85rem; margin-bottom: 4px; }
|
|
|
- .status-label { opacity: 0.6; }
|
|
|
+ .section + .section { margin-top: 20px; }
|
|
|
.empty-note { opacity: 0.5; font-size: 0.85rem; padding: 8px 0; }
|
|
|
.inline-edit { display: flex; gap: 6px; align-items: center; }
|
|
|
.inline-edit input { flex: 1; }
|
|
|
@@ -120,13 +108,6 @@ class ZLockSlotsCard extends HTMLElement {
|
|
|
<ha-card${this._config.title ? ` header="${this._config.title}"` : ""}>
|
|
|
<div class="pending-indicator" id="pending-indicator"><ha-icon icon="mdi:loading"></ha-icon></div>
|
|
|
<div class="card-content">
|
|
|
- <div class="section">
|
|
|
- <div class="status-row">
|
|
|
- <span><span class="status-label">Last action:</span> ${lastAction}</span>
|
|
|
- <span><span class="status-label">Last user:</span> ${lastUser}</span>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
<div class="section">
|
|
|
<h3>Active code slots</h3>
|
|
|
${slots.length === 0
|
