added input parms for latest-blocks component; replaced block grid on blocks page with latest-blocks component
This commit is contained in:
parent
5e79d1d4f3
commit
d5adf90a9b
@ -9,25 +9,33 @@
|
||||
|
||||
<ion-row>
|
||||
<ion-col><b>Height</b></ion-col>
|
||||
<ion-col><b>Age</b></ion-col>
|
||||
<ion-col *ngIf="showTimeAs === 'age'"><b>Age</b></ion-col>
|
||||
<ion-col *ngIf="showTimeAs === 'timestamp'"><b>Timestamp</b></ion-col>
|
||||
<ion-col text-right><b>Transactions</b></ion-col>
|
||||
<ion-col><b>Mined By</b></ion-col>
|
||||
<ion-col text-right><b>Size</b></ion-col>
|
||||
</ion-row>
|
||||
<ion-row *ngFor="let block of getBlocks(6)">
|
||||
<ion-row *ngFor="let block of getBlocks()">
|
||||
<ion-col>
|
||||
<a (click)="goToBlock(block.hash)">{{block.height}}</a>
|
||||
</ion-col>
|
||||
<ion-col>
|
||||
<ion-col *ngIf="showTimeAs === 'age'">
|
||||
{{ block.time | amFromUnix | amTimeAgo }}
|
||||
</ion-col>
|
||||
<ion-col *ngIf="showTimeAs === 'timestamp'">
|
||||
{{ block.time * 1000 | date:'medium' }}
|
||||
</ion-col>
|
||||
<ion-col text-right>
|
||||
{{block.txlength}}
|
||||
</ion-col>
|
||||
<ion-col>
|
||||
<a *ngIf="block.poolInfo.poolName" href="{{block.poolInfo.url}}">{{block.poolInfo.poolName}}</a>
|
||||
</ion-col>
|
||||
<ion-col text-right>
|
||||
{{ block.size }}
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row>
|
||||
<ion-row *ngIf="showAllBlocksButton">
|
||||
<ion-col text-center>
|
||||
<button ion-button (click)="goToBlocks()">See all blocks</button>
|
||||
</ion-col>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { Component, NgZone } from '@angular/core';
|
||||
import { Component, NgZone, Input } from '@angular/core';
|
||||
import { BlocksProvider } from '../../providers/blocks/blocks';
|
||||
import { NavController } from 'ionic-angular';
|
||||
|
||||
@ -16,6 +16,9 @@ export class LatestBlocksComponent {
|
||||
|
||||
public loading: boolean = true;
|
||||
public blocks: Array<any> = [];
|
||||
@Input() public numBlocks: number;
|
||||
@Input() public showAllBlocksButton: boolean;
|
||||
@Input() public showTimeAs: string;
|
||||
|
||||
constructor(private blocksProvider: BlocksProvider, private navCtrl: NavController, ngZone: NgZone) {
|
||||
this.loadBlocks();
|
||||
@ -50,9 +53,9 @@ export class LatestBlocksComponent {
|
||||
});
|
||||
}
|
||||
|
||||
public getBlocks(num: number = 10): Array<any> {
|
||||
public getBlocks(): Array<any> {
|
||||
/* tslint:disable:no-unused-variable */
|
||||
return this.blocks.filter((block, index) => index < num);
|
||||
return this.blocks.filter((block, index) => index < this.numBlocks);
|
||||
/* tslint:enable:no-unused-variable */
|
||||
}
|
||||
|
||||
|
||||
@ -9,31 +9,6 @@
|
||||
|
||||
<div *ngIf="!loading">
|
||||
<h1>Blocks</h1>
|
||||
<ion-grid>
|
||||
<ion-row>
|
||||
<ion-col><b>Height</b></ion-col>
|
||||
<ion-col><b>Timestamp</b></ion-col>
|
||||
<ion-col text-right><b>Transactions</b></ion-col>
|
||||
<ion-col><b>Mined By</b></ion-col>
|
||||
<ion-col text-right><b>Size</b></ion-col>
|
||||
</ion-row>
|
||||
<ion-row *ngFor="let block of blocks">
|
||||
<ion-col>
|
||||
<a (click)="goToBlock(block.hash)">{{block.height}}</a>
|
||||
</ion-col>
|
||||
<ion-col>
|
||||
{{ block.time * 1000 | date:'medium' }}
|
||||
</ion-col>
|
||||
<ion-col text-right>
|
||||
{{ block.txlength }}
|
||||
</ion-col>
|
||||
<ion-col>
|
||||
<a *ngIf="block.poolInfo.poolName" href="{{block.poolInfo.url}}">{{block.poolInfo.poolName}}</a>
|
||||
</ion-col>
|
||||
<ion-col text-right>
|
||||
{{ block.size }}
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
<latest-blocks [numBlocks]="100" [showTimeAs]="'timestamp'" [showAllBlocksButton]="false"></latest-blocks>
|
||||
</div>
|
||||
</ion-content>
|
||||
|
||||
@ -2,6 +2,7 @@ import { NgModule } from '@angular/core';
|
||||
import { IonicPageModule } from 'ionic-angular';
|
||||
import { BlocksPage } from './blocks';
|
||||
import { HeadNavComponentModule } from '../../components/head-nav/head-nav.module';
|
||||
import { LatestBlocksComponentModule } from '../../components/latest-blocks/latest-blocks.module';
|
||||
|
||||
@NgModule({
|
||||
declarations: [
|
||||
@ -9,7 +10,8 @@ import { HeadNavComponentModule } from '../../components/head-nav/head-nav.modul
|
||||
],
|
||||
imports: [
|
||||
IonicPageModule.forChild(BlocksPage),
|
||||
HeadNavComponentModule
|
||||
HeadNavComponentModule,
|
||||
LatestBlocksComponentModule
|
||||
],
|
||||
exports: [
|
||||
BlocksPage
|
||||
|
||||
@ -13,7 +13,7 @@
|
||||
|
||||
<div>
|
||||
<h1>Latest Blocks</h1>
|
||||
<latest-blocks></latest-blocks>
|
||||
<latest-blocks [numBlocks]="6" [showTimeAs]="'age'" [showAllBlocksButton]="true"></latest-blocks>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user