Actualización de Historial

vacaciones/src/app/components/mes/mesmhs/mesmhs-form/mesmhs-form.component.html

@@ -45,14 +45,7 @@
           </mat-form-field>
         </mat-grid-tile>
 
-        <mat-grid-tile colspan="6">
-          <mat-form-field appearance="legacy">
-            <mat-label>Período vacacional</mat-label>
-            <input matInput formControlName="periodo_vacacional" />
-            <mat-icon matSuffix>date_range</mat-icon>
-          </mat-form-field>
-        </mat-grid-tile>
-
+<!-- 
         <mat-grid-tile colspan="6">
           <mat-form-field appearance="legacy">
             <mat-label>Días disponibles antes de las vacaciones</mat-label>
@@ -68,7 +61,7 @@
             <mat-icon matSuffix>event_available</mat-icon>
           </mat-form-field>
         </mat-grid-tile>
-
+ -->
         <mat-grid-tile colspan="12" *ngIf="estatus!.value != 'Aprobado'">
           <mat-form-field appearance="legacy">
             <mat-label>Motivo</mat-label>
@@ -79,10 +72,32 @@
       </form>
     </mat-grid-list>
 
+
+    <table mat-table [dataSource]="periodo_vacacional?.value" >
+
+      <ng-container matColumnDef="periodo">
+        <th mat-header-cell *matHeaderCellDef> Periodos </th>
+        <td mat-cell *matCellDef="let element"> {{element.PERIODO}} </td>
+      </ng-container>
+
+      <ng-container matColumnDef="antes">
+        <th mat-header-cell *matHeaderCellDef style="text-align: center;"> Días antes </th>
+        <td mat-cell *matCellDef="let element" style="text-align: center;"> {{element.DIASDISPANTES}} </td>
+      </ng-container>
+
+      <ng-container matColumnDef="despues">
+        <th mat-header-cell *matHeaderCellDef style="text-align: center;"> Días después </th>
+        <td mat-cell *matCellDef="let element" style="text-align: center;"> {{element.DIASDISPDESP}} </td>
+      </ng-container>
+    
+    
+      <tr mat-header-row *matHeaderRowDef="['periodo', 'antes', 'despues']"></tr>
+      <tr mat-row *matRowDef="let row; columns: ['periodo', 'antes', 'despues'];"></tr>
+    </table>
   
 
     <div class="centre" style="padding-top: 20px">
-      <button mat-raised-button class="mr-2" color="warn" [mat-dialog-close]="'false'">
+      <button mat-raised-button class="mr-2" color="warn" [mat-dialog-close]="false">
         Cerrar
       </button>
     </div>

vacaciones/src/app/components/mes/mesmhs/mesmhs-form/mesmhs-form.component.ts

@@ -30,6 +30,7 @@ export class MESMHSFORMComponent implements OnInit {
   }
 
   private createFormGroup() {
+    
     return new FormGroup({
       id_usuario: new FormControl({
         value: this.data.item.IDUSUARIO,
@@ -57,8 +58,8 @@ export class MESMHSFORMComponent implements OnInit {
       }),
       periodo_vacacional: new FormControl({
         value:
-          this.data.item.PERIODOVACACIONAL != null
-            ? this.formatoFechaPeriodo(this.data.item.PERIODOVACACIONAL)[0]
+          this.data.item.PERIODOVACACIONAL !== null
+            ? this.formatoFechaPeriodo(this.data.item.PERIODOSVACACIONALES)
             : 'N/A',
         disabled: true,
       }),
@@ -84,15 +85,18 @@ export class MESMHSFORMComponent implements OnInit {
     });
   }
 
-  private formatoFechaPeriodo(item: any) {
-    let arrPeriodoVacacional = [];
-    let fechaPeriodo = item.split('|');
-    arrPeriodoVacacional.push(
-      'De ' +
-        this.formato(fechaPeriodo[0]) +
-        ' a ' +
-        this.formato(fechaPeriodo[1])
-    );
+  private formatoFechaPeriodo(item: Array<any>) {
+    let arrPeriodoVacacional:Array<any> = [];
+    item.map((element:any) => {
+      let fechaPeriodo = element.PERIODO.split('|');
+      arrPeriodoVacacional.push({
+        PERIODO: 'De '+this.formato(fechaPeriodo[0])+' a '+this.formato(fechaPeriodo[1]),
+        DIASDISPANTES:element.DIASDISPANTES,
+        DIASDISPDESP:element.DIASDISPDESP
+      });
+    });
+    
+    
     return arrPeriodoVacacional;
   }
 

vacaciones/src/app/components/mes/mesmhs/mesmhs.component.html

@@ -60,7 +60,7 @@
     </mat-grid-tile>
   </mat-grid-list>
 
-  <div *ngIf="data_empty" class="data-empty">No hay datos registrados</div>
+  <div *ngIf="dataSource.data.length == 0" class="data-empty">No hay datos registrados</div>
 
   <mat-progress-bar *ngIf="loading" mode="indeterminate"></mat-progress-bar>
 
@@ -92,9 +92,9 @@
     </ng-container>
 
     <ng-container matColumnDef="periodovacacional">
-      <th mat-header-cell *matHeaderCellDef>Periodo vacacional</th>
+      <th mat-header-cell *matHeaderCellDef>Periodos abarcados</th>
       <td mat-cell *matCellDef="let element">
-        {{ element.PERIODOVACACIONAL }}
+        {{ element.PERIODOSVACACIONALES }}
       </td>
     </ng-container>
 

vacaciones/src/app/components/mes/mesmhs/mesmhs.component.ts

@@ -87,9 +87,7 @@ export class MESMHSComponent implements AfterViewInit {
   }
 
   ngAfterViewInit(): void {
-    this.obtenerHistorialPorNumero(
-      this._encService.desencriptar(this.usuario_session.IDUSUARIO)
-    );
+    this.obtenerHistorialPorNumero(this._encService.desencriptar(this.usuario_session.IDUSUARIO));
     if (this.isAdmin) {
       this.cargarSubordinadosAdmin();
     } else {
@@ -143,6 +141,7 @@ export class MESMHSComponent implements AfterViewInit {
         } else if (!res.status && res.response.length > 0) {
           this.loading = false;
           this.dataSource.data = res.response;
+          
           this.historial_admin = res.response;
           this.cargarTabla(res.response);
           this.data_empty = this.dataSource.data.length > 0 ? false : true;
@@ -437,6 +436,7 @@ export class MESMHSComponent implements AfterViewInit {
   }
 
   private cargarTabla(solicitudes: any) {
+    
     this.solicitudes = solicitudes;
     this.dataSource = new MatTableDataSource<any>(this.solicitudes);
 
@@ -445,7 +445,7 @@ export class MESMHSComponent implements AfterViewInit {
         data.FECHAINICIAL.toString().toLowerCase().includes(filter) ||
         data.FECHAFINAL.toString().toLowerCase().includes(filter) ||
         data.ESTATUS.toLowerCase().includes(filter) ||
-        data.PERIODOVACACIONAL.toLowerCase().includes(filter) ||
+        data.PERIODOSVACACIONALES.toLowerCase().includes(filter) ||
         data.IDUSUARIO.toLowerCase().includes(filter)
       );
     };
@@ -456,21 +456,18 @@ export class MESMHSComponent implements AfterViewInit {
   }
 
   private mapearTabla() {
-    this.solicitudes.map((solicitud: any) => {
-      let finalDate = this.getDateWithString(
-        this.dateFormat(solicitud.FECHAFINAL)
-      );
+    this.solicitudes.map((solicitud: any) => {let finalDate = this.getDateWithString(this.dateFormat(solicitud.FECHAFINAL));
+      
       //AGREGAR 7 DÍAS ANTES DE INAHABILITAR LA FUNCIONALIDAD DE AGREGAR DÍAS A UNA SOLICITUD
       finalDate.setDate(finalDate.getDate() + 7);
-
-      if (solicitud.PERIODOVACACIONAL == null) {
-        solicitud.PERIODOVACACIONAL = 'N/A';
+      
+      if (solicitud.PERIODOSVACACIONALES == null) {
+        solicitud.PERIODOSVACACIONALES = 'N/A';
       } else {
-        solicitud.PERIODOVACACIONAL = this.formatoFechaPeriodo(
-          solicitud.PERIODOVACACIONAL
-        ).join();
+        solicitud.PERIODOSVACACIONALES = solicitud.PERIODOSVACACIONALES.length;
       }
 
+      
       if (
         solicitud.ESTATUS != 'Aprobado' ||
         this.today.getTime() >= finalDate.getTime()