copay/www/views/bitpayCard.html

94 lines
3.5 KiB
HTML

<ion-view id="bitpayCard">
<ion-nav-bar class="bar-royal">
<ion-nav-back-button>
</ion-nav-back-button>
<ion-nav-title>BitPay Card</ion-nav-title>
<ion-nav-buttons side="secondary">
<button class="button back-button" ng-show="!error" ui-sref="tabs.bitpayCard.preferences">
<i class="icon ion-ios-gear-outline"></i>
</button>
</ion-nav-buttons>
</ion-nav-bar>
<ion-content>
<div class="box-notification warning m0" ng-show="network == 'testnet'">
Sandbox version. Only for testing purpose
</div>
<div class="oh pr" ng-show="!error">
<div class="amount">
<div ng-if="bitpayCard.bitpayCardCurrentBalance" ng-click="bitpayCard.update()">
<div class="size-36 m20b">${{bitpayCard.bitpayCardCurrentBalance}}</div>
<a class="button button-positive button-small" ui-sref="tabs.bitpayCard.amount({'cardId': cardId, 'toName': 'BitPay Card'})">
<i class="icon ion-ios-plus-empty"></i> {{'Add Funds'|translate}}
</a>
</div>
<div ng-if="!bitpayCard.bitpayCardCurrentBalance" class="m10t">
<strong class="size-36">...</strong>
</div>
</div>
<div class="wallet-details-wallet-info">
<img style="height:0.6em" ng-show="loadingHistory" src="img/icon-sync-white.svg">
</div>
</div>
<div ng-show="error" class="text-center m10t assertive">
{{error}}
</div>
<div
class="m10t text-center padding"
ng-if="!loadingHistory && !bitpayCard.bitpayCardTransactionHistory[0] && !error">
<i class="icon ion-ios-arrow-thin-up size-24"></i>
<h1>Get started</h1>
<h4>Your BitPay Card is ready. Add funds to your card to start using your card at stores and ATMs worldwide.</h4>
</div>
<div class="list" ng-show="bitpayCard.bitpayCardTransactionHistory[0]">
<div class="item item-divider">
<select class="select-style" ng-model="dateRange" ng-change="bitpayCard.update(dateRange)">
<option value="last30Days">Recent Activity</option>
<option value="lastMonth">Last Month</option>
<option value="all">All Activity</option>
</select>
</div>
<div
ng-repeat="tx in bitpayCard.bitpayCardTransactionHistory | orderBy: ['pending','-timestamp']"
class="item row"
ng-init="bitpayCard.getMerchantInfo(tx)">
<div class="col col-10" ng-init="icon = bitpayCard.getIconName(tx)">
<img class="m5t" ng-src="img/mcc-icons/{{icon}}.svg" width="22">
</div>
<div class="col">
<div class="size-12 text-bold">
{{tx.merchant.name}}
</div>
<div class="size-12">
{{tx.merchant.city}}, {{tx.merchant.state}}
</div>
</div>
<div
ng-init="desc = bitpayCard.processDescription(tx)"
class="col size-12">
{{desc}}
</div>
<div class="col">
<img ng-show="!tx.pending" ng-src="img/check.svg" width="14">
<img ng-show="tx.pending" ng-src="img/sync.svg" width="14">
</div>
<div class="col text-right size-12 text-gray">
<div class="size-14"
ng-class="{
'text-success': tx.amount.indexOf('-') == -1 && !tx.pending,
'text-gray': tx.amount.indexOf('-') == -1 && tx.pending}">
{{tx.amount | currency:'$':2 }}
</div>
<time>{{tx.timestamp | amTimeAgo}}</time>
</div>
</div>
</div>
</ion-content>
</ion-view>