How to Change the Background Color of a Group in Node-RED Dashboard Based on Test Results?

[zenofmud]

This might help you. Take a look at this project I created quite awhile ago

'ET Display Home' a flow to help manage your ESPeasy, Sonoff/Tasmota and Homie flashed devices (now on GitHub)

This project is designed to help you keep your Wemos and Sonoff devices under control by providing a dashboard with a link to the latest ESPeasy ano/or Sonoff Tasmota release, the node name, status, current software version (devices with older versions are hi-lighted), The current RSSI value, a link to each online device's configuration page and other infomation that will seem reasonable to provide. [ethd_v019_display] The project uses two tables in an SQLite database and is designed that, i…

the 'magic' is done in a ui-template node with this code:

<div id="et_home">
<h2 style="text-align: center;">ET Display Home {{msg.etdh_version}}</h2>
<p style="text-align: center;">ESPeasy current release: <a href="https://github.com/letscontrolit/ESPEasy/releases/download/{{msg.esp_release}}/ESPEasy_ESP82xx_{{msg.esp_release}}.zip" target="_blank">{{msg.esp_release}}</a> (click to download)</p>
<p style="text-align: center;">Tasmota current release: <a href="https://github.com/arendst/Tasmota-firmware/raw/main/release-firmware/tasmota/tasmota-display.bin" target="_blank">{{msg.tas_release}}</a> (click to download)</p>

<br/>
<table id="table" border="1">
    <tr>
        <th>Node Name</th> 
        <th>Node Status</th> 
        <th>Last Seen</th> 
        <th>Version</th>
        <th>RSSI</th>
        <th>Uptime</th>
        <th>Last boot cause</th>
        <th>Free RAM</th>
        <th>IP</th>
    </tr>
    <tbody style="text-align: center">
        <tr ng-repeat="x in msg.payload">
            <td ng-if="x.node_status ==  'database is empty'" class="warning_red" >DATABASE IS EMPTY</td>
 
            <td ng-if='x.node_status ==  1' class="device_online" >{{x.node_name}}</td>
            <td ng-if='x.node_status ==  0' class="device_offline">{{x.node_name}}</td>
            
            <td ng-if='x.node_status ==  1' class="device_online"  >On Line </td>
            <td ng-if='x.node_status ==  0' class="device_offline" >Off Line</td>
            
            <td ng-if='x.node_status ==  1' class="device_last_seen"  >{{x.last_seen}} </td>
            <td ng-if='x.node_status ==  0' class="device_last_seen"  >{{x.last_seen}} </td>

            
            <td ng-if="(x.firmware_type == 'espeasy' && x.firmware_build ==  msg.esp_release)" class="device_online"> {{x.firmware_build}} </td>
            <td ng-if="(x.firmware_type == 'espeasy' && x.firmware_build !=  msg.esp_release)" class="warning_color"> {{x.firmware_build}} </td>
            <td ng-if="(x.firmware_type == 'tasmota' && x.firmware_build ==  msg.tas_release)" class="device_online"> {{x.firmware_build}} </td>
            <td ng-if="(x.firmware_type == 'tasmota' && x.firmware_build !=  msg.tas_release)" class="warning_color"> {{x.firmware_build}} </td>
            <td ng-if="(x.firmware_type == 'homie'   && x.firmware_build ==  msg.hom_release)" class="device_online"> {{x.firmware_build}} </td>
            <td ng-if="(x.firmware_type == 'homie'   && x.firmware_build !=  msg.hom_release)" class="warning_color"> {{x.firmware_build}} </td>
             
            <td ng-if='x.node_status ==  1'  > {{x.rssi}} </td>
            <td ng-if='x.node_status ==  0'  >- - -</td>
            
            <td ng-if='x.node_status ==  1'  > {{x.uptime}} </td>
            <td ng-if='x.node_status ==  0'  >- - - - -</td>
            
            <td ng-if='x.node_status ==  1'  > {{x.last_boot_cause}} </td>
            <td ng-if='x.node_status ==  0'  >- - - - - - -</td>
            
            <td ng-if='x.node_status ==  1'  > {{x.free_ram}} </td>
            <td ng-if='x.node_status ==  0'  >- - - - -</td>
            <td>
                <a href="http://{{x.ip}}" target="_blank"> {{x.ip}} </a>
            </td>
        </tr>
    </tbody>
</table>

</div>

So the way it works is that each device is an object which contains node_status. The node_status determines the color in the table.

Hopefully this will help you out.