Panel Custom Home Assistant

La integración Panel Custom Home Assistant, le permite escribir sus propios paneles en JavaScript y agregarlos a Home Assistant.

Los paneles son páginas que muestran información dentro de Home Assistant y pueden permitir controlarla. Los paneles están vinculados desde el menú lateral y se representan a pantalla completa. Tienen acceso en tiempo real al objeto Home Assistant a través de JavaScript. Ejemplos de paneles en la aplicación son tableros, mapa, libro de registro e historial.

Además de los paneles de registro de componentes, los usuarios también pueden registrar paneles utilizando el componente panel_custom. Esto permite a los usuarios crear rápidamente sus propias interfaces personalizadas para Home Assistant.

Introducción Panel Custom Home Assistant

Los paneles se definen como elementos personalizados. Puede usar cualquier marco que desee, siempre que lo incluya como un elemento personalizado. Para comenzar con un panel, lo primero que tiene que hacer es descargar este archivo y copiarlo en la carpeta config/www de su Home Assistant.

En este punto, hay reiniciar su Home Assistant, de lo contrario, es posible que más adelante no le deje reiniciar

Luego cree el archivo panel_custom.yaml  y copie esta línea en su archivo configuration.yaml

panel_custom: !include panel_custom.yaml

Ahora, toca reiniciar su Home Assistant.

A continuación, ya  está listo para crear sus enlaces. Aquí le dejo unos ejemplos y después vamos a repasar que es cada línea.

  - name: Server Controls
    url_path: developer-tools/yaml
    sidebar_title: Server Controls
    sidebar_icon: mdi:server # https://materialdesignicons.com/
    module_url: /local/panel-redirect.js  # 'local' is '/config/www/'

  - name: panel-redirect
    url_path: redirect-supervisor
    sidebar_title: Supervisor
    sidebar_icon: mdi:home-assistant # https://materialdesignicons.com/
    module_url: /local/panel-redirect.js
    config:
      target: /hassio/dashboard # Hacia dónde quieres redirigir

  - name: Zones
    url_path: config/zone
    sidebar_title: Zones
    sidebar_icon: mdi:google-maps
    module_url: /local/panel-redirect.js

VARIABLES DE CONFIGURACIÓN

name (OBLIGATORIO)

Nombre de la integración web que representa su panel.

sidebar_title ( opcional)

Título descriptivo para el panel en la barra lateral. Omitirlo significa que no hay entrada en la barra lateral (pero aún accesible a través de la URL).

sidebar_icon ( opcional , predeterminado: mdi: marcador )

Icono de entrada. Elija un ícono que pueda encontrar en materialdesignicons.com para usar para su entrada y prefije el nombre con mdi:. Por ejemplo mdi:car, mdi:ambulanceo mdi:motorbike.

url_path ( opcional)

La URL en la que estará disponible su panel en la interfaz. Si se omite, el nombre del panel será predeterminado.

js_url ( opcional)

La URL que contiene el JavaScript de tu panel. Si se usa junto con module_url, solo se servirá a los usuarios que usen la compilación ES5 de la interfaz.

module_url ( opcional)

La URL que contiene el módulo JavaScript de tu panel. Cargado como un módulo de JavaScript en lugar de un script. Si se usa junto con module_url, solo se servirá a los usuarios que usen la versión «más reciente» de la interfaz.

config ( opcional)

Configuración que se pasará a su componente web cuando se cree una instancia.

require_admin ( opcional , predeterminado: falso )

Si se requiere acceso de administrador para ver este panel.

embed_iframe ( opcional , predeterminado: falso )

Configúrelo truepara incrustar el panel en iframe. Esto es necesario si el panel usa el marco React o si contiene componentes web en conflicto.

trust_external_script ( opcional , predeterminado: falso )

De forma predeterminada, el usuario debe confirmar antes de cargar un script desde una fuente externa. Establecer esto en true, omitirá esta confirmación.

Sígueme a Youtube