Bisq markets dashboard: 24H Volume. WIP.

This commit is contained in:
softsimon
2021-02-28 17:18:29 +07:00
parent eeb7447988
commit 38e866995f
7 changed files with 63 additions and 13 deletions

View File

@@ -4,20 +4,28 @@
<table class="table table-borderless table-striped">
<thead>
<th style="width: 20%;" i18n>Coin</th>
<th class="d-none d-md-block" style="width: 100%;" i18n>Pair</th>
<th style="width: 20%;" i18n>Price</th>
<th style="width: 20%;" i18n>24h volume</th>
<th class="d-none d-md-block" i18n>Volume %</th>
<th i18n>Rank</th>
<th i18n>Currency</th>
<th i18n>Pair</th>
<th i18n>Price</th>
<th i18n>Volume (24h)</th>
<th i18n>Trades (24h)</th>
</thead>
<tbody *ngIf="tickers.value; else loadingTmpl">
<tr *ngFor="let ticker of tickers.value; trackBy: trackByFn">
<tr *ngFor="let ticker of tickers.value; trackBy: trackByFn; let i = index">
<td>{{ i + 1 }}</td>
<td>{{ ticker.market.lname }}</td>
<td><a [routerLink]="['/market' | relativeUrl, ticker.pair_url]">{{ ticker.pair }}</a></td>
<td>
<app-fiat *ngIf="ticker.market.rtype === 'crypto'; else fiat" [value]="ticker.last * 100000000"></app-fiat>
<ng-template #fiat><span class="green-color">{{ ticker.last | currency: ticker.market.rsymbol }}</span></ng-template>
<ng-template #fiat>
<span class="green-color">{{ ticker.last | currency: ticker.market.rsymbol }}</span>
</ng-template>
</td>
<td>
<app-fiat [value]="ticker.volume?.volume"></app-fiat>
</td>
<td>{{ ticker.volume?.num_trades }}</td>
</tr>
</tbody>
</table>
@@ -29,6 +37,6 @@
<ng-template #loadingTmpl>
<tr *ngFor="let i of [1,2,3,4,5,6,7,8,9,10]">
<td *ngFor="let j of [1, 2, 3, 4, 5]"><span class="skeleton-loader"></span></td>
<td *ngFor="let j of [1, 2, 3, 4, 5, 6]"><span class="skeleton-loader"></span></td>
</tr>
</ng-template>