mempool/frontend/src/app/tx-bubble/tx-bubble.component.html
2019-11-12 16:39:59 +08:00

29 lines
1.4 KiB
HTML

<div class="txBubble" [ngStyle]="txBubbleStyle" *ngIf="txTrackingEnabled && tx">
<span class="txBubbleText" ngClass="arrow-{{ txBubbleArrowPosition }}">
<table style="width: 100%;">
<tr>
<td class="text-left"><b>Transaction hash</b></td>
<td class="text-right">
<a *ngIf="!isEsploraEnabled" href="https://www.blockstream.info/tx/{{ tx?.txid }}" target="_blank">{{ tx?.txid | shortenString }}</a>
<a *ngIf="isEsploraEnabled" [routerLink]="['/explorer/tx/', tx?.txid]">{{ tx?.txid | shortenString }}</a>
</td>
</tr>
<tr>
<td class="text-left"><b>Fee:</b></td>
<td class="text-right">{{ tx?.fee * 100000000 | number }} sats <span *ngIf="conversions">(<span class="green-color">{{ conversions.USD * tx?.fee | currency:'USD':'symbol':'1.2-2' }}</span>)</span></td>
</tr>
<tr>
<td class="text-left"><b>Fee per vByte:</b></td>
<td class="text-right">{{ tx?.feePerVsize | number : '1.2-2' }} sat/vB</td>
</tr>
</table>
<br />
<span *ngIf="txTrackingBlockHeight === 0">
<button type="button" class="btn btn-danger">Unconfirmed</button>
</span>
<span *ngIf="txTrackingBlockHeight > 0">
<button type="button" class="btn btn-success">{{ confirmations }} confirmation<span *ngIf="confirmations > 1">s</span></button>
</span>
</span>
</div>