Tengo la siguiente tabla donde los campos descripcion, inhabilM e inhabilC son editables, y el update que realizo es a traves del campo fechaInhabil
<div class="container">
<div class="page">
<div class="scrollme">
<table mat-table [dataSource]="dataSource" class="mat-elevation-z8">
<ng-container matColumnDef="fechaInhabil">
<th mat-header-cell *matHeaderCellDef> FECHA INHÁBIL </th>
<td mat-cell *matCellDef="let element"> {{element.fechaInhabil | date: 'yyyy-MM-dd'}} </td>
</ng-container>
<ng-container matColumnDef="descDiaInhabil">
<th mat-header-cell *matHeaderCellDef> DESCRIPCIÓN </th>
<td mat-cell *matCellDef="let element">
<mat-form-field>
<textarea matInput [value]="element.descDiaInhabil" [disabled]="!element.editable"
(keyup)="obtenerDescrip($event.target,element)"></textarea>
</mat-form-field>
</td>
</ng-container>
<ng-container matColumnDef="inhabilM">
<th mat-header-cell *matHeaderCellDef> INHAB M </th>
<td mat-cell *matCellDef="let element">
<mat-form-field>
<mat-select [value]="element.inhabilM" [disabled]="!element.editable"
(selectionChange)="selectInhabilM($event.value,element)"
[disableOptionCentering]="true">
<mat-option *ngFor="let inhabilMex of inhabMexder" [value]="inhabilMex.valor">
{{inhabilMex.label}}
</mat-option>
</mat-select>
</mat-form-field>
</td>
</ng-container>
<ng-container matColumnDef="inhabilC">
<th mat-header-cell *matHeaderCellDef> INHAB C </th>
<td mat-cell *matCellDef="let element">
<mat-form-field>
<mat-select (value)="element.inhabilC" [disabled]="!element.editable"
(selectionChange)="selectInhabilC($event.value,element)"
[disableOptionCentering]="true">
<mat-option *ngFor="let inhabilChic of inhabChic" [value]="inhabilChic.valor">
{{inhabilChic.label}}
</mat-option>
</mat-select>
</mat-form-field>
</td>
</ng-container>
<ng-container matColumnDef="botonEdit">
<th mat-header-cell *matHeaderCellDef> EDITAR </th>
<td mat-cell *matCellDef="let element">
<button mat-icon-button color="primary" (click)="actualizar(element,inhabilModel)">
<mat-icon>edit</mat-icon>
</button>
</td>
</ng-container>
<ng-container matColumnDef="botonDelete">
<th mat-header-cell *matHeaderCellDef> ELIMINAR </th>
<td mat-cell *matCellDef="let element">
<button mat-icon-button color="warn">
<mat-icon>delete</mat-icon>
</button>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</div>
<mat-paginator #paginator [pageIndex]="0" [pageSize]="5" [pageSizeOptions]="[5, 10]" showFirstLastButtons>
</mat-paginator>
</div>
</div>
en el metodo actualizar() recupero los datos de los campos editables, y utilizo la funcion formatDateToString() para darle este formato a la fecha (dd/MM/yyyy) y asi mandar los parametros al service de Angular
actualizar(element: any, inhabilModel: DiaInhabil) {
if (element.editable) {
element.editable = false;
inhabilModel.fechaInhabil = this.formatDateToString(this.idSelecc);
inhabilModel.descripcion = this.descripcionIngresada;
inhabilModel.inhabilM = this.inhabilMSelecc;
inhabilModel.inhabilC = this.inhabilCSelecc;
this.diaInhaervice.actualizarDia(inhabilModel).subscribe(data => {
inhabilModel = data;
this.idSelecc = null
this.descripcionIngresada = null;
this.inhabilMexderSelecc = null;
this.inhabilChicagoSelecc = null;
Swal.fire({
icon: 'success',
title: 'Éxito',
text: 'Registro actualizado correctamente'
});
});
} else {
element.editable = true;
}
}
//funcion para darle formato a la fecha
formatDateToString(date: Date): string {
if (date) {
const format = 'dd/MM/yyyy';
const locale = 'en-US';
return formatDate(date, format, locale);
}
return '';
}
Mi Service de Angular para realizar una peticion PUT, pero al ejecutarse manda el siguiente error en el navegador
export class DiaInhabService {
constructor(private httpCli: HttpClient) { }
private baseUrl = "http://localhost:8086/api/domain/public/v1.0.0/pymt/example/actualizarDia";
actualizarDia(diaInhab: DiaInhabil){
return this.httpCli.put<DiaInhabil>(this.baseUrl+"/"+diaInhab.fechaInhabil,diaInhab);
}
ERROR
core.js:4442 ERROR HttpErrorResponse {headers: HttpHeaders, status: 0, statusText: 'Unknown Error', url:
'http://localhost:8086/api/domain/public/v1.0.0/example/actualizarDia/20/07/2023', ok: false, …} error : ProgressEvent {isTrusted: true, lengthComputable: false, loaded: 0, total: 0, type: 'error', …} headers : HttpHeaders {normalizedNames: Map(0), lazyUpdate: null, headers: Map(0)} message : "Http failure response for http://localhost:8086/api/domain/public/v1.0.0/example/actualizarDia/20/07/2023: 0 Unknown Error" name : "HttpErrorResponse"
yo pienso que quiza sea por el formato de fecha al final del endpoint, que quiza lo este tomando como si fueran 3 parametros, pero en realizad solo es un parametro de fecha el cual el formato es (20/07/2023) y no entra ni a mi servicio en SpringBoot
este es mi codigo de back
@PutMapping("/actualizarDia/{fechaInhabil}")
public void actualizarDiaInhab(@RequestBody DiaInhabilEntity entidad,
@PathVariable("fechaInhabil") String fechaInhabil) throws Exception {
try {
diaInhabilService.actualizarDia(entidad, fechaInhabil);
} catch (Exception e) {
LOGGER.error("Error in Values ");
throw e;
}
}
@Transactional
@Override
public void actualizarDia(DiaInhabilEntity entidad, String fechaInhabil) throws Exception {
try {
diaInhabilRepository.actualizarCatDia(entidad.getDescripcion(), entidad.getInhabilM(),
entidad.getInhabilC(), fechaInhabil);
} catch (Exception e) {
LOGGER.error("An error ocurred looking for Data");
}
}
@Modifying
@Query(value = "UPDATE DIA_INHABIL I SET I.DESCRIPCION=?1, I.INHABIL_M=?2, I.INHABIL_C=?3 WHERE I.FECHA_INHABIL=?4", nativeQuery = true)
void actualizarCatDia(String descripcion, String inhabilM, String inhabilC, String fechaInhabil);
al realizar una prueba unitaria si realiza el Update, y lo mando como el mismo formato
@Test
void testUpdate() {
DiaInhabilEntity exec = new DiaInhabilEntity();
exec.setDescripcion("PRUEBA DATOS");
exec.setInhabilM("0");
exec.setInhabilC("0");
exec.setFechaInhabil("20/07/2023");
repository.actualizarCatDia(exec.getDescripcion(), exec.getInhabilM(), exec.getInhabilC(), exec.getFechaInhabil());
}
pero al momento de hacerlo desde el Front, manda ese error, como puedo hacer para que en el Endpoint no lo tome como si fueran 3 paraetros, sino uno solo?