Added fiat balance to address and made fiat balance into a component.

This commit is contained in:
softsimon 2020-03-02 17:29:00 +07:00
parent d28730787a
commit 669a5e429d
11 changed files with 60 additions and 15 deletions

View File

@ -41,6 +41,7 @@ import { BlockchainComponent } from './components/blockchain/blockchain.componen
import { FooterComponent } from './components/footer/footer.component';
import { ExplorerComponent } from './components/explorer/explorer.component';
import { AudioService } from './services/audio.service';
import { FiatComponent } from './fiat/fiat.component';
@NgModule({
declarations: [
@ -73,6 +74,7 @@ import { AudioService } from './services/audio.service';
ExplorerComponent,
ChartistComponent,
FooterComponent,
FiatComponent,
],
imports: [
BrowserModule,

View File

@ -23,7 +23,7 @@
</tr>
<tr>
<td>Balance</td>
<td>{{ (receieved - sent) / 100000000 | number: '1.2-8' }} BTC</td>
<td>{{ (receieved - sent) / 100000000 | number: '1.2-8' }} BTC (<app-fiat [value]="receieved - sent"></app-fiat>)</td>
</tr>
</tbody>
</table>

View File

@ -49,6 +49,7 @@ export class AddressComponent implements OnInit, OnDestroy {
this.error = undefined;
this.isLoadingAddress = true;
this.loadedConfirmedTxCount = 0;
this.address = null;
this.isLoadingTransactions = true;
this.transactions = null;
document.body.scrollTo(0, 0);

View File

@ -47,7 +47,7 @@
</tr>
<tr>
<td>Block subsidy</td>
<td>{{ blockSubsidy | number: '1.2-2' }} BTC <span *ngIf="conversions">(<span class="green-color">{{ conversions.USD * blockSubsidy | currency:'USD':'symbol':'1.0-0' }}</span>)</span></td>
<td>{{ blockSubsidy | number: '1.2-2' }} BTC <span *ngIf="conversions">(<app-fiat [value]="blockSubsidy"></app-fiat>)</span></td>
</tr>
<tr>
<td>Status</td>

View File

@ -22,7 +22,6 @@ export class BlockComponent implements OnInit {
isLoadingTransactions = true;
error: any;
blockSubsidy = 50;
conversions: any;
constructor(
private route: ActivatedRoute,
@ -69,12 +68,6 @@ export class BlockComponent implements OnInit {
this.stateService.blocks$
.subscribe((block) => this.latestBlock = block);
this.stateService.conversions$
.subscribe((conversions) => {
this.conversions = conversions;
});
}
setBlockSubsidy() {

View File

@ -32,7 +32,7 @@
<ng-template [ngIf]="tx.fee">
<tr>
<td>Fees</td>
<td>{{ tx.fee | number }} sats <span *ngIf="conversions">(<span class="green-color">{{ conversions.USD * tx.fee / 100000000 | currency:'USD':'symbol':'1.2-2' }}</span>)</span></td>
<td>{{ tx.fee | number }} sats (<app-fiat [value]="tx.fee"></app-fiat>)</td>
</tr>
<tr>
<td>Fees per vByte</td>
@ -67,7 +67,7 @@
</ng-template>
<tr>
<td>Fees</td>
<td>{{ tx.fee | number }} sats <span *ngIf="conversions">(<span class="green-color">{{ conversions.USD * tx.fee / 100000000 | currency:'USD':'symbol':'1.2-2' }}</span>)</span></td>
<td>{{ tx.fee | number }} sats (<app-fiat [value]="tx.fee"></app-fiat>)</td>
</tr>
<tr>
<td>Fees per vByte</td>

View File

@ -18,7 +18,6 @@ export class TransactionComponent implements OnInit, OnDestroy {
tx: Transaction;
txId: string;
isLoadingTx = true;
conversions: any;
error: any = undefined;
latestBlock: Block;
transactionTime = -1;
@ -66,9 +65,6 @@ export class TransactionComponent implements OnInit, OnDestroy {
this.isLoadingTx = false;
});
this.stateService.conversions$
.subscribe((conversions) => this.conversions = conversions);
this.stateService.blocks$
.subscribe((block) => this.latestBlock = block);

View File

@ -0,0 +1 @@
<span class="green-color">{{ (conversions$ | async)?.USD * value / 100000000 | currency:'USD':'symbol':'1.2-2' }}</span>

View File

@ -0,0 +1,3 @@
.green-color {
color: #3bcc49;
}

View File

@ -0,0 +1,25 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { FiatComponent } from './fiat.component';
describe('FiatComponent', () => {
let component: FiatComponent;
let fixture: ComponentFixture<FiatComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ FiatComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(FiatComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

View File

@ -0,0 +1,24 @@
import { Component, OnInit, ChangeDetectionStrategy, Input } from '@angular/core';
import { Observable } from 'rxjs';
import { StateService } from '../services/state.service';
@Component({
selector: 'app-fiat',
templateUrl: './fiat.component.html',
styleUrls: ['./fiat.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class FiatComponent implements OnInit {
conversions$: Observable<any>;
@Input() value: number;
constructor(
private stateService: StateService,
) { }
ngOnInit(): void {
this.conversions$ = this.stateService.conversions$.asObservable();
}
}