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

added loading spinner and links to block detail

Browse Source
This commit is contained in:
Darren Nelsen 2017-08-17 16:42:09 -04:00
parent f2196bc297
commit cdbc84e93a
2 changed files with 37 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
app/src/components/latest-blocks/latest-blocks.html
View File

@ -1,27 +1,32 @@
<!-- Generated template for the LatestBlocksComponent component -->
<div>
{{text}}
<ion-grid>
<div *ngIf="loading">
<ion-spinner name="crescent"></ion-spinner>
</div>
<ion-row>
<ion-col><b>Height</b></ion-col>
<ion-col><b>Age</b></ion-col>
<ion-col text-right><b>Transactions</b></ion-col>
<ion-col text-right><b>Size</b></ion-col>
</ion-row>
<ion-row *ngFor="let block of getBlocks(8)">
<ion-col>
<a (click)="goToBlock(block.hash)">{{block.height}}</a>
</ion-col>
<ion-col>
{{ block.time | amFromUnix | amTimeAgo }}
</ion-col>
<ion-col text-right>
{{block.txlength}}
</ion-col>
<ion-col text-right>
{{ block.size }}
</ion-col>
</ion-row>
</ion-grid>
<div *ngIf="!loading">
<ion-grid>
<ion-row>
<ion-col><b>Height</b></ion-col>
<ion-col><b>Age</b></ion-col>
<ion-col text-right><b>Transactions</b></ion-col>
<ion-col text-right><b>Size</b></ion-col>
</ion-row>
<ion-row *ngFor="let block of getBlocks(6)">
<ion-col>
<a (click)="goToBlock(block.hash)">{{block.height}}</a>
</ion-col>
<ion-col>
{{ block.time | amFromUnix | amTimeAgo }}
</ion-col>
<ion-col text-right>
{{block.txlength}}
</ion-col>
<ion-col text-right>
{{ block.size }}
</ion-col>
</ion-row>
</ion-grid>
</div>
</div>

16
app/src/components/latest-blocks/latest-blocks.ts
View File

@ -1,5 +1,6 @@
import { Component } from '@angular/core';
import { BlocksProvider } from '../../providers/blocks/blocks';
import { NavController } from 'ionic-angular';
/**
* Generated class for the LatestBlocksComponent component.
@ -13,25 +14,26 @@ import { BlocksProvider } from '../../providers/blocks/blocks';
})
export class LatestBlocksComponent {
private text: string;
public loading: boolean = true;
public blocks: Array<any> = [];
constructor(private blocksProvider: BlocksProvider) {
this.text = 'Hello Latest Blocks';
constructor(private blocksProvider: BlocksProvider, private navCtrl: NavController) {
blocksProvider.getBlocks().subscribe(
(data) => {
this.blocks = JSON.parse(data['_body']).blocks;
console.log('blocks', this.blocks);
this.loading = false;
},
(err) => {
console.log('err', err);
this.loading = false;
}
);
}
public goToBlock(hash: string): void {
console.log('go to', hash);
public goToBlock(blockHash: string): void {
this.navCtrl.push('block-detail', {
'blockHash': blockHash
});
}
public getBlocks(num: number = 10): Array<any> {