diff --git a/ogWebconsole/src/app/components/groups/classroom-view/classroom-view.component.html b/ogWebconsole/src/app/components/groups/classroom-view/classroom-view.component.html
index 7edb861..833d99f 100644
--- a/ogWebconsole/src/app/components/groups/classroom-view/classroom-view.component.html
+++ b/ogWebconsole/src/app/components/groups/classroom-view/classroom-view.component.html
@@ -1,3 +1,4 @@
+<button mat-flat-button color="primary" (click)="saveDisposition()">Guardar disposición</button>
 <div class="classroom">
   <mat-card *ngFor="let group of groupedClients" class="classroom-group">
     <mat-card-title>Clientes dentro de: {{ group.organizationalUnitName }}</mat-card-title>
@@ -7,8 +8,8 @@
     </div>
     <div *ngFor="let row of group.clientRows" class="client-row">
       <div class="client-container" *ngFor="let client of row" 
-           cdkDrag [cdkDragFreeDragPosition]="client.dragPosition" (cdkDragMoved)="onDragMoved($event)" cdkDragBoundary=".classroom">
-        <div class="client-box" (click)="handleClientClick(client)">
+           cdkDrag [cdkDragFreeDragPosition]="client.dragPosition" (cdkDragMoved)="onDragMoved($event, client)" cdkDragBoundary=".classroom">
+        <div class="client-box" (dblclick)="handleClientClick(client)">
           <mat-card appearance="outlined">
             <div class="client-image-container">
               <img mat-card-image src="assets/images/client.png" alt="Client" class="client-image"/>
diff --git a/ogWebconsole/src/app/components/groups/classroom-view/classroom-view.component.ts b/ogWebconsole/src/app/components/groups/classroom-view/classroom-view.component.ts
index e70d9f3..3af2bf7 100644
--- a/ogWebconsole/src/app/components/groups/classroom-view/classroom-view.component.ts
+++ b/ogWebconsole/src/app/components/groups/classroom-view/classroom-view.component.ts
@@ -1,7 +1,8 @@
-import { Component, Input, OnInit } from '@angular/core';
+import { Component, Input, OnInit, OnChanges } from '@angular/core';
 import { MatDialog } from '@angular/material/dialog';
 import { ClientViewComponent } from "../client-view/client-view.component";
-import { CdkDragEnd, CdkDragMove } from '@angular/cdk/drag-drop';
+import { CdkDragMove } from '@angular/cdk/drag-drop';
+import { HttpClient } from '@angular/common/http';
 
 interface GroupedClients {
   organizationalUnitName: string;
@@ -13,12 +14,12 @@ interface GroupedClients {
   templateUrl: './classroom-view.component.html',
   styleUrls: ['./classroom-view.component.css']
 })
-export class ClassroomViewComponent implements OnInit {
+export class ClassroomViewComponent implements OnInit, OnChanges {
   @Input() clients: any[] = [];
   @Input() pcInTable: number = 5;
   groupedClients: GroupedClients[] = [];
 
-  constructor(public dialog: MatDialog) {}
+  constructor(public dialog: MatDialog, private http: HttpClient) {}
 
   ngOnInit(): void {
     this.groupClientsByOrganizationalUnit();
@@ -40,88 +41,18 @@ export class ClassroomViewComponent implements OnInit {
       return acc;
     }, {});
 
-        /* this.groupedClients = Object.keys(grouped).map(ouName => ({
+    this.groupedClients = Object.keys(grouped).map(ouName => ({
       organizationalUnitName: ouName,
       clientRows: this.chunkArray(grouped[ouName], this.pcInTable)
-    })); */
-
-    this.groupedClients = [{
-      "organizationalUnitName": "Aula01",
-      "clientRows": [
-        [
-          {
-            "@id": "/clients/0190b603-3e40-7256-90dd-ea04b4ea0e41",
-            "@type": "Client",
-            "name": "PC1",
-            "position": `{"x": -165, "y": -93}`,
-            "type": "client",
-            "ip": "127.0.0.1",
-            "mac": "00:00:00:00:1",
-            "serialNumber": "1",
-            "netiface": "eth0",
-            "netDriver": "generic",
-            "organizationalUnit": {
-              "@id": "/organizational-units/0190b602-35f2-7026-a42a-cc310ed07921",
-              "@type": "OrganizationalUnit",
-              "name": "Aula01",
-              "type": "classroom",
-              "networkSettings": {
-                "@id": "/network-settings/0190b602-35f2-7026-a42a-cc310f5c8648",
-                "@type": "NetworkSettings",
-                "validation": false,
-                "uuid": "0190b602-35f2-7026-a42a-cc310f5c8648",
-                "id": 2
-              },
-              "uuid": "0190b602-35f2-7026-a42a-cc310ed07921",
-              "id": 2
-            },
-            "partitions": [],
-            "createdAt": "2024-07-15T10:49:44+00:00",
-            "createdBy": "ogadmin",
-            "uuid": "0190b603-3e40-7256-90dd-ea04b4ea0e41",
-            "id": 1
-          },
-          {
-            "@id": "/clients/0190b603-e73e-7033-bba1-309d4672f581",
-            "@type": "Client",
-            "name": "PC2",
-            "position": `{"x": -65, "y": 55}`,
-            "type": "client",
-            "ip": "123.0.0.2",
-            "mac": "00:00:00:00:2",
-            "serialNumber": "2",
-            "netiface": "eth0",
-            "organizationalUnit": {
-              "@id": "/organizational-units/0190b602-35f2-7026-a42a-cc310ed07921",
-              "@type": "OrganizationalUnit",
-              "name": "Aula01",
-              "type": "classroom",
-              "networkSettings": {
-                "@id": "/network-settings/0190b602-35f2-7026-a42a-cc310f5c8648",
-                "@type": "NetworkSettings",
-                "validation": false,
-                "uuid": "0190b602-35f2-7026-a42a-cc310f5c8648",
-                "id": 2
-              },
-              "uuid": "0190b602-35f2-7026-a42a-cc310ed07921",
-              "id": 2
-            },
-            "partitions": [],
-            "createdAt": "2024-07-15T10:50:27+00:00",
-            "createdBy": "ogadmin",
-            "uuid": "0190b603-e73e-7033-bba1-309d4672f581",
-            "id": 2
-          },
-        ]
-      ]
-    }]
+    }));
+    console.log(this.groupedClients);
   }
 
   initializeClientPositions(): void {
     this.groupedClients.forEach(group => {
       group.clientRows.forEach(row => {
         row.forEach(client => {
-          const position = JSON.parse(client.position);
+          const position = client.position; // Ya es un objeto, no necesita JSON.parse
           client.dragPosition = { x: position.x, y: position.y };
         });
       });
@@ -140,9 +71,32 @@ export class ClassroomViewComponent implements OnInit {
     const dialogRef = this.dialog.open(ClientViewComponent, { data: { client }, width: '800px', height:'700px' });
   }
 
-  onDragMoved(event: CdkDragMove<any>): void {
-    console.log('Elemento movido:', event.source.element.nativeElement);
+  onDragMoved(event: CdkDragMove<any>, client: any): void {
+    const dragPosition = event.source.getFreeDragPosition()
+    client.position.x = dragPosition.x;
+    client.position.y = dragPosition.y;
+    console.log("el drag", event.source.getFreeDragPosition().x)
+    /* console.log('Elemento movido:', event.source.element.nativeElement);
     console.log('Posición actual:', event.pointerPosition);
-    console.log('Posición relativa:', event.distance);
+    console.log('Posición relativa:', dragPosition); */
+  }
+
+  saveDisposition(): void {
+    this.groupedClients.forEach(group => {
+      group.clientRows.forEach(row => {
+        row.forEach(client => {
+          const url = `http://127.0.0.1:8080/clients/${client.uuid}`;
+          const payload = {
+            name: client.name,
+            position: client.position
+          };
+          this.http.patch(url, payload).subscribe(response => {
+            console.log('Cliente actualizado:', response);
+          }, error => {
+            console.error('Error al actualizar cliente:', error);
+          });
+        });
+      });
+    });
   }
 }