Shahana Farooqui
4 years ago
parent
28ee4c75a5
commit
893d5e5c30
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -1 +1 @@
|
||||
!function(e){function r(r){for(var n,a,i=r[0],c=r[1],f=r[2],p=0,s=[];p<i.length;p++)a=i[p],Object.prototype.hasOwnProperty.call(o,a)&&o[a]&&s.push(o[a][0]),o[a]=0;for(n in c)Object.prototype.hasOwnProperty.call(c,n)&&(e[n]=c[n]);for(l&&l(r);s.length;)s.shift()();return u.push.apply(u,f||[]),t()}function t(){for(var e,r=0;r<u.length;r++){for(var t=u[r],n=!0,i=1;i<t.length;i++)0!==o[t[i]]&&(n=!1);n&&(u.splice(r--,1),e=a(a.s=t[0]))}return e}var n={},o={0:0},u=[];function a(r){if(n[r])return n[r].exports;var t=n[r]={i:r,l:!1,exports:{}};return e[r].call(t.exports,t,t.exports,a),t.l=!0,t.exports}a.e=function(e){var r=[],t=o[e];if(0!==t)if(t)r.push(t[2]);else{var n=new Promise((function(r,n){t=o[e]=[r,n]}));r.push(t[2]=n);var u,i=document.createElement("script");i.charset="utf-8",i.timeout=120,a.nc&&i.setAttribute("nonce",a.nc),i.src=function(e){return a.p+""+({}[e]||e)+"."+{1:"df8a42ae5fabe34ad893",6:"9052d99b0c58d3773f50",7:"e259f5b9069a29cff75d"}[e]+".js"}(e);var c=new Error;u=function(r){i.onerror=i.onload=null,clearTimeout(f);var t=o[e];if(0!==t){if(t){var n=r&&("load"===r.type?"missing":r.type),u=r&&r.target&&r.target.src;c.message="Loading chunk "+e+" failed.\n("+n+": "+u+")",c.name="ChunkLoadError",c.type=n,c.request=u,t[1](c)}o[e]=void 0}};var f=setTimeout((function(){u({type:"timeout",target:i})}),12e4);i.onerror=i.onload=u,document.head.appendChild(i)}return Promise.all(r)},a.m=e,a.c=n,a.d=function(e,r,t){a.o(e,r)||Object.defineProperty(e,r,{enumerable:!0,get:t})},a.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},a.t=function(e,r){if(1&r&&(e=a(e)),8&r)return e;if(4&r&&"object"==typeof e&&e&&e.__esModule)return e;var t=Object.create(null);if(a.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:e}),2&r&&"string"!=typeof e)for(var n in e)a.d(t,n,(function(r){return e[r]}).bind(null,n));return t},a.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return a.d(r,"a",r),r},a.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},a.p="",a.oe=function(e){throw console.error(e),e};var i=window.webpackJsonp=window.webpackJsonp||[],c=i.push.bind(i);i.push=r,i=i.slice();for(var f=0;f<i.length;f++)r(i[f]);var l=c;t()}([]);
|
||||
!function(e){function r(r){for(var n,a,i=r[0],c=r[1],f=r[2],p=0,s=[];p<i.length;p++)a=i[p],Object.prototype.hasOwnProperty.call(o,a)&&o[a]&&s.push(o[a][0]),o[a]=0;for(n in c)Object.prototype.hasOwnProperty.call(c,n)&&(e[n]=c[n]);for(l&&l(r);s.length;)s.shift()();return u.push.apply(u,f||[]),t()}function t(){for(var e,r=0;r<u.length;r++){for(var t=u[r],n=!0,i=1;i<t.length;i++)0!==o[t[i]]&&(n=!1);n&&(u.splice(r--,1),e=a(a.s=t[0]))}return e}var n={},o={0:0},u=[];function a(r){if(n[r])return n[r].exports;var t=n[r]={i:r,l:!1,exports:{}};return e[r].call(t.exports,t,t.exports,a),t.l=!0,t.exports}a.e=function(e){var r=[],t=o[e];if(0!==t)if(t)r.push(t[2]);else{var n=new Promise((function(r,n){t=o[e]=[r,n]}));r.push(t[2]=n);var u,i=document.createElement("script");i.charset="utf-8",i.timeout=120,a.nc&&i.setAttribute("nonce",a.nc),i.src=function(e){return a.p+""+({}[e]||e)+"."+{1:"df8a42ae5fabe34ad893",6:"ce201f8313431c83a606",7:"f0a3f44d200d9238d4bc"}[e]+".js"}(e);var c=new Error;u=function(r){i.onerror=i.onload=null,clearTimeout(f);var t=o[e];if(0!==t){if(t){var n=r&&("load"===r.type?"missing":r.type),u=r&&r.target&&r.target.src;c.message="Loading chunk "+e+" failed.\n("+n+": "+u+")",c.name="ChunkLoadError",c.type=n,c.request=u,t[1](c)}o[e]=void 0}};var f=setTimeout((function(){u({type:"timeout",target:i})}),12e4);i.onerror=i.onload=u,document.head.appendChild(i)}return Promise.all(r)},a.m=e,a.c=n,a.d=function(e,r,t){a.o(e,r)||Object.defineProperty(e,r,{enumerable:!0,get:t})},a.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},a.t=function(e,r){if(1&r&&(e=a(e)),8&r)return e;if(4&r&&"object"==typeof e&&e&&e.__esModule)return e;var t=Object.create(null);if(a.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:e}),2&r&&"string"!=typeof e)for(var n in e)a.d(t,n,(function(r){return e[r]}).bind(null,n));return t},a.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return a.d(r,"a",r),r},a.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},a.p="",a.oe=function(e){throw console.error(e),e};var i=window.webpackJsonp=window.webpackJsonp||[],c=i.push.bind(i);i.push=r,i=i.slice();for(var f=0;f<i.length;f++)r(i[f]);var l=c;t()}([]);
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -1,59 +1,91 @@
|
||||
<div fxLayout="column">
|
||||
<div fxLayout="row" fxLayoutAlign="start center" class="padding-gap-x page-title-container">
|
||||
<fa-icon [icon]="faNetworkWired" class="page-title-img mr-1"></fa-icon>
|
||||
<span class="page-title">Network Information</span>
|
||||
</div>
|
||||
<div fxLayout="row" fxFlex="100" fxLayoutAlign="start start" class="padding-gap-x">
|
||||
<mat-card fxLayout="column" fxFlex="100" fxLayoutAlign="start start">
|
||||
<mat-progress-bar *ngIf="flgLoading[1]===true" mode="indeterminate"></mat-progress-bar>
|
||||
<mat-card-content fxLayout="column" fxFlex="100" fxLayoutAlign="start stretch" class="card-content-gap w-100">
|
||||
<div fxLayout="column" fxLayout.gt-sm="row wrap" fxLayoutAlign="start space-between" fxLayoutAlign.gt-sm="start start" fxFlex="100">
|
||||
<div fxLayout="column" fxFlex="33" fxLayoutAlign="end space-between" class="network-info-block">
|
||||
<h4 class="font-bold-330">Network Capacity</h4>
|
||||
<span class="foreground-secondary-text">{{networkInfo.total_network_capacity | number}} Sats</span>
|
||||
<mat-divider class="mt-1"></mat-divider>
|
||||
</div>
|
||||
<div fxLayout="column" fxFlex="33" fxLayoutAlign="end space-between" class="network-info-block">
|
||||
<h4 class="font-bold-330">Number of Nodes</h4>
|
||||
<span class="foreground-secondary-text">{{networkInfo.num_nodes | number}}</span>
|
||||
<mat-divider class="mt-1"></mat-divider>
|
||||
</div>
|
||||
<div fxLayout="column" fxFlex="33" fxLayoutAlign="end space-between" class="network-info-block">
|
||||
<h4 class="font-bold-330">Number of Channels</h4>
|
||||
<span class="foreground-secondary-text">{{networkInfo.num_channels | number}}</span>
|
||||
<mat-divider class="mt-1"></mat-divider>
|
||||
</div>
|
||||
</div>
|
||||
<div fxLayout="column" fxLayout.gt-sm="row wrap" fxLayoutAlign="start space-between" fxLayoutAlign.gt-sm="start start" fxFlex="100">
|
||||
<div fxLayout="column" fxFlex="33" fxLayoutAlign="end space-between" class="network-info-block">
|
||||
<h4 class="font-bold-330">Max Channel Size</h4>
|
||||
<span class="foreground-secondary-text">{{networkInfo.max_channel_size | number}}</span>
|
||||
<mat-divider class="mt-1"></mat-divider>
|
||||
</div>
|
||||
<div fxLayout="column" fxFlex="33" fxLayoutAlign="end space-between" class="network-info-block">
|
||||
<h4 class="font-bold-330">Avg Channel Size</h4>
|
||||
<span class="foreground-secondary-text">{{networkInfo.avg_channel_size | number}}</span>
|
||||
<mat-divider class="mt-1"></mat-divider>
|
||||
</div>
|
||||
<div fxLayout="column" fxFlex="33" fxLayoutAlign="end space-between" class="network-info-block">
|
||||
<h4 class="font-bold-330">Min Channel Size</h4>
|
||||
<span class="foreground-secondary-text">{{networkInfo.min_channel_size | number}}</span>
|
||||
<mat-divider class="mt-1"></mat-divider>
|
||||
<div fxLayout="column" fxLayoutAlign="space-between stretch" class="mb-4">
|
||||
<mat-grid-list *ngIf="selNode.userPersona !== userPersonaEnum.OPERATOR" cols="3" rowHeight="330px">
|
||||
<mat-grid-tile class="node-grid-tile" *ngFor="let card of nodeCards" [colspan]="card.cols" [rowspan]="card.rows">
|
||||
<div fxLayout="column" fxLayoutAlign="stretch start" fxFlex="100" class="h-100">
|
||||
<div fxLayout="row" fxLayoutAlign="start start" class="w-100">
|
||||
<div fxLayout="row" fxLayoutAlign="start start" class="padding-gap-x page-title-container">
|
||||
<fa-icon [icon]="card.icon" class="mr-1"></fa-icon>
|
||||
<span>{{card.title}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div fxLayout="column" fxLayout.gt-sm="row wrap" fxLayoutAlign="start space-between" fxLayoutAlign.gt-sm="start start" fxFlex="100">
|
||||
<div fxLayout="column" fxFlex="33" fxLayoutAlign="end space-between" class="network-info-block">
|
||||
<h4 class="font-bold-330">Max Out Degree</h4>
|
||||
<span class="foreground-secondary-text">{{networkInfo.max_out_degree | number}}</span>
|
||||
<mat-divider class="mt-1"></mat-divider>
|
||||
</div>
|
||||
<div fxLayout="column" fxFlex="33" fxLayoutAlign="end space-between" class="network-info-block">
|
||||
<h4 class="font-bold-330">Avg Out Degree</h4>
|
||||
<span class="foreground-secondary-text">{{networkInfo.avg_out_degree | number:'1.0-2'}}</span>
|
||||
<mat-divider class="mt-1"></mat-divider>
|
||||
</div>
|
||||
</div>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
<div fxLayout="column" fxLayoutAlign="stretch center" fxLayout.gt-sm="row" fxLayoutAlign.gt-sm="center stretch" class="w-100 h-93">
|
||||
<mat-card fxLayout="row" fxFlex="95" fxLayoutAlign="start stretch" class="dashboard-card p-24 w-96 h-93">
|
||||
<mat-card-content fxFlex="100" class="dashboard-card-content">
|
||||
<div [ngSwitch]="card.id" fxLayout="column" fxFlex="100">
|
||||
<rtl-node-info fxFlex="100" *ngSwitchCase="'node'" [information]="information" [ngClass]="{'error-border': flgLoading[0]==='error'}"></rtl-node-info>
|
||||
<rtl-fee-info fxFlex="100" *ngSwitchCase="'fee'" [fees]="fees" [ngClass]="{'error-border': flgLoading[2]==='error'}"></rtl-fee-info>
|
||||
<rtl-channel-status-info fxFlex="100" *ngSwitchCase="'status'" [channelsStatus]="channelsStatus" [ngClass]="{'error-border': flgLoading[3]==='error' || flgLoading[4]==='error'}"></rtl-channel-status-info>
|
||||
</div>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</div>
|
||||
</div>
|
||||
</mat-grid-tile>
|
||||
</mat-grid-list>
|
||||
<div fxLayout="row" fxLayoutAlign="start end" class="padding-gap-x page-title-container" [ngClass]="{'mt-1': screenSize !== screenSizeEnum.XS}">
|
||||
<fa-icon [icon]="faProjectDiagram" class="page-title-img mr-1"></fa-icon>
|
||||
<span class="page-title">Network</span>
|
||||
</div>
|
||||
<mat-grid-list cols="3" rowHeight="250px">
|
||||
<mat-grid-tile fxLayout="row" *ngFor="let card of networkCards" [colspan]="card.cols" [rowspan]="card.rows">
|
||||
<mat-card fxLayout="row" fxFlex="95" fxLayoutAlign="start stretch" class="dashboard-card p-24 h-93">
|
||||
<mat-card-content fxFlex="100" class="dashboard-card-content">
|
||||
<div [ngSwitch]="card.id" fxLayout="column" fxFlex="100">
|
||||
<div fxFlex="100" *ngSwitchCase="'general'" [ngClass]="{'error-border': flgLoading[1]==='error'}"><ng-container *ngTemplateOutlet="generalBlock"></ng-container></div>
|
||||
<div fxFlex="100" *ngSwitchCase="'channels'" [ngClass]="{'error-border': flgLoading[1]==='error'}"><ng-container *ngTemplateOutlet="channelsBlock"></ng-container></div>
|
||||
<div fxFlex="100" *ngSwitchCase="'degrees'" [ngClass]="{'error-border': flgLoading[1]==='error'}"><ng-container *ngTemplateOutlet="degreesBlock"></ng-container></div>
|
||||
</div>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</mat-grid-tile>
|
||||
</mat-grid-list>
|
||||
</div>
|
||||
|
||||
<ng-template #generalBlock>
|
||||
<div fxLayout="column" fxFlex="100" fxLayoutAlign="space-between">
|
||||
<div>
|
||||
<h4 class="dashboard-info-title">Network Capacity</h4>
|
||||
<div class="dashboard-info-value">{{networkInfo.total_network_capacity | number}} Sats</div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="dashboard-info-title">Number of Nodes</h4>
|
||||
<div class="dashboard-info-value">{{networkInfo.num_nodes | number}}</div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="dashboard-info-title">Number of Channels</h4>
|
||||
<span class="overflow-wrap dashboard-info-value">{{networkInfo.num_channels | number}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
<ng-template #channelsBlock>
|
||||
<div fxLayout="column" fxFlex="100" fxLayoutAlign="space-between">
|
||||
<div>
|
||||
<h4 class="dashboard-info-title">Max Channel Size</h4>
|
||||
<div class="dashboard-info-value">{{networkInfo.max_channel_size | number}}</div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="dashboard-info-title">Avg Channel Size</h4>
|
||||
<div class="dashboard-info-value">{{networkInfo.avg_channel_size | number}}</div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="dashboard-info-title">Min Channel Size</h4>
|
||||
<span class="overflow-wrap dashboard-info-value">{{networkInfo.min_channel_size | number}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
<ng-template #degreesBlock>
|
||||
<div fxLayout="column" fxFlex="100" fxLayoutAlign="space-between">
|
||||
<div>
|
||||
<h4 class="dashboard-info-title">Max Out Degree</h4>
|
||||
<div class="dashboard-info-value">{{networkInfo.max_out_degree | number}}</div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="dashboard-info-title">Avg Out Degree</h4>
|
||||
<div class="dashboard-info-value">{{networkInfo.avg_out_degree | number:'1.0-2'}}</div>
|
||||
</div>
|
||||
<div fxFlex="20">
|
||||
<h4 class="dashboard-info-title"></h4>
|
||||
<span class="overflow-wrap dashboard-info-value"></span>
|
||||
</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
|
||||
@ -1,3 +0,0 @@
|
||||
.network-info-block {
|
||||
padding: 1rem 0;
|
||||
}
|
||||
@ -0,0 +1,3 @@
|
||||
.open-inputs-box {
|
||||
padding: 1.2rem 2.4rem 0.8rem 2.4rem !important;
|
||||
}
|
||||
Loading…
Reference in New Issue