DashboardAirTileComponent

src/main/angular/src/app/api/series/series.service.ts

@@ -21,6 +21,18 @@ export class SeriesService {
 
   public gridPower: Series | null = null;
 
+  public schlafzimmerTemperature: Series | null = null;
+
+  public schlafzimmerHumidityRelative: Series | null = null;
+
+  public schlafzimmerHumidityAbsolute: Series | null = null;
+
+  public gartenTemperature: Series | null = null;
+
+  public gartenHumidityRelative: Series | null = null;
+
+  public gartenHumidityAbsolute: Series | null = null;
+
   constructor(
     private readonly api: ApiService,
   ) {
@@ -40,6 +52,14 @@ export class SeriesService {
 
     this.photovoltaicProduced = this.seriesUpdate2(series, this.photovoltaicProduced, 'electricity.photovoltaic.energy');
     this.photovoltaicPower = this.seriesUpdate2(series, this.photovoltaicPower, 'electricity.photovoltaic.power');
+
+    this.schlafzimmerTemperature = this.seriesUpdate2(series, this.schlafzimmerTemperature, 'schlafzimmer.temperature');
+    this.schlafzimmerHumidityRelative = this.seriesUpdate2(series, this.schlafzimmerHumidityRelative, 'schlafzimmer.humidity_relative');
+    this.schlafzimmerHumidityAbsolute = this.seriesUpdate2(series, this.schlafzimmerHumidityAbsolute, 'schlafzimmer.humidity_absolute');
+
+    this.gartenTemperature = this.seriesUpdate2(series, this.gartenTemperature, 'garten.temperature');
+    this.gartenHumidityRelative = this.seriesUpdate2(series, this.gartenHumidityRelative, 'garten.humidity_relative');
+    this.gartenHumidityAbsolute = this.seriesUpdate2(series, this.gartenHumidityAbsolute, 'garten.humidity_absolute');
   }
 
   private seriesUpdate2(fresh: Series, old: Series | null, name: string): Series | null {

src/main/angular/src/app/pages/dashboard/air/dashboard-air-tile.component.html

@@ -0,0 +1 @@
+<app-values-tile title="Luft" icon="air.svg" [displayList]="getDisplayList()"></app-values-tile>

src/main/angular/src/app/pages/dashboard/air/dashboard-air-tile.component.ts

@@ -0,0 +1,35 @@
+import {Component} from '@angular/core';
+import {ValuesTileComponent} from "../../../shared/values-tile/values-tile.component";
+import {Display, DisplayOrSeparator} from "../../../api/series/IValue";
+import {SeriesService} from "../../../api/series/series.service";
+
+@Component({
+  selector: 'app-dashboard-air-tile',
+  standalone: true,
+  imports: [
+    ValuesTileComponent
+  ],
+  templateUrl: './dashboard-air-tile.component.html',
+  styleUrl: './dashboard-air-tile.component.less'
+})
+export class DashboardAirTileComponent {
+
+  constructor(
+    protected readonly seriesService: SeriesService,
+  ) {
+    // -
+  }
+
+  getDisplayList(): DisplayOrSeparator[] {
+    return [
+      new Display('Schlaf. Temperatur', '', this.seriesService.schlafzimmerTemperature),
+      new Display('Schlaf. Feucht. Relativ', '', this.seriesService.schlafzimmerHumidityRelative),
+      new Display('Schlaf. Feucht. Absolut', '', this.seriesService.schlafzimmerHumidityAbsolute),
+      null,
+      new Display('Garten Temperatur', '', this.seriesService.gartenTemperature),
+      new Display('Garten Feucht. Relativ', '', this.seriesService.gartenHumidityRelative),
+      new Display('Garten Feucht. Absolut', '', this.seriesService.gartenHumidityAbsolute),
+    ];
+  }
+
+}

src/main/angular/src/app/pages/dashboard/dashboard.component.html

@@ -1,3 +1,7 @@
 <div class="width100">
   <app-dashboard-electricity-tile></app-dashboard-electricity-tile>
 </div>
+
+<div class="width100">
+  <app-dashboard-air-tile></app-dashboard-air-tile>
+</div>

src/main/angular/src/app/shared/values-tile/values-tile.component.less

@@ -29,15 +29,18 @@
     th {
       text-align: left;
       width: 0;
+      white-space: nowrap;
     }
 
     .v {
       text-align: right;
+      white-space: nowrap;
     }
 
     .u {
       text-align: left;
       width: 0;
+      white-space: nowrap;
     }
 
     .spacer {