Il mio edificio - Controllo delle lampade

• Tutorial

Tutorial

Questo capitolo descrive la supervisione e il controllo delle lampade in un edificio. Mostra la personalizzazione della loro rappresentazione visiva nel digital twin oltre all'implementazione di controlli per accendere o spegnere le lampade direttamente dall'interfaccia.

Nella maggior parte delle installazioni, è presente la supervisione delle lampade e costituisce Il vettore principale dei comandi inviati dal software all'apparecchiatura per controllare il loro acceso e disattivamento.

In questo tutorial vedremo come personalizzare la visualizzazione delle lampade nell'app a seconda dello stato, così come dei pulsanti di configurazione permettendo di inviare comandi alle lampade.

Obiettivi funzionali

1. Colorare la bolla dell'attrezzatura in base allo stato dell'illuminazione di una lampada
2. Aggiunto un pulsante Azione Rapida per inviare un comando per accendere o spegnere una lampada

Prerequisiti

• Creare uno script comportamentale legato alla famiglia Light
• Associazione dei Light a una bolla di apparecchiature nel gemello digitale

Colorare la bolla dell'attrezzatura in base allo stato dell'illuminazione di una lampada

Per raggiungere l'obiettivo che ci siamo prefissati, tutto ciò che dobbiamo fare è attuarlo La funzione Customize, già visto in precedenza.

Il primo passo è recuperare lo stato della variabile Light per determinare se la lampada è accesa o spenta.

La proprietà icon Icona widget ti permette di cambiare l'icona visualizzata dall'attrezzatura. Il nome dell'icona deve corrispondere a un asset immagine Aggiunto in precedenza alla nostra organizzazione.

La proprietà iconBackgroundColor Ti permette di cambiare il colore di sfondo dell'icona. È possibile passare un nome di colore o direttamente un colore in formato esadecimale.

function Customize(equipment, w2d, w3d)
{
  let isOn = equipment.GetVariable("LIGHT").AsInt > 0;

  // Modification de l'icône et de la couleur de fond en fonction de l'état de la lumière
  w3d.icon = isOn ? "Icon Lamp_On" : "Icon Lamp_Off";
  w3d.iconBackgroundColor = isOn ? "yellow" : "";
}

Aggiunto un pulsante Azione Rapida per inviare un comando per accendere/spegnere una lampada

Per aggiungere un pulsante per inviare ordini, Dobbiamo aggiungere un po' di codice alla funzione Customize.

La proprietà quickAction widgets ti permette di aggiungere pulsanti Interazione Rapida, che viene etichettata per corrispondere al testo associato all'Azione Rapida.

Nel nostro caso, il testo dell'azione dipende dallo stato della lampada:

• Spegnimento
• Accenditi

Poi aggiungiamo il ExecuteQuickAction, che verrà chiamato quando l'utente preme il pulsante.

La nostra implementazione chiama l'endpoint /api/Scene dal nostro server inviando il corpo corrispondente ai parametri necessari Accendere o spegnere la luce.

Le due promesse then e catch Permettici di mostrare Messaggi quando l'endpoint restituisce una risposta. per informare l'utente dell'esecuzione corretta o scorretta dell'ordine.

Script JS:

function Customize(equipment, w2d, w3d)
{
  let isOn = equipment.GetVariable("LIGHT").AsInt > 0;

  // Affichage du bouton QuickAction avec le bon label
  w2d.quickAction = w3d.quickAction = isOn ? "Eteindre" : "Allumer";

  // Modification de l'icône et de la couleur de fond en fonction de l'état de la lumière
  w3d.icon = isOn ? "Icon Lamp_On" : "Icon Lamp_Off";
  w3d.iconBackgroundColor = isOn ? "yellow" : "";
}

// Implémentation de la QuickAction pour l'allumage/exctinction des lumières
function ExecuteQuickAction(equipment)
{
    let isOn = equipment.GetVariable("LIGHT").AsInt > 0;

    let serverUrl = "https://localhost:7003";

    // Construction du body à envoyer au endpoint
    let body = {
        sceneName : "Corridor Light",
        action : isOn ? "off ": "on"
    };

    // Envoi de la requète au endpoint server/api/Scene
    WebRequestProvider.Post(serverUrl + `/api/Scene`, JSON.stringify(body))
    .Then(response =>
    {
        // Affichage d'un toast de succès et récupération des données
        Immersive.Toaster.ToastSuccess("Commande éclairage Ok");
        Immersive.Hub.ObserveSingleUpdate();
    })
    .Catch(error =>
    {
        // Affichage d'une erreur en cas de problème
        Immersive.App.ShowPopup("Commande éclairage", "La commande n'a pas pu être effectuée");
    });
}