Improvements. UX styles and api calls updated
parent
664091136d
commit
275064d8f5
|
@ -1,5 +1,8 @@
|
|||
<div class="header-container">
|
||||
<h2 class="title" i18n="@@adminCommandsTitle">Trazas de comandos y procedimientos</h2>
|
||||
<div class="images-button-row">
|
||||
<button mat-flat-button color="primary" (click)="resetFilters()">Reiniciar filtros</button>
|
||||
</div>
|
||||
</div>
|
||||
<mat-divider class="divider"></mat-divider>
|
||||
<div class="search-container">
|
||||
|
|
|
@ -149,6 +149,12 @@ export class TaskLogsComponent implements OnInit {
|
|||
);
|
||||
}
|
||||
|
||||
resetFilters() {
|
||||
this.loading = true;
|
||||
this.filters = {};
|
||||
this.loadTraces();
|
||||
}
|
||||
|
||||
groupByCommandId(traces: any[]): any[] {
|
||||
const grouped: { [key: string]: any[] } = {};
|
||||
|
||||
|
@ -167,8 +173,9 @@ export class TaskLogsComponent implements OnInit {
|
|||
}
|
||||
|
||||
onPageChange(event: any): void {
|
||||
this.page = event.pageIndex + 1;
|
||||
this.page = event.pageIndex;
|
||||
this.itemsPerPage = event.pageSize;
|
||||
this.length = event.length;
|
||||
this.loadTraces();
|
||||
}
|
||||
}
|
||||
|
|
|
@ -25,10 +25,6 @@
|
|||
<input matInput placeholder="Unidad organizativa" (input)="applyFilter()" [(ngModel)]="filterName" i18n-placeholder="@@namePlaceholder">
|
||||
</mat-form-field>
|
||||
|
||||
|
||||
|
||||
<!-- FILTROS UNIDAD ORGANIZATIVA-->
|
||||
|
||||
<ng-container *ngIf="selectedFilter1 === 'ou'">
|
||||
|
||||
<mat-form-field [disabled]="selectedFilter1 === 'ou'">
|
||||
|
|
|
@ -50,7 +50,7 @@ export class AdvancedSearchComponent {
|
|||
savedFilterNames: any[] = [];
|
||||
length: number = 0;
|
||||
itemsPerPage: number = 10;
|
||||
page: number = 1;
|
||||
page: number = 0;
|
||||
pageSizeOptions: number[] = [5, 10, 25, 100];
|
||||
selectedElements: any[] = [];
|
||||
isAllSelected: boolean = false;
|
||||
|
@ -301,7 +301,7 @@ export class AdvancedSearchComponent {
|
|||
}
|
||||
|
||||
applyFilter() {
|
||||
this.dataService.getFilteredResults(this.selectedFilter1, this.selectedFilter2, this.filterName, this.filterIP, this.filterMAC, this.page, this.itemsPerPage)
|
||||
this.dataService.getFilteredResults(this.selectedFilter1, this.selectedFilter2, this.filterName, this.filterIP, this.filterMAC, this.page + 1, this.itemsPerPage)
|
||||
.subscribe(
|
||||
response => {
|
||||
this.filteredResults = response.results;
|
||||
|
@ -317,6 +317,7 @@ export class AdvancedSearchComponent {
|
|||
onPageChange(event: PageEvent) {
|
||||
this.page = event.pageIndex;
|
||||
this.itemsPerPage = event.pageSize;
|
||||
this.length = event.length;
|
||||
this.applyFilter();
|
||||
}
|
||||
|
||||
|
|
|
@ -12,15 +12,23 @@
|
|||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
padding: 0 5px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.search-string {
|
||||
flex: 1;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.divider {
|
||||
margin: 20px 0;
|
||||
}
|
||||
|
||||
.mat-elevation-z8 {
|
||||
box-shadow: 0px 0px 0px rgba(0,0,0,0.2);
|
||||
}
|
||||
|
||||
.search-boolean {
|
||||
flex: 1;
|
||||
padding: 5px;
|
||||
|
|
|
@ -34,7 +34,7 @@
|
|||
</mat-select>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<table mat-table [dataSource]="dataSource">
|
||||
<table mat-table [dataSource]="dataSource" class="mat-elevation-z8">
|
||||
<ng-container *ngFor="let column of columns" [matColumnDef]="column.columnDef">
|
||||
<th mat-header-cell *matHeaderCellDef> {{ column.header }} </th>
|
||||
<td mat-cell *matCellDef="let image" >
|
||||
|
|
|
@ -142,7 +142,7 @@ export class ClientTabViewComponent {
|
|||
|
||||
loadOrganizationalUnits() {
|
||||
this.loading = true;
|
||||
this.http.get<any>( `${this.baseUrl}/organizational-units?&page=1&itemsPerPage=10000`).subscribe(
|
||||
this.http.get<any>( `${this.baseUrl}/organizational-units?&page=1&itemsPerPage=10`).subscribe(
|
||||
response => {
|
||||
this.organizationalUnits = response['hydra:member'];
|
||||
this.loading = false;
|
||||
|
|
|
@ -12,6 +12,7 @@
|
|||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
padding: 0 5px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
@ -26,6 +27,10 @@
|
|||
padding: 5px;
|
||||
}
|
||||
|
||||
.mat-elevation-z8 {
|
||||
box-shadow: 0px 0px 0px rgba(0,0,0,0.2);
|
||||
}
|
||||
|
||||
.search-select {
|
||||
flex: 2;
|
||||
padding: 5px;
|
||||
|
|
|
@ -24,7 +24,7 @@
|
|||
</mat-select>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<table mat-table [dataSource]="dataSource">
|
||||
<table mat-table [dataSource]="dataSource" class="mat-elevation-z8">
|
||||
<ng-container *ngFor="let column of columns" [matColumnDef]="column.columnDef">
|
||||
<th mat-header-cell *matHeaderCellDef> {{ column.header }} </th>
|
||||
<td mat-cell *matCellDef="let ou" >
|
||||
|
|
|
@ -91,7 +91,7 @@ export class OrganizationalUnitTabViewComponent {
|
|||
this.length = data['hydra:totalItems'];
|
||||
},
|
||||
(error) => {
|
||||
console.error('Error fetching commands', error);
|
||||
console.error('Error fetching ou', error);
|
||||
}
|
||||
);
|
||||
}
|
||||
|
|
|
@ -161,7 +161,7 @@ export class GroupsComponent implements OnInit {
|
|||
this.dataService.getOrganizationalUnits().subscribe(
|
||||
data => {
|
||||
this.organizationalUnits = data
|
||||
this.loadChildrenAndClients(parent.id);
|
||||
this.loadChildrenAndClients(parent?.id);
|
||||
},
|
||||
error => console.error('Error fetching unidades organizativas', error)
|
||||
);
|
||||
|
|
|
@ -1,10 +1,10 @@
|
|||
<h1 mat-dialog-title i18n="@@actions-modal-title">Acciones</h1>
|
||||
<div class="button-container">
|
||||
<div *ngFor="let row of chunkArray(commands, 4)" class="button-row">
|
||||
<button
|
||||
*ngFor="let command of row"
|
||||
mat-flat-button
|
||||
color="primary"
|
||||
<button
|
||||
*ngFor="let command of row"
|
||||
mat-flat-button
|
||||
color="primary"
|
||||
class="button-action"
|
||||
(click)="onCommandClick(command)">
|
||||
{{ command.name }}
|
||||
|
|
|
@ -65,7 +65,7 @@ export class CreateImageComponent implements OnInit {
|
|||
},
|
||||
error: (error) => {
|
||||
console.error('Error:', error);
|
||||
this.toastService.error('Error updating image');
|
||||
this.toastService.error(error.error['hydra:description'] || 'Error updating image');
|
||||
}
|
||||
});
|
||||
} else {
|
||||
|
@ -77,7 +77,7 @@ export class CreateImageComponent implements OnInit {
|
|||
},
|
||||
error: (error) => {
|
||||
console.error('Error:', error);
|
||||
this.toastService.error('Error creating image');
|
||||
this.toastService.error(error.error['hydra:description'] || 'Error creating image');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
|
|
@ -162,14 +162,14 @@ export class ImagesComponent implements OnInit {
|
|||
width: '700px',
|
||||
data: image
|
||||
});
|
||||
|
||||
|
||||
dialogRef.afterClosed().subscribe(result => {
|
||||
if (result) {
|
||||
this.search();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
applyFilter() {
|
||||
this.http.get<any>(`${this.apiUrl}?page=${this.page}&itemsPerPage=${this.itemsPerPage}`).subscribe({
|
||||
|
@ -200,10 +200,10 @@ export class ImagesComponent implements OnInit {
|
|||
}
|
||||
|
||||
getIcon(): { name: string, color: string } {
|
||||
if (Number(this.alertMessage) === this.length) {
|
||||
return { name: 'check_circle', color: 'green' }; // Icono de check verde
|
||||
if (this.alertMessage) {
|
||||
return { name: 'check_circle', color: 'green' };
|
||||
} else {
|
||||
return { name: 'cancel', color: 'red' }; // Icono de cruz roja
|
||||
return { name: 'cancel', color: 'red' };
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -1,6 +1,5 @@
|
|||
form {
|
||||
max-width: 600px;
|
||||
margin: 20px auto;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
|
@ -49,4 +48,4 @@ h3 {
|
|||
margin-top: 30px;
|
||||
font-size: 1.2rem;
|
||||
color: #000000;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -2,23 +2,23 @@
|
|||
<mat-dialog-content>
|
||||
<mat-form-field appearance="fill" class="full-width">
|
||||
<mat-label>Nombre</mat-label>
|
||||
<input matInput [(ngModel)]="name" placeholder="Nombre de la subred">
|
||||
<input matInput [(ngModel)]="name" placeholder="Nombre de la subred" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="fill" class="full-width">
|
||||
<mat-label>Netmask</mat-label>
|
||||
<input matInput [(ngModel)]="netmask" placeholder="Netmask">
|
||||
<input matInput [(ngModel)]="netmask" placeholder="Netmask" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="fill" class="full-width">
|
||||
<mat-label>Dirección IP</mat-label>
|
||||
<input matInput [(ngModel)]="ipAddress" placeholder="Dirección IP">
|
||||
<input matInput [(ngModel)]="ipAddress" placeholder="Dirección IP" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="fill" class="full-width">
|
||||
<mat-label>Next Server</mat-label>
|
||||
<input matInput [(ngModel)]="nextServer" placeholder="Next Server">
|
||||
<input matInput [(ngModel)]="nextServer" placeholder="Next Server" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="fill" class="full-width">
|
||||
<mat-label>Boot File Name</mat-label>
|
||||
<input matInput [(ngModel)]="bootFileName" placeholder="Boot File Name">
|
||||
<input matInput [(ngModel)]="bootFileName" placeholder="Boot File Name" required>
|
||||
</mat-form-field>
|
||||
</mat-dialog-content>
|
||||
<mat-dialog-actions align="end">
|
||||
|
|
|
@ -24,7 +24,7 @@ export class CreateSubnetComponent implements OnInit {
|
|||
) { }
|
||||
|
||||
ngOnInit(): void {
|
||||
|
||||
|
||||
}
|
||||
|
||||
onNoClick(): void {
|
||||
|
@ -45,11 +45,11 @@ export class CreateSubnetComponent implements OnInit {
|
|||
next: (response) => {
|
||||
console.log('Success:', response);
|
||||
this.toastService.success('Configuración de red añadida exitosamente');
|
||||
this.dialogRef.close();
|
||||
this.dialogRef.close();
|
||||
},
|
||||
error: (error) => {
|
||||
console.error('Error:', error);
|
||||
this.toastService.error('Error al añadir la configuración de red');
|
||||
this.toastService.error(error.error['hydra:description']);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
|
|
@ -150,7 +150,11 @@ export class OgDhcpSubnetsComponent {
|
|||
this.itemsPerPage = event.pageSize;
|
||||
}
|
||||
|
||||
getIcon() {
|
||||
return { name: 'info', color: 'blue' };
|
||||
getIcon(): { name: string, color: string } {
|
||||
if (this.alertMessage) {
|
||||
return { name: 'check_circle', color: 'green' };
|
||||
} else {
|
||||
return { name: 'cancel', color: 'red' };
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue