Add difficulty adjustment in mining page + Fix pools table on mobile

This commit is contained in:
nymkappa
2022-01-17 15:34:34 +09:00
parent 091027cc79
commit b9a047b22d
9 changed files with 63 additions and 20 deletions

View File

@@ -1,6 +1,13 @@
<div class="container-xl">
<app-difficulty [showProgress]=false [showHalving]=true></app-difficulty>
<div style="height: 500px; margin-top: 30px;" echarts [initOpts]="chartInitOptions" [options]="chartOptions"></div>
<div class="text-center loadingGraphs" *ngIf="isLoading">
<div class="spinner-border text-light"></div>
</div>
<div class="card-header">
<!-- <i class="fa fa-area-chart"></i> <span i18n="mining.pools-by-vBytes">Pools</span> -->
<form [formGroup]="radioGroupForm" class="formRadioGroup">
<div class="btn-group btn-group-toggle" ngbRadioGroup name="radioBasic" formControlName="dateSpan"
(change)="onChangeWindowPreference($event)">
@@ -38,33 +45,31 @@
</form>
</div>
<div style="height: 500px;" echarts [initOpts]="chartInitOptions" [options]="chartOptions"></div>
<div class="text-center loadingGraphs" *ngIf="isLoading">
<div class="spinner-border text-light"></div>
</div>
<table class="table table-borderless" [alwaysCallback]="true" infiniteScroll [infiniteScrollDistance]="1.5" [infiniteScrollUpDistance]="1.5" [infiniteScrollThrottle]="50">
<thead>
<th i18n="latest-blocks.height">Rank</th>
<th class="d-none d-md-block"i18n="latest-blocks.timestamp">Name</th>
<th class="d-none d-md-block" i18n="latest-blocks.height">Rank</th>
<th><!-- LOGO --></th>
<th i18n="latest-blocks.timestamp">Name</th>
<th i18n="latest-blocks.timestamp">Hashrate</th>
<th class="d-none d-md-block" i18n="latest-blocks.mined">Block Count (share)</th>
<th i18n="latest-blocks.transactions">Empty Blocks (ratio)</th>
<th i18n="latest-blocks.mined">Block Count (%)</th>
<th class="d-none d-md-block" i18n="latest-blocks.transactions">Empty Blocks (%)</th>
</thead>
<tbody *ngIf="(miningStatsEmitter$ | async) as miningStats">
<tr>
<td>-</td>
<td class="d-none d-md-block">-</td>
<td><!-- LOGO --></td>
<td>All miners</td>
<td>{{ miningStats.lastEstimatedHashrate}} PH/s</td>
<td>{{ miningStats.blockCount }}</td>
<td>{{ miningStats.totalEmptyBlock }} ({{ miningStats.totalEmptyBlockRatio }}%)</td>
<td class="d-none d-md-block">{{ miningStats.totalEmptyBlock }} ({{ miningStats.totalEmptyBlockRatio }}%)</td>
</tr>
<tr *ngFor="let pool of miningStats.pools">
<td>{{ pool.rank }}</td>
<td><a href="{{ pool.link }}">{{ pool.name }}</a></td>
<td class="d-none d-md-block">{{ pool.rank }}</td>
<td><img width="25" height="25" src="{{ pool.logo }}"></td>
<td><a target="#" href="{{ pool.link }}">{{ pool.name }}</a></td>
<td>{{ pool.lastEstimatedHashrate }} PH/s</td>
<td>{{ pool.blockCount }} ({{ pool.share }}%)</td>
<td>{{ pool.emptyBlocks }} ({{ pool.emptyBlockRatio }}%)</td>
<td class="d-none d-md-block">{{ pool.emptyBlocks }} ({{ pool.emptyBlockRatio }}%)</td>
</tr>
</tbody>
</table>

View File

@@ -93,7 +93,7 @@ export class PoolRankingComponent implements OnInit, OnDestroy {
return;
}
data.push({
value: pool.lastEstimatedHashrate,
value: pool.share,
name: pool.name,
label: { color: '#FFFFFF' },
tooltip: {
@@ -125,8 +125,16 @@ export class PoolRankingComponent implements OnInit, OnDestroy {
tooltip: {
trigger: 'item'
},
legend: (window.innerWidth <= 767.98) ? {
bottom: '0%',
left: 'center',
textStyle: {
color: '#FFF'
}
} : null,
series: [
{
top: '5%',
name: 'Mining pool',
type: 'pie',
radius: ['30%', '70%'],
@@ -137,6 +145,7 @@ export class PoolRankingComponent implements OnInit, OnDestroy {
},
},
label: {
show: (window.innerWidth > 767.98),
fontSize: 14,
},
itemStyle: {