dashboard.component.html 3.26 KB
Newer Older
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42
 <section id="breeze">
  <!-- CONTENT -->
  <section id="content" class="bitcoin">
    <!-- JUMBOTRON-->
    <div class="jumbotron jumbotron-fluid">
      <div class="container">
        <div class="row d-flex align-items-center">
          <div class="col-xs-12 col-md-4 text-left">
            <h5 class="text-uppercase">Active balance</h5>
            <p class="lead">
              <i class="icon-bitcoin"></i>
              <!--<strong><span class="h2">29</span>.76500293</strong>-->
              <strong>{{confirmedBalance | coinNotation }}</strong>
              <!--<small class="text-uppercase">btc</small>-->
            </p>
          </div>
          <!-- /col-->
          <!--<div class="col-xs-12 col-md-4 text-left">
            <h5 class="text-uppercase">Current value</h5>
            <p class="lead">
              <i class="icon-coin-dollar"></i>
              <strong><span class="h2">51,390</span></strong>
              <small class="text-uppercase">usd</small>
            </p>
          </div>-->
          <div class="col-xs-12 col-md-4 text-left">
            <h5 class="text-uppercase">Unconfirmed balance</h5>
            <p class="lead">
              <i class="icon-bitcoin"></i>
              <strong>{{unconfirmedBalance | coinNotation }}</strong>
            </p>
          </div>
          <!-- /col-->
          <div class="col-xs-12 col-md-4 text-right">
            <p>
              <a class="btn btn-secondary" data-toggle="modal" data-target="#modalReceive" role="button" (click)="openReceiveDialog()">Receive</a>
              <a class="btn btn-primary ml-2" data-toggle="modal" data-target="#modalSend" role="button" (click)="openSendDialog()">Send</a>
            </p>
          </div>
          <!-- /col-->
        </div>
        <!-- /row-->
43
      </div>
44
      <!-- /container-->
45
    </div>
46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65
    <!-- /JUMBOTRON-->

    <!-- TRANSACTIONS -->
    <section id="transaction" class="container">
      <h5 class="text-uppercase">Latest Transactions</h5>
      <div *ngIf="transactions; else noTransactions">
        <div *ngFor="let transaction of transactions; let i=index">
          <div class="card" *ngIf="i<3">
            <div class="card-block text-nowrap">
              <ul class="list-inline row">
                <li class="list-inline-item hidden-xs-down col text-uppercase align-bottom">{{ transaction.type }}</li>
                <li class="list-inline-item col-4 amount text-left align-baseline"><!--<span class="text-success">+</span>--> {{ transaction.amount | coinNotation }} <!--<small class="text-uppercase">btc</small> <span class="badge badge-danger text-capitalize">unconfirmed</span>--></li>
                <li class="list-inline-item hidden-sm-down col text-center align-baseline">{{ transaction.timestamp * 1000 | date:'medium' }}</li>
                <li class="list-inline-item col text-right align-baseline"><a data-toggle="modal" data-target="#modalDetail" (click)="openTransactionDetailDialog(transaction)">details</a></li>
              </ul>
            </div>
          </div>
          <!-- /card-->
        </div>
      </div>
66
      <ng-template #noTransactions>Looks like you haven't made any transactions yet</ng-template>
67 68 69 70 71 72 73
    </section>
    <!-- /TRANSACTIONS -->
    <status-bar></status-bar>
  </section>
  <!-- /CONTENT-->
</section>
<!-- /breeze-->