opengnsys
/
oggui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Enhance Global Status component layout with loading state handling and improved dialog dimensions
testing/ogGui-multibranch/pipeline/head This commit looks good Details

pull/18/head
Lucas Lara García 2025-03-20 14:17:49 +01:00
parent b1af49c641
commit 44c4c60297
4 changed files with 42 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
ogWebconsole/src/app/components/global-status/global-status.component.css
View File

@ -1,7 +1,13 @@
mat-dialog-content { mat-dialog-content {
height: calc(100% - 64px);
overflow: auto;
padding-top: 0.5em !important; padding-top: 0.5em !important;
} }
.content-container {
min-height: 100%;
}
.action-container { .action-container {
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;

53
ogWebconsole/src/app/components/global-status/global-status.component.html
View File

@ -2,35 +2,40 @@
<h1 mat-dialog-title>{{'GlobalStatus' | translate}}</h1> <h1 mat-dialog-title>{{'GlobalStatus' | translate}}</h1>
</header> </header>
<mat-dialog-content> <mat-dialog-content>
<app-loading [isLoading]="loading"></app-loading>
<mat-tab-group (selectedTabChange)="onTabChange($event)"> <mat-tab-group (selectedTabChange)="onTabChange($event)">
<mat-tab label="OgBoot"> <mat-tab label="OgBoot">
<app-status-tab <div *ngIf="!loading" class="content-container">
[loading]="loading" <app-status-tab
[diskUsage]="ogBootDiskUsage" [loading]="loading"
[servicesStatus]="ogBootServicesStatus" [diskUsage]="ogBootDiskUsage"
[installedOgLives]="installedOgLives" [servicesStatus]="ogBootServicesStatus"
[diskUsageChartData]="ogBootDiskUsageChartData" [installedOgLives]="installedOgLives"
[view]="view" [diskUsageChartData]="ogBootDiskUsageChartData"
[colorScheme]="colorScheme" [view]="view"
[isDoughnut]="isDoughnut" [colorScheme]="colorScheme"
[showLabels]="showLabels" [isDoughnut]="isDoughnut"
[isDhcp]="isDhcp"> [showLabels]="showLabels"
</app-status-tab> [isDhcp]="isDhcp">
</app-status-tab>
</div>
</mat-tab> </mat-tab>
<mat-tab label="Dhcp"> <mat-tab label="Dhcp">
<app-status-tab <div *ngIf="!loading" class="content-container">
[loading]="loading" <app-status-tab
[diskUsage]="dhcpDiskUsage" [loading]="loading"
[servicesStatus]="dhcpServicesStatus" [diskUsage]="dhcpDiskUsage"
[subnets]="subnets" [servicesStatus]="dhcpServicesStatus"
[diskUsageChartData]="dhcpDiskUsageChartData" [subnets]="subnets"
[view]="view" [diskUsageChartData]="dhcpDiskUsageChartData"
[colorScheme]="colorScheme" [view]="view"
[isDoughnut]="isDoughnut" [colorScheme]="colorScheme"
[showLabels]="showLabels" [isDoughnut]="isDoughnut"
[isDhcp]="isDhcp"> [showLabels]="showLabels"
</app-status-tab> [isDhcp]="isDhcp">
</app-status-tab>
</div>
</mat-tab> </mat-tab>
<mat-tab label="Pxe"> Content 3 </mat-tab> <mat-tab label="Pxe"> Content 3 </mat-tab>

2
ogWebconsole/src/app/components/global-status/global-status.component.ts
View File

@ -109,4 +109,4 @@ export class GlobalStatusComponent implements OnInit {
this.loadDhcpStatus(); this.loadDhcpStatus();
} }
} }
} }

7
ogWebconsole/src/app/layout/header/header.component.ts
View File

@ -49,6 +49,11 @@ export class HeaderComponent implements OnInit {
} }
showGlobalStatus() { showGlobalStatus() {
this.dialog.open(GlobalStatusComponent) this.dialog.open(GlobalStatusComponent, {
width: '45vw',
height: '80vh',
// maxWidth: '60vw',
// maxHeight: '60vh'
})
} }
} }