mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-26 02:36:37 +00:00
Add Timer to Helpers (#7366)
This commit is contained in:
parent
19fc37539e
commit
a4ea4b1f5f
@ -2,6 +2,7 @@ import {
|
||||
HassEntityAttributeBase,
|
||||
HassEntityBase,
|
||||
} from "home-assistant-js-websocket";
|
||||
import { HomeAssistant } from "../types";
|
||||
|
||||
export type TimerEntity = HassEntityBase & {
|
||||
attributes: HassEntityAttributeBase & {
|
||||
@ -9,3 +10,48 @@ export type TimerEntity = HassEntityBase & {
|
||||
remaining: string;
|
||||
};
|
||||
};
|
||||
|
||||
export interface DurationDict {
|
||||
hours?: number | string;
|
||||
minutes?: number | string;
|
||||
seconds?: number | string;
|
||||
}
|
||||
|
||||
export interface Timer {
|
||||
id: string;
|
||||
name: string;
|
||||
icon?: string;
|
||||
duration?: string | number | DurationDict;
|
||||
}
|
||||
|
||||
export interface TimerMutableParams {
|
||||
name: string;
|
||||
icon: string;
|
||||
duration: string | number | DurationDict;
|
||||
}
|
||||
|
||||
export const fetchTimer = (hass: HomeAssistant) =>
|
||||
hass.callWS<Timer[]>({ type: "timer/list" });
|
||||
|
||||
export const createTimer = (hass: HomeAssistant, values: TimerMutableParams) =>
|
||||
hass.callWS<Timer>({
|
||||
type: "timer/create",
|
||||
...values,
|
||||
});
|
||||
|
||||
export const updateTimer = (
|
||||
hass: HomeAssistant,
|
||||
id: string,
|
||||
updates: Partial<TimerMutableParams>
|
||||
) =>
|
||||
hass.callWS<Timer>({
|
||||
type: "timer/update",
|
||||
timer_id: id,
|
||||
...updates,
|
||||
});
|
||||
|
||||
export const deleteTimer = (hass: HomeAssistant, id: string) =>
|
||||
hass.callWS({
|
||||
type: "timer/delete",
|
||||
timer_id: id,
|
||||
});
|
||||
|
@ -6,4 +6,5 @@ export const PLATFORMS_WITH_SETTINGS_TAB = {
|
||||
input_boolean: "entity-settings-helper-tab",
|
||||
input_datetime: "entity-settings-helper-tab",
|
||||
counter: "entity-settings-helper-tab",
|
||||
timer: "entity-settings-helper-tab",
|
||||
};
|
||||
|
@ -47,6 +47,11 @@ import {
|
||||
fetchCounter,
|
||||
updateCounter,
|
||||
} from "../../../../../data/counter";
|
||||
import {
|
||||
deleteTimer,
|
||||
fetchTimer,
|
||||
updateTimer,
|
||||
} from "../../../../../data/timer";
|
||||
import { showConfirmationDialog } from "../../../../../dialogs/generic/show-dialog-box";
|
||||
import type { HomeAssistant } from "../../../../../types";
|
||||
import type { Helper } from "../../../helpers/const";
|
||||
@ -56,6 +61,7 @@ import "../../../helpers/forms/ha-input_number-form";
|
||||
import "../../../helpers/forms/ha-input_select-form";
|
||||
import "../../../helpers/forms/ha-input_text-form";
|
||||
import "../../../helpers/forms/ha-counter-form";
|
||||
import "../../../helpers/forms/ha-timer-form";
|
||||
import "../../entity-registry-basic-editor";
|
||||
import type { HaEntityRegistryBasicEditor } from "../../entity-registry-basic-editor";
|
||||
import { haStyle } from "../../../../../resources/styles";
|
||||
@ -91,6 +97,11 @@ const HELPERS = {
|
||||
update: updateCounter,
|
||||
delete: deleteCounter,
|
||||
},
|
||||
timer: {
|
||||
fetch: fetchTimer,
|
||||
update: updateTimer,
|
||||
delete: deleteTimer,
|
||||
},
|
||||
};
|
||||
|
||||
@customElement("entity-settings-helper-tab")
|
||||
|
@ -4,6 +4,7 @@ import { InputNumber } from "../../../data/input_number";
|
||||
import { InputSelect } from "../../../data/input_select";
|
||||
import { InputText } from "../../../data/input_text";
|
||||
import { Counter } from "../../../data/counter";
|
||||
import { Timer } from "../../../data/timer";
|
||||
|
||||
export const HELPER_DOMAINS = [
|
||||
"input_boolean",
|
||||
@ -12,6 +13,7 @@ export const HELPER_DOMAINS = [
|
||||
"input_datetime",
|
||||
"input_select",
|
||||
"counter",
|
||||
"timer",
|
||||
];
|
||||
|
||||
export type Helper =
|
||||
@ -20,4 +22,5 @@ export type Helper =
|
||||
| InputNumber
|
||||
| InputSelect
|
||||
| InputDateTime
|
||||
| Counter;
|
||||
| Counter
|
||||
| Timer;
|
||||
|
@ -23,6 +23,7 @@ import { createInputNumber } from "../../../data/input_number";
|
||||
import { createInputSelect } from "../../../data/input_select";
|
||||
import { createInputText } from "../../../data/input_text";
|
||||
import { createCounter } from "../../../data/counter";
|
||||
import { createTimer } from "../../../data/timer";
|
||||
import { haStyleDialog } from "../../../resources/styles";
|
||||
import { HomeAssistant } from "../../../types";
|
||||
import { Helper } from "./const";
|
||||
@ -32,6 +33,7 @@ import "./forms/ha-input_number-form";
|
||||
import "./forms/ha-input_select-form";
|
||||
import "./forms/ha-input_text-form";
|
||||
import "./forms/ha-counter-form";
|
||||
import "./forms/ha-timer-form";
|
||||
|
||||
const HELPERS = {
|
||||
input_boolean: createInputBoolean,
|
||||
@ -40,6 +42,7 @@ const HELPERS = {
|
||||
input_datetime: createInputDateTime,
|
||||
input_select: createInputSelect,
|
||||
counter: createCounter,
|
||||
timer: createTimer,
|
||||
};
|
||||
|
||||
@customElement("dialog-helper-detail")
|
||||
|
130
src/panels/config/helpers/forms/ha-timer-form.ts
Normal file
130
src/panels/config/helpers/forms/ha-timer-form.ts
Normal file
@ -0,0 +1,130 @@
|
||||
import {
|
||||
css,
|
||||
CSSResult,
|
||||
customElement,
|
||||
html,
|
||||
LitElement,
|
||||
property,
|
||||
internalProperty,
|
||||
TemplateResult,
|
||||
} from "lit-element";
|
||||
import { fireEvent } from "../../../../common/dom/fire_event";
|
||||
import "../../../../components/ha-icon-input";
|
||||
import { Timer, DurationDict } from "../../../../data/timer";
|
||||
import { haStyle } from "../../../../resources/styles";
|
||||
import { HomeAssistant } from "../../../../types";
|
||||
|
||||
@customElement("ha-timer-form")
|
||||
class HaTimerForm extends LitElement {
|
||||
@property({ attribute: false }) public hass!: HomeAssistant;
|
||||
|
||||
@property() public new?: boolean;
|
||||
|
||||
private _item?: Timer;
|
||||
|
||||
@internalProperty() private _name!: string;
|
||||
|
||||
@internalProperty() private _icon!: string;
|
||||
|
||||
@internalProperty() private _duration!: string | number | DurationDict;
|
||||
|
||||
set item(item: Timer) {
|
||||
this._item = item;
|
||||
if (item) {
|
||||
this._name = item.name || "";
|
||||
this._icon = item.icon || "";
|
||||
this._duration = item.duration || "";
|
||||
} else {
|
||||
this._name = "";
|
||||
this._icon = "";
|
||||
this._duration = "00:00:00";
|
||||
}
|
||||
}
|
||||
|
||||
public focus() {
|
||||
this.updateComplete.then(() =>
|
||||
(this.shadowRoot?.querySelector(
|
||||
"[dialogInitialFocus]"
|
||||
) as HTMLElement)?.focus()
|
||||
);
|
||||
}
|
||||
|
||||
protected render(): TemplateResult {
|
||||
if (!this.hass) {
|
||||
return html``;
|
||||
}
|
||||
const nameInvalid = !this._name || this._name.trim() === "";
|
||||
|
||||
return html`
|
||||
<div class="form">
|
||||
<paper-input
|
||||
.value=${this._name}
|
||||
.configValue=${"name"}
|
||||
@value-changed=${this._valueChanged}
|
||||
.label=${this.hass!.localize(
|
||||
"ui.dialogs.helper_settings.generic.name"
|
||||
)}
|
||||
.errorMessage="${this.hass!.localize(
|
||||
"ui.dialogs.helper_settings.required_error_msg"
|
||||
)}"
|
||||
.invalid=${nameInvalid}
|
||||
dialogInitialFocus
|
||||
></paper-input>
|
||||
<ha-icon-input
|
||||
.value=${this._icon}
|
||||
.configValue=${"icon"}
|
||||
@value-changed=${this._valueChanged}
|
||||
.label=${this.hass!.localize(
|
||||
"ui.dialogs.helper_settings.generic.icon"
|
||||
)}
|
||||
></ha-icon-input>
|
||||
<paper-input
|
||||
.configValue=${"duration"}
|
||||
.value=${this._duration}
|
||||
@value-changed=${this._valueChanged}
|
||||
.label=${this.hass.localize(
|
||||
"ui.dialogs.helper_settings.timer.duration"
|
||||
)}
|
||||
></paper-input>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
private _valueChanged(ev: CustomEvent) {
|
||||
if (!this.new && !this._item) {
|
||||
return;
|
||||
}
|
||||
ev.stopPropagation();
|
||||
const configValue = (ev.target as any).configValue;
|
||||
const value = ev.detail.value;
|
||||
if (this[`_${configValue}`] === value) {
|
||||
return;
|
||||
}
|
||||
const newValue = { ...this._item };
|
||||
if (!value) {
|
||||
delete newValue[configValue];
|
||||
} else {
|
||||
newValue[configValue] = ev.detail.value;
|
||||
}
|
||||
fireEvent(this, "value-changed", {
|
||||
value: newValue,
|
||||
});
|
||||
}
|
||||
|
||||
static get styles(): CSSResult[] {
|
||||
return [
|
||||
haStyle,
|
||||
css`
|
||||
.form {
|
||||
color: var(--primary-text-color);
|
||||
}
|
||||
`,
|
||||
];
|
||||
}
|
||||
}
|
||||
|
||||
declare global {
|
||||
interface HTMLElementTagNameMap {
|
||||
"ha-timer-form": HaTimerForm;
|
||||
}
|
||||
}
|
@ -608,6 +608,9 @@
|
||||
"initial": "Initial value",
|
||||
"restore": "Restore the last known value when Home Assistant starts",
|
||||
"step": "Step size"
|
||||
},
|
||||
"timer": {
|
||||
"duration": "Duration"
|
||||
}
|
||||
},
|
||||
"options_flow": {
|
||||
@ -793,7 +796,8 @@
|
||||
"input_select": "Dropdown",
|
||||
"input_boolean": "Toggle",
|
||||
"input_datetime": "Date and/or time",
|
||||
"counter": "Counter"
|
||||
"counter": "Counter",
|
||||
"timer": "Timer"
|
||||
},
|
||||
"picker": {
|
||||
"headers": {
|
||||
|
Loading…
x
Reference in New Issue
Block a user