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

refs #2148 Refactor dialog components to use <mat-dialog-content> and <mat-dialog-actions> for better responsiveness

pull/26/head
Lucas Lara García 2025-06-03 10:58:41 +02:00
parent 36f709f7c1
commit e964c6b47a
6 changed files with 49 additions and 51 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
ogWebconsole/src/app/components/groups/shared/clients/create-multiple-client/create-multiple-client.component.css
View File

@ -1,6 +1,7 @@
.create-client-container {
display: flex;
flex-direction: column;
max-height: 80vh;
padding: 16px 16px 0px 16px;
}

17
ogWebconsole/src/app/components/groups/shared/clients/create-multiple-client/create-multiple-client.component.html
View File

@ -1,5 +1,5 @@
<div class="create-client-container">
<h1 mat-dialog-title i18n="@@add-client-dialog-title">Añadir multiples clientes</h1>
<mat-dialog-content class="create-client-container">
<h1 mat-dialog-title>{{ 'newMultipleClientButton' | translate }}</h1>
<div class="inputs-container">
<div class="mat-dialog-content" [ngClass]="{'loading': loading}">
@ -57,10 +57,9 @@
</div>
</div>
</div>
<div mat-dialog-actions class="action-container">
<button class="ordinary-button" (click)="onNoClick()">{{ 'cancelButton' | translate }}</button>
<button class="submit-button" [disabled]="!organizationalUnit" (click)="onSubmit()">{{ 'saveButton' | translate
}}</button>
</div>
</div>
</mat-dialog-content>
<mat-dialog-actions class="action-container">
<button class="ordinary-button" (click)="onNoClick()">{{ 'cancelButton' | translate }}</button>
<button class="submit-button" [disabled]="!organizationalUnit" (click)="onSubmit()">{{ 'saveButton' | translate
}}</button>
</mat-dialog-actions>

11
ogWebconsole/src/app/components/groups/shared/clients/manage-client/manage-client.component.css
View File

@ -11,10 +11,6 @@ h1 {
width: 100%;
}
.mat-dialog-content {
padding: 15px 50px 15px 50px;
}
mat-option .unit-name {
display: block;
}
@ -33,7 +29,12 @@ mat-option .unit-path {
}
.create-client-container {
position: relative;
max-height: 80vh;
overflow-y: auto;
background-color: #fff;
display: flex;
flex-direction: column;
padding: 1em 4em 2em 4em;
}
.grid-form {

25
ogWebconsole/src/app/components/groups/shared/clients/manage-client/manage-client.component.html
View File

@ -1,6 +1,6 @@
<div class="create-client-container">
<mat-dialog-content class="create-client-container">
<h1 mat-dialog-title>{{ dialogTitle | translate }}</h1>
<div class="mat-dialog-content" [ngClass]="{'loading': loading}">
<div [ngClass]="{'loading': loading}">
<mat-spinner class="loading-spinner" *ngIf="loading"></mat-spinner>
<form *ngIf="clientForm && !loading" [formGroup]="clientForm" class="client-form grid-form">
<mat-form-field class="form-field">
@ -102,16 +102,15 @@
<mat-error>{{ 'menuError' | translate }}</mat-error>
</mat-form-field>
<mat-checkbox formControlName="maintenance">
{{ 'maintenance' | translate }}
</mat-checkbox>
<mat-checkbox formControlName="maintenance">
{{ 'maintenance' | translate }}
</mat-checkbox>
</form>
</div>
<div mat-dialog-actions class="action-container">
<button class="ordinary-button" (click)="onNoClick()">{{ 'cancelButton' | translate }}</button>
<button class="submit-button" [disabled]="!clientForm.valid" (click)="onSubmit()">
{{ isEditMode ? 'Guardar' : 'Crear' }}
</button>
</div>
</div>
</mat-dialog-content>
<mat-dialog-actions class="action-container">
<button class="ordinary-button" (click)="onNoClick()">{{ 'cancelButton' | translate }}</button>
<button class="submit-button" [disabled]="!clientForm.valid" (click)="onSubmit()">
{{ isEditMode ? 'Guardar' : 'Crear' }}
</button>
</mat-dialog-actions>

28
ogWebconsole/src/app/components/groups/shared/organizational-units/manage-organizational-unit/manage-organizational-unit.component.css
View File

@ -7,7 +7,12 @@ h1 {
}
.create-ou-container {
position: relative;
max-height: 80vh;
overflow-y: auto;
background-color: #fff;
display: flex;
flex-direction: column;
padding: 1em 4em 2em 4em;
}
.form-field {
@ -18,25 +23,18 @@ h1 {
grid-column: span 2;
}
.mat-dialog-content {
padding: 0px 40px 15px 50px;
max-height: 70vh;
overflow-y: auto;
}
.loading-spinner {
display: block;
margin: 0 auto;
align-items: center;
justify-content: center;
display: block;
margin: 0 auto;
align-items: center;
justify-content: center;
}
.mat-dialog-actions {
.action-container {
display: flex;
justify-content: flex-end;
gap: 1em;
padding: 1em;
margin-right: 1em;
padding: 1.5em;
}
.grid-form {
@ -66,4 +64,4 @@ h1 {
align-items: center;
grid-column: span 2;
margin-bottom: 10px;
}
}

18
ogWebconsole/src/app/components/groups/shared/organizational-units/manage-organizational-unit/manage-organizational-unit.component.html
View File

@ -1,7 +1,7 @@
<div class="create-ou-container">
<mat-dialog-content class="create-ou-container">
<h1 mat-dialog-title>{{ isEditMode ? ('edit' | translate) : ('createButton' | translate) }} {{
'labelOrganizationalUnit' | translate }}</h1>
<div class="mat-dialog-content" [ngClass]="{'loading': loading}">
<div [ngClass]="{'loading': loading}">
<!-- Paso 1: General -->
<mat-spinner class="loading-spinner" *ngIf="loading"></mat-spinner>
<span *ngIf="!loading" class="step-title">{{ 'generalTabLabel' | translate }}</span>
@ -185,10 +185,10 @@
</mat-form-field>
</form>
</div>
<div class="mat-dialog-actions">
<button class="ordinary-button" (click)="onNoClick()">{{ 'cancelButton' | translate }}</button>
<button class="submit-button" (click)="onSubmit()"
[disabled]="!generalFormGroup.valid || !additionalInfoFormGroup.valid || !networkSettingsFormGroup.valid">{{
isEditMode ? ('edit' | translate) : ('createButton' | translate) }}</button>
</div>
</div>
</mat-dialog-content>
<mat-dialog-actions class="action-container">
<button class="ordinary-button" (click)="onNoClick()">{{ 'cancelButton' | translate }}</button>
<button class="submit-button" (click)="onSubmit()"
[disabled]="!generalFormGroup.valid || !additionalInfoFormGroup.valid || !networkSettingsFormGroup.valid">{{
isEditMode ? ('edit' | translate) : ('createButton' | translate) }}</button>
</mat-dialog-actions>