Retoque final + comentarios

src/app/app.component.ts

@@ -4,9 +4,9 @@ import { MqttService, IMqttMessage } from 'ngx-mqtt';
 import { Subscription, interval } from 'rxjs';
 import { Subscription, interval } from 'rxjs';
 import { startWith, switchMap } from 'rxjs/operators';
 import { startWith, switchMap } from 'rxjs/operators';
 import { CrearPedidoDialogComponent } from './crear-pedido-dialog/crear-pedido-dialog.component';
 import { CrearPedidoDialogComponent } from './crear-pedido-dialog/crear-pedido-dialog.component';
-import { MapaComponent } from './mapa/mapa.component'; // Importa MapaComponent
+import { MapaComponent } from './mapa/mapa.component';
 import { BackendService } from './backend.service';
 import { BackendService } from './backend.service';
-import { ServicioPedidoService } from './servicio-pedido.service';  // Asegúrate de tener este servicio
+import { ServicioPedidoService } from './servicio-pedido.service';
 
 
 @Component({
 @Component({
   selector: 'app-root',
   selector: 'app-root',
@@ -16,11 +16,9 @@ import { ServicioPedidoService } from './servicio-pedido.service';  // Asegúrat
 
 
 export class AppComponent implements OnInit, OnDestroy {
 export class AppComponent implements OnInit, OnDestroy {
   private subscription: Subscription = new Subscription(); //Variable para suscribirse a un topic
   private subscription: Subscription = new Subscription(); //Variable para suscribirse a un topic
-  private finalizaSubscription: Subscription = new Subscription();
 
 
-  private publishInterval: Subscription = new Subscription(); //Variable para publicar datos cada 10 segundos
   //0202000105030705000200041109060110031000000200080101100110000106010701
   //0202000105030705000200041109060110031000000200080101100110000106010701
-  message: string = '0202000105030705000200041109060110031000000200080101100110000106010701'; //Variable para mostrar el mensaje MQTT
+  message: string = ''; //Variable para mostrar el mensaje MQTT
   @ViewChild(MapaComponent) mapaComponent!: MapaComponent;
   @ViewChild(MapaComponent) mapaComponent!: MapaComponent;
   @ViewChild(CrearPedidoDialogComponent) pedidodialog!: CrearPedidoDialogComponent;
   @ViewChild(CrearPedidoDialogComponent) pedidodialog!: CrearPedidoDialogComponent;
 
 
@@ -37,15 +35,9 @@ export class AppComponent implements OnInit, OnDestroy {
 
 
   ngOnDestroy() {
   ngOnDestroy() {
     this.subscription?.unsubscribe(); //Nos desconectamos del topic
     this.subscription?.unsubscribe(); //Nos desconectamos del topic
-    this.publishInterval?.unsubscribe(); //Nos desconectamos de publicar datos
   }
   }
 
 
-/**
- * Suscribe al topic 'pruebaMQTT' para recibir mensajes.
- * Al recibir un mensaje, el contenido se convierte a cadena y se almacena en la propiedad `message`,
- * y además se muestra en la consola.
- */
-
+  //Método para suscribirse al topic del mapa
 subscribeToTopicMapa() {
 subscribeToTopicMapa() {
   console.log('Conectado:');
   console.log('Conectado:');
 
 
@@ -55,13 +47,13 @@ subscribeToTopicMapa() {
     this.backendService.enviarMapa(messageMQTT).then((output:string) => {
     this.backendService.enviarMapa(messageMQTT).then((output:string) => {
       console.log('Respuesta del servidor:', output)
       console.log('Respuesta del servidor:', output)
     });
     });
-    // Update mapStr in MapaComponent
     this.mapaComponent.mapStr = messageMQTT;
     this.mapaComponent.mapStr = messageMQTT;
     this.message = messageMQTT;
     this.message = messageMQTT;
-    // Call ngOnInit in MapaComponent to refresh the map
     this.mapaComponent.ngOnInit();
     this.mapaComponent.ngOnInit();
   });
   });
 }
 }
+
+//Método para suscribirse al topic de la posicion
 subscribeToTopicPosicion() {
 subscribeToTopicPosicion() {
   this.subscription = this.mqttService.observe('equipoD/posicion').subscribe((data: IMqttMessage) => {
   this.subscription = this.mqttService.observe('equipoD/posicion').subscribe((data: IMqttMessage) => {
     try {
     try {
@@ -78,8 +70,9 @@ subscribeToTopicPosicion() {
   });
   });
 }
 }
 
 
+//Método para suscribirse al topic que indica si un pedido ha finalizado
 subscribeToFinaliza() {
 subscribeToFinaliza() {
-  this.finalizaSubscription = this.mqttService.observe('equipoD/finalizacion').subscribe({
+  this.subscription = this.mqttService.observe('equipoD/finalizacion').subscribe({
     next: (message) => {
     next: (message) => {
       console.log('Robot ha finalizado el pedido:', message.payload.toString());
       console.log('Robot ha finalizado el pedido:', message.payload.toString());
       this.procesarFinalizacionPedido();
       this.procesarFinalizacionPedido();
@@ -92,11 +85,7 @@ procesarFinalizacionPedido() {
   this.pedidoService.finalizarPedidoEnCurso();
   this.pedidoService.finalizarPedidoEnCurso();
   console.log('Primer pedido eliminado, siguiente pedido en la cola.');
   console.log('Primer pedido eliminado, siguiente pedido en la cola.');
 }
 }
-/**
-* Inicia la publicación periódica de mensajes en el topic 'pruebaMQTT'.
-* Se configura un intervalo que publica un mensaje cada 10 segundos, el cual incluye
-* la palabra 'Prueba' seguida de la fecha y hora actual.
-*/
+
 
 
 abrirPopupCrearPedido(): void {
 abrirPopupCrearPedido(): void {
   const dialogRef = this.dialog.open(CrearPedidoDialogComponent, {
   const dialogRef = this.dialog.open(CrearPedidoDialogComponent, {
@@ -120,6 +109,7 @@ actualizarUltimoIdDestino(nuevoDestinoId: number) {
   this.ultimoIdDestino = nuevoDestinoId;
   this.ultimoIdDestino = nuevoDestinoId;
 }
 }
 
 
+//Función para enviar el camino optimo de entrega del paquete mediante MQTT al robot
 enviarCaminos(actual: number, paquete: number, destino: number) {
 enviarCaminos(actual: number, paquete: number, destino: number) {
   this.backendService.enviarCaminos(actual, paquete, destino).then(response => {
   this.backendService.enviarCaminos(actual, paquete, destino).then(response => {
     console.log('Caminos recibidos:', response);
     console.log('Caminos recibidos:', response);

src/app/backend.service.ts

-// Definir las interfaces en un archivo separado o en la parte superior de tu servicio
-export interface MapResponse {
-  status: string;
-  message: string;
-}
-export interface Error {
-  status: string;
-  message: string;
-}
-export interface RouteResponse {
-  route: any[]; // Especifica un tipo más concreto si conoces la estructura de la ruta
-  duration: number;
-}
-
 import { Injectable } from '@angular/core';
 import { Injectable } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
 import { HttpClient } from '@angular/common/http';
-import { Observable } from 'rxjs';
 
 
 @Injectable({
 @Injectable({
   providedIn: 'root'
   providedIn: 'root'
@@ -24,6 +9,7 @@ export class BackendService {
 
 
   constructor(private http: HttpClient) { }
   constructor(private http: HttpClient) { }
 
 
+  //Método para realizar una petición get al backend para enviarle el mapa a este para luego pedirle caminos
   enviarMapa(mapa: string): Promise<any> {
   enviarMapa(mapa: string): Promise<any> {
     const url = this.baseUrl + "procesarmapa?mapa=" + encodeURIComponent(mapa);
     const url = this.baseUrl + "procesarmapa?mapa=" + encodeURIComponent(mapa);
     const response = this.http.get(url).toPromise();
     const response = this.http.get(url).toPromise();
@@ -32,11 +18,12 @@ export class BackendService {
   }
   }
 
 
 
 
+  //Método para realizar una petición get al backend para que este nos envíe el camino óptimo para el paquete
   enviarCaminos(actual: number, paquete: number, destino: number): Promise<any> {
   enviarCaminos(actual: number, paquete: number, destino: number): Promise<any> {
     const url = `${this.baseUrl}getcaminos?actual=${encodeURIComponent(actual.toString())}&paquete=${encodeURIComponent(paquete.toString())}&destino=${encodeURIComponent(destino.toString())}`;
     const url = `${this.baseUrl}getcaminos?actual=${encodeURIComponent(actual.toString())}&paquete=${encodeURIComponent(paquete.toString())}&destino=${encodeURIComponent(destino.toString())}`;
     const response = this.http.get(url).toPromise();
     const response = this.http.get(url).toPromise();
     console.log("Respuesta sobre la ruta", response);
     console.log("Respuesta sobre la ruta", response);
     return response;
     return response;
   }
   }
-  
+
 }
 }

src/app/cola-pedidos/cola-pedidos.component.ts

@@ -34,12 +34,4 @@ export class ColaPedidosComponent implements OnInit {
       this.pedidos = pedidosActualizados;
       this.pedidos = pedidosActualizados;
     });
     });
   }
   }
-
-    /**
-   * @brief Elimina un pedido específico de la cola de pedidos.
-   *
-   * Llama al método de eliminarPedido del servicio de pedidos, que filtra y actualiza la lista de pedidos.
-   *
-   * @param id Identificador único del pedido a eliminar.
-   */
 }
 }

src/app/crear-pedido-dialog/crear-pedido-dialog.component.ts

@@ -25,22 +25,21 @@ puntoDeEntrega: {idUnico:number,id: string, row: number, col: number} | null = n
 constructor(private pedidoService: ServicioPedidoService, private dialogRef: MatDialogRef<CrearPedidoDialogComponent>
 constructor(private pedidoService: ServicioPedidoService, private dialogRef: MatDialogRef<CrearPedidoDialogComponent>
   ,@Inject(MAT_DIALOG_DATA) public data: any,
   ,@Inject(MAT_DIALOG_DATA) public data: any,
 ) {
 ) {
-  this.mapaString = data.mapaString; // Aquí se asigna el string recibido al campo mapaString
+  this.mapaString = data.mapaString;
 }
 }
 
 
 
 
   /**
   /**
    * @brief Maneja la selección de un bloque en el mapa.
    * @brief Maneja la selección de un bloque en el mapa.
-   * 
+   *
    * Asigna el bloque seleccionado como punto de recogida o punto de entrega según el estado actual.
    * Asigna el bloque seleccionado como punto de recogida o punto de entrega según el estado actual.
    * Solo se permite seleccionar un punto de entrega si ya se ha seleccionado un punto de recogida y son distintos.
    * Solo se permite seleccionar un punto de entrega si ya se ha seleccionado un punto de recogida y son distintos.
-   * 
+   *
    * @param event Objeto que contiene el ID del bloque y sus coordenadas de fila y columna.
    * @param event Objeto que contiene el ID del bloque y sus coordenadas de fila y columna.
    */
    */
   enCeldaSeleccionada(event: {idUnico:number,id: string, row: number, col: number}): void {
   enCeldaSeleccionada(event: {idUnico:number,id: string, row: number, col: number}): void {
   if (!this.puntoDeRecogida) {
   if (!this.puntoDeRecogida) {
     this.puntoDeRecogida = event;
     this.puntoDeRecogida = event;
-    // Actualiza los estilos de resaltado aquí si es necesario
   } else if (!this.puntoDeEntrega && (this.puntoDeRecogida.row !== event.row || this.puntoDeRecogida.col !== event.col)) {
   } else if (!this.puntoDeEntrega && (this.puntoDeRecogida.row !== event.row || this.puntoDeRecogida.col !== event.col)) {
     this.puntoDeEntrega = event;
     this.puntoDeEntrega = event;
   }
   }
@@ -48,9 +47,9 @@ constructor(private pedidoService: ServicioPedidoService, private dialogRef: Mat
 
 
   /**
   /**
    * @brief Obtiene la ruta de la imagen del bloque basada en sus coordenadas.
    * @brief Obtiene la ruta de la imagen del bloque basada en sus coordenadas.
-   * 
+   *
    * Utiliza el servicio de mapa para obtener la imagen correspondiente al ID del bloque.
    * Utiliza el servicio de mapa para obtener la imagen correspondiente al ID del bloque.
-   * 
+   *
    * @param block Objeto que contiene el ID del bloque y sus coordenadas de fila y columna.
    * @param block Objeto que contiene el ID del bloque y sus coordenadas de fila y columna.
    * @return Ruta de la imagen del bloque.
    * @return Ruta de la imagen del bloque.
    */
    */
@@ -60,7 +59,7 @@ constructor(private pedidoService: ServicioPedidoService, private dialogRef: Mat
 
 
   /**
   /**
    * @brief Reinicia la selección de los puntos de recogida y entrega.
    * @brief Reinicia la selección de los puntos de recogida y entrega.
-   * 
+   *
    * Utilizado para comenzar una nueva selección después de confirmar un pedido o al desear cambiar la selección actual.
    * Utilizado para comenzar una nueva selección después de confirmar un pedido o al desear cambiar la selección actual.
    */
    */
   resetearSeleccion(): void {
   resetearSeleccion(): void {
@@ -70,19 +69,19 @@ constructor(private pedidoService: ServicioPedidoService, private dialogRef: Mat
 
 
   /**
   /**
    * @brief Confirma la selección de los puntos de recogida y entrega y crea un nuevo pedido.
    * @brief Confirma la selección de los puntos de recogida y entrega y crea un nuevo pedido.
-   * 
+   *
    * Utiliza el servicio de pedidos para agregar el nuevo pedido generado con un ID único a la cola de pedidos.
    * Utiliza el servicio de pedidos para agregar el nuevo pedido generado con un ID único a la cola de pedidos.
    */
    */
   confirmarSeleccion(): void {
   confirmarSeleccion(): void {
     console.log('Confirmación de selección con:', this.puntoDeRecogida, this.puntoDeEntrega);
     console.log('Confirmación de selección con:', this.puntoDeRecogida, this.puntoDeEntrega);
     if (this.puntoDeRecogida && this.puntoDeEntrega) {
     if (this.puntoDeRecogida && this.puntoDeEntrega) {
       const nuevoPedido: Pedido = {
       const nuevoPedido: Pedido = {
-        id: '',  // Asumiendo que el ID se asignará en alguna otra parte o por el backend
+        id: '',
         puntoDeRecogida: this.puntoDeRecogida,
         puntoDeRecogida: this.puntoDeRecogida,
         puntoDeEntrega: this.puntoDeEntrega
         puntoDeEntrega: this.puntoDeEntrega
       };
       };
       console.log('Nuevo pedido:', nuevoPedido);
       console.log('Nuevo pedido:', nuevoPedido);
-  
+
       this.pedidoService.agregarPedido(nuevoPedido);
       this.pedidoService.agregarPedido(nuevoPedido);
       // Cerrar el diálogo y pasar los datos necesarios al componente que abrió el diálogo
       // Cerrar el diálogo y pasar los datos necesarios al componente que abrió el diálogo
       this.dialogRef.close({
       this.dialogRef.close({
@@ -94,5 +93,5 @@ constructor(private pedidoService: ServicioPedidoService, private dialogRef: Mat
       console.log('No se ha completado la selección de puntos, no se puede confirmar.');
       console.log('No se ha completado la selección de puntos, no se puede confirmar.');
     }
     }
   }
   }
-  
+
 }
 }

src/app/mapa/mapa.component.ts

@@ -23,10 +23,9 @@ export class MapaComponent implements OnInit {
   @Input() interactivo: boolean = true;
   @Input() interactivo: boolean = true;
   @Output() celdaSeleccionada = new EventEmitter<{ id: string, idUnico: number, row: number, col: number }>();
   @Output() celdaSeleccionada = new EventEmitter<{ id: string, idUnico: number, row: number, col: number }>();
   @Output() celdaInvalidaClickeada = new EventEmitter<void>();
   @Output() celdaInvalidaClickeada = new EventEmitter<void>();
-// Extiende la definición de cada celda en tu matriz del mapa
   mapMatrix: {id: string, idUnico: number, robotPresente: boolean}[][] = [];
   mapMatrix: {id: string, idUnico: number, robotPresente: boolean}[][] = [];
   //0202000105030705000200041109060110031000000200080101100110000106010701
   //0202000105030705000200041109060110031000000200080101100110000106010701
-  @Input() mapStr: string = "0202000105030705000200041109060110031000000200080101100110000106010701"; // Cadena de texto que representa las casillas del mapa
+  @Input() mapStr: string = ""; // Cadena de texto que representa las casillas del mapa
   rows: number = 7;
   rows: number = 7;
   cols: number = 5;
   cols: number = 5;
   SeleccionadoIdRecogida: string | null = null;
   SeleccionadoIdRecogida: string | null = null;
@@ -90,17 +89,7 @@ actualizarPosicionRobot(idUnico: number): void {
   }
   }
 }
 }
 
 
-/*
-  enviarPedido(pedido: any): void {
-    this.backendService.obtenerRuta(pedido).subscribe({
-      next: (ruta:RouteResponse) => {
-        console.log('Ruta recibida del backend', ruta);
-        // Aquí puedes manejar la lógica para actualizar la ruta del robot o lo que sea necesario
-      },
-      error: (error:Error) => console.error('Error al obtener la ruta', error)
-    });
-  }
-  */
+
 /**
 /**
  * @brief Obtiene la ruta de la imagen para un ID de bloque específico.
  * @brief Obtiene la ruta de la imagen para un ID de bloque específico.
  *
  *