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

refs #1477 Refactor Env-Vars, Roles and Users components for improved layout and styling
testing/ogGui-multibranch/pipeline/head There was a failure building this commit Details

pull/16/head
Lucas Lara García 2025-02-11 12:32:14 +01:00
parent 4437acdac2
commit 9e071814e9
6 changed files with 66 additions and 65 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
ogWebconsole/src/app/components/admin/env-vars/env-vars.component.css
View File

@ -1,9 +1,5 @@
.env-settings {
padding: 16px;
h1 {
margin-bottom: 16px;
}
padding: 0rem 1rem 0rem 1rem;
.mat-table {
margin-bottom: 16px;

6
ogWebconsole/src/app/components/admin/env-vars/env-vars.component.html
View File

@ -1,5 +1,9 @@
<div class="env-settings">
<h1>Editar Variables de Entorno</h1>
<div class="header-container">
<div class="header-container-title">
<h2>Editar Variables de Entorno</h2>
</div>
</div>
<mat-table [dataSource]="envVars" class="mat-elevation-z8">
<!-- Nombre de la variable -->

29
ogWebconsole/src/app/components/admin/roles/roles/roles.component.css
View File

@ -1,6 +1,19 @@
.header-container {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px 10px;
border-bottom: 1px solid #ddd;
}
.header-container-title {
flex-grow: 1;
text-align: left;
margin-left: 1em;
}
table {
width: 100%;
margin-top: 50px;
}
.search-container {
@ -8,14 +21,10 @@ table {
justify-content: space-between;
align-items: center;
width: 100%;
padding: 0 5px;
margin: 1.5rem 0rem 1.5rem 0rem;
box-sizing: border-box;
}
.divider {
margin: 20px 0;
}
.search-string {
flex: 2;
padding: 5px;
@ -26,13 +35,6 @@ table {
padding: 5px;
}
.header-container {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px;
}
.mat-elevation-z8 {
box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.2);
}
@ -42,4 +44,3 @@ table {
justify-content: end;
margin-bottom: 30px;
}

21
ogWebconsole/src/app/components/admin/roles/roles/roles.component.html
View File

@ -1,24 +1,25 @@
<div class="header-container">
<h2 class="title">{{ 'adminRolesTitle' | translate }}</h2>
<div class="header-container-title">
<h2>{{ 'adminRolesTitle' | translate }}</h2>
</div>
<div class="images-button-row">
<button mat-flat-button color="primary" (click)="addUser()">
{{ 'addRole' | translate }}
</button>
</div>
</div>
<mat-divider class="divider"></mat-divider>
<div class="search-container">
<mat-form-field appearance="fill" class="search-string">
<mat-label>{{ 'searchRoleLabel' | translate }}</mat-label>
<input matInput placeholder="{{ 'searchPlaceholder' | translate }}" [(ngModel)]="filters['name']" (keyup.enter)="search()">
<input matInput placeholder="{{ 'searchPlaceholder' | translate }}" [(ngModel)]="filters['name']"
(keyup.enter)="search()">
<mat-icon matSuffix>search</mat-icon>
<mat-hint>{{ 'searchHint' | translate }}</mat-hint>
</mat-form-field>
</div>
<div *ngIf="loading" class="loading-container">
<mat-spinner></mat-spinner>
</div>
<app-loading [isLoading]="loading"></app-loading>
<div *ngIf="!loading">
<table mat-table [dataSource]="dataSource" class="mat-elevation-z8">
@ -33,7 +34,8 @@
<button mat-icon-button color="primary" (click)="editRole(role)">
<mat-icon>edit</mat-icon>
</button>
<button mat-icon-button color="warn" (click)="deleteRole(role)" [disabled]="role.permissions.includes('ROLE_SUPER_ADMIN')">
<button mat-icon-button color="warn" (click)="deleteRole(role)"
[disabled]="role.permissions.includes('ROLE_SUPER_ADMIN')">
<mat-icon>delete</mat-icon>
</button>
</td>
@ -44,10 +46,7 @@
</div>
<div class="paginator-container">
<mat-paginator [length]="length"
[pageSize]="itemsPerPage"
[pageIndex]="page"
[pageSizeOptions]="pageSizeOptions"
<mat-paginator [length]="length" [pageSize]="itemsPerPage" [pageIndex]="page" [pageSizeOptions]="pageSizeOptions"
(page)="onPageChange($event)">
</mat-paginator>
</div>

28
ogWebconsole/src/app/components/admin/users/users/users.component.css
View File

@ -1,6 +1,19 @@
.header-container {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px 10px;
border-bottom: 1px solid #ddd;
}
.header-container-title {
flex-grow: 1;
text-align: left;
margin-left: 1em;
}
table {
width: 100%;
margin-top: 50px;
}
.search-container {
@ -8,14 +21,10 @@ table {
justify-content: space-between;
align-items: center;
width: 100%;
padding: 0 5px;
margin: 1.5rem 0rem 1.5rem 0rem;
box-sizing: border-box;
}
.divider {
margin: 20px 0;
}
.search-string {
flex: 2;
padding: 5px;
@ -26,13 +35,6 @@ table {
padding: 5px;
}
.header-container {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px;
}
.mat-elevation-z8 {
box-shadow: 0px 0px 0px rgba(0,0,0,0.2);
}

19
ogWebconsole/src/app/components/admin/users/users/users.component.html
View File

@ -1,24 +1,26 @@
<div class="header-container">
<h2 class="title">{{ 'adminUsersTitle' | translate }}</h2>
<div class="header-container-title">
<h2>{{ 'adminUsersTitle' | translate }}</h2>
</div>
<div class="images-button-row">
<button mat-flat-button color="primary" (click)="addUser()">
{{ 'addUser' | translate }}
</button>
</div>
</div>
<mat-divider class="divider"></mat-divider>
<div class="search-container">
<mat-form-field appearance="fill" class="search-string">
<mat-label>{{ 'searchLabel' | translate }}</mat-label>
<input matInput placeholder="{{ 'searchPlaceholder' | translate }}" [(ngModel)]="filters['name']" (keyup.enter)="search()">
<input matInput placeholder="{{ 'searchPlaceholder' | translate }}" [(ngModel)]="filters['name']"
(keyup.enter)="search()">
<mat-icon matSuffix>search</mat-icon>
<mat-hint>{{ 'searchHint' | translate }}</mat-hint>
</mat-form-field>
</div>
<div *ngIf="loading" class="loading-container">
<mat-spinner></mat-spinner>
</div>
<app-loading [isLoading]="loading"></app-loading>
<div *ngIf="!loading">
<table mat-table [dataSource]="dataSource" class="mat-elevation-z8">
@ -44,10 +46,7 @@
</div>
<div class="paginator-container">
<mat-paginator [length]="length"
[pageSize]="itemsPerPage"
[pageIndex]="page"
[pageSizeOptions]="pageSizeOptions"
<mat-paginator [length]="length" [pageSize]="itemsPerPage" [pageIndex]="page" [pageSizeOptions]="pageSizeOptions"
(page)="onPageChange($event)">
</mat-paginator>
</div>