Add power display widget

This commit is contained in:
2019-10-15 18:10:55 -04:00
parent fe1a66a655
commit 2ee6cb2b4a
9 changed files with 132 additions and 8 deletions

View File

@@ -0,0 +1,25 @@
<div class="power-current">
<div *ngIf="latestStatus === null">
Loading...
</div>
<div *ngIf="latestStatus !== null">
<table>
<tr>
<td class="power-current-header">
Generation
</td>
<td>
{{ latestStatus.Generation < 0 ? 0 : latestStatus.Generation }}
</td>
</tr>
<tr>
<td class="power-current-header">
Consumption
</td>
<td>
{{ latestStatus.Consumption < 0 ? 0 : latestStatus.Consumption }}
</td>
</tr>
</table>
</div>
</div>

View File

@@ -0,0 +1,10 @@
.power-current {
font-size: 14px;
padding: 10px;
}
.power-current-header {
font-weight: 500;
text-align: right;
padding-right: 10px;
}

View File

@@ -0,0 +1,25 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { PowerComponent } from './power.component';
describe('PowerComponent', () => {
let component: PowerComponent;
let fixture: ComponentFixture<PowerComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [PowerComponent]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(PowerComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

View File

@@ -0,0 +1,17 @@
import { Component, OnInit } from '@angular/core';
import { PowerService } from '../../services/power/power.service';
import { PowerStatus } from '../../models/power/power-status';
@Component({
selector: 'app-power',
templateUrl: './power.component.html',
styleUrls: ['./power.component.scss']
})
export class PowerComponent implements OnInit {
public latestStatus: PowerStatus;
constructor(private powerService: PowerService) { }
ngOnInit() {
this.powerService.getLatestStatus().subscribe(s => this.latestStatus = s);
}
}