feat: add filtering options for tasks by date and subject, including new service methods

Front/src/app/modules/Alumno/pages/tareas/tareas.component.html

@@ -11,6 +11,34 @@
                 <input class="input" (keyup)="applyFilter($event)" matInput placeholder="Buscar" #input>
                 <mat-icon matSuffix>search</mat-icon>
             </mat-form-field>
+            <mat-form-field style="width: 200px; margin-left: 20px; margin-right: 20px; margin-top: 5px;">
+                <mat-label>Filtrar por:</mat-label>
+                <mat-select (selectionChange)="onFiltroChange($event.value)">
+                    <mat-option value="FE">Fecha de entrega</mat-option>
+                    <mat-option value="FA">Fecha de asignación</mat-option>
+                    <mat-option value="MAT">Materia</mat-option>
+                </mat-select>
+            </mat-form-field>
+
+            <!-- Si se elige "Fecha de entrega" o "Fecha de asignación" -->
+            <mat-form-field *ngIf="filtroSeleccionado === 'FE' || filtroSeleccionado === 'FA'" class="input"
+                style="width: 200px; margin-left: 20px; margin-right: 20px; margin-top: 5px;">
+                <mat-label>Seleccionar fecha</mat-label>
+                <input matInput [matDatepicker]="picker" (dateChange)="onFechaSeleccionada($event)">
+                <mat-datepicker-toggle matIconSuffix [for]="picker"></mat-datepicker-toggle>
+                <mat-datepicker #picker></mat-datepicker>
+            </mat-form-field>
+
+            <!-- Si se elige "Materia" -->
+            <mat-form-field *ngIf="filtroSeleccionado === 'MAT'"
+                style="width: 200px; margin-left: 20px; margin-right: 20px; margin-top: 5px;">
+                <mat-label>Seleccionar materia</mat-label>
+                <mat-select (selectionChange)="onMateriaSeleccionada($event.value)">
+                    <mat-option *ngFor="let materia of materias" [value]="materia.idMateria">
+                        {{ materia.nombreMateria }}
+                    </mat-option>
+                </mat-select>
+            </mat-form-field>
         </div>
 
     </div>
@@ -35,7 +63,7 @@
                 </ng-container>
 
                 <ng-container matColumnDef="fechaPub">
-                    <th mat-header-cell *matHeaderCellDef> Fecha de Publicación </th>
+                    <th mat-header-cell *matHeaderCellDef> Fecha de Asignación </th>
                     <td mat-cell *matCellDef="let tarea"> {{tarea.fechaPublicacion| date: 'dd/MM/yyyy hh:mm:ss'}}
                     </td>
                 </ng-container>

Front/src/app/modules/Alumno/pages/tareas/tareas.component.ts

@@ -11,11 +11,15 @@ import { ModalTarea } from '../../../Profesor/pages/tareas/tareas.component';
 
 import * as XLSX from 'xlsx';
 import { TareasService } from '../../services/tareas.service';
+import { MAT_DATE_LOCALE, provideNativeDateAdapter } from '@angular/material/core';
 
 @Component({
   selector: 'app-tareas',
   templateUrl: './tareas.component.html',
-  styleUrl: './tareas.component.css'
+  styleUrl: './tareas.component.css',
+  providers: [provideNativeDateAdapter(),
+  { provide: MAT_DATE_LOCALE, useValue: 'en-GB' }
+  ]
 })
 export class TareasComponent {
   public checked = false;
@@ -23,7 +27,7 @@ export class TareasComponent {
   public searchInput = new FormControl('');
   public color: string = '';
   public textColor: string = '';
-  public columnas: string[] = ['titulo', 'materia', 'tipoTarea', 'fechaPub', 'fechaEntrega', 'enlaces' ,'adjuntos', 'acciones'];
+  public columnas: string[] = ['titulo', 'materia', 'tipoTarea', 'fechaPub', 'fechaEntrega', 'enlaces', 'adjuntos', 'acciones'];
   public dataSource = new MatTableDataSource<any>();
   private userData = JSON.parse(localStorage.getItem('userData') || '[]');
   private userDataS = JSON.parse(localStorage.getItem('userDataS') || '[]');
@@ -102,7 +106,7 @@ export class TareasComponent {
   public urls: any = [];
   //Traer la información y mostrarla en la tabla
   getTareas() {
-    this.tareasService.getTareas(this.userDataS[0] ? this.userDataS[0] : this.userData[0] ).subscribe((response: any) => {
+    this.tareasService.getTareas(this.userDataS[0] ? this.userDataS[0] : this.userData[0]).subscribe((response: any) => {
       this.isLoading = false;
 
       this.allInfo = response.map((tarea: any) => {
@@ -114,16 +118,16 @@ export class TareasComponent {
         } else {
           tarea.vinculoTareaArray = [];
         }
-      
+
         if (tarea.adjuntoTarea) {
           tarea.adjuntoTarea = JSON.parse(tarea.adjuntoTarea);
         } else {
           tarea.adjuntoTarea = [];
         }
-      
+
         return tarea;
       });
-      
+
 
       this.dataSource = new MatTableDataSource<any>(this.allInfo);
       this.dataSource.paginator = this.paginator;
@@ -141,8 +145,106 @@ export class TareasComponent {
     this.dataSource.filter = filterValue.trim().toLowerCase();
   }
 
+  filtroSeleccionado: string = '';
+  materias: any[] = [];
+  fechaSeleccionada: Date | null = null;
+  materiaSeleccionada: any = null;
+
+  onFiltroChange(valor: string): void {
+    // Actualiza el filtro seleccionado
+    this.filtroSeleccionado = valor;
+
+    // Limpia valores previos
+    this.fechaSeleccionada = null;
+    this.materiaSeleccionada = null;
+
+    // Limpia tabla (opcional)
+    this.dataSource.data = this.allInfo;
+
+    // Si se selecciona MAT, carga materias recientes
+    if (valor === 'MAT') {
+      this.cargarMaterias();
+    }
+  }
+
+  cargarMaterias(): void {
+    const userId = this.userDataS[0] ? this.userDataS[0] : this.userData[0];
+
+    this.tareasService.getMaterias30Dias(userId).subscribe(
+      (response: any) => {
+        this.materias = response;
+        console.log('Materias de últimos 30 días:', this.materias);
+      },
+      (error) => {
+        console.error('Error al cargar materias:', error);
+        this.materias = []; // fallback
+      }
+    );
+  }
+
+  onFechaSeleccionada(event: any): void {
+    
+    this.fechaSeleccionada = event.value;
+    if (!this.fechaSeleccionada) return;
+    const fechaFormateada = this.formatFecha(this.fechaSeleccionada);
+    console.log('📅 Fecha seleccionada:', fechaFormateada);
+
+    if (!this.filtroSeleccionado) return;
+
+    // Mostrar loader
+    this.isLoading = true;
+
+    // Llamar al servicio correspondiente
+    if (this.filtroSeleccionado === 'FE') {
+      // Fecha de entrega
+      this.tareasService.getByFechaEntrega(fechaFormateada, this.userDataS[0] ? this.userDataS[0] : this.userData[0]).subscribe((response: any) => {
+        this.actualizarTabla(response);
+      });
+    } else if (this.filtroSeleccionado === 'FA') {
+      // Fecha de asignación
+      this.tareasService.getByFechaAsignacion(fechaFormateada, this.userDataS[0] ? this.userDataS[0] : this.userData[0]).subscribe((response: any) => {
+        this.actualizarTabla(response);
+      });
+    }
+  }
+
+  onMateriaSeleccionada(idMateria: any): void {
+    this.materiaSeleccionada = idMateria;
+    console.log('📘 Materia seleccionada:', idMateria);
+
+    if (!idMateria) return;
+
+    this.isLoading = true;
+    this.tareasService.getByMateria(idMateria).subscribe((response: any) => {
+      this.actualizarTabla(response);
+    });
+  }
+
+  private actualizarTabla(response: any): void {
+    this.isLoading = false;
+
+    this.dataSource = new MatTableDataSource<any>(
+      response.map((tarea: any) => {
+        tarea.vinculoTareaArray = tarea.vinculoTarea
+          ? tarea.vinculoTarea.split("||").map((url: string) => ({ nombre: url, url }))
+          : [];
+        tarea.adjuntoTarea = tarea.adjuntoTarea ? JSON.parse(tarea.adjuntoTarea) : [];
+        return tarea;
+      })
+    );
+    this.dataSource.paginator = this.paginator;
+  }
+
+  private formatFecha(fecha: Date): string {
+    // Devuelve formato YYYY-MM-DD
+    const year = fecha.getFullYear();
+    const month = String(fecha.getMonth() + 1).padStart(2, '0');
+    const day = String(fecha.getDate()).padStart(2, '0');
+    return `${year}-${month}-${day}`;
+  }
+
+
 
-  
 
   // openDialog1(id: string) {
   //   const dialogRef = this.dialog.open(ModalCircular, {
@@ -182,6 +284,6 @@ export class TareasComponent {
   imports: [MatIconModule, MatDialogContent, MatDialogActions, MatDialogClose]
 })
 export class TareaAlumComponent {
-  constructor(@Inject(MAT_DIALOG_DATA) public data: any) { 
+  constructor(@Inject(MAT_DIALOG_DATA) public data: any) {
   }
 }

Front/src/app/modules/Alumno/services/tareas.service.ts

@@ -23,5 +23,21 @@ export class TareasService {
     return this.http.get(`${this.URL}/tareas/usuario/${idAlumno}`, { headers: this.getHeaders() });
   }
 
+  getByFechaEntrega(fechaEntrega: string, idUsuario: string) {
+    return this.http.get(`${this.URL}/tareas/fecha-entrega/${fechaEntrega}/${idUsuario}`, { headers: this.getHeaders() });
+  }
+
+  getByFechaAsignacion(fechaAsignacion: string, idUsuario: string) {
+    return this.http.get(`${this.URL}/tareas/fecha-asignacion/${fechaAsignacion}/${idUsuario}`, { headers: this.getHeaders() });
+  }
+
+  getByMateria(idMateria: string) {
+    return this.http.get(`${this.URL}/tareas/materia/${idMateria}`, { headers: this.getHeaders() });
+  }
+
+  getMaterias30Dias(userId: string) {
+    return this.http.get(`${this.URL}/tareas/materiaUlt30/${userId}`, { headers: this.getHeaders() });
+  }
+
 
 }

Front/src/app/modules/Profesor/services/tareas.service.ts

@@ -22,6 +22,22 @@ export class TareasService {
     return this.http.get(`${this.URL}/getAllTareas`, { headers: this.getHeaders() });
   }
 
+  getByFechaEntrega(fechaEntrega: string) {
+    return this.http.get(`${this.URL}/tareas/fecha-entrega/${fechaEntrega}`, { headers: this.getHeaders() });
+  }
+
+  getByFechaAsignacion(fechaAsignacion: string) {
+    return this.http.get(`${this.URL}/tareas/fecha-asignacion/${fechaAsignacion}`, { headers: this.getHeaders() });
+  }
+
+  getByMateria(idMateria: string) {
+    return this.http.get(`${this.URL}/tareas/materia/${idMateria}`, { headers: this.getHeaders() });
+  }
+
+  getMaterias30Dias() {
+    return this.http.get(`${this.URL}/tareas/materiaUlt30/`, { headers: this.getHeaders() });
+  }
+
   getTipoTareas() {
     return this.http.get(`${this.URL}/tipoTarea`, { headers: this.getHeaders() });
   }