insight-previous-tcr/src/pages/transaction/transaction.html

A blockchain explorer for Bitcore

<head-nav [chainNetwork]="chainNetwork"></head-nav>
<ion-content>
  <ion-grid fixed>

    <div class="page-content">

      <loader *ngIf="loading" [type]="'title'"></loader>

      <error [message]="errorMessage" *ngIf="!loading && errorMessage && confirmations !== -3 "></error>

      <div *ngIf="(!loading && !errorMessage) || confirmations === -3">
        <h1 ion-text>
          Transaction
          <ion-note *ngIf="vout !== undefined">
            <span class="tx-note" ion-text *ngIf="fromVout">Output {{ vout }}</span>
            <span class="tx-note" ion-text *ngIf="!fromVout">Input {{ vout }}</span>
          </ion-note>
        </h1>

        <p class="item-hash">
          <b>Transaction Hash</b> {{ tx.txid }} <button [copyToClipboard]="tx.txid">
            <ion-icon md="md-copy"></ion-icon>
          </button>
        </p>

        <h2>Summary</h2>

        <error [message]="errorMessage" *ngIf="!loading && errorMessage"></error>

        <ion-list class="list--summary">
          <ion-item>
            Size
            <ion-note item-end>
              {{ tx.size }} (bytes)
            </ion-note>
          </ion-item>
          <ion-item *ngIf="tx.fee >= 0">
            Fee Rate
            <ion-note item-end>
              {{ (tx.fee / tx.size) | number:'1.0-2' }} sats/byte
            </ion-note>
          </ion-item>
          <ion-item>
            Received Time
            <ion-note item-end>
              {{ tx.time * 1000 | date:'long' }}
            </ion-note>
          </ion-item>
          <ion-item *ngIf="confirmations > 0">
            Mined Time
            <ion-note item-end>
              {{ tx.blocktime * 1000 | date:'long' }}
            </ion-note>
          </ion-item>
          <ion-item>
            Included in Block
            <ion-note item-end>
              <a (click)="goToBlock(tx.blockhash)">{{ tx.blockhash }}</a>
            </ion-note>
            <ion-note *ngIf="confirmations === -3" item-end>
              Invalid
            </ion-note>
            <ion-note *ngIf="confirmations === -1" item-end>
              Unconfirmed
            </ion-note>
          </ion-item>
        </ion-list>

        <h2>Details</h2>

        <transaction [tx]="tx" [showCoins]="true" [chainNetwork]="chainNetwork"></transaction>
      </div>

    </div>

  </ion-grid>
</ion-content>
<footer [chainNetwork]="chainNetwork"></footer>