Merge pull request #1288 from nymkappa/feature/merge-hashrate-pool-ranking

Merge pool share and dominance into one widget
This commit is contained in:
wiz 2022-02-25 21:44:05 +09:00 committed by GitHub
commit 5f19b6dd07
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 36 additions and 32 deletions

View File

@ -27,7 +27,7 @@
<div *ngIf="hashrateObservable$ | async" [class]="!widget ? 'chart' : 'chart-widget'"
echarts [initOpts]="chartInitOptions" [options]="chartOptions"></div>
<div class="text-center loadingGraphs" *ngIf="isLoading">
<div class="text-center loadingGraphs" [class]="widget ? 'widget' : ''" *ngIf="isLoading">
<div class="spinner-border text-light"></div>
</div>

View File

@ -48,3 +48,13 @@
}
}
}
.loadingGraphs {
position: absolute;
top: 50%;
left: calc(50% - 15px);
z-index: 100;
}
.loadingGraphs.widget {
top: 75%;
}

View File

@ -1,25 +1,28 @@
<div class="container-xl dashboard-container">
<div class="row row-cols-1 row-cols-md-2">
<!-- pools hashrate -->
<div class="col">
<div class="card">
<div class="card double">
<div class="card-body">
<!-- pool distribution -->
<h5 class="card-title">
<a class="link" href="" [routerLink]="['/mining/hashrate/pools' | relativeUrl]" i18n="mining.pools-hashrate">
Mining Pools Dominance (1y)
<a href="" [routerLink]="['/mining/pools' | relativeUrl]" i18n="mining.pool-share">
Mining Pools Share (1w)
</a>
</h5>
<app-pool-ranking [widget]=true></app-pool-ranking>
<!-- pools hashrate -->
<app-hashrate-chart-pools [widget]=true></app-hashrate-chart-pools>
</div>
</div>
</div>
<!-- hashrate -->
<div class="col">
<div class="card">
<div class="card-body">
<!-- hashrate -->
<h5 class="card-title">
<a class="link" href="" [routerLink]="['/mining/hashrate' | relativeUrl]" i18n="mining.hashrate">
Hashrate (1y)
@ -28,21 +31,7 @@
<app-hashrate-chart [widget]=true></app-hashrate-chart>
</div>
</div>
</div>
<!-- pool distribution -->
<div class="col">
<div class="card">
<div class="card-body pool-ranking">
<h5 class="card-title">
<a href="" [routerLink]="['/mining/pools' | relativeUrl]" i18n="mining.pool-share">
Mining Pools Share (1w)
</a>
</h5>
<app-pool-ranking [widget]=true></app-pool-ranking>
</div>
</div>
</div>
</div>
</div>
</div>

View File

@ -14,6 +14,9 @@
background-color: #1d1f31;
height: 340px;
}
.card.double {
height: 620px;
}
.card-title {
font-size: 1rem;

View File

@ -2,7 +2,7 @@
<div [class]="widget ? 'chart-widget' : 'chart'"
echarts [initOpts]="chartInitOptions" [options]="chartOptions" (chartInit)="onChartInit($event)"></div>
<div class="text-center loadingGraphs" *ngIf="isLoading">
<div class="text-center loadingGraphs" [class]="widget ? 'widget' : ''" *ngIf="isLoading">
<div class="spinner-border text-light"></div>
</div>

View File

@ -34,3 +34,13 @@
padding: .3em !important;
}
}
.loadingGraphs {
position: absolute;
top: 50%;
left: calc(50% - 15px);
z-index: 100;
}
.loadingGraphs.widget {
top: 25%;
}

View File

@ -15,14 +15,6 @@ import { chartColors, poolsColor } from 'src/app/app.constants';
selector: 'app-pool-ranking',
templateUrl: './pool-ranking.component.html',
styleUrls: ['./pool-ranking.component.scss'],
styles: [`
.loadingGraphs {
position: absolute;
top: 50%;
left: calc(50% - 15px);
z-index: 100;
}
`],
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class PoolRankingComponent implements OnInit {
@ -164,7 +156,7 @@ export class PoolRankingComponent implements OnInit {
let radius: any[] = ['20%', '70%'];
if (this.isMobile() || this.widget) {
radius = ['20%', '65%'];
radius = ['20%', '60%'];
}
this.chartOptions = {