Aroy/Angular-DotIO
1
0
Fork 0
Code Activity Actions

Add: right now card with quik stats

Browse source
This commit is contained in:
Aroy-Art 2025-05-16 11:07:57 +02:00
parent b16d139d35
commit 92b3482110
Signed by: Aroy
GPG key ID: 583642324A1D2070
3 changed files with 171 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

29
src/app/app.component.html
View file

@ -27,6 +27,35 @@
</div>
</div>
@if (!loading && !error && priceData.length > 0) {
<div class="price-summary">
<div class="price-heading">
<h2>{{ getRegionName(selectedRegion) }} {{ formattedDisplayDate }}</h2>
<p class="price-subheading">(utan moms och andra skatter)</p>
</div>
<div class="current-price">
<div class="price-label">Just nu</div>
<div class="price-value">{{ currentPrice?.SEK_per_kWh || 0 | number:'1.2-2' }} <span class="price-unit">kr/kWh</span></div>
<div class="price-change" [ngClass]="{'price-increase': (currentPrice?.SEK_per_kWh || 0) > averagePrice, 'price-decrease': (currentPrice?.SEK_per_kWh || 0) < averagePrice}">
{{ (currentPrice?.SEK_per_kWh || 0) > averagePrice ? '+' : '' }}{{ ((currentPrice?.SEK_per_kWh || 0) - averagePrice) | number:'1.2-2' }}%
</div>
</div>
<div class="price-extremes">
<div class="price-high">
↑ {{ highestPrice?.SEK_per_kWh || 0 | number:'1.2-2' }} kr kl {{ highestPrice?.time_start | date:'HH:mm' }}
</div>
<div class="price-low">
↓ {{ lowestPrice?.SEK_per_kWh || 0 | number:'1.2-2' }} kr kl {{ lowestPrice?.time_start | date:'HH:mm' }}
</div>
<div class="price-average">
{{ averagePrice | number:'1.2-2' }} kr snitt
</div>
</div>
</div>
}
<div class="chart-container">
@if (loading) {
<div class="loading">