75 lines
3.6 KiB
HTML
75 lines
3.6 KiB
HTML
<div class="grid">
|
|
<ng-container *ngIf="workerInfo$ | async as workerInfo">
|
|
<div class="col-12 lg:col-6 xl:col-3">
|
|
<div class="card mb-0">
|
|
<div class="flex justify-content-between mb-3">
|
|
<div>
|
|
<span class="block text-500 font-medium mb-3">ID</span>
|
|
<div class="text-900 font-medium text-xl">{{workerInfo.name}}</div>
|
|
</div>
|
|
<div class="flex align-items-center justify-content-center bg-blue-100 border-round"
|
|
[ngStyle]="{width: '2.5rem', height: '2.5rem'}">
|
|
<i class="pi pi-id-card text-blue-500 text-xl"></i>
|
|
</div>
|
|
</div>
|
|
<!-- <span class="text-green-500 font-medium">24 new </span> -->
|
|
<span class="text-500"> </span>
|
|
</div>
|
|
</div>
|
|
<div class="col-12 lg:col-6 xl:col-3">
|
|
<div class="card mb-0">
|
|
<div class="flex justify-content-between mb-3">
|
|
<div>
|
|
<span class="block text-500 font-medium mb-3">Best Difficulty</span>
|
|
<div class="text-900 font-medium text-xl">{{workerInfo.bestDifficulty | numberSuffix}}
|
|
</div>
|
|
</div>
|
|
<div class="flex align-items-center justify-content-center bg-orange-100 border-round"
|
|
[ngStyle]="{width: '2.5rem', height: '2.5rem'}">
|
|
<i class="pi pi-star text-orange-500 text-xl"></i>
|
|
</div>
|
|
</div>
|
|
<span class="text-green-500 font-medium">{{workerInfo.bestDifficulty | number}}</span>
|
|
</div>
|
|
</div>
|
|
<!-- <div class="col-12 lg:col-6 xl:col-3">
|
|
<div class="card mb-0">
|
|
<div class="flex justify-content-between mb-3">
|
|
<div>
|
|
<span class="block text-500 font-medium mb-3">Uptime</span>
|
|
<div class="text-900 font-medium text-xl">{{workerInfo.startTime | dateAgo}}</div>
|
|
</div>
|
|
<div class="flex align-items-center justify-content-center bg-cyan-100 border-round"
|
|
[ngStyle]="{width: '2.5rem', height: '2.5rem'}">
|
|
<i class="pi pi-clock text-cyan-500 text-xl"></i>
|
|
</div>
|
|
</div>
|
|
|
|
<span class="text-500">Since {{workerInfo.startTime | date : 'short'}}</span>
|
|
</div>
|
|
</div> -->
|
|
<!-- <div class="col-12 lg:col-6 xl:col-3">
|
|
<div class="card mb-0">
|
|
<div class="flex justify-content-between mb-3">
|
|
<div>
|
|
<span class="block text-500 font-medium mb-3">Comments</span>
|
|
<div class="text-900 font-medium text-xl">152 Unread</div>
|
|
</div>
|
|
<div class="flex align-items-center justify-content-center bg-purple-100 border-round"
|
|
[ngStyle]="{width: '2.5rem', height: '2.5rem'}">
|
|
<i class="pi pi-comment text-purple-500 text-xl"></i>
|
|
</div>
|
|
</div>
|
|
<span class="text-green-500 font-medium">85 </span>
|
|
<span class="text-500">responded</span>
|
|
</div>
|
|
</div> -->
|
|
</ng-container>
|
|
|
|
|
|
<div class="col-12" *ngIf="chartData$ | async as chartData">
|
|
<div class="card chart">
|
|
<p-chart type="line" [data]="chartData" [options]="chartOptions"></p-chart>
|
|
</div>
|
|
</div>
|
|
</div> |