diff --git a/ogWebconsole/src/app/components/groups/groups.component.html b/ogWebconsole/src/app/components/groups/groups.component.html
index 435d965..e28e7ea 100644
--- a/ogWebconsole/src/app/components/groups/groups.component.html
+++ b/ogWebconsole/src/app/components/groups/groups.component.html
@@ -358,7 +358,13 @@
-
+
+
@@ -375,4 +381,4 @@
-
\ No newline at end of file
+
diff --git a/ogWebconsole/src/app/components/groups/groups.component.ts b/ogWebconsole/src/app/components/groups/groups.component.ts
index ff484ad..ebb0b58 100644
--- a/ogWebconsole/src/app/components/groups/groups.component.ts
+++ b/ogWebconsole/src/app/components/groups/groups.component.ts
@@ -19,7 +19,7 @@ import { DeleteModalComponent } from '../../shared/delete_modal/delete-modal/del
import { ClassroomViewDialogComponent } from './shared/classroom-view/classroom-view-modal';
import { MatSort } from '@angular/material/sort';
import { MatTableDataSource } from '@angular/material/table';
-import { MatPaginator } from '@angular/material/paginator';
+import {MatPaginator, PageEvent} from '@angular/material/paginator';
import { CreateMultipleClientComponent } from "./shared/clients/create-multiple-client/create-multiple-client.component";
import { SelectionModel } from "@angular/cdk/collections";
@@ -41,6 +41,10 @@ export class GroupsComponent implements OnInit, OnDestroy {
organizationalUnits: UnidadOrganizativa[] = [];
selectedUnidad: UnidadOrganizativa | null = null;
selectedDetail: UnidadOrganizativa | null = null;
+ length: number = 0;
+ itemsPerPage: number = 10;
+ page: number = 0;
+ pageSizeOptions: number[] = [5, 10, 20, 40, 100];
initialLoading: boolean = true;
isLoadingClients: boolean = false;
searchTerm = '';
@@ -334,11 +338,12 @@ export class GroupsComponent implements OnInit, OnDestroy {
}
- public fetchClientsForNode(node: TreeNode, selectedClientsBeforeEdit: string[] = []): void {
+ public fetchClientsForNode(node: any, selectedClientsBeforeEdit: string[] = []): void {
this.isLoadingClients = true;
- this.http.get(`${this.baseUrl}/clients?organizationalUnit.id=${node.id}`).subscribe({
+ this.http.get(`${this.baseUrl}/clients?organizationalUnit.id=${node.id}&page=${this.page + 1}&itemsPerPage=${this.itemsPerPage}`).subscribe({
next: (response) => {
this.selectedClients.data = response['hydra:member'];
+ this.length = response['hydra:totalItems'];
this.arrayClients = this.selectedClients.data;
this.hasClients = node.hasClients ?? false;
this.isLoadingClients = false;
@@ -732,4 +737,11 @@ export class GroupsComponent implements OnInit, OnDestroy {
inputElement.value = '';
this.filterClients('');
}
+
+ onPageChange(event: PageEvent): void {
+ this.page = event.pageIndex;
+ this.itemsPerPage = event.pageSize;
+ this.length = event.length;
+ this.fetchClientsForNode(this.selectedNode);
+ }
}
diff --git a/ogWebconsole/src/app/components/ogdhcp/create-subnet/create-subnet.component.css b/ogWebconsole/src/app/components/ogdhcp/create-subnet/create-subnet.component.css
index 24cf3c0..c0a1dd5 100644
--- a/ogWebconsole/src/app/components/ogdhcp/create-subnet/create-subnet.component.css
+++ b/ogWebconsole/src/app/components/ogdhcp/create-subnet/create-subnet.component.css
@@ -2,10 +2,6 @@
width: 100%;
}
-form {
- padding: 20px;
-}
-
.spacing-container {
margin-top: 20px;
margin-bottom: 16px;
diff --git a/ogWebconsole/src/app/components/ogdhcp/create-subnet/create-subnet.component.html b/ogWebconsole/src/app/components/ogdhcp/create-subnet/create-subnet.component.html
index cbdfc10..9246697 100644
--- a/ogWebconsole/src/app/components/ogdhcp/create-subnet/create-subnet.component.html
+++ b/ogWebconsole/src/app/components/ogdhcp/create-subnet/create-subnet.component.html
@@ -1,38 +1,62 @@
{{ isEditMode ? 'Editar' : 'Añadir' }} subred
-
+
-
+
diff --git a/ogWebconsole/src/app/components/ogdhcp/create-subnet/create-subnet.component.ts b/ogWebconsole/src/app/components/ogdhcp/create-subnet/create-subnet.component.ts
index 3dfaea1..bf37323 100644
--- a/ogWebconsole/src/app/components/ogdhcp/create-subnet/create-subnet.component.ts
+++ b/ogWebconsole/src/app/components/ogdhcp/create-subnet/create-subnet.component.ts
@@ -1,8 +1,8 @@
import { HttpClient } from '@angular/common/http';
import { Component, Inject, OnInit } from '@angular/core';
-import {MAT_DIALOG_DATA, MatDialog, MatDialogRef} from '@angular/material/dialog';
+import { MAT_DIALOG_DATA, MatDialog, MatDialogRef } from '@angular/material/dialog';
+import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { ToastrService } from 'ngx-toastr';
-import {DeleteModalComponent} from "../../../shared/delete_modal/delete-modal/delete-modal.component";
@Component({
selector: 'app-create-subnet',
@@ -11,23 +11,28 @@ import {DeleteModalComponent} from "../../../shared/delete_modal/delete-modal/de
})
export class CreateSubnetComponent implements OnInit {
baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
- subnetId: string | null = null;
- name: string = '';
- netmask: string = '';
- ipAddress: string = '';
- nextServer: string = '';
- bootFileName: string = '';
- router: string = '';
- serverId: number = 0;
+ subnetForm: FormGroup;
isEditMode: boolean = false;
+ subnetId: string | null = null;
constructor(
private toastService: ToastrService,
private http: HttpClient,
+ private fb: FormBuilder,
public dialogRef: MatDialogRef,
public dialog: MatDialog,
@Inject(MAT_DIALOG_DATA) public data: any
- ) { }
+ ) {
+ this.subnetForm = this.fb.group({
+ name: ['', Validators.required],
+ netmask: ['', Validators.required],
+ ipAddress: ['', Validators.required],
+ router: [''],
+ dns: ['', Validators.pattern(/^(((25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?),)*((25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/)],
+ nextServer: [''],
+ bootFileName: ['']
+ });
+ }
ngOnInit(): void {
if (this.data) {
@@ -38,13 +43,15 @@ export class CreateSubnetComponent implements OnInit {
loadData() {
this.subnetId = this.data.uuid;
- this.name = this.data.name;
- this.netmask = this.data.netmask;
- this.ipAddress = this.data.ipAddress;
- this.nextServer = this.data.nextServer;
- this.bootFileName = this.data.bootFileName;
- this.router = this.data.router;
- this.serverId = this.data.serverId;
+ this.subnetForm.patchValue({
+ name: this.data.name,
+ netmask: this.data.netmask,
+ dns: this.data.dns,
+ ipAddress: this.data.ipAddress,
+ nextServer: this.data.nextServer,
+ bootFileName: this.data.bootFileName,
+ router: this.data.router
+ });
}
onNoClick(): void {
@@ -52,37 +59,33 @@ export class CreateSubnetComponent implements OnInit {
}
save(): void {
- const payload = {
- name: this.name,
- netmask: this.netmask,
- ipAddress: this.ipAddress,
- router: this.router || null,
- nextServer: this.nextServer || null,
- bootFileName: this.bootFileName || null
- };
+ if (this.subnetForm.invalid) {
+ this.toastService.error('Por favor, revisa los campos del formulario');
+ return;
+ }
- if (!this.data){
- this.http.post(`${this.baseUrl}/subnets`, payload)
- .subscribe({
- next: (response) => {
- this.toastService.success('Configuración de red añadida exitosamente');
- this.dialogRef.close();
- },
- error: (error) => {
- this.toastService.error(error.error['hydra:description']);
- }
- });
+ const payload = this.subnetForm.value;
+
+ if (!this.isEditMode) {
+ this.http.post(`${this.baseUrl}/subnets`, payload).subscribe({
+ next: () => {
+ this.toastService.success('Configuración de red añadida exitosamente');
+ this.dialogRef.close();
+ },
+ error: (error) => {
+ this.toastService.error(error.error['hydra:description']);
+ }
+ });
} else {
- this.http.patch(`${this.baseUrl}/subnets/${this.subnetId}`, payload)
- .subscribe({
- next: (response) => {
- this.toastService.success('Configuración de red actualizada exitosamente');
- this.dialogRef.close();
- },
- error: (error) => {
- this.toastService.error(error.error['hydra:description']);
- }
- });
+ this.http.patch(`${this.baseUrl}/subnets/${this.subnetId}`, payload).subscribe({
+ next: () => {
+ this.toastService.success('Configuración de red actualizada exitosamente');
+ this.dialogRef.close();
+ },
+ error: (error) => {
+ this.toastService.error(error.error['hydra:description']);
+ }
+ });
}
}
}
diff --git a/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets.component.ts b/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets.component.ts
index 13d6396..4932267 100644
--- a/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets.component.ts
+++ b/ogWebconsole/src/app/components/ogdhcp/og-dhcp-subnets.component.ts
@@ -66,10 +66,8 @@ export class OgDhcpSubnetsComponent implements OnInit {
ngOnInit() {
this.loading = true;
- this.loadSubnets();
this.loadAlert()
this.syncSubnets()
- this.loading = false;
}
loadSubnets() {
@@ -93,7 +91,9 @@ export class OgDhcpSubnetsComponent implements OnInit {
.subscribe(response => {
this.toastService.success('Sincronización con componente DHCP exitosa');
this.loadSubnets()
+ this.loading = false;
}, error => {
+ this.loading = false;
this.toastService.error('Error al sincronizar');
});
}