[ADD] NUEVA FORMA DE REGISTRO OS

src/app/pages/conformidad/conformidad.componente.css

@@ -14,10 +14,6 @@
   width: 20rem;
 }
 
-.contenedorRequerimiento{
-  padding: 0 20px;
-}
-
 .contenedor-general-botones {
   display: flex;
 }

src/app/pages/conformidad/conformidad.componente.ts

@@ -153,6 +153,7 @@ export class ConformidadComponent implements AfterViewInit {
   sede_list: any = [];
   cargosU_list : any = [];
   zona_list: any = [];
+  unidades_list : any = [];
   requerimientosFiltrados: any[] = [];
   listSedesAtencion : lugaresTrabajo[] = [];
   listRequerimientos: interRequerimientos[] = [];
@@ -210,15 +211,16 @@ export class ConformidadComponent implements AfterViewInit {
     descripcionTrabajo : new FormControl<string>('' ,Validators.required),
   });
 
+  existeMaterialS : FormGroup = new FormGroup({
+    existeMaterial : new FormControl(null ,Validators.required),
+  });
+
   /*datos_pasajeAcumulado = new FormGroup<any>({});
 
   datos_lugarOrigen : FormGroup = new FormGroup<any>({}) ;
 
   datos_fechaPasaje : FormGroup = new FormGroup<any>({}) ;*/
 
-  existeMaterialS : FormGroup = new FormGroup({
-    existeMaterial : new FormControl(null ,Validators.required),
-  });
 
   // GROUPO DE FORMULARIO
 
@@ -270,20 +272,24 @@ export class ConformidadComponent implements AfterViewInit {
       personal,
       sede,
       tipoTrabajo,
-      cargosUnidos
+      cargosUnidos,
+      unidades
     ] = await Promise.all([
       this.conformidadHelper.cargarPersonal(),
       this.conformidadHelper.cargarSedes(),
       this.conformidadHelper.gestionConformidad({opcion: 9}),
-      this.conformidadHelper.cargarCargosU()
+      this.conformidadHelper.cargarCargosU(),
+      this.conformidadHelper.listadoGeneralHorizon({accion : 5})
     ]);
 
     //this.personal_list = personal;
     this.sede_list = sede;
     this.cargosU_list = cargosUnidos;
     this.zona_list = [{ value: 1, viewValue: 'NORTE' },{ value: 2, viewValue: 'SUR' },{ value: 3, viewValue: 'ESTE' },{ value: 4, viewValue: 'CENTRO' }];
+    this.unidades_list = unidades;
+
     //this.dataSource = []; // Inicializa la tabla de pasajes
-    this.activarPasajes = false;
+    //this.activarPasajes = false;
 
     const jsonTipoTrabajo = JSON.parse(tipoTrabajo);
     this.listTipoTrabajo = jsonTipoTrabajo.data;
@@ -394,6 +400,8 @@ export class ConformidadComponent implements AfterViewInit {
         });*/
       }
     });
+
+
   }
 
   //AL SELECCIONAR UN REQUERIMIENTO
@@ -970,7 +978,7 @@ export class ConformidadComponent implements AfterViewInit {
                       return {
                         accion: 2,
                         codOrdenSalida: respuestaOrdenSalida.data.codordensalida,
-                        codArticulo: item.codigoArticulo,
+                        codArticulo: item.codigo,
                         nombreArticulo: item.nombre,
                         unidad: item.unidad,
                         cantidad: item.cantidad,

src/app/pages/conformidad/modalArticuloOC/modalArticuloOC.componente.html

+
+<h1 mat-dialog-title>Detalle Articulo</h1>
+<mat-dialog-content [formGroup]="datos_Articulo" >
+  <mat-card appearance="outlined" >
+    <mat-card-content class="flex items-center gap-4 p-4 rounded-lg shadow-lg bg-blue-50" >
+      <div>
+        <mat-label>NOMBRE ARTÍCULO: </mat-label>
+        <mat-form-field class="w-full">
+          <mat-label>Ingrese artículo</mat-label>
+          <input type="text"  formControlName="nombreArticulo" placeholder="" matInput>
+        </mat-form-field>
+      </div>
+      <div>
+        <mat-form-field appearance="outline" floatLabel="always" class="w-full">
+          <mat-label>Unidad de medida</mat-label>
+          <mat-select formControlName="unidadArticulo" placeholder="[Seleccionar Unidad]" required>
+            <mat-option *ngFor="let option of this.Unidades" [value]="option?.codigo">{{option?.nombre}}</mat-option>
+          </mat-select>
+        </mat-form-field>
+      </div>
+      <div>
+        <mat-label>CANTIDAD : </mat-label>
+        <mat-form-field class="w-full">
+          <mat-label>Ingrese cantidad</mat-label>
+          <input formControlName="cantidadArticulo" matInput soloNumeros="entero" maxlength="2" placeholder="Máx. 2 dígitos">
+        </mat-form-field>
+      </div>
+
+      <div>
+        <mat-form-field appearance="outline" floatLabel="always" class="w-full">
+          <mat-label>Estado del artículo</mat-label>
+          <mat-select formControlName="estadoArticulo" placeholder="[Seleccionar estado del artículo]" required>
+            <mat-option *ngFor="let tipoT of Estados" [value]="tipoT.codigo">{{ tipoT.nombre }}</mat-option>
+          </mat-select>
+        </mat-form-field>
+      </div>
+    </mat-card-content>
+  </mat-card>
+</mat-dialog-content>
+<div mat-dialog-actions align="center">
+  <button mat-button (click)="onCancelar()">Cancelar</button>
+  <ng-container *ngIf="!Editar; else displayEditar">
+    <button mat-button color="green" (click)="onConfirmar()">Registrar</button>
+  </ng-container>
+  <ng-template #displayEditar>
+    <button mat-button color="green" (click)="onConfirmar()">Editar</button>
+  </ng-template>
+</div>

src/app/pages/conformidad/modalArticuloOC/modalArticuloOC.componente.ts

+import {Component, ElementRef, inject, Inject, OnInit, ViewChild} from '@angular/core';
+import {MatOption, provideNativeDateAdapter} from '@angular/material/core';
+import {MatTableModule} from '@angular/material/table';
+import { MatDialogActions, MatDialogClose, MatDialogContent, MatDialogTitle, MAT_DIALOG_DATA, MatDialogRef } from "@angular/material/dialog";
+import {JsonPipe, NgForOf, NgIf} from "@angular/common";
+import {Observable} from "rxjs";
+import {MatFormField, MatLabel,MatFormFieldModule } from "@angular/material/form-field";
+import {FormControl, FormGroup, ReactiveFormsModule, Validators} from "@angular/forms";
+import {MatIconModule} from '@angular/material/icon';
+import {MatDividerModule} from '@angular/material/divider';
+import {MatButtonModule} from '@angular/material/button';
+import {MatCard, MatCardContent} from "@angular/material/card";
+import {MatInput} from "@angular/material/input";
+import {MatSelect} from "@angular/material/select";
+import {SoloNumerosDirective} from "../../../service/directivas_service/soloNumeros/solo-numeros.directive";
+import Notiflix from "notiflix";
+import {MatSnackBar, MatSnackBarHorizontalPosition, MatSnackBarVerticalPosition} from "@angular/material/snack-bar";
+
+
+interface listadoComun {
+  codigo: string;
+  nombre: string;
+}
+
+@Component({
+  selector: 'app-modalArticuloOC',
+  standalone: true,
+  providers: [provideNativeDateAdapter()],
+  templateUrl: './modalArticuloOC.componente.html',
+  imports: [
+    MatDialogActions,
+    MatDialogClose,
+    MatDialogContent,
+    JsonPipe,
+    MatLabel,
+    ReactiveFormsModule,
+    MatFormField,
+    MatDialogTitle,
+    MatTableModule,
+    MatButtonModule,
+    MatDividerModule,
+    MatIconModule,
+    MatCard,
+    MatCardContent,
+    MatInput,
+    MatOption,
+    MatSelect,
+    NgForOf,
+    NgIf,
+    SoloNumerosDirective,
+    MatFormFieldModule
+  ],
+})
+export class modalArticuloOC {
+
+  //INICIALIZANDO VARIABLES
+  private barraAlerta = inject(MatSnackBar);
+  alertaPosicionHorizontal: MatSnackBarHorizontalPosition = 'center';
+  alertaPosicionVertical: MatSnackBarVerticalPosition = 'bottom';
+  alertaDuracion : number = 3;
+  Estados : listadoComun[] = [];
+  Unidades : listadoComun[] = [];
+  Articulo : any = {};
+  Editar : boolean = false;
+
+  datos_Articulo = new FormGroup({
+    nombreArticulo : new FormControl<string>('' ,Validators.required),
+    unidadArticulo : new FormControl<string>('' ,Validators.required),
+    cantidadArticulo :  new FormControl<number | null >(null,Validators.required),
+    estadoArticulo : new FormControl<string>('' ,Validators.required)
+  });
+
+  constructor(@Inject(MAT_DIALOG_DATA) public data: any ,public dialogRef: MatDialogRef<modalArticuloOC>) {
+
+    this.Estados = data.Estados;
+    this.Unidades = data.Unidades;
+    this.Articulo = data.DatoArticulo || {};
+    this.Editar = data.Editar || false;
+
+    if(this.Editar){
+      this.datos_Articulo.get('nombreArticulo')?.setValue(this.Articulo.nombre);
+      this.datos_Articulo.get('unidadArticulo')?.setValue(this.Articulo.unidad);
+      this.datos_Articulo.get('cantidadArticulo')?.setValue(this.Articulo.cantidad);
+      this.datos_Articulo.get('estadoArticulo')?.setValue(this.Articulo.estado);
+    }
+  }
+
+  onCancelar(): void {
+    this.Articulo = {};
+    this.dialogRef.close(this.Articulo);
+  }
+
+  onConfirmar(): void {
+
+    this.Articulo = {
+      codigoArticulo : '',
+      nombreArticulo : this.datos_Articulo.get('nombreArticulo')?.value,
+      unidadArticulo : this.datos_Articulo.get('unidadArticulo')?.value,
+      cantidadArticulo : this.datos_Articulo.get('cantidadArticulo')?.value,
+      estadoArticulo : this.datos_Articulo.get('estadoArticulo')?.value
+    }
+
+    const validacion = this.validarRegistroArticulo(this.Articulo) ;
+
+    if(validacion){
+      this.dialogRef.close(this.Articulo);
+    }else{
+      this.mostrarAlerta('VALIDAR DATOS INGRESADOS');
+      return;
+    }
+
+  }
+
+  validarRegistroArticulo(valores: any): boolean {
+
+    if (valores.nombreArticulo && valores.unidadArticulo && valores.cantidadArticulo && valores.estadoArticulo) {
+      return true;
+    } else {
+      return false;
+    }
+  }
+
+  mostrarAlerta(mensaje: string): void {
+
+    Notiflix.Loading.remove();
+    this.barraAlerta.open(mensaje, '', {
+      horizontalPosition: this.alertaPosicionHorizontal,
+      verticalPosition: this.alertaPosicionVertical,
+      duration: this.alertaDuracion * 1000,
+      panelClass: ['custom-snackbar'],
+    });
+
+  }
+}

src/app/pages/conformidad/modalEliminarPasaje/eliminarPasaje.componente.ts

@@ -27,9 +27,9 @@ import {MatTableModule} from "@angular/material/table";
   ],
   standalone: true,
   template: `
-    <h1 mat-dialog-title>Confirmar eliminación pasaje</h1>
+    <h1 mat-dialog-title>Confirmar eliminación de articulo</h1>
     <div mat-dialog-content>
-      <p>¿Estás seguro de que deseas eliminar este pasaje?</p>
+      <p>¿Estás seguro de que deseas quitar este artículo de la lista?</p>
     </div>
     <div mat-dialog-actions>
       <button mat-button (click)="onCancelar()">Cancelar</button>

src/app/pages/conformidad/modalRequerimiento/modalRequerimiento.componente.ts

@@ -11,14 +11,6 @@ import {MatDividerModule} from '@angular/material/divider';
 import {MatButtonModule} from '@angular/material/button';
 import {MatCard, MatCardContent} from "@angular/material/card";
 
-
-export interface PeriodicElement {
-  position: number;
-  name: string;
-  weight: number;
-  symbol: string;
-}
-
 export interface interDetalleRequerimiento {
   posicion: string;
   nombre : string;
@@ -26,10 +18,6 @@ export interface interDetalleRequerimiento {
   cantidad: number;
 }
 
-
-
-//const ARTICULOS_DATA : detalleRequerimiento[] = [];
-
 @Component({
   selector: 'app-modalRequerimiento',
   standalone: true,
@@ -54,18 +42,14 @@ export interface interDetalleRequerimiento {
   ]
 })
 
-export class modalRequerimientoComponent implements OnInit{
-
-  @ViewChild('datosPrincipales') datosPrincipales!: ElementRef;
+export class modalRequerimientoComponent{
 
   detalleRequerimiento: any;
-  //filasRequerimientos: any;
   columnasArticulos: string[] = ['posicion', 'nombre', 'unidad', 'cantidad'];
   dataSource: interDetalleRequerimiento[] = [];
 
   constructor(@Inject(MAT_DIALOG_DATA) public data: any) {
 
-
     const datosPrincipales = data.requerimientoInfo?.map((item: any) => {
       return {
         numeroDoc : item.numeroDoc,
@@ -84,6 +68,7 @@ export class modalRequerimientoComponent implements OnInit{
 
     if(datosPrincipales[0]){
       //Obtener los valores de descripcion, observacion, sede y empleado por separado y en un solo objeto
+
       this.detalleRequerimiento = {
         numeroDoc : datosPrincipales[0].numeroDoc,
         tipoRequerimiento : datosPrincipales[0].tipoRequerimiento,
@@ -95,16 +80,5 @@ export class modalRequerimientoComponent implements OnInit{
 
       this.dataSource = datosPrincipales;
     }
-    //this.detalleRequerimiento = data.requerimientoInfo
-    //this.filasRequerimientos =
-
-  }
-
-  ngOnInit(): void {
-    //ARTICULOS_DATA.push(this.detalleRequerimiento);
-
   }
-
-
-
 }

src/app/pages/ordensalida/ordensalida.componente.html

@@ -13,10 +13,10 @@
     <!-- Título y botón de agregar artículo -->
     <div class="grid gap-4 grid-cols-1 sm:grid-cols-2 items-center">
       <mat-label class="text-[1.1em] font-bold mb-4 flex items-center">
-        LISTADO DE ARTÍCULOS
-        <mat-icon class="ml-2">attach_money</mat-icon>
+        LISTADO DE MATERIAL SOBRANTE
+        <mat-icon>deployed_code_update</mat-icon>
       </mat-label>
-      <button [ngStyle]="{'visibility': activarNuevoArticulo ? 'visible' : 'hidden'}" [disabled]="!activarNuevoArticulo" mat-raised-button (click)="onAgregarArticulo($event)">
+      <button [ngStyle]="{'visibility': activarNuevoArticulo ? 'visible' : 'hidden'}" [disabled]="!activarNuevoArticulo" mat-raised-button (click)="onEventoAgregarArticulo($event)">
         <mat-icon>add</mat-icon>
         <b>Agregar material</b>
       </button>
@@ -29,26 +29,14 @@
         <ng-container matColumnDef="nombre">
           <th mat-header-cell *matHeaderCellDef> NOMBRE DE ARTÍCULO </th>
           <td mat-cell *matCellDef="let element">
-            <!-- DESBLOQUEAR DESPUES -->
-            <!-- <ng-container *ngIf="element.isNew; else displayOrigen">
-              <mat-form-field class="w-[25rem]">
-                <input type="text" placeholder="Buscar artículos" matInput formControlName="articulo{{element.index}}" [matAutocomplete]="auto" maxlength="9"
-                       (input)="onBusquedaArticulo($event,element.index)">
-                <mat-autocomplete #auto="matAutocomplete" (optionSelected)="onSeleccionArticulo($event,element.index)">
-                  <mat-option *ngFor="let option of articulosList" [value]="option.codigo">
-                    {{ option.nombre }}
-                  </mat-option>
-                </mat-autocomplete>
-              </mat-form-field>
-            </ng-container> -->
-            <ng-container *ngIf="element.isNew; else displayOrigen">
+            <!--<ng-container *ngIf="element.isNew; else displayOrigen">
               <mat-form-field class="w-[25rem]">
                 <input type="text" placeholder="Buscar artículos" matInput formControlName="articulo{{element.index}}">
               </mat-form-field>
             </ng-container>
-            <ng-template #displayOrigen>
+            <ng-template #displayOrigen> -->
               {{ element.nombre }}
-            </ng-template>
+              <!--</ng-template>-->
           </td>
         </ng-container>
 
@@ -56,10 +44,7 @@
         <ng-container matColumnDef="unidad">
           <th mat-header-cell *matHeaderCellDef> UNIDAD </th>
           <td mat-cell *matCellDef="let element">
-            <!-- <ng-container *ngIf="element.isNew; else displayOrigen">
-              <mat-label>{{formGroupMS(2,'unidad'+element.index)?.value}}</mat-label>
-            </ng-container> -->
-            <ng-container *ngIf="element.isNew; else displayOrigen">
+            <!--<ng-container *ngIf="element.isNew; else displayOrigen">
               <mat-form-field appearance="outline">
                 <mat-select formControlName="unidad{{element.index}}" required>
                   <mat-option *ngFor="let option of this.listUnidades" [value]="option?.codigo">
@@ -68,9 +53,9 @@
                 </mat-select>
               </mat-form-field>
             </ng-container>
-            <ng-template #displayOrigen>
+            <ng-template #displayOrigen>-->
               {{ element.unidad }}
-            </ng-template>
+            <!--</ng-template>-->
           </td>
         </ng-container>
 
@@ -78,14 +63,14 @@
         <ng-container matColumnDef="cantidad">
           <th mat-header-cell *matHeaderCellDef> CANTIDAD </th>
           <td mat-cell *matCellDef="let element">
-            <ng-container *ngIf="element.isNew; else displayOrigen">
+            <!--<ng-container *ngIf="element.isNew; else displayOrigen">
               <mat-form-field class="w-[10rem]" appearance="outline">
                 <input matInput formControlName="cantidad{{element.index}}" soloNumeros="entero" maxlength="2">
               </mat-form-field>
             </ng-container>
-            <ng-template #displayOrigen>
+            <ng-template #displayOrigen>-->
               {{ element.cantidad }}
-            </ng-template>
+              <!--</ng-template>-->
           </td>
         </ng-container>
 
@@ -93,17 +78,17 @@
         <ng-container matColumnDef="estado">
           <th mat-header-cell *matHeaderCellDef> ESTADO ARTÍCULO </th>
           <td mat-cell *matCellDef="let element">
-            <ng-container *ngIf="element.isNew; else displayOrigen">
+            <!--<ng-container *ngIf="element.isNew; else displayOrigen">
               <mat-form-field class="w-full select-tipoTrabajo">
                 <mat-label>Seleccionar tipo de trabajo</mat-label>
                 <mat-select formControlName="estado{{element.index}}">
-                  <mat-option *ngFor="let tipoT of listEstadoArticulo" [value]="tipoT.valor">{{ tipoT.nombre }}</mat-option>
+                  <mat-option *ngFor="let tipoT of listEstadoArticulo" [value]="tipoT.codigo">{{ tipoT.nombre }}</mat-option>
                 </mat-select>
               </mat-form-field>
             </ng-container>
-            <ng-template #displayOrigen>
+            <ng-template #displayOrigen> -->
               {{ formatoEstado(element.estado) }}
-            </ng-template>
+              <!--</ng-template>-->
           </td>
         </ng-container>
 
@@ -111,7 +96,13 @@
         <ng-container matColumnDef="accion">
           <th mat-header-cell *matHeaderCellDef> ACCIÓN </th>
           <td mat-cell *matCellDef="let element">
-            <ng-container *ngIf="element.acciones; else sinAcciones">
+            <button mat-icon-button (click)="onEventoEditarArticulo($event, element)">
+              <mat-icon>edit</mat-icon>
+            </button>
+            <button mat-icon-button (click)="onEventoEliminarArticulo($event, element)">
+              <mat-icon>delete</mat-icon>
+            </button>
+            <!--<ng-container *ngIf="element.acciones; else sinAcciones">
               <ng-container *ngIf="element.isNew; else accionesEditar">
                 <button mat-icon-button (click)="onEventoConfirmarArticulo($event, element)">
                   <mat-icon>check_circle</mat-icon>
@@ -129,7 +120,7 @@
                 </button>
               </ng-template>
             </ng-container>
-            <ng-template #sinAcciones></ng-template>
+            <ng-template #sinAcciones></ng-template> -->
           </td>
         </ng-container>