mirror of https://github.com/BTCPrivate/copay.git
Merge pull request #8031 from gabrielbazan7/ref/txtxpdetails
[V4] REF: UI tx and txp details
This commit is contained in:
commit
4ec2ee4793
|
@ -5,37 +5,35 @@
|
|||
</ion-header>
|
||||
|
||||
<ion-content no-bounce>
|
||||
<ion-card *ngIf="btx">
|
||||
<ion-card-content>
|
||||
<div class="sending-label" *ngIf="btx.confirmations > 0">
|
||||
<img class="sending-img" src="assets/img/tx-action/icon-sent.svg" width="40" *ngIf="btx.action === 'sent'">
|
||||
<img class="sending-img" src="assets/img/tx-action/icon-received.svg" width="40" *ngIf="btx.action === 'received'">
|
||||
<img class="sending-img" src="assets/img/tx-action/icon-moved.svg" width="40" *ngIf="btx.action === 'moved'">
|
||||
<span *ngIf="btx.action === 'sent'">{{'Sent' | translate}}</span>
|
||||
<span *ngIf="btx.action === 'received'">{{'Received' | translate}}</span>
|
||||
<span *ngIf="btx.action === 'moved'">{{'Moved' | translate}}</span>
|
||||
<div *ngIf="btx" padding>
|
||||
<div class="sending-label" *ngIf="btx.confirmations > 0">
|
||||
<img class="sending-img" src="assets/img/tx-action/icon-sent.svg" width="40" *ngIf="btx.action === 'sent'">
|
||||
<img class="sending-img" src="assets/img/tx-action/icon-received.svg" width="40" *ngIf="btx.action === 'received'">
|
||||
<img class="sending-img" src="assets/img/tx-action/icon-moved.svg" width="40" *ngIf="btx.action === 'moved'">
|
||||
<span *ngIf="btx.action === 'sent'">{{'Sent' | translate}}</span>
|
||||
<span *ngIf="btx.action === 'received'">{{'Received' | translate}}</span>
|
||||
<span *ngIf="btx.action === 'moved'">{{'Moved' | translate}}</span>
|
||||
</div>
|
||||
<div class="sending-label" *ngIf="btx.confirmations === 0">
|
||||
<img class="sending-img" src="assets/img/tx-action/icon-confirming.svg">
|
||||
<span *ngIf="btx.action == 'sent' || btx.action == 'moved'" translate>Sending</span>
|
||||
<span *ngIf="btx.action == 'received'" translate>Receiving</span>
|
||||
</div>
|
||||
<div class="amount-label">
|
||||
<div class="amount">{{btx.amountValueStr}}
|
||||
<span class="unit">{{btx.amountUnitStr}}</span>
|
||||
</div>
|
||||
<div class="sending-label" *ngIf="btx.confirmations === 0">
|
||||
<img class="sending-img" src="assets/img/tx-action/icon-confirming.svg">
|
||||
<span *ngIf="btx.action == 'sent' || btx.action == 'moved'" translate>Sending</span>
|
||||
<span *ngIf="btx.action == 'received'" translate>Receiving</span>
|
||||
</div>
|
||||
<div class="amount-label">
|
||||
<div class="amount">{{btx.amountValueStr}}
|
||||
<span class="unit">{{btx.amountUnitStr}}</span>
|
||||
</div>
|
||||
<div class="alternative" (click)="showRate = !showRate">
|
||||
<span *ngIf="!showRate">{{btx.alternativeAmountStr}}</span>
|
||||
<span *ngIf="showRate">
|
||||
<span *ngIf="!rate">...</span>
|
||||
<span *ngIf="rate">
|
||||
{{rate| currency:'':2}} {{alternativeIsoCode}} ({{rateDate | amDateFormat:'MM/DD/YYYY HH:mm a'}})
|
||||
</span>
|
||||
<div class="alternative" (click)="showRate = !showRate">
|
||||
<span *ngIf="!showRate">{{btx.alternativeAmountStr}}</span>
|
||||
<span *ngIf="showRate">
|
||||
<span *ngIf="!rate">...</span>
|
||||
<span *ngIf="rate">
|
||||
{{rate| currency:'':2}} {{alternativeIsoCode}} ({{rateDate | amDateFormat:'MM/DD/YYYY HH:mm a'}})
|
||||
</span>
|
||||
</div>
|
||||
</span>
|
||||
</div>
|
||||
</ion-card-content>
|
||||
</ion-card>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ion-list *ngIf="btx">
|
||||
<ion-item *ngIf="btx.action === 'sent'">
|
||||
|
@ -97,7 +95,7 @@
|
|||
</ion-note>
|
||||
</ion-item>
|
||||
|
||||
<ion-item-divider text-wrap class="low-fees" *ngIf="btx.action == 'received' && btx.lowFees">
|
||||
<ion-item-divider text-wrap class="low-fees" *ngIf="btx.action == 'received' && btx.lowFees">
|
||||
<img src="assets/img/icon-warning.png" width="20">
|
||||
<span translate>This transaction could take a long time to confirm or could be dropped due to the low fees set by the sender</span>
|
||||
</ion-item-divider>
|
||||
|
@ -160,4 +158,4 @@
|
|||
|
||||
</ion-list>
|
||||
|
||||
</ion-content>
|
||||
</ion-content>
|
|
@ -13,48 +13,40 @@
|
|||
|
||||
<ion-content no-bounce>
|
||||
|
||||
<ion-card>
|
||||
<ion-card-content>
|
||||
<div class="sending-label">
|
||||
<img class="sending-img" src="assets/img/icon-tx-sent-outline.svg">
|
||||
<span translate>Sending</span>
|
||||
</div>
|
||||
<div class="amount-label">
|
||||
<div class="amount">{{tx.amountStr}}</div>
|
||||
<div class="alternative" *ngIf="tx.alternativeAmountStr">{{tx.alternativeAmountStr}}</div>
|
||||
</div>
|
||||
</ion-card-content>
|
||||
</ion-card>
|
||||
<div padding>
|
||||
<div class="sending-label">
|
||||
<img class="sending-img" src="assets/img/icon-tx-sent-outline.svg">
|
||||
<span translate>Sending</span>
|
||||
</div>
|
||||
<div class="amount-label">
|
||||
<div class="amount">{{tx.amountStr}}</div>
|
||||
<div class="alternative" *ngIf="tx.alternativeAmountStr">{{tx.alternativeAmountStr}}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ion-card *ngIf="tx.removed">
|
||||
<ion-card-content>
|
||||
<span translate>The payment was removed by creator</span>
|
||||
</ion-card-content>
|
||||
</ion-card>
|
||||
<ion-item *ngIf="tx.removed" text-wrap>
|
||||
<span translate>The payment was removed by creator</span>
|
||||
</ion-item>
|
||||
|
||||
<ion-card *ngIf="tx.status != 'pending'">
|
||||
<ion-card-content>
|
||||
<div *ngIf="tx.status == 'accepted' && !tx.isGlidera">
|
||||
<div translate>Payment accepted, but not yet broadcasted</div>
|
||||
<button ion-button block type="button" (click)="broadcast(tx)" [disabled]="loading">
|
||||
<ion-icon name="cloud-upload"></ion-icon>
|
||||
<span translate>Broadcast Payment</span>
|
||||
</button>
|
||||
</div>
|
||||
<div *ngIf="tx.status == 'accepted' && tx.isGlidera">
|
||||
<div translate>Payment accepted. It will be broadcasted by Glidera. In case there is a problem, it can be deleted 6 hours after
|
||||
it was created.</div>
|
||||
</div>
|
||||
<div *ngIf="tx.status == 'broadcasted'" translate>Payment Sent</div>
|
||||
<div *ngIf="tx.status =='rejected'" translate>Payment Rejected</div>
|
||||
</ion-card-content>
|
||||
</ion-card>
|
||||
<div *ngIf="tx.status != 'pending'">
|
||||
<div *ngIf="tx.status == 'accepted' && !tx.isGlidera">
|
||||
<ion-item text-wrap translate>Payment accepted, but not yet broadcasted</ion-item>
|
||||
<button ion-item class="btn-broadcast" icon-left (click)="broadcast(tx)" [disabled]="loading">
|
||||
<ion-icon name="cloud-upload"></ion-icon>
|
||||
<span translate>Broadcast Payment</span>
|
||||
</button>
|
||||
</div>
|
||||
<ion-item *ngIf="tx.status == 'accepted' && tx.isGlidera" text-wrap>
|
||||
<span translate>Payment accepted. It will be broadcasted by Glidera. In case there is a problem, it can be deleted 6 hours after it
|
||||
was created.</span>
|
||||
</ion-item>
|
||||
<ion-item *ngIf="tx.status == 'broadcasted'" text-wrap translate>Payment Sent</ion-item>
|
||||
<ion-item *ngIf="tx.status =='rejected'" text-wrap translate>Payment Rejected</ion-item>
|
||||
</div>
|
||||
|
||||
<ion-card *ngIf="!currentSpendUnconfirmed && tx.hasUnconfirmedInputs">
|
||||
<ion-card-content>
|
||||
<span translate>Warning: this transaction has unconfirmed inputs</span>
|
||||
</ion-card-content>
|
||||
</ion-card>
|
||||
<ion-item *ngIf="!currentSpendUnconfirmed && tx.hasUnconfirmedInputs">
|
||||
<span translate>Warning: this transaction has unconfirmed inputs</span>
|
||||
</ion-item>
|
||||
|
||||
<ion-list>
|
||||
<ion-item class="container-to">
|
||||
|
@ -101,7 +93,6 @@
|
|||
<div>
|
||||
<div class="wallet" *ngIf="wallet">
|
||||
<img class="icon-wallet" src="assets/img/icon-wallet.svg" />
|
||||
<!-- TODO ng-include="'views/includes/walletIcon.html'" -->
|
||||
<div>{{wallet.name}}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -236,4 +227,4 @@
|
|||
</button>
|
||||
</ion-buttons>
|
||||
</ion-toolbar>
|
||||
</ion-footer>
|
||||
</ion-footer>
|
|
@ -140,5 +140,8 @@ page-txp-details {
|
|||
.btn-remove {
|
||||
color: color($colors, danger);
|
||||
}
|
||||
.btn-broadcast {
|
||||
color: color($colors, primary);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue