Add download button on pool ranking and mempool graphs
This commit is contained in:
@@ -4,6 +4,10 @@
|
||||
<div class="card mb-3">
|
||||
<div class="card-header">
|
||||
<i class="fa fa-area-chart"></i> <span i18n="statistics.memory-by-vBytes">Mempool by vBytes (sat/vByte)</span>
|
||||
<button class="btn" style="position: absolute; right: 30px" (click)="onSaveChart('mempool')">
|
||||
<fa-icon [icon]="['fas', 'download']" [fixedWidth]="true"></fa-icon>
|
||||
</button>
|
||||
|
||||
<form [formGroup]="radioGroupForm" class="formRadioGroup" [class]="stateService.env.MINING_DASHBOARD ? 'mining' : ''" (click)="saveGraphPreference()">
|
||||
<div class="btn-group btn-group-toggle" ngbRadioGroup name="radioBasic" formControlName="dateSpan">
|
||||
<label ngbButtonLabel class="btn-primary btn-sm">
|
||||
@@ -60,7 +64,7 @@
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="incoming-transactions-graph">
|
||||
<app-mempool-graph
|
||||
<app-mempool-graph #mempoolgraph
|
||||
dir="ltr"
|
||||
[template]="'advanced'"
|
||||
[limitFee]="500"
|
||||
@@ -80,9 +84,13 @@
|
||||
<div class="card-header">
|
||||
<i class="fa fa-area-chart"></i> <span i18n="statistics.transaction-vbytes-per-second">Transaction vBytes per second (vB/s)</span>
|
||||
</div>
|
||||
<button class="btn" style="position: absolute; right: 30px" (click)="onSaveChart('incoming')">
|
||||
<fa-icon [icon]="['fas', 'download']" [fixedWidth]="true"></fa-icon>
|
||||
</button>
|
||||
|
||||
<div class="card-body">
|
||||
<div class="incoming-transactions-graph">
|
||||
<app-incoming-transactions-graph
|
||||
<app-incoming-transactions-graph #incominggraph
|
||||
[height]="500"
|
||||
[left]="65"
|
||||
[template]="'advanced'"
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { Component, OnInit, LOCALE_ID, Inject } from '@angular/core';
|
||||
import { Component, OnInit, LOCALE_ID, Inject, ViewChild, ElementRef } from '@angular/core';
|
||||
import { ActivatedRoute } from '@angular/router';
|
||||
import { FormGroup, FormBuilder } from '@angular/forms';
|
||||
import { of, merge} from 'rxjs';
|
||||
@@ -12,6 +12,8 @@ import { StateService } from 'src/app/services/state.service';
|
||||
import { SeoService } from 'src/app/services/seo.service';
|
||||
import { StorageService } from 'src/app/services/storage.service';
|
||||
import { feeLevels, chartColors } from 'src/app/app.constants';
|
||||
import { MempoolGraphComponent } from '../mempool-graph/mempool-graph.component';
|
||||
import { IncomingTransactionsGraphComponent } from '../incoming-transactions-graph/incoming-transactions-graph.component';
|
||||
|
||||
@Component({
|
||||
selector: 'app-statistics',
|
||||
@@ -19,6 +21,9 @@ import { feeLevels, chartColors } from 'src/app/app.constants';
|
||||
styleUrls: ['./statistics.component.scss']
|
||||
})
|
||||
export class StatisticsComponent implements OnInit {
|
||||
@ViewChild('mempoolgraph') mempoolGraph: MempoolGraphComponent;
|
||||
@ViewChild('incominggraph') incomingGraph: IncomingTransactionsGraphComponent;
|
||||
|
||||
network = '';
|
||||
|
||||
loading = true;
|
||||
@@ -38,6 +43,7 @@ export class StatisticsComponent implements OnInit {
|
||||
graphWindowPreference: string;
|
||||
inverted: boolean;
|
||||
feeLevelDropdownData = [];
|
||||
timespan = '';
|
||||
|
||||
constructor(
|
||||
@Inject(LOCALE_ID) private locale: string,
|
||||
@@ -75,6 +81,7 @@ export class StatisticsComponent implements OnInit {
|
||||
)
|
||||
.pipe(
|
||||
switchMap(() => {
|
||||
this.timespan = this.radioGroupForm.controls.dateSpan.value;
|
||||
this.spinnerLoading = true;
|
||||
if (this.radioGroupForm.controls.dateSpan.value === '2h') {
|
||||
this.websocketService.want(['blocks', 'live-2h-chart']);
|
||||
@@ -195,4 +202,12 @@ export class StatisticsComponent implements OnInit {
|
||||
stat.vbytes_per_second = Math.min(median * capRatio, stat.vbytes_per_second);
|
||||
}
|
||||
}
|
||||
|
||||
onSaveChart(name) {
|
||||
if (name === 'mempool') {
|
||||
this.mempoolGraph.onSaveChart(this.timespan);
|
||||
} else if (name === 'incoming') {
|
||||
this.incomingGraph.onSaveChart(this.timespan);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user