machankura/mempool
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Bisq stats page.

Browse Source 
BSQ prices.
This commit is contained in:
softsimon
2020-07-14 21:26:02 +07:00
parent cb3d21a2b2
commit 518629e144
21 changed files with 207 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files

85
frontend/src/app/bisq/bisq-stats/bisq-stats.component.html
View File

@@ -4,47 +4,52 @@
<div class="clearfix"></div>
<table class="table table-borderless table-striped">
<thead>
<th>Property</th>
<th>Value</th>
</thead>
<tbody *ngIf="!isLoading; else loadingTemplate">
<tr>
<td class="td-width">Existing amount</td>
<td>{{ (stats.minted - stats.burnt) / 100 | number: '1.2-2' }} BSQ</td>
</tr>
<tr>
<td>Minted amount</td>
<td>{{ stats.minted | number: '1.2-2' }} BSQ</td>
</tr>
<tr>
<td>Burnt amount</td>
<td>{{ stats.burnt | number: '1.2-2' }} BSQ</td>
</tr>
<tr>
<td>Addresses</td>
<td>{{ stats.addresses | number }}</td>
</tr>
<tr>
<td>Unspent TXOs</td>
<td>{{ stats.unspent_txos | number }}</td>
</tr>
<tr>
<td>Spent TXOs</td>
<td>{{ stats.spent_txos | number }}</td>
</tr>
<tr>
<td>Price</td>
<td></td>
</tr>
<tr>
<td>Market cap</td>
<td></td>
</tr>
</tbody>
</table>
<div class="row">
<div class="col-sm">
<table class="table table-borderless table-striped">
<thead>
<th>Property</th>
<th>Value</th>
</thead>
<tbody *ngIf="!isLoading; else loadingTemplate">
<tr>
<td class="td-width">Existing amount</td>
<td>{{ (stats.minted - stats.burnt) / 100 | number: '1.2-2' }} BSQ</td>
</tr>
<tr>
<td>Minted amount</td>
<td>{{ stats.minted | number: '1.2-2' }} BSQ</td>
</tr>
<tr>
<td>Burnt amount</td>
<td>{{ stats.burnt | number: '1.2-2' }} BSQ</td>
</tr>
<tr>
<td>Addresses</td>
<td>{{ stats.addresses | number }}</td>
</tr>
<tr>
<td>Unspent TXOs</td>
<td>{{ stats.unspent_txos | number }}</td>
</tr>
<tr>
<td>Spent TXOs</td>
<td>{{ stats.spent_txos | number }}</td>
</tr>
<tr>
<td>Price</td>
<td><app-fiat [value]="price"></app-fiat></td>
</tr>
<tr>
<td>Market cap</td>
<td><app-fiat [value]="price * (stats.minted - stats.burnt) / 100 "></app-fiat></td>
</tr>
</tbody>
</table>
</div>
<div class="col-sm"></div>
</div>
</div>
<ng-template #loadingTemplate>

6
frontend/src/app/bisq/bisq-stats/bisq-stats.component.scss
View File

@@ -1,5 +1,5 @@
.td-width {
width: 300px;
width: 250px;
}
@media (max-width: 767.98px) {
@@ -7,7 +7,3 @@
width: 175px;
}
}
.skeleton-loader {
width: 200px;
}

10
frontend/src/app/bisq/bisq-stats/bisq-stats.component.ts
View File

@@ -2,6 +2,7 @@ import { Component, OnInit } from '@angular/core';
import { BisqApiService } from '../bisq-api.service';
import { BisqStats } from '../bisq.interfaces';
import { SeoService } from 'src/app/services/seo.service';
import { StateService } from 'src/app/services/state.service';
@Component({
selector: 'app-bisq-stats',
@@ -11,15 +12,22 @@ import { SeoService } from 'src/app/services/seo.service';
export class BisqStatsComponent implements OnInit {
isLoading = true;
stats: BisqStats;
price: number;
constructor(
private bisqApiService: BisqApiService,
private seoService: SeoService,
private stateService: StateService,
) { }
ngOnInit(): void {
ngOnInit() {
this.seoService.setTitle('BSQ Statistics', false);
this.stateService.bsqPrice$
.subscribe((bsqPrice) => {
this.price = bsqPrice;
});
this.bisqApiService.getStats$()
.subscribe((stats) => {
this.isLoading = false;