Bug fixes UI from walletDetails
This commit is contained in:
parent
09eaaa1536
commit
bf0f5f451a
4 changed files with 83 additions and 136 deletions
|
|
@ -156,9 +156,7 @@ angular.module('copayApp.controllers').controller('walletDetailsController', fun
|
|||
|
||||
var updateTxHistory = function(cb) {
|
||||
if (!cb) cb = function() {};
|
||||
if ($scope.updatingTxHistory) return;
|
||||
|
||||
$scope.updatingTxHistory = true;
|
||||
$scope.updateTxHistoryError = false;
|
||||
$scope.updatingTxHistoryProgress = 0;
|
||||
|
||||
|
|
@ -358,6 +356,8 @@ angular.module('copayApp.controllers').controller('walletDetailsController', fun
|
|||
if (!$scope.wallet) return;
|
||||
$scope.requiresMultipleSignatures = $scope.wallet.credentials.m > 1;
|
||||
|
||||
$scope.updatingTxHistory = true;
|
||||
|
||||
addressbookService.list(function(err, ab) {
|
||||
if (err) $log.error(err);
|
||||
$scope.addressbook = ab || {};
|
||||
|
|
|
|||
|
|
@ -88,6 +88,27 @@
|
|||
padding: 1rem;
|
||||
background: #f8f8f9;
|
||||
}
|
||||
|
||||
&__no-transaction {
|
||||
color: $v-mid-gray;
|
||||
font-size: 12.5px;
|
||||
text-align: center;
|
||||
padding-top: 2rem;
|
||||
}
|
||||
|
||||
&__no-update-history {
|
||||
color: $v-error-color;
|
||||
font-size: 12.5px;
|
||||
text-align: center;
|
||||
padding-top: 2rem;
|
||||
}
|
||||
|
||||
&__updating-history {
|
||||
color: $v-mid-gray;
|
||||
font-size: 12.5px;
|
||||
text-align: center;
|
||||
padding-top: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
#walletDetails {
|
||||
|
|
@ -177,10 +198,6 @@
|
|||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
&.collapsible {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
&__balance {
|
||||
-webkit-transform: scale3d(1, 1, 1) translateY(45px);
|
||||
transform: scale3d(1, 1, 1) translateY(45px);
|
||||
|
|
@ -200,6 +217,15 @@
|
|||
border: 1px solid rgba(255,255,255,0.25);
|
||||
}
|
||||
|
||||
&__error {
|
||||
cursor: pointer;
|
||||
font-size: 14px;
|
||||
padding: 35px 20px;
|
||||
}
|
||||
|
||||
}
|
||||
.no-alternative {
|
||||
padding-top: 45px;
|
||||
}
|
||||
.item.item-footer {
|
||||
font-weight: lighter;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
|
||||
<ion-spinner class="spinner-dark recent right" icon="crescent" ng-show="updatingStatus || (updatingTxHistory && updatingTxHistoryProgress<=5)" ></ion-spinner>
|
||||
<ion-spinner class="spinner-dark recent right" icon="crescent" ng-show="(updatingStatus || updatingTxHistory) &&
|
||||
!walletNotRegistered && !updateStatusError && !updateTxHistoryError"></ion-spinner>
|
||||
|
||||
<div>
|
||||
<span ng-show="wallet.status.wallet.singleAddress" class="size-12"><span translate>Auditable</span></span>
|
||||
|
|
|
|||
|
|
@ -14,72 +14,59 @@
|
|||
<div class="bp-content" ng-class="{'status-bar': isCordova}">
|
||||
|
||||
<div class="amount-wrapper" ng-show="wallet && wallet.isComplete() && amountIsCollapsible" ng-class="{'wallet-background-color-default': !wallet.color}" ng-style="{'background-color':wallet.color}">
|
||||
<div
|
||||
class="amount-bg"
|
||||
ng-style="{'background-color':wallet.color}"
|
||||
ng-class="{collapsible: amountIsCollapsible, 'wallet-background-color-default': !wallet.color}"
|
||||
></div>
|
||||
|
||||
<div
|
||||
ng-style="{'background-color':wallet.color, 'height': amountHeight}"
|
||||
class="amount"
|
||||
ng-class="{collapsible: amountIsCollapsible, 'wallet-background-color-default': !wallet.color}"
|
||||
ng-class="{collapsible: amountIsCollapsible, 'wallet-background-color-default': !wallet.color, 'no-alternative': wallet.network != 'livenet'}"
|
||||
>
|
||||
<div ng-if="!notAuthorized && !updatingStatus">
|
||||
|
||||
<div ng-show="updateStatusError">
|
||||
<span class="size-12 db m10">{{updateStatusError}}</span>
|
||||
<a class="button button-outline button-light button-small" ng-click='updateAll(true)' translate>Tap to retry</a>
|
||||
</div>
|
||||
<div class="amount__error" ng-style="{opacity: altAmountOpacity}" ng-show="updateStatusError" ng-click="updateAll(true)">
|
||||
<span>{{updateStatusError}}</span>
|
||||
</div>
|
||||
|
||||
<div ng-show="walletNotRegistered">
|
||||
<span class="size-12 db m10" translate>This wallet is not registered at the given Bitcore Wallet Service (BWS). You can recreate it from the local information.</span>
|
||||
<a class="button button-outline button-light button-small" ng-click='recreate()' translate>Recreate</a>
|
||||
</div>
|
||||
<div class="amount__error" ng-style="{opacity: altAmountOpacity}" ng-show="walletNotRegistered" ng-click="recreate()">
|
||||
<span translate>This wallet is not registered at the given Bitcore Wallet Service (BWS). You can recreate it from the local information.</span>
|
||||
</div>
|
||||
|
||||
<div
|
||||
ng-click='updateAll(true)'
|
||||
ng-show="!updateStatusError && !wallet.balanceHidden"
|
||||
on-hold="hideToggle()"
|
||||
ng-style="{'transform': amountScale}"
|
||||
ng-class="{amount__balance: amountIsCollapsible}">
|
||||
<strong class="size-36">{{status.totalBalanceStr}}</strong>
|
||||
<div
|
||||
ng-click='updateAll(true)'
|
||||
ng-show="!updateStatusError && !wallet.balanceHidden"
|
||||
on-hold="hideToggle()"
|
||||
ng-style="{'transform': amountScale}"
|
||||
ng-class="{amount__balance: amountIsCollapsible}">
|
||||
<strong class="size-36">{{status.totalBalanceStr}}</strong>
|
||||
<div
|
||||
class="size-14 amount-alternative"
|
||||
ng-if="status.totalBalanceAlternative && wallet.network == 'livenet'"
|
||||
ng-style="{opacity: altAmountOpacity}">
|
||||
{{status.totalBalanceAlternative}} {{status.alternativeIsoCode}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div ng-style="{'transform': amountScale}"
|
||||
class="amount__balance"
|
||||
ng-show="!updateStatusError && wallet.balanceHidden"
|
||||
on-hold="hideToggle()">
|
||||
<strong class="size-24" translate>[Balance Hidden]</strong>
|
||||
<div ng-style="{opacity: altAmountOpacity}" class="size-14 amount-alternative" translate>
|
||||
Tap and hold to show
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div ng-if="!wallet.balanceHidden && showBalanceButton" ng-style="{'opacity': altAmountOpacity, 'transform': amountScale}">
|
||||
<button class="button button-standard button-primary amount__button-balance size-14" ng-click="openBalanceModal()">
|
||||
<i class="icon ion-ios-checkmark-outline"></i>
|
||||
<strong>
|
||||
{{status.spendableBalanceStr}}
|
||||
</strong>
|
||||
|
||||
<span>
|
||||
{{status.spendableBalanceAlternative}} {{status.alternativeIsoCode}}
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div ng-if="updatingStatus" class="amount__updating">
|
||||
<div class="size-36">
|
||||
<strong>...</strong>
|
||||
class="size-14 amount-alternative"
|
||||
ng-if="status.totalBalanceAlternative && wallet.network == 'livenet'"
|
||||
ng-style="{opacity: altAmountOpacity}">
|
||||
{{status.totalBalanceAlternative}} {{status.alternativeIsoCode}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div ng-style="{'transform': amountScale}"
|
||||
class="amount__balance"
|
||||
ng-show="!updateStatusError && wallet.balanceHidden"
|
||||
on-hold="hideToggle()">
|
||||
<strong class="size-24" translate>[Balance Hidden]</strong>
|
||||
<div ng-style="{opacity: altAmountOpacity}" class="size-14 amount-alternative" translate>
|
||||
Tap and hold to show
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div ng-if="!wallet.balanceHidden && showBalanceButton" ng-style="{'opacity': altAmountOpacity, 'transform': amountScale}">
|
||||
<button class="button button-standard button-primary amount__button-balance size-14" ng-click="openBalanceModal()">
|
||||
<i class="icon ion-ios-checkmark-outline"></i>
|
||||
<strong>
|
||||
{{status.spendableBalanceStr}}
|
||||
</strong>
|
||||
|
||||
<span>
|
||||
{{status.spendableBalanceAlternative}} {{status.alternativeIsoCode}}
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="wallet-details-wallet-info" ng-style="{opacity: altAmountOpacity}">
|
||||
<span ng-include="'views/includes/walletInfo.html'"></span>
|
||||
|
|
@ -94,77 +81,17 @@
|
|||
on-refresh="onRefresh()">
|
||||
</ion-refresher>
|
||||
|
||||
<div class="amount-wrapper" ng-if="wallet && wallet.isComplete() && !amountIsCollapsible">
|
||||
<div
|
||||
class="amount-bg"
|
||||
ng-class="{'wallet-background-color-default': !wallet.color}" ng-style="{'background-color':wallet.color}"
|
||||
></div>
|
||||
<div
|
||||
ng-style="{'background-color':wallet.color}"
|
||||
class="amount"
|
||||
ng-class="{'collapsible': amountIsCollapsible, 'wallet-background-color-default': !wallet.color}"
|
||||
>
|
||||
<div ng-if="!updatingStatus">
|
||||
|
||||
<div ng-show="updateStatusError">
|
||||
<span class="size-12 db m10">{{updateStatusError}}</span>
|
||||
<a class="button button-outline button-light button-small" ng-click='updateAll()' translate>Tap to retry</a>
|
||||
</div>
|
||||
|
||||
<div ng-show="walletNotRegistered">
|
||||
<span class="size-12 db m10" translate>This wallet is not registered at the given Bitcore Wallet Service (BWS). You can recreate it from the local information.</span>
|
||||
<a class="button button-outline button-light button-small" ng-click='recreate()' translate>Recreate</a>
|
||||
</div>
|
||||
|
||||
<div ng-click='updateAll(true)' ng-show="!updateStatusError && !wallet.balanceHidden" on-hold="hideToggle()" ng-style="{'transform': amountScale}">
|
||||
<strong class="size-36">{{status.totalBalanceStr}}</strong>
|
||||
<div class="size-14 amount-alternative" ng-if="status.totalBalanceAlternative && wallet.network == 'livenet'">{{status.totalBalanceAlternative}} {{status.alternativeIsoCode}}</div>
|
||||
</div>
|
||||
|
||||
<div ng-if="!wallet.balanceHidden && showBalanceButton" ng-style="{'opacity': altAmountOpacity, 'transform': amountScale}">
|
||||
<button class="button button-standard button-primary amount__button-balance size-14" ng-click="openBalanceModal()">
|
||||
<i class="icon ion-ios-checkmark-outline"></i>
|
||||
<strong>
|
||||
{{status.spendableBalanceStr}}
|
||||
</strong>
|
||||
|
||||
<span>
|
||||
{{status.spendableBalanceAlternative}} {{status.alternativeIsoCode}}
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div ng-show="!updateStatusError && wallet.balanceHidden" ng-style="{'transform': amountScale}" on-hold="hideToggle()">
|
||||
<strong class="size-24" translate>[Balance Hidden]</strong>
|
||||
<div class="size-14" translate>
|
||||
Tap and hold to show
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div ng-if="updatingStatus">
|
||||
<div class="size-36">
|
||||
<strong>...</strong>
|
||||
</div>
|
||||
</div>
|
||||
</div> <!-- amount -->
|
||||
|
||||
<div class="wallet-details-wallet-info">
|
||||
<span ng-include="'views/includes/walletInfo.html'"></span>
|
||||
</div>
|
||||
</div> <!-- oh -->
|
||||
|
||||
<a class="wallet-not-backed-up-warning" ng-if="wallet.needsBackup" ui-sref="tabs.wallet.backupWarning({from: 'tabs.wallet'})" translate>
|
||||
Wallet not backed up
|
||||
</a>
|
||||
|
||||
|
||||
<a class="wallet-not-backed-up-warning" ng-if="lowUtxosWarning" ui-sref="tabs.wallet.addresses({walletId:wallet.id,from: 'tabs.wallet'})" translate>
|
||||
Spending this balance will need significant Bitcoin network fees
|
||||
</a>
|
||||
|
||||
|
||||
<div class="p60b" ng-if="wallet && wallet.isComplete() && !walletNotRegistered">
|
||||
<div class="oh pr m20t" ng-show="wallet.incorrectDerivation">
|
||||
<div ng-if="wallet && wallet.isComplete() && !walletNotRegistered">
|
||||
<div class="wallet-details__incorrect-derivation" ng-show="wallet.incorrectDerivation">
|
||||
<div class="text-center text-warning">
|
||||
<i class="fi-alert"></i>
|
||||
<span translate>
|
||||
|
|
@ -189,37 +116,30 @@
|
|||
|
||||
<!-- Transactions -->
|
||||
|
||||
<div class="oh pr m20t text-gray size-12 text-center"
|
||||
<div class="wallet-details__no-transaction"
|
||||
ng-show="!txHistory[0] && !updatingTxHistory && !updateTxHistoryError && !updateStatusError" translate>
|
||||
No transactions yet
|
||||
</div>
|
||||
|
||||
|
||||
<div class="oh pr m20t text-gray size-12 text-center"
|
||||
<div class="wallet-details__no-update-history"
|
||||
ng-show="!txHistory[0] && !updatingTxHistory && updateTxHistoryError" translate>
|
||||
Could not update transaction history
|
||||
</div>
|
||||
|
||||
|
||||
<div ng-show="updatingTxHistory && updatingTxHistoryProgress>5" class="updating">
|
||||
<div class="row" >
|
||||
<ion-spinner class="spinner-dark" icon="crescent"></ion-spinner>
|
||||
</div>
|
||||
<div class="row" >
|
||||
<div class="col">
|
||||
<span translate>Updating transaction history. Please stand by.</span><br>
|
||||
<span translate>{{updatingTxHistoryProgress}} transactions downloaded</span>
|
||||
</div>
|
||||
</div>
|
||||
<div ng-show="updatingTxHistory && updatingTxHistoryProgress>5" class="wallet-details__updating-history">
|
||||
<span translate>Updating transaction history. Please stand by.</span><br>
|
||||
<span translate>{{updatingTxHistoryProgress}} transactions downloaded</span>
|
||||
</div>
|
||||
|
||||
<div class="wallet-details__list" ng-show="txHistory[0]">
|
||||
<div class="wallet-details__list" ng-show="txHistory[0] && !updatingTxHistory">
|
||||
<div ng-repeat="btx in txHistory track by $index" ng-click="openTxModal(btx)">
|
||||
<span ng-include="'views/includes/walletHistory.html'"></span>
|
||||
</div>
|
||||
</div>
|
||||
<ion-infinite-scroll
|
||||
ng-if="txHistoryShowMore"
|
||||
ng-if="txHistory[0] && !updatingTxHistory && txHistoryShowMore"
|
||||
on-infinite="showMore()"
|
||||
distance="1%">
|
||||
</ion-infinite-scroll>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue