patrick/Data-old
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Dashboard heating-colors

Browse Source
This commit is contained in:
Patrick Haßel 2024-10-18 13:49:10 +02:00
parent 79d5aad71f
commit 4ed155381a
3 changed files with 32 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
src/main/angular/src/app/pages/dashboard/heating/dashboard-heating-tile.component.ts
View File

@ -1,6 +1,6 @@
import {Component, Input} from '@angular/core'; import {Component, Input} from '@angular/core';
import {ValuesTileComponent} from "../../../shared/values-tile/values-tile.component"; import {ValuesTileComponent} from "../../../shared/values-tile/values-tile.component";
import {Display, DisplayOrSeparator} from "../../../api/series/IValue"; import {Display, DisplayOrSeparator, IValue} from "../../../api/series/IValue";
import {SeriesService} from "../../../api/series/series.service"; import {SeriesService} from "../../../api/series/series.service";
@Component({ @Component({
@ -25,16 +25,31 @@ export class DashboardHeatingTileComponent {
getDisplayList(): DisplayOrSeparator[] { getDisplayList(): DisplayOrSeparator[] {
return [ return [
new Display('Abgas', '', this.seriesService.heatingExhaustTemperature), new Display('Abgas', this.color(50, 100, this.seriesService.heatingExhaustTemperature), this.seriesService.heatingExhaustTemperature),
new Display('Puffer Vorlauf', '', this.seriesService.heatingBufferSupplyTemperature), null,
new Display('Puffer Rücklauf', '', this.seriesService.heatingBufferReturnTemperature), new Display('Heizkreis Vorlauf', this.color(22, 40, this.seriesService.heatingLoopSupplyTemperature), this.seriesService.heatingLoopSupplyTemperature),
new Display('Puffer Kalt', '', this.seriesService.heatingBufferColdTemperature), new Display('Heizkreis Rücklauf', this.color(22, 40, this.seriesService.heatingLoopReturnTemperature), this.seriesService.heatingLoopReturnTemperature),
new Display('Puffer Speicher', '', this.seriesService.heatingBufferInnerTemperature), null,
new Display('Puffer Warm', '', this.seriesService.heatingBufferHotTemperature), new Display('Puffer Vorlauf', this.color(22, 40, this.seriesService.heatingBufferSupplyTemperature), this.seriesService.heatingBufferSupplyTemperature),
new Display('Puffer Zirkulation', '', this.seriesService.heatingBufferCirculationTemperature), new Display('Puffer Rücklauf', this.color(22, 40, this.seriesService.heatingBufferReturnTemperature), this.seriesService.heatingBufferReturnTemperature),
new Display('Heizkreis Vorlauf', '', this.seriesService.heatingLoopSupplyTemperature), null,
new Display('Heizkreis Rücklauf', '', this.seriesService.heatingLoopReturnTemperature), 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),
]; ];
} }
private color(middle: number, height: number, value: IValue | null): string {
if (value === null || value.value === null) {
return "";
}
if (value.value < middle) {
return 'blue';
} else if (value.value < height) {
return 'orange';
}
return 'red';
}
} }

8
src/main/angular/src/app/shared/values-tile/values-tile.component.html
View File

@ -7,8 +7,12 @@
<ng-container *ngFor="let display of displayList"> <ng-container *ngFor="let display of displayList">
<tr class="rate" *ngIf="display" [style.color]="display.color"> <tr class="rate" *ngIf="display" [style.color]="display.color">
<th>{{ display.title }}</th> <th>{{ display.title }}</th>
<td class="v">{{ display?.iValue?.value | number:'0.0-0' }}</td> <td class="v">
<td class="u">{{ display?.iValue?.unit }}</td> {{ display?.iValue?.value | number:'0.0-0' }}
</td>
<td class="u">
{{ display?.iValue?.unit }}
</td>
</tr> </tr>
<tr *ngIf="!display" class="spacer"> <tr *ngIf="!display" class="spacer">
<td colspan="3"></td> <td colspan="3"></td>

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

@ -30,6 +30,7 @@
text-align: left; text-align: left;
width: 0; width: 0;
white-space: nowrap; white-space: nowrap;
font-weight: normal;
} }
.v { .v {