68 lines
1.9 KiB
HTML
68 lines
1.9 KiB
HTML
<div class="lists"><span>Wybierz urządzenie:</span></div>
|
|
<div class="machine-list">
|
|
<div class="row row-list">
|
|
<div class="col-md-3 col-xs-3" *ngFor="let device of devices">
|
|
<button
|
|
class="room-button"
|
|
[ngStyle]="{
|
|
color: device.lastStatus == 1 ? 'red' : 'green',
|
|
borderColor: device.lastStatus == 1 ? 'red' : 'green'
|
|
}"
|
|
>
|
|
{{ device.name }}
|
|
</button>
|
|
<b>{{ device.lastStatus == 1 ? "Zajęte" : "Wolne" }}</b>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row machine-row">
|
|
<div class="col-md-5 col-xs-11">
|
|
<p class="text-center machine-text">
|
|
- <span>{{ activeDevice.name }}</span> -
|
|
</p>
|
|
|
|
<p class="machine-status">
|
|
Status:
|
|
<img
|
|
[src]="
|
|
activeDevice.lastStatus == 1
|
|
? '../assets/img/busy.png'
|
|
: '../assets/img/free.png'
|
|
"
|
|
alt=""
|
|
/>
|
|
<span>{{ activeDevice.lastStatus == 1 ? "Zajęte" : "Wolne" }}</span>
|
|
</p>
|
|
<p *ngIf="activeDevice.lastStatus == 1" class="machine-status2">
|
|
Zajęte od: <span>{{ this.time }}</span>
|
|
</p>
|
|
</div>
|
|
<div class="col-md-7 col-xs-1">
|
|
<img
|
|
class="machine-image"
|
|
src="../assets/img/football2.jpg"
|
|
alt="{{ status }}"
|
|
/>
|
|
</div>
|
|
</div>
|
|
<div class="row statistics-row">
|
|
<div class="col-md-6 stat-wrapper">
|
|
<p class="stat-text"><span>Statystyki szczegółowe:</span></p>
|
|
<ul class="list-group">
|
|
<p style="margin-bottom:15px">
|
|
<span>Średni czas gry: </span> <span class="boldMe">23</span
|
|
><span> min</span><br />
|
|
</p>
|
|
|
|
<span>Przewidywane zakończenie: </span>
|
|
<span class="boldMe">10</span
|
|
><span> min</span>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div id="tabel" class="col-md-6"><canvas id="lineChart"></canvas></div>
|
|
<div id="tabel" class="col-md-6"><canvas id="barChart"></canvas></div>
|
|
</div>
|