UI styling. Improve error handle
This commit is contained in:
parent
d0ac2e4fa4
commit
0b3cb389ae
6 changed files with 132 additions and 80 deletions
|
|
@ -142,13 +142,21 @@ angular.module('copayApp.controllers').controller('buyMercadoLibreController', f
|
|||
var checkTransaction = lodash.throttle(function(count, dataSrc) {
|
||||
mercadoLibreService.createGiftCard(dataSrc, function(err, giftCard) {
|
||||
$log.debug("creating gift card " + count);
|
||||
if (err || !giftCard.pin) {
|
||||
if (err) {
|
||||
$scope.sendStatus = '';
|
||||
ongoingProcess.set('buyingGiftCard', false, statusChangeHandler);
|
||||
giftCard = {};
|
||||
giftCard.status = 'FAILURE';
|
||||
}
|
||||
|
||||
if (giftCard && giftCard.cardStatus && (giftCard.cardStatus != 'active' && giftCard.cardStatus != 'inactive' && giftCard.cardStatus != 'expired')) {
|
||||
$scope.sendStatus = '';
|
||||
ongoingProcess.set('buyingGiftCard', false, statusChangeHandler);
|
||||
giftCard = {};
|
||||
giftCard.status = 'FAILURE';
|
||||
}
|
||||
|
||||
|
||||
if (giftCard.status == 'PENDING' && count < 3) {
|
||||
$log.debug("Waiting for payment confirmation");
|
||||
checkTransaction(count + 1, dataSrc);
|
||||
|
|
|
|||
|
|
@ -24,18 +24,15 @@ angular.module('copayApp.controllers').controller('mercadoLibreCardsController',
|
|||
};
|
||||
|
||||
$scope.updatePendingGiftCards = lodash.debounce(function() {
|
||||
$scope.updatingPending = {};
|
||||
updateGiftCards(function() {
|
||||
var index = 0;
|
||||
var gcds = $scope.giftCards;
|
||||
lodash.forEach(gcds, function(dataFromStorage) {
|
||||
if (dataFromStorage.status == 'PENDING' || dataFromStorage.status == 'invalid') {
|
||||
if (dataFromStorage.status == 'PENDING') {
|
||||
$log.debug("Creating / Updating gift card");
|
||||
$scope.updatingPending[dataFromStorage.invoiceId] = true;
|
||||
|
||||
mercadoLibreService.createGiftCard(dataFromStorage, function(err, giftCard) {
|
||||
|
||||
$scope.updatingPending[dataFromStorage.invoiceId] = false;
|
||||
if (err) {
|
||||
popupService.showAlert('Error creating gift card', err);
|
||||
return;
|
||||
|
|
@ -44,6 +41,12 @@ angular.module('copayApp.controllers').controller('mercadoLibreCardsController',
|
|||
if (giftCard.status != 'PENDING') {
|
||||
var newData = {};
|
||||
|
||||
if (!giftCard.status) dataFromStorage.status = null; // Fix error from server
|
||||
|
||||
var cardStatus = giftCard.cardStatus;
|
||||
if (cardStatus && (cardStatus != 'active' && cardStatus != 'inactive' && cardStatus != 'expired'))
|
||||
giftCard.status = 'FAILURE';
|
||||
|
||||
lodash.merge(newData, dataFromStorage, giftCard);
|
||||
|
||||
mercadoLibreService.savePendingGiftCard(newData, null, function(err) {
|
||||
|
|
|
|||
|
|
@ -140,7 +140,7 @@ angular.module('copayApp.services').factory('mercadoLibreService', function($htt
|
|||
$log.info('Mercado Libre Gift Card Create/Update: ' + status);
|
||||
return cb(null, data.data);
|
||||
}, function(data) {
|
||||
$log.error('Mercado Libre Gift Card Create/Update: ' + data.data.message);
|
||||
$log.error('Mercado Libre Gift Card Create/Update: ', JSON.stringify(data.data));
|
||||
return cb(data.data);
|
||||
});
|
||||
};
|
||||
|
|
|
|||
|
|
@ -144,3 +144,50 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
#meli-card {
|
||||
.card-head {
|
||||
margin: 20px 0;
|
||||
text-align: center;
|
||||
.date {
|
||||
font-size: 12px;
|
||||
margin: 10px 0;
|
||||
}
|
||||
.amount {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
.card-status {
|
||||
text-align: center;
|
||||
margin-bottom: 25px;
|
||||
.card-status-desc {
|
||||
margin-top: 5px;
|
||||
font-size: 12px;
|
||||
color: $v-text-secondary-color;
|
||||
}
|
||||
.redeem-pin {
|
||||
font-weight: bold;
|
||||
font-size: 22px;
|
||||
}
|
||||
.button-redeem {
|
||||
margin-top: 10px;
|
||||
background: transparent;
|
||||
border: none;
|
||||
font-size: 12px;
|
||||
color: $v-text-accent-color;
|
||||
}
|
||||
}
|
||||
.card-remove {
|
||||
text-align: center;
|
||||
margin-top: 30px;
|
||||
.button-remove {
|
||||
margin-top: 10px;
|
||||
background: transparent;
|
||||
border: none;
|
||||
font-size: 12px;
|
||||
color: red;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -12,19 +12,20 @@
|
|||
class="item item-avatar"
|
||||
ng-hide="hideCards">
|
||||
<img src="img/mercado-libre/icon-ml.svg" alt="{{id}}" width="40">
|
||||
<ion-spinner class="spinner-dark recent right m10 size-16" icon="crescent" ng-show="updatingPending[item.invoiceId]">
|
||||
</ion-spinner>
|
||||
|
||||
<span class="item-note">
|
||||
<span class="assertive" ng-if="item.status == 'FAILURE'" translate>Error</span>
|
||||
<span class="dark" ng-if="item.status == 'expired'" translate>Invoice expired</span>
|
||||
<span class="calm" ng-if="item.status == 'invalid'" translate>Still pending</span>
|
||||
<span class="positive" ng-if="item.status == 'PENDING'" translate>Pending</span>
|
||||
|
||||
<span class="assertive" ng-if="item.cardStatus == 'inactive'" translate>Inactive</span>
|
||||
<span class="assertive" ng-if="item.cardStatus == 'expired'" translate>Expired</span>
|
||||
</span>
|
||||
<h2 ng-if="item.amount">
|
||||
{{item.amount | currency : '$ ' : 2}} {{item.currency}}
|
||||
</h2>
|
||||
<p>
|
||||
<span class="assertive" ng-if="item.status == 'FAILURE' || item.status == 'RESEND'">Error</span>
|
||||
<span class="assertive" ng-if="item.status == 'expired'">Expired</span>
|
||||
<span class="assertive" ng-if="item.status == 'invalid'">Still waiting confirmation<br> (Use higher fees setting to faster delivery)</span>
|
||||
<span class="text-gray" ng-if="item.status == 'PENDING'">Pending to confirmation</span>
|
||||
<span class="assertive" ng-if="item.status == 'SUCCESS' && item.cardStatus == 'Canceled'">Canceled</span>
|
||||
<span class="text-gray">{{item.date | amTimeAgo}}</span>
|
||||
</p>
|
||||
{{item.amount | currency : '' : 2}} {{item.currency}}
|
||||
</h2>
|
||||
<p class="dark">{{item.date | amTimeAgo}}</p>
|
||||
</div>
|
||||
</div>
|
||||
</ion-content>
|
||||
|
|
|
|||
|
|
@ -1,82 +1,75 @@
|
|||
<ion-modal-view ng-controller="mercadoLibreCardDetailsController">
|
||||
<ion-modal-view id="meli-card" ng-controller="mercadoLibreCardDetailsController">
|
||||
<ion-header-bar align-title="center" class="bar-royal">
|
||||
<button class="button button-back button-clear" ng-click="cancel()">
|
||||
<button class="button button-back button-clear" ng-click="cancel()" translate>
|
||||
Close
|
||||
</button>
|
||||
<h1 class="title">Details</h1>
|
||||
<h1 class="title" translate>Details</h1>
|
||||
</ion-header-bar>
|
||||
|
||||
<ion-content>
|
||||
|
||||
<div class="header-modal text-center">
|
||||
<img src="img/mercado-libre/giftcard-pt.svg" alt="Mercado Libre Gift Card" width="230" ng-click="refreshGiftCard()">
|
||||
<div class="card-head">
|
||||
<img src="img/mercado-libre/giftcard-pt.svg" alt="Mercado Libre Gift Card" width="230" ng-click="refreshGiftCard()">
|
||||
|
||||
<div class="m10t">
|
||||
Gift Card Amount:
|
||||
<span class="text-bold">
|
||||
{{card.amount | currency : '$ ' : 2}}
|
||||
</span>
|
||||
</div>
|
||||
<div class="amount">
|
||||
{{card.amount | currency : '' : 2}} {{card.currency}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-status">
|
||||
<div ng-show="card.cardStatus == 'active'">
|
||||
<div class="redeem-pin" copy-to-clipboard="card.pin">{{card.pin}}</div>
|
||||
<button class="button-redeem"
|
||||
ng-click="openExternalLink('https://www.mercadolivre.com.br/redeem?pin=' + card.pin)" translate>
|
||||
Redeem Now
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="m10t">
|
||||
<span translate>Created</span>
|
||||
<div ng-show="card.cardStatus == 'inactive'">
|
||||
<span class="assertive" translate>Inactive</span>
|
||||
<div class="card-status-desc" translate>Gift Card is not available to use anymore</div>
|
||||
</div>
|
||||
|
||||
<div ng-show="card.cardStatus == 'expired'">
|
||||
<span class="assertive" translate>Expired</span>
|
||||
<div class="card-status-desc" translate>Gift Card is not available to use anymore</div>
|
||||
</div>
|
||||
|
||||
<div ng-show="card.status">
|
||||
<span class="positive" ng-show="card.status == 'PENDING'" translate>
|
||||
Pending
|
||||
</span>
|
||||
<span class="calm" ng-show="card.status=='invalid'" translate>
|
||||
Still pending
|
||||
</span>
|
||||
<span class="assertive" ng-show="card.status == 'FAILURE'" translate>
|
||||
Error
|
||||
</span>
|
||||
<span class="dark" ng-show="card.status == 'expired'" translate>
|
||||
Invoice expired
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="list">
|
||||
<div class="item">
|
||||
<span translate>Created</span>
|
||||
<span class="item-note">
|
||||
{{card.date | amTimeAgo}}
|
||||
</div>
|
||||
|
||||
|
||||
<div ng-show="card.pin">
|
||||
<div ng-show="card.cardStatus !== 'inactive' && card.cardStatus !== 'expired'">
|
||||
Claim code: <span class="text-bold" copy-to-clipboard="card.pin">{{card.pin}}</span>
|
||||
</div>
|
||||
<div class="m10t" ng-show="card.status == 'active'">
|
||||
<button class="button button-positive"
|
||||
ng-click="openExternalLink('https://www.mercadolivre.com.br/redeem?pin=' + card.pin)">
|
||||
Redeem Now
|
||||
</button>
|
||||
</div>
|
||||
<div class="m10t" ng-show="card.cardStatus == 'inactive'">
|
||||
<div class="m10t">
|
||||
Status:
|
||||
<span class="text-bold">
|
||||
Inactive
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div ng-show="!card.pin">
|
||||
<div class="m10t">
|
||||
Status:
|
||||
<span class="text-bold" ng-show="card.status == 'PENDING'">
|
||||
PENDING
|
||||
</span>
|
||||
<span class="text-bold" ng-show="card.status=='invalid'">
|
||||
STILL PENDING
|
||||
</span>
|
||||
|
||||
<span class="text-bold" ng-show="card.status == 'FAILURE' || card.status == 'RESEND'">
|
||||
FAILURE
|
||||
</span>
|
||||
<span class="text-bold" ng-show="card.status == 'expired'">
|
||||
EXPIRED
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="m10t text-center">
|
||||
<a class="button button-clear button-calm" ng-click="openExternalLink(card.invoiceUrl)">See invoice</a>
|
||||
</div>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="box-notification warning" ng-show="card.status == 'FAILURE' || card.status == 'RESEND'">
|
||||
There was a failure to the create gift card. Please, contact BitPay support.
|
||||
<div class="item item-icon-right" ng-click="openExternalLink(card.invoiceUrl)" translate>
|
||||
<i class="icon bp-arrow-right"></i>
|
||||
See invoice
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="list text-center">
|
||||
<a class="item" ng-show="card.status == 'FAILURE' || card.cardStatus == 'Canceled'
|
||||
|| card.cardStatus == 'Expired' || card.status == 'expired'" ng-click="remove()">
|
||||
<span class="assertive">Remove</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="card-remove" ng-show="card.status == 'FAILURE' || card.cardStatus == 'inactive' || card.cardStatus == 'expired' || card.status == 'expired'">
|
||||
<button class="button-remove" ng-click="remove()" translate>
|
||||
Remove
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</ion-content>
|
||||
</ion-modal-view>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue