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.