diff --git a/web-ui/src/app/app.component.ts b/web-ui/src/app/app.component.ts
index f84d133..f5734bb 100644
--- a/web-ui/src/app/app.component.ts
+++ b/web-ui/src/app/app.component.ts
@@ -117,7 +117,8 @@ export class AppComponent {
'label.payee': 'Payee',
'label.active': 'Active',
'label.details': 'Details',
- 'label.raw': 'Raw'
+ 'label.raw': 'Raw',
+ 'label.date': 'Date'
};
}
}
diff --git a/web-ui/src/app/components/address-details/address-details.component.html b/web-ui/src/app/components/address-details/address-details.component.html
index eeedfed..5b43ec5 100644
--- a/web-ui/src/app/components/address-details/address-details.component.html
+++ b/web-ui/src/app/components/address-details/address-details.component.html
@@ -4,57 +4,79 @@
-
{{'label.address' | translate}}
+ {{'label.address' | translate}}
-
-
-
-
- {{'label.summary' | translate}} |
- |
-
-
+
+
+
+
+
+ {{'label.summary' | translate}} |
+ |
+
+
-
-
- {{'label.address' | translate}} |
- {{addressString}} |
-
-
- {{'label.balance' | translate}} |
- {{address.balance}} {{'label.coinName' | translate}} |
-
-
- {{'label.received' | translate}} |
- {{address.received}} {{'label.coinName' | translate}} |
-
-
- {{'label.spent' | translate}} |
- {{getSent(address)}} {{'label.coinName' | translate}} |
-
-
-
+
+
+ {{'label.address' | translate}} |
+ {{addressString}} |
+
+
+ {{'label.balance' | translate}} |
+ {{address.available}} {{'label.coinName' | translate}} |
+
+
+ {{'label.received' | translate}} |
+ {{address.received}} {{'label.coinName' | translate}} |
+
+
+ {{'label.spent' | translate}} |
+ {{getSent(address)}} {{'label.coinName' | translate}} |
+
+
+
+
-
-
-
-
- {{'label.transactions' | translate}} ({{address.transactions.length}}) |
-
-
+ {{'label.transactions' | translate}}
+
+
+
+
+
+ # |
+ {{'label.transaction' | translate}} |
+ {{'label.blockhash' | translate}} |
+ {{'label.date' | translate}} |
+ {{'label.value' | translate}} |
+ {{'label.size' | translate}} |
+
+
+
+
+
+ {{(currentPage - 1) * pageSize + index + 1}} |
+
+ {{item.id | slice:0:15}}...
+ |
+
+ {{item.blockhash | slice:0:15}}...
+ |
+ {{item.time * 1000 | date:'MMMM d, y, h:mm:ss a'}} |
+ {{item.received >= item.sent ? '+' : ''}}{{item.received - item.sent}} {{'label.coinName' | translate}} |
+ {{item.size}} |
+
+
+
+
-
-
-
- {{item}}
- |
-
-
-
+
diff --git a/web-ui/src/app/components/address-details/address-details.component.ts b/web-ui/src/app/components/address-details/address-details.component.ts
index fbd8eb7..9c4a846 100644
--- a/web-ui/src/app/components/address-details/address-details.component.ts
+++ b/web-ui/src/app/components/address-details/address-details.component.ts
@@ -1,9 +1,10 @@
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
-import { TranslateService } from '@ngx-translate/core';
+import { Observable } from 'rxjs/Observable';
-import { Address } from '../../models/address';
+import { Balance } from '../../models/balance';
+import { Transaction } from '../../models/transaction';
import { AddressesService } from '../../services/addresses.service';
import { ErrorService } from '../../services/error.service';
@@ -16,9 +17,15 @@ import { NavigatorService } from '../../services/navigator.service';
})
export class AddressDetailsComponent implements OnInit {
- address: Address;
+ address: Balance;
addressString: string;
+ // pagination
+ total = 0;
+ currentPage = 1;
+ pageSize = 10;
+ asyncItems: Observable
;
+
constructor(
private route: ActivatedRoute,
private router: Router,
@@ -32,17 +39,30 @@ export class AddressDetailsComponent implements OnInit {
response => this.onAddressRetrieved(response),
response => this.onError(response)
);
+ this.getPage(this.currentPage);
}
- private onAddressRetrieved(response: Address) {
+ private onAddressRetrieved(response: Balance) {
this.address = response;
}
+ getPage(page: number) {
+ const offset = (page - 1) * this.pageSize;
+ const limit = this.pageSize;
+ const order = 'time:desc';
+
+ this.asyncItems = this.addressesService
+ .getTransactions(this.addressString, offset, limit, order)
+ .do(response => this.total = response.total)
+ .do(response => this.currentPage = 1 + (response.offset / this.pageSize))
+ .map(response => response.data);
+ }
+
private onError(response: any) {
this.errorService.renderServerErrors(null, response);
}
- getSent(address: Address): number {
- return address.received - address.balance;
+ getSent(address: Balance): number {
+ return address.received - address.available;
}
}
diff --git a/web-ui/src/app/models/address.ts b/web-ui/src/app/models/address.ts
deleted file mode 100644
index 95bf7b1..0000000
--- a/web-ui/src/app/models/address.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-
-export class Address {
- balance: number;
- received: number;
- transactions: string[];
-}
diff --git a/web-ui/src/app/services/addresses.service.ts b/web-ui/src/app/services/addresses.service.ts
index 7c009ae..4592046 100644
--- a/web-ui/src/app/services/addresses.service.ts
+++ b/web-ui/src/app/services/addresses.service.ts
@@ -4,7 +4,9 @@ import { Observable } from 'rxjs/Observable';
import { environment } from '../../environments/environment';
-import { Address } from '../models/address';
+import { Balance } from '../models/balance';
+import { PaginatedResult } from '../models/paginated-result';
+import { Transaction } from '../models/transaction';
const httpOptions = {
headers: new HttpHeaders({ 'Content-Type': 'application/json' })
@@ -17,8 +19,13 @@ export class AddressesService {
constructor(private http: HttpClient) { }
- get(address: string): Observable {
+ get(address: string): Observable {
const url = `${this.baseUrl}/${address}`;
- return this.http.get(url);
+ return this.http.get(url);
+ }
+
+ getTransactions(address: string, offset: number = 0, limit: number = 10, orderBy: string = ''): Observable> {
+ const url = `${this.baseUrl}/${address}/transactions?offset=${offset}&limit=${limit}&orderBy=${orderBy}`;
+ return this.http.get>(url);
}
}