From 91837cbc3469fdf6241f29fd96ea1d38c5b5e182 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Patrick=20Ha=C3=9Fel?= Date: Fri, 18 Oct 2024 14:15:07 +0200 Subject: [PATCH] heating colors 2 --- .../air/dashboard-air-tile.component.ts | 8 ++--- .../dashboard-heating-tile.component.ts | 36 +++++++++++-------- 2 files changed, 26 insertions(+), 18 deletions(-) diff --git a/src/main/angular/src/app/pages/dashboard/air/dashboard-air-tile.component.ts b/src/main/angular/src/app/pages/dashboard/air/dashboard-air-tile.component.ts index 0a5ec55..ad393ab 100644 --- a/src/main/angular/src/app/pages/dashboard/air/dashboard-air-tile.component.ts +++ b/src/main/angular/src/app/pages/dashboard/air/dashboard-air-tile.component.ts @@ -35,14 +35,14 @@ export class DashboardAirTileComponent { const heatingRoomVentColor = heatingRoomVent ? 'red' : ''; return [ - new Display('Schlaf. Temperatur', '', this.seriesService.schlafzimmerTemperature), - new Display('Schlaf. Feucht. Relativ', '', this.seriesService.schlafzimmerHumidityRelative), - new Display('Schlaf. Feucht. Absolut', bedroomVentColor, this.seriesService.schlafzimmerHumidityAbsolute), - null, new Display('Garten Temperatur', '', this.seriesService.outdoorTemperature), new Display('Garten Feucht. Relativ', '', this.seriesService.outdoorHumidityRelative), new Display('Garten Feucht. Absolut', '', this.seriesService.outdoorHumidityAbsolute), null, + new Display('Schlaf. Temperatur', '', this.seriesService.schlafzimmerTemperature), + new Display('Schlaf. Feucht. Relativ', '', this.seriesService.schlafzimmerHumidityRelative), + new Display('Schlaf. Feucht. Absolut', bedroomVentColor, this.seriesService.schlafzimmerHumidityAbsolute), + null, new Display('Heiz. Temperatur', '', this.seriesService.heatingRoomTemperature), new Display('Heiz. Feucht. Relativ', '', this.seriesService.heatingRoomHumidityRelative), new Display('Heiz. Feucht. Absolut', heatingRoomVentColor, this.seriesService.heatingRoomHumidityAbsolute), diff --git a/src/main/angular/src/app/pages/dashboard/heating/dashboard-heating-tile.component.ts b/src/main/angular/src/app/pages/dashboard/heating/dashboard-heating-tile.component.ts index 7d42080..472bc09 100644 --- a/src/main/angular/src/app/pages/dashboard/heating/dashboard-heating-tile.component.ts +++ b/src/main/angular/src/app/pages/dashboard/heating/dashboard-heating-tile.component.ts @@ -3,6 +3,14 @@ import {ValuesTileComponent} from "../../../shared/values-tile/values-tile.compo import {Display, DisplayOrSeparator, IValue} from "../../../api/series/IValue"; import {SeriesService} from "../../../api/series/series.service"; +const EXHAUST_WARM = 40; + +const EXHAUST_HOT = 90; + +const WATER_WARM = 22; + +const WATER_HOT = 60; + @Component({ selector: 'app-dashboard-heating-tile', standalone: true, @@ -25,31 +33,31 @@ export class DashboardHeatingTileComponent { getDisplayList(): DisplayOrSeparator[] { return [ - new Display('Abgas', this.color(50, 100, this.seriesService.heatingExhaustTemperature), this.seriesService.heatingExhaustTemperature), + new Display('Abgas', this.color(EXHAUST_WARM, EXHAUST_HOT, this.seriesService.heatingExhaustTemperature, ''), this.seriesService.heatingExhaustTemperature), null, - new Display('Heizkreis Vorlauf', this.color(22, 40, this.seriesService.heatingLoopSupplyTemperature), this.seriesService.heatingLoopSupplyTemperature), - new Display('Heizkreis Rücklauf', this.color(22, 40, this.seriesService.heatingLoopReturnTemperature), this.seriesService.heatingLoopReturnTemperature), + new Display('Heizkreis Vorlauf', this.color(WATER_WARM, WATER_HOT, this.seriesService.heatingLoopSupplyTemperature), this.seriesService.heatingLoopSupplyTemperature), + new Display('Heizkreis Rücklauf', this.color(WATER_WARM, WATER_HOT, this.seriesService.heatingLoopReturnTemperature), this.seriesService.heatingLoopReturnTemperature), null, - new Display('Puffer Vorlauf', this.color(22, 40, this.seriesService.heatingBufferSupplyTemperature), this.seriesService.heatingBufferSupplyTemperature), - new Display('Puffer Rücklauf', this.color(22, 40, this.seriesService.heatingBufferReturnTemperature), this.seriesService.heatingBufferReturnTemperature), + new Display('Puffer Vorlauf', this.color(WATER_WARM, WATER_HOT, this.seriesService.heatingBufferSupplyTemperature), this.seriesService.heatingBufferSupplyTemperature), + new Display('Puffer Rücklauf', this.color(WATER_WARM, WATER_HOT, this.seriesService.heatingBufferReturnTemperature), this.seriesService.heatingBufferReturnTemperature), null, - new Display('Puffer Kalt', this.color(22, 40, this.seriesService.heatingBufferColdTemperature), this.seriesService.heatingBufferColdTemperature), - new Display('Puffer Speicher', this.color(22, 40, this.seriesService.heatingBufferInnerTemperature), this.seriesService.heatingBufferInnerTemperature), - new Display('Puffer Warm', this.color(22, 40, this.seriesService.heatingBufferHotTemperature), this.seriesService.heatingBufferHotTemperature), - new Display('Puffer Zirkulation', this.color(22, 40, this.seriesService.heatingBufferCirculationTemperature), this.seriesService.heatingBufferCirculationTemperature), + new Display('Puffer Kalt', this.color(WATER_WARM, WATER_HOT, this.seriesService.heatingBufferColdTemperature), this.seriesService.heatingBufferColdTemperature), + new Display('Puffer Speicher', this.color(WATER_WARM, WATER_HOT, this.seriesService.heatingBufferInnerTemperature), this.seriesService.heatingBufferInnerTemperature), + new Display('Puffer Warm', this.color(WATER_WARM, WATER_HOT, this.seriesService.heatingBufferHotTemperature), this.seriesService.heatingBufferHotTemperature), + new Display('Puffer Zirkulation', this.color(WATER_WARM, WATER_HOT, this.seriesService.heatingBufferCirculationTemperature), this.seriesService.heatingBufferCirculationTemperature), ]; } - private color(middle: number, height: number, value: IValue | null): string { + private color(middle: number, high: number, value: IValue | null, smallColor: string = '#23F', middleColor: string = 'orange', highColor: string = 'red'): string { if (value === null || value.value === null) { return ""; } if (value.value < middle) { - return 'blue'; - } else if (value.value < height) { - return 'orange'; + return smallColor; + } else if (value.value < high) { + return middleColor; } - return 'red'; + return highColor; } }