improvements on the card UI on pending and pre-auth holds and underpaid situations
This commit is contained in:
parent
a4495f73fc
commit
221ab9c87a
7 changed files with 160 additions and 56 deletions
|
|
@ -46,12 +46,23 @@
|
|||
class="text-center padding get-started"
|
||||
ng-show="bitpayCard.getStarted">
|
||||
<i class="icon ion-ios-arrow-thin-up get-started__arrow"></i>
|
||||
<h1>Get started</h1>
|
||||
<div class="get-started__text">
|
||||
<h1 translate>Get started</h1>
|
||||
<div class="get-started__text" translate>
|
||||
Your BitPay Card is ready. Add funds to your card to start using your card at stores and ATMs worldwide.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div ng-if="bitpayCard.bitpayCardTransactionHistoryConfirming[0] && !bitpayCard.underpaidInvoiceInList && bitpayCard.delayedInvoiceInList" class="comment">
|
||||
<span translate>Confirming transactions take up to 1 block confirmation to proccess.</span>
|
||||
<a ng-click="bitpayCard.openExternalLink('https://help.bitpay.com/bitpay-card/why-do-you-require-one-blockchain-confirmation-for-bitpay-card-loads')" translate>Learn More</a>
|
||||
</div>
|
||||
<div ng-if="bitpayCard.bitpayCardTransactionHistoryConfirming[0] && bitpayCard.underpaidInvoiceInList" class="comment">
|
||||
<span translate>Confirming load transactions that are underpaid may require at least six blockchain confirmations to process.</span>
|
||||
<a ng-click="bitpayCard.openExternalLink('https://help.bitpay.com/bitpay-card/why-do-you-require-one-blockchain-confirmation-for-bitpay-card-loads')" translate>Learn More</a>
|
||||
</div>
|
||||
<div ng-if="bitpayCard.bitpayCardTransactionHistoryPreAuth[0]" class="comment">
|
||||
<span translate>(Pre-Auth Holds transactions) The merchant has initiated a hold to make those funds unavailable until your transaction to them has fully settled. Funds are released within 30 days at the latest in the event the merchant decides not to complete the transaction.</span>
|
||||
<a ng-click="bitpayCard.openExternalLink('https://help.bitpay.com/bitpay-card/why-was-i-overcharged-on-my-bitpay-card-account-why-is-there-a-hold-on-my-account')" translate>Learn More</a>
|
||||
</div>
|
||||
<div class="list" ng-show="!bitpayCard.getStarted">
|
||||
<label class="item item-input item-select">
|
||||
<div class="input-label" translate>
|
||||
|
|
@ -63,46 +74,34 @@
|
|||
<option value="all" translate>All</option>
|
||||
</select>
|
||||
</label>
|
||||
<div ng-if="bitpayCard.bitpayCardTransactionHistory[0]"
|
||||
ng-repeat="tx in bitpayCard.bitpayCardTransactionHistory"
|
||||
class="item row">
|
||||
<div class="col col-10 text-center">
|
||||
<div class="tu size-12">{{tx.timestamp | amDateFormat:'MMM'}}</div>
|
||||
<div class="text-light">{{tx.timestamp | amDateFormat:'DD'}}</div>
|
||||
</div>
|
||||
<div class="col col-10">
|
||||
<img class="m15t" ng-src="img/mcc-icons/{{tx.icon}}.svg" width="24">
|
||||
</div>
|
||||
|
||||
<div class="col col-50">
|
||||
<div class="size-12 text-bold">
|
||||
{{tx.merchant.name || 'Unknown Merchant'}}
|
||||
<div ng-if="bitpayCard.bitpayCardTransactionHistoryConfirming[0]">
|
||||
<label class="item status-label">
|
||||
<div translate>
|
||||
Confirming
|
||||
</div>
|
||||
<div class="size-12 text-gray">
|
||||
<span ng-show="tx.merchant.city && tx.merchant.state">{{tx.merchant.location}}</span>
|
||||
<span ng-class="{'m5l':tx.merchant.city && tx.merchant.state}">
|
||||
{{tx.timestamp | amDateFormat:'h:mm A'}}
|
||||
</span>
|
||||
</label>
|
||||
<div ng-repeat="tx in bitpayCard.bitpayCardTransactionHistoryConfirming">
|
||||
<span ng-include="'views/includes/cardActivity.html'"></span>
|
||||
</div>
|
||||
</div>
|
||||
<div ng-if="bitpayCard.bitpayCardTransactionHistoryPreAuth[0]">
|
||||
<label class="item status-label">
|
||||
<div translate>
|
||||
Pre-Auth Holds
|
||||
</div>
|
||||
</label>
|
||||
<div ng-repeat="tx in bitpayCard.bitpayCardTransactionHistoryPreAuth">
|
||||
<span ng-include="'views/includes/cardActivity.html'"></span>
|
||||
</div>
|
||||
<!--
|
||||
<div class="col size-12">
|
||||
{{tx.desc}}
|
||||
</div>
|
||||
<div class="col col-10 text-center p10t">
|
||||
<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">
|
||||
<div ng-class="{
|
||||
'balanced': tx.price.toString().indexOf('-') == -1 && !tx.pending,
|
||||
'stable': tx.price.toString().indexOf('-') == -1 && tx.pending}">
|
||||
<span ng-show="tx.price.toString().indexOf('-') == -1 && !tx.pending">+ </span>
|
||||
{{tx.price | currency:'$':2 }}
|
||||
</div>
|
||||
<div ng-if="bitpayCard.bitpayCardTransactionHistoryCompleted[0]">
|
||||
<label ng-if="bitpayCard.bitpayCardTransactionHistoryConfirming[0]" class="item status-label">
|
||||
<div translate>
|
||||
Completed
|
||||
</div>
|
||||
<time class="size-12 text-gray" ng-if="!tx.pending">{{tx.runningBalance | currency:'$':2}}</time>
|
||||
<span class="size-12 text-gray text-italic" ng-if="tx.pending" class="tu" translate>Pending</span>
|
||||
</label>
|
||||
<div ng-repeat="tx in bitpayCard.bitpayCardTransactionHistoryCompleted">
|
||||
<span ng-include="'views/includes/cardActivity.html'"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue