diff --git a/src/app/app.module.ts b/src/app/app.module.ts index bf9e20f70..e7c063a7e 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -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, ]; diff --git a/src/assets/img/tx-action/icon-sent.svg b/src/assets/img/tx-action/icon-sent.svg index 9da8ad2ba..790099585 100644 --- a/src/assets/img/tx-action/icon-sent.svg +++ b/src/assets/img/tx-action/icon-sent.svg @@ -18,3 +18,4 @@ + \ No newline at end of file diff --git a/src/pages/tx-details/tx-details.html b/src/pages/tx-details/tx-details.html new file mode 100644 index 000000000..d2b38edeb --- /dev/null +++ b/src/pages/tx-details/tx-details.html @@ -0,0 +1,56 @@ + + + {{title | translate}} + + + + + + +
+ + Received +
+
+ + Sent +
+
+ + Moved +
+ +
{{amountStr | toUnit : tx.amount}}
+
{{fiatAmountStr | toFiat : tx.amount}}
+
+ + + + + +

To

+

{{destinationAddress || '...'}}

+
+ + + {{'Date' | translate}} + + {{tx.time * 1000 | amDateFormat:'MM/DD/YYYY HH:mm a'}} + + + + + + + {{'Confirmations' | translate}} + + {{tx.Confirmations || 'Unconfirmed' | translate}} + + +
+ + +
\ No newline at end of file diff --git a/src/pages/tx-details/tx-details.scss b/src/pages/tx-details/tx-details.scss new file mode 100644 index 000000000..e1b7dc662 --- /dev/null +++ b/src/pages/tx-details/tx-details.scss @@ -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; + } +} \ No newline at end of file diff --git a/src/pages/tx-details/tx-details.ts b/src/pages/tx-details/tx-details.ts new file mode 100644 index 000000000..e1b8ea2b4 --- /dev/null +++ b/src/pages/tx-details/tx-details.ts @@ -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; + } +} \ No newline at end of file diff --git a/src/pages/wallet-details/wallet-details.html b/src/pages/wallet-details/wallet-details.html index 97333a7df..e05c88ae6 100644 --- a/src/pages/wallet-details/wallet-details.html +++ b/src/pages/wallet-details/wallet-details.html @@ -7,11 +7,11 @@
{{wallet.status.availableBalanceStr}}
-
{{alternativeBalanceStr || '...'}}
+
{{alternativeBalanceStr | toFiat : wallet.status.totalBalanceSat}}
- diff --git a/src/pages/wallet-details/wallet-details.ts b/src/pages/wallet-details/wallet-details.ts index c7b4be79f..afd44eca2 100644 --- a/src/pages/wallet-details/wallet-details.ts +++ b/src/pages/wallet-details/wallet-details.ts @@ -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) => { diff --git a/src/pipes/toFiat.ts b/src/pipes/toFiat.ts index 7315ed1d9..3e77fd229 100644 --- a/src/pipes/toFiat.ts +++ b/src/pipes/toFiat.ts @@ -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); } } \ No newline at end of file diff --git a/src/pipes/toUnit.ts b/src/pipes/toUnit.ts new file mode 100644 index 000000000..ee1868067 --- /dev/null +++ b/src/pipes/toUnit.ts @@ -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); + } +} \ No newline at end of file diff --git a/src/providers/tx-format/tx-format.ts b/src/providers/tx-format/tx-format.ts index 5a1a9023b..6356bd5a0 100644 --- a/src/providers/tx-format/tx-format.ts +++ b/src/providers/tx-format/tx-format.ts @@ -57,17 +57,15 @@ export class TxFormatProvider { }); }; - public formatAlternativeStr(coin: string, satoshis: number): Promise { - 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 {