mirror of https://github.com/BTCPrivate/copay.git
wip add tx details - fix pipes
This commit is contained in:
parent
c55bd2e026
commit
81c1175cc1
|
@ -42,6 +42,7 @@ import { AddressbookPage } from '../pages/addressbook/addressbook';
|
|||
import { AddressbookAddPage } from '../pages/addressbook/add/add';
|
||||
import { AddressbookViewPage } from '../pages/addressbook/view/view';
|
||||
import { WalletDetailsPage } from '../pages/wallet-details/wallet-details';
|
||||
import { TxDetailsPage } from '../pages/tx-details/tx-details';
|
||||
|
||||
/* Tabs */
|
||||
import { HomePage } from '../pages/home/home';
|
||||
|
@ -68,6 +69,7 @@ import { ChooseFeeLevelPage } from '../pages/choose-fee-level/choose-fee-level';
|
|||
import { CustomAmountPage } from '../pages/receive/custom-amount/custom-amount';
|
||||
|
||||
/* Pipes */
|
||||
import { ToUnitPipe } from '../pipes/toUnit';
|
||||
import { ToFiatPipe } from '../pipes/toFiat';
|
||||
|
||||
/* Providers */
|
||||
|
@ -144,6 +146,7 @@ let pages: any = [
|
|||
TermsOfUsePage,
|
||||
TourPage,
|
||||
TabsPage,
|
||||
TxDetailsPage,
|
||||
WalletDetailsPage,
|
||||
];
|
||||
|
||||
|
@ -199,6 +202,7 @@ let providers: any = [
|
|||
];
|
||||
|
||||
let pipes = [
|
||||
ToUnitPipe,
|
||||
ToFiatPipe,
|
||||
];
|
||||
|
||||
|
|
|
@ -18,3 +18,4 @@
|
|||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 1.6 KiB |
|
@ -0,0 +1,56 @@
|
|||
<ion-header no-border>
|
||||
<ion-navbar>
|
||||
<ion-title>{{title | translate}}</ion-title>
|
||||
</ion-navbar>
|
||||
</ion-header>
|
||||
|
||||
<ion-content>
|
||||
<ion-list>
|
||||
<ion-item>
|
||||
<div *ngIf="tx.action == 'received'" class="action">
|
||||
<img src="assets/img/tx-action/icon-received.svg" width="40">
|
||||
<span translate>Received</span>
|
||||
</div>
|
||||
<div *ngIf="tx.action == 'sent'" class="action">
|
||||
<img src="assets/img/tx-action/icon-sent.svg" width="40">
|
||||
<span translate>Sent</span>
|
||||
</div>
|
||||
<div *ngIf="tx.action == 'moved'" class="action">
|
||||
<img src="assets/img/tx-action/icon-moved.svg" width="40">
|
||||
<span translate>Moved</span>
|
||||
</div>
|
||||
|
||||
<div class="amount-str">{{amountStr | toUnit : tx.amount}}</div>
|
||||
<div class="amount-alt-str">{{fiatAmountStr | toFiat : tx.amount}}</div>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-avatar item-start>
|
||||
<img src="assets/img/icon-wallet.svg" class="icon-wallet">
|
||||
</ion-avatar>
|
||||
<h2 translate>To</h2>
|
||||
<p>{{destinationAddress || '...'}}</p>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-label>{{'Date' | translate}}</ion-label>
|
||||
<ion-note item-end>
|
||||
{{tx.time * 1000 | amDateFormat:'MM/DD/YYYY HH:mm a'}}
|
||||
</ion-note>
|
||||
</ion-item>
|
||||
|
||||
<button ion-item (click)="addMemo()">
|
||||
<ion-label>{{'Memo' | translate}}</ion-label>
|
||||
<span>{{tx.message}}</span>
|
||||
</button>
|
||||
|
||||
<ion-item>
|
||||
<ion-label>{{'Confirmations' | translate}}</ion-label>
|
||||
<ion-note item-end>
|
||||
{{tx.Confirmations || 'Unconfirmed' | translate}}
|
||||
</ion-note>
|
||||
</ion-item>
|
||||
</ion-list>
|
||||
|
||||
<button ion-button block clear (click)="viewOnBlockchain()" translate>View on blockchain</button>
|
||||
</ion-content>
|
|
@ -0,0 +1,24 @@
|
|||
page-tx-details {
|
||||
.action {
|
||||
display: flex;
|
||||
height: 4rem;
|
||||
align-items: center;
|
||||
margin-top: 1.5rem;
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
img {
|
||||
margin-right: 15px;
|
||||
&.icon-wallet {
|
||||
background-color: color($colors, primary);
|
||||
}
|
||||
}
|
||||
.amount-str {
|
||||
font-size: 30px;
|
||||
margin-bottom: .5rem;
|
||||
}
|
||||
.amount-alt-str {
|
||||
font-size: 16px;
|
||||
margin-left: 2px;
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
}
|
|
@ -0,0 +1,29 @@
|
|||
import { Component } from "@angular/core";
|
||||
import { NavParams } from 'ionic-angular';
|
||||
import { TxFormatProvider } from '../../providers/tx-format/tx-format';
|
||||
|
||||
@Component({
|
||||
selector: 'page-tx-details',
|
||||
templateUrl: 'tx-details.html'
|
||||
})
|
||||
export class TxDetailsPage {
|
||||
public title: string;
|
||||
public tx: any;
|
||||
public fiatAmountStr: string;
|
||||
|
||||
constructor(
|
||||
private navParams: NavParams,
|
||||
private txFormatProvider: TxFormatProvider,
|
||||
) {
|
||||
this.tx = this.navParams.data.tx;
|
||||
this.fiatAmountStr = this.txFormatProvider.formatAlternativeStr('btc', this.tx.amount);
|
||||
}
|
||||
|
||||
addMemo() {
|
||||
return;
|
||||
}
|
||||
|
||||
viewOnBlockchain() {
|
||||
return;
|
||||
}
|
||||
}
|
|
@ -7,11 +7,11 @@
|
|||
<ion-content>
|
||||
<div class="balance-header">
|
||||
<div class="balance-str">{{wallet.status.availableBalanceStr}}</div>
|
||||
<div class="balance-alt-str">{{alternativeBalanceStr || '...'}}</div>
|
||||
<div class="balance-alt-str">{{alternativeBalanceStr | toFiat : wallet.status.totalBalanceSat}}</div>
|
||||
</div>
|
||||
|
||||
<ion-list>
|
||||
<button ion-item *ngFor="let tx of wallet.completeHistory" (click)="goToTxDetails(tx.txid)">
|
||||
<button ion-item *ngFor="let tx of wallet.completeHistory" (click)="goToTxDetails(tx)">
|
||||
<ion-icon item-start>
|
||||
<img src="assets/img/tx-action/icon-received.svg" *ngIf="tx.action == 'received'" width="40">
|
||||
<img src="assets/img/tx-action/icon-sent.svg" *ngIf="tx.action == 'sent'" width="40">
|
||||
|
@ -19,7 +19,7 @@
|
|||
</ion-icon>
|
||||
<div class="action">{{tx.action}}</div>
|
||||
<div class="detail">
|
||||
<div class="amount">{{amountStr | toFiat : tx.amount : unitCode}}</div>
|
||||
<div class="amount">{{amountStr | toUnit : tx.amount}}</div>
|
||||
<div class="date">{{tx.time * 1000 | amTimeAgo}}</div>
|
||||
</div>
|
||||
</button>
|
||||
|
|
|
@ -1,7 +1,8 @@
|
|||
import { Component } from '@angular/core';
|
||||
import { NavParams } from 'ionic-angular';
|
||||
import { NavController, NavParams } from 'ionic-angular';
|
||||
import { WalletProvider } from '../../providers/wallet/wallet';
|
||||
import { ConfigProvider } from '../../providers/config/config';
|
||||
import { TxDetailsPage } from '../../pages/tx-details/tx-details';
|
||||
|
||||
@Component({
|
||||
selector: 'page-wallet-details',
|
||||
|
@ -13,6 +14,7 @@ export class WalletDetailsPage {
|
|||
public alternativeBalanceStr: string;
|
||||
|
||||
constructor(
|
||||
private navCtrl: NavController,
|
||||
private navParams: NavParams,
|
||||
private walletProvider: WalletProvider,
|
||||
private configProvider: ConfigProvider,
|
||||
|
@ -20,20 +22,19 @@ export class WalletDetailsPage {
|
|||
this.wallet = this.navParams.data.wallet;
|
||||
this.unitCode = this.configProvider.get()['wallet']['settings'].unitCode;
|
||||
}
|
||||
|
||||
|
||||
ionViewDidEnter() {
|
||||
if (!this.wallet.isComplete()) {
|
||||
console.log('Wallet incomplete');
|
||||
return;
|
||||
};
|
||||
this.alternativeBalanceStr = this.wallet.status.totalBalanceAlternative + ' ' + this.wallet.status.alternativeIsoCode;
|
||||
this.getTxHistory();
|
||||
}
|
||||
|
||||
goToTxDetails(txid: string) {
|
||||
return;
|
||||
|
||||
goToTxDetails(tx: any) {
|
||||
this.navCtrl.push(TxDetailsPage, {tx: tx});
|
||||
}
|
||||
|
||||
|
||||
getTxHistory(force?: boolean) {
|
||||
let self = this;
|
||||
this.walletProvider.getTxHistory_(this.wallet, {force: force}).then((txh) => {
|
||||
|
|
|
@ -1,12 +1,18 @@
|
|||
import { Pipe, PipeTransform } from '@angular/core';
|
||||
import { TxFormatProvider } from '../providers/tx-format/tx-format';
|
||||
import { ConfigProvider } from '../providers/config/config';
|
||||
|
||||
@Pipe({ name: 'toFiat' })
|
||||
export class ToFiatPipe implements PipeTransform {
|
||||
private unitCode: string;
|
||||
|
||||
constructor(
|
||||
private configProvider: ConfigProvider,
|
||||
private txFormatProvider: TxFormatProvider
|
||||
) {}
|
||||
transform(value: string, satoshis: number, coin: string): any {
|
||||
return this.txFormatProvider.formatAmountStr(coin, satoshis);
|
||||
) {
|
||||
this.unitCode = this.configProvider.get()['wallet']['settings'].unitCode;
|
||||
}
|
||||
transform(value: string, satoshis: number): any {
|
||||
return this.txFormatProvider.formatAlternativeStr(this.unitCode, satoshis);
|
||||
}
|
||||
}
|
|
@ -0,0 +1,18 @@
|
|||
import { Pipe, PipeTransform } from '@angular/core';
|
||||
import { TxFormatProvider } from '../providers/tx-format/tx-format';
|
||||
import { ConfigProvider } from '../providers/config/config';
|
||||
|
||||
@Pipe({ name: 'toUnit' })
|
||||
export class ToUnitPipe implements PipeTransform {
|
||||
private unitCode: string;
|
||||
|
||||
constructor(
|
||||
private configProvider: ConfigProvider,
|
||||
private txFormatProvider: TxFormatProvider
|
||||
) {
|
||||
this.unitCode = this.configProvider.get()['wallet']['settings'].unitCode;
|
||||
}
|
||||
transform(value: string, satoshis: number): any {
|
||||
return this.txFormatProvider.formatAmountStr(this.unitCode, satoshis);
|
||||
}
|
||||
}
|
|
@ -57,17 +57,15 @@ export class TxFormatProvider {
|
|||
});
|
||||
};
|
||||
|
||||
public formatAlternativeStr(coin: string, satoshis: number): Promise<any> {
|
||||
return new Promise((resolve, reject) => {
|
||||
if (isNaN(satoshis)) return resolve();
|
||||
let settings = this.config.get().wallet.settings;
|
||||
public formatAlternativeStr(coin: string, satoshis: number) {
|
||||
if (isNaN(satoshis)) return;
|
||||
let settings = this.config.get().wallet.settings;
|
||||
|
||||
var v1 = parseFloat((this.rate.toFiat(satoshis, settings.alternativeIsoCode, coin)).toFixed(2));
|
||||
var v1FormatFiat = this.filter.formatFiatAmount(v1);
|
||||
if (!v1FormatFiat) return resolve(null);
|
||||
var v1 = parseFloat((this.rate.toFiat(satoshis, settings.alternativeIsoCode, coin)).toFixed(2));
|
||||
var v1FormatFiat = this.filter.formatFiatAmount(v1);
|
||||
if (!v1FormatFiat) return;
|
||||
|
||||
return resolve(v1FormatFiat + ' ' + settings.alternativeIsoCode);
|
||||
});
|
||||
return v1FormatFiat + ' ' + settings.alternativeIsoCode;
|
||||
};
|
||||
|
||||
public processTx(coin: string, tx: any): any {
|
||||
|
|
Loading…
Reference in New Issue