0

Tengo un sistema que requiere primeramente que el usuario especifique un número de expediente, y luego pueda subir un archivo de excel con diferentes datos, entre ellos una columna que contiene Fechas ..

El problema es que me las captura mal a las fechas.. por ejemplo, si quiero capturar una fecha así : 15/02/2024 el programa me la captura de esta forma: 45337 Por lo que estuve leyendo parece ser que en realidad es el mismo dato, solamente que la librería que estoy utilizando en Angular toma por defecto una codificación de los tipos de datos Dates, y no el dato real ...

Cómo puedo hacer para lograr capturar bien las fechas y que se me muestren en mi tabla como deberían de verse y no en esa codificación ?

[![angular1][1]][1]


[![excel 1][1]][1]


        
import { HttpClient } from '@angular/common/http';
import { Component, OnInit } from '@angular/core';
import { MatDialog } from '@angular/material/dialog';
import { Router } from '@angular/router';
import { AnomaliaExpediente } from 'src/app/models/anomaliaExpediente';
import { AnomaliaExpedienteService } from 'src/app/services/anomalias/anomalia-expediente.service';
import { ExpedienteService } from 'src/app/services/nueva-caratula/expediente.service';
import Swal from 'sweetalert2';
import * as XLSX from 'xlsx';
import { VistaPreviaModalComponent } from './vista-previa-modal/vista-previa-modal.component';
import { AyudaPopComponent } from './ayudapop.component';


@Component({
  selector: 'app-carga-imagenes',
  templateUrl: './carga-imagenes.component.html',
  styleUrls: ['./carga-imagenes.component.css']
})
export class CargaImagenesComponent implements OnInit {

  fileList: File[] = [];
  expedientes!: any;
  headers: string[] = [];
  rows: any[] = [];

  nroExpedienteSeleccionado!: string;


  constructor(public dialog: MatDialog, private router: Router, private expedienteService: ExpedienteService, private anomaliaExpedienteService: AnomaliaExpedienteService) { }


 ngOnInit(): void {
    this.expedienteService.getAllExpediente().subscribe(
      (resp) => {
        this.expedientes = resp;
      }
    );
  }
onFilesSelected(event: any): void {

    console.log('Iniciando la selección de archivos');
    const files: FileList = event.target.files;
    this.headers = [];
    this.rows = [];

    for (let i = 0; i < files.length; i++) {
      this.fileList.push(files[i]);
    }

 for (let i = 0; i < this.fileList.length; i++) {
      const fileReader: FileReader = new FileReader();

      fileReader.onload = (e: any) => {
        console.log('Procesando el archivo:', this.fileList[i].name);
        const data: string | ArrayBuffer = e.target.result;
        const workbook: XLSX.WorkBook = XLSX.read(data, { type: 'binary' });
        const sheetName: string = workbook.SheetNames[0];
        const worksheet: XLSX.WorkSheet = workbook.Sheets[sheetName];

        const rangeRef = worksheet['!ref'];
        if (!rangeRef) {
 console.error('La referencia de rango no está definida en la hoja de cálculo.');
  return;
}
 const range: XLSX.Range = XLSX.utils.decode_range(rangeRef);
 for (let C = range.s.c; C <= range.e.c; ++C) {
          const cellRef: string = XLSX.utils.encode_cell({ r: range.s.r, c: C });
          const cell: XLSX.CellObject = worksheet[cellRef];
          this.headers.push(cell && cell.v !== undefined ? String(cell.v) : '');
        }

        for (let R = range.s.r + 1; R <= range.e.r; ++R) {
          const row: any = {};
          for (let C = range.s.c; C <= range.e.c; ++C) {
            const cellRef: string = XLSX.utils.encode_cell({ r: R, c: C });
            const cell: XLSX.CellObject = worksheet[cellRef];
            let cellValue = cell ? cell.v : undefined;
   if (cell && cell.t === 'n' && this.headers[C] === 'Fecha') {
              if (typeof cellValue === 'number') {
                cellValue = this.excelSerialToDate(cellValue);
                console.log('Fecha convertida:', cellValue);
              }
            }
      if (this.headers[C] === 'ANOMALIA') {
              const parts = (cellValue as string).split(':'); // Dividir el valor en dos partes usando ':'
              if (parts.length === 2) {
                row['codigo'] = parts[0].trim(); // La parte antes de ':' es el código
                row['descripcion'] = parts[1].trim(); // La parte después de ':' es la descripción
              } else {
   row['descripcion'] = cellValue;
              }
  console.log('Valor completo de ANOMALÍA:', cellValue);
              console.log('Código:', row['codigo']);
              console.log('Descripción:', row['descripcion']);
            } else {
              row[this.headers[C]] = cellValue;
            }
          }
          this.rows.push(row);
        }
     console.log('Headers:', this.headers);
        console.log('Rows:', this.rows);
      };

      fileReader.readAsBinaryString(this.fileList[i]);
    }
  }

  excelSerialToDate(serial: number): Date {
 if (serial <= 0) {
      return new Date('1900-01-01'); // Valor de fecha por defecto
    }
   const secondsInDay = 24 * 60 * 60;
    const epoch = Date.parse('1900-01-01');
    const offset = (serial - 1) * secondsInDay * 1000;
    return new Date(epoch + offset);
  }

  uploadFiles(): void {

    if (this.fileList.length === 0) {
  return;
    }

    if (!this.expedientes) {
      return;

    const nroExpedienteSeleccionado = this.nroExpedienteSeleccionado;
    console.log('Número de expediente seleccionado:', nroExpedienteSeleccionado);

    for (let i = 0; i < this.rows.length; i++) {
  const expedienteEncontrado = this.expedientes.find(
        (exp: { nroExpediente: any }) => exp.nroExpediente.toString() === nroExpedienteSeleccionado.toString()
      );

      if (!expedienteEncontrado) {
        console.error('Expediente no encontrado para el número: ' + nroExpedienteSeleccionado);
        console.log('Números de expedientes disponibles:', this.expedientes.map((exp: any) => exp.nroExpediente));
        continue;
      }
const anomaliaExpediente: AnomaliaExpediente = {
        id: 0,
        nroExpediente: expedienteEncontrado.nroExpediente,
        caso: this.rows[i].CASOS,
        fecha: this.rows[i].FECHA,
        latitud: this.rows[i].LATITUD,
        longitud: this.rows[i].LONGITUD,
        descripcion: this.rows[i].descripcion,
        medidor: this.rows[i].MEDIDOR,
        fotos: this.rows[i].FOTOS.split(';'),
        direccion: this.rows[i].DIRECCION,
        reclamoSara: this.rows[i].RECLAMO_SARA,
        localidad: this.rows[i].LOCALIDAD,

        codigo: this.rows[i].codigo,
  otros: this.rows[i].otros,
        denunciante: this.rows[i].denunciante,
        empleado: this.rows[i].empleado,
        gravedad: this.rows[i].gravedad




      };


      this.anomaliaExpedienteService.saveAnomaliaExpediente(anomaliaExpediente).subscribe(
        (resp) => {

          Swal.fire({
            title: 'Se han guardado los datos!',
            icon: 'success'
          });
   },
        (error) => {
          console.error('Error en la solicitud HTTP:', error);
          console.error('Error al guardar datos en la base de datos:', error);
        }
      );
    }
  console.log('Fin de la carga de archivos');
    this.expedientes = undefined;
  }

removeFile(index: number): void {
    this.fileList.splice(index, 1);
  }

}

HTML:

<div class="container">
  <div class="card p-4"><br><br><br>
    <div class="edit-post">
      <span class="edit-tooltip">&nbsp;&nbsp;&nbsp;&nbsp;Qué Archivos Debo subir?</span>
      <span class="edit-icon"(click)="abrirPopupAyuda()">❔</span>
    </div>
    
    <h1><br></h1>
    <h2 class="form-title mb-4">Carga de Excel</h2>
    <hr class="linea"><br><br>
    <h1><br></h1><br><br><br>

    <br><br>
    <label style="color: #5ba759; margin-left: 110px;"><strong>
      <FONT size="4">Seleccione un Expediente</FONT>
    </strong></label>
    <select style="text-align: center; width: 245px; margin-left: 100px;" [(ngModel)]="nroExpedienteSeleccionado">
      <option style="text-align: center" *ngFor="let item of expedientes" [value]="item.nroExpediente">
        {{item.nroExpediente}}
      </option>
    </select>
    
      
      


    <br><br>
    <h1><br></h1><br><br>
    <h1></h1>
    <input type="file" #fileInput style="display: none" (change)="onFilesSelected($event)" multiple>

    <!-- <input type="file" #fileInput style="display: none" (change)="onFilesSelected($event)" multiple accept=".jpg, .jpeg, .png"> -->
    <button class="custom-file-upload" (click)="fileInput.click()">Seleccionar Archivo</button>
    
    <br><br>
    <hr class="linea">
    <div *ngIf="fileList.length > 0" class="file-list">
      <h3 style="color: rgb(55, 128, 134);"><u> Archivo Seleccionado:</u></h3>
      <ul>
        <li style="color: rgb(70, 144, 83);" *ngFor="let file of fileList; let i = index">
          <span><strong>{{ file.name }}</strong><button class="custom-file-upload2" (click)="recargarNavegador()">Cancelar</button>
          </span>
          
        </li><br>
      </ul><br>
    </div><br>
    




    
<a (click)="abrirModalVistaPrevia()" class="btn2" style="cursor: pointer;">Vista Previa de Archivo</a>

<br>
    <h1><br></h1>
    <button class="upload-button"  (click)="uploadFiles()">
      Subir Archivos
    </button>
  </div>
</div>

Servicio: (No creo que sirva de ayuda pero por las dudas)

import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { FormGroup } from '@angular/forms';
import { Observable, catchError } from 'rxjs';
import { AnomaliaExpediente } from 'src/app/models/anomaliaExpediente';
import { environment } from 'src/environments/environment.production';

@Injectable({
  providedIn: 'root'
})
export class AnomaliaExpedienteService {
  
  
  private API_URL: string = environment.apiUrl + '/anomaliaExpediente_rest/';



  constructor(private http: HttpClient) { }

  saveAnomaliaExpediente(anomaliaExpediente: AnomaliaExpediente) {
    return this.http.post<AnomaliaExpediente>(this.API_URL, anomaliaExpediente).pipe(
      catchError((error) => {
        console.error('Error en la solicitud HTTP:', error);
        throw 'Hubo un error al guardar los datos en la base de datos.';
      })
    );
  }
}

ASI SE VE LA TABLA LUEGO DE GUARDAR EL REGISTRO EN LA BDD:

ANGULAR2

1 respuesta 1

0

Me pasa lo mismo, no se si eso se pueda solucionar con alguna libreria pero mientras no se si intentar pasar esos numeros de seria a dias usando una funcion, en realidad ese numero se cuenta desde el año 1900 hasta la actualidad asi funciona las fechas de excel, es el numero de dias hasta la actualidad ejemplo 30/02/2024 es 45381.

ESTO QUIZAS AYUDE ESTA EN JS:

1
  • 1
    Tal y como está redactada, tu respuesta no es clara. Por favor, pulsa en editar para añadir detalles adicionales que ayuden a los demás a entender cómo esto responde a la pregunta formulada. Puedes encontrar más información sobre cómo escribir buenas respuestas en el centro de ayuda. Commented el 30 mar. a las 15:19

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.