RanchiMall/flosight-api
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

added spinners to transaction and address pages and transaction list component

Browse Source
This commit is contained in:
Darren Nelsen 2017-08-16 12:46:08 -04:00
parent 90379522fe
commit c9a1b6b153
4 changed files with 93 additions and 74 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/src/components/head-nav/head-nav.ts
View File

@ -139,7 +139,7 @@ export class HeadNavComponent {
actionSheet.present(); actionSheet.present();
} }
public toggleSearch() { public toggleSearch(): void {
this.showSearch = !this.showSearch; this.showSearch = !this.showSearch;
} }
} }

21
app/src/components/transaction-list/transaction-list.html
View File

@ -1,7 +1,14 @@
<ion-grid> <div *ngIf="loading">
<ion-row *ngFor="let tx of transactions.txs"> <ion-spinner name="crescent"></ion-spinner>
<ion-col col-12> </div>
<transaction [tx]="tx"></transaction>
</ion-col>
</ion-row> <div *ngIf="!loading">
</ion-grid> <ion-grid>
<ion-row *ngFor="let tx of transactions.txs">
<ion-col col-12>
<transaction [tx]="tx"></transaction>
</ion-col>
</ion-row>
</ion-grid>
</div>

76
app/src/pages/address/address.html
View File

@ -3,45 +3,51 @@
</ion-header> </ion-header>
<ion-content padding> <ion-content padding>
<h1>Address</h1> <div *ngIf="loading">
<p class="ellipsis"><b>Address</b> {{ address.addrStr }}</p> <ion-spinner name="crescent"></ion-spinner>
<p>{{ currency.getConversion(address.balance) }}</p> </div>
<h2>Summary</h2> <div *ngIf="!loading">
<h1>Address</h1>
<p class="ellipsis"><b>Address</b> {{ address.addrStr }}</p>
<p>{{ currency.getConversion(address.balance) }}</p>
<ion-list class="summary"> <h2>Summary</h2>
<ion-item>
Total Received
<span item-end>
{{ currency.getConversion(address.totalReceived) }}
</span>
</ion-item>
<ion-item>
Total Sent
<span item-end>
{{ currency.getConversion(address.totalSent) }}
</span>
</ion-item>
<ion-item>
Final Balance
<span item-end>
{{ currency.getConversion(address.balance) }}
</span>
</ion-item>
<ion-item>
No. Transactions
<span item-end>
{{ address.txApperances }}
</span>
</ion-item>
</ion-list>
<p text-center> <ion-list class="summary">
<qr-code [value]="address.addrStr" [size]="160"></qr-code> <ion-item>
<p> Total Received
<span item-end>
{{ currency.getConversion(address.totalReceived) }}
</span>
</ion-item>
<ion-item>
Total Sent
<span item-end>
{{ currency.getConversion(address.totalSent) }}
</span>
</ion-item>
<ion-item>
Final Balance
<span item-end>
{{ currency.getConversion(address.balance) }}
</span>
</ion-item>
<ion-item>
No. Transactions
<span item-end>
{{ address.txApperances }}
</span>
</ion-item>
</ion-list>
<h2>Transactions</h2> <p text-center>
<qr-code [value]="address.addrStr" [size]="160"></qr-code>
<p>
<transaction-list [queryType]="'address'" [queryValue]="addrStr"></transaction-list> <h2>Transactions</h2>
<transaction-list [queryType]="'address'" [queryValue]="addrStr"></transaction-list>
</div>
</ion-content> </ion-content>

68
app/src/pages/transaction/transaction.html
View File

@ -3,40 +3,46 @@
</ion-header> </ion-header>
<ion-content padding> <ion-content padding>
<h1>Transaction</h1> <div *ngIf="loading">
<p class="ellipsis"><b>Transaction</b> {{ tx.txid }}</p> <ion-spinner name="crescent"></ion-spinner>
</div>
<h2>Summary</h2> <div *ngIf="!loading">
<h1>Transaction</h1>
<p class="ellipsis"><b>Transaction</b> {{ tx.txid }}</p>
<ion-list class="summary"> <h2>Summary</h2>
<ion-item>
Size
<span item-end>
{{ tx.size }} (bytes)
</span>
</ion-item>
<ion-item>
Received Time
<span item-end>
{{ tx.time * 1000 | date:'medium' }}
</span>
</ion-item>
<ion-item>
Mined Time
<span item-end>
{{ tx.blocktime * 1000 | date:'medium' }}
</span>
</ion-item>
<ion-item>
Included in Block
<span item-end>
<a (click)="goToBlock(tx.blockhash)">{{ tx.blockhash }}</a>
</span>
</ion-item>
</ion-list>
<h2>Details</h2> <ion-list class="summary">
<ion-item>
Size
<span item-end>
{{ tx.size }} (bytes)
</span>
</ion-item>
<ion-item>
Received Time
<span item-end>
{{ tx.time * 1000 | date:'medium' }}
</span>
</ion-item>
<ion-item>
Mined Time
<span item-end>
{{ tx.blocktime * 1000 | date:'medium' }}
</span>
</ion-item>
<ion-item>
Included in Block
<span item-end>
<a (click)="goToBlock(tx.blockhash)">{{ tx.blockhash }}</a>
</span>
</ion-item>
</ion-list>
<transaction [tx]="tx"></transaction> <h2>Details</h2>
<transaction [tx]="tx"></transaction>
</div>
</ion-content> </ion-content>