|
|
|
<div fxLayout="column" fxLayoutAlign="space-between stretch" fxFlex="100">
|
|
|
|
<div fxLayout="column" fxFlex="9" fxLayoutAlign="end start">
|
|
|
|
<span class="dashboard-capacity-header this-channel-capacity">Total Capacity</span>
|
|
|
|
<div fxLayout="row" fxLayoutAlign="space-between start" class="w-100">
|
|
|
|
<mat-hint fxFlex="50" fxLayoutAlign="start center" class="font-size-90"><strong class="font-weight-900 mr-5px">Local:</strong>{{channelBalances.localBalance || 0 | number}} Sats</mat-hint>
|
|
|
|
<mat-hint fxFlex="50" fxLayoutAlign="end center" class="font-size-90"><strong class="font-weight-900 mr-5px">Remote:</strong>{{channelBalances.remoteBalance || 0 | number}} Sats</mat-hint>
|
|
|
|
</div>
|
|
|
|
<mat-progress-bar class="dashboard-progress-bar this-channel-bar" mode="determinate" color="accent" value="{{channelBalances.localBalance && channelBalances.localBalance > 0 ? ((+channelBalances.localBalance/((+channelBalances.localBalance)+(+channelBalances.remoteBalance)))*100) : 0}}"></mat-progress-bar>
|
|
|
|
</div>
|
|
|
|
<div fxLayout="column" fxFlex="3" fxLayoutAlign="end stretch"><mat-divider class="dashboard-divider"></mat-divider></div>
|
|
|
|
<div fxLayout="column" fxFlex.gt-sm="88" fxFlex="84" fxLayoutAlign="start start" class="channels-capacity-scroll" perfectScrollbar>
|
|
|
|
<div fxLayout="column" fxFlex="100" class="w-100" *ngIf="allChannels && allChannels.length > 0; else noChannelBlock">
|
|
|
|
<div *ngFor="let channel of allChannels" class="mt-2">
|
|
|
|
<span class="dashboard-capacity-header" matTooltip="{{channel.remote_alias || channel.remote_pubkey}}" matTooltipDisabled="{{(channel.remote_alias || channel.remote_pubkey).length < 26}}">{{(channel.remote_alias || channel.remote_pubkey) | slice:0:24}}{{(channel.remote_alias || channel.remote_pubkey).length > 25 ? '...' : ''}}</span>
|
|
|
|
<div fxLayout="row" fxLayoutAlign="space-between start" class="w-100">
|
|
|
|
<mat-hint fxFlex="40" fxLayoutAlign="start center" class="font-size-90 color-primary"><strong class="font-weight-900 mr-5px">Local:</strong>{{channel.local_balance || 0 | number}} Sats</mat-hint>
|
|
|
|
<mat-hint fxFlex="20" fxLayoutAlign="center center" class="font-size-90 color-primary">
|
|
|
|
<fa-icon [icon]="faBalanceScale" class="color-primary mr-3px" matTooltip="Balance Score"></fa-icon>
|
|
|
|
({{channel.balancedness || 0 | number}})
|
|
|
|
<!-- <fa-icon [icon]="sortBy === 'Channel Balance' ? faBalanceScale : faDumbbell" class="color-primary mr-3px" matTooltip="Balance Score"></fa-icon>
|
|
|
|
({{((sortBy === 'Channel Balance' ? channel.balancedness : channel.capacity) || 0) | number}}{{sortBy === 'Channel Balance' ? '' : ' Sats'}}) -->
|
|
|
|
</mat-hint>
|
|
|
|
<mat-hint fxFlex="40" fxLayoutAlign="end center" class="font-size-90 color-primary"><strong class="font-weight-900 mr-5px">Remote:</strong>{{channel.remote_balance || 0 | number}} Sats</mat-hint>
|
|
|
|
</div>
|
|
|
|
<mat-progress-bar class="dashboard-progress-bar" mode="determinate" value="{{channel.local_balance && channel.local_balance > 0 ? ((+channel.local_balance/((+channel.local_balance)+(+channel.remote_balance)))*100) : 0}}"></mat-progress-bar>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<ng-template #noChannelBlock>
|
|
|
|
<div fxLayout="column" fxFlex="100" class="w-100 mt-2">No channels available.</div>
|
|
|
|
</ng-template>
|