actualizaciones pertinentes

parent e0ac78c4
export class docompar{
UZYTAVDOCOMPAR_CODE?: number;
UZYTAVINSTPROY_ID?: number;
UZYTAVDOCOMPAR_NOMBRE_DOC?: string;
UZYTAVDOCOMPAR_NOMBRE_URL?: string;
UZYTAVDOCOMPAR_FECHA_CREA?: Date;
uzytavdocompar_code?: number;
uzytavinstproy_id?: number;
uzytavdocompar_nombre_doc?: string;
uzytavdocompar_nombre_url?: string;
uzytavdocompar_fecha_crea?: Date;
}
export class EvaluacionProy{
uzytavevalproy_id?:number;
uzytavcabevalp_id?:number;
uzytavaloruzytparametros_id?:number;
uzytavevalproy_puntaje?:number;
uzytavparaeva_id?:number;
uzytavevalproy_observ?:string;
}
......@@ -69,7 +69,6 @@ import { PartidasAgreComponent } from './pages/Seccion-configuraciones/Partidas/
import { PartidasEdiComponent } from './pages/Seccion-configuraciones/Partidas/partidas-edi/partidas-edi.component';
import { PartidasListComponent } from './pages/Seccion-configuraciones/Partidas/partidas-list/partidas-list.component';
import { LineasComponent } from './pages/Lineas/Lineas.component';
import { CalificacionComiComponent } from './pages/calificacion-comi/calificacion-comi.component';
import { MenusComponent } from './pages/Seccion-configuraciones/menus/menus.component';
import { ListarProgramaComponent } from './pages/programa/listar-programa/listar-programa.component';
import { AgregarProgramaComponent } from './pages/programa/agregar-programa/agregar-programa.component';
......@@ -118,6 +117,7 @@ const routes: Routes = [
//Proyectos
{ path: 'editar-proyecto/:id', component: EditProyectoComponent},
{ path: 'editar-proyecto', component: EditProyectoComponent},
{ path: 'ListaProyectos', component: ListaProyectosComponent },
{ path: 'Proyecto', component: ProyectoComponent },
......@@ -136,8 +136,6 @@ const routes: Routes = [
{ path: 'PerfilUsuario', component: PerfilUsuarioComponent },
//-----------------Calificación comision-------------
{ path: 'calificación', component: CalificacionComiComponent },
//-------------------Menus------------------------------//
{ path: 'Menu', component: MenusComponent },
......
......@@ -92,7 +92,6 @@ import { LineasComponent } from './pages/Lineas/Lineas.component';
import { PartidasPresupuestarias } from './Models/partidas-presupuestarias';
import { lineaOpe } from './Models/lineas-operativas';
import { CalificacionComiComponent } from './pages/calificacion-comi/calificacion-comi.component';
import { MenusComponent } from './pages/Seccion-configuraciones/menus/menus.component';
import { AgregarProgramaComponent } from './pages/programa/agregar-programa/agregar-programa.component';
import { ListarProgramaComponent } from './pages/programa/listar-programa/listar-programa.component';
......@@ -199,14 +198,8 @@ import { ListCompromisoComponent } from './pages/Proyectos/Inicio Ejecución/com
import { instproy } from './Models/instproy';
import { ListDocumentosComponent } from './pages/Proyectos/Inicio Ejecución/compromiso participacion/list-documentos/list-documentos.component';
import { AddDocumentosComponent } from './pages/Proyectos/Inicio Ejecución/compromiso participacion/add-documentos/add-documentos.component';
import { CartaCompromisoComuComponent } from './pages/Proyectos/Inicio Ejecución/carta compromiso comunidad/carta-compromiso-comu/carta-compromiso-comu.component';
import { ListInstiComponent } from './pages/Proyectos/Cierre/numerico de beneficiarios/list-insti/list-insti.component';
import { EditInstiComponent } from './pages/Proyectos/Cierre/numerico de beneficiarios/edit-insti/edit-insti.component';
import { ActaCompromisoCarrerasComponent } from './pages/Proyectos/Acta de Compromiso de Carreras/acta-compromiso-carreras/acta-compromiso-carreras.component';
import { ActaConsejoDepartamentoComponent } from './pages/Proyectos/Acta de Consejo de Departamento/acta-consejo-departamento/acta-consejo-departamento.component';
import { ActaDirectorProyectoComponent } from './pages/Proyectos/Acta Compromiso Director Proyecto/acta-director-proyecto/acta-director-proyecto.component';
import { ListarActaCompromisoCarrerasComponent } from './pages/Proyectos/Acta de Compromiso de Carreras/listar-acta-compromiso-carreras/listar-acta-compromiso-carreras.component';
import { ListarActaConsejoDepartamentoComponent } from './pages/Proyectos/Acta de Consejo de Departamento/listar-acta-consejo-departamento/listar-acta-consejo-departamento.component';
import { PdfComponent } from './pages/Proyectos/pdf/pdf.component';
import { ListObjetivosEjecComponent } from './pages/Proyectos/Cierre/objetivos ejecutados/list-objetivos-ejec/list-objetivos-ejec.component';
import { EditObjetivosEjecComponent } from './pages/Proyectos/Cierre/objetivos ejecutados/edit-objetivos-ejec/edit-objetivos-ejec.component';
......@@ -224,6 +217,13 @@ import { actproy } from './Models/actproy';
import { detactproy } from './Models/detactproy';
import { EditInformeBodyComponent } from './pages/Proyectos/Ejecución/informes de avance/edit-informe-body/edit-informe-body.component';
import { AddInformeComponent } from './pages/Proyectos/Ejecución/informes de avance/add-informe/add-informe.component';
import { CabEvalProyService } from './services/cabecera-eval-proye/cab-eval-proy.service';
import { AddCalificacionVinculacionComponent } from './pages/Calificacion Comision Vinculacion/add-calificacion-vinculacion/add-calificacion-vinculacion.component';
import { ActaDirectorProyectoComponent } from './pages/Proyectos/Acta Compromiso Director Proyecto/acta-director-proyecto/acta-director-proyecto.component';
import { ActaConsejoDepartamentoComponent } from './pages/Proyectos/Acta de Consejo de Departamento/acta-consejo-departamento/acta-consejo-departamento.component';
import { ActaCompromisoCarrerasComponent } from './pages/Proyectos/Acta de Compromiso de Carreras/acta-compromiso-carreras/acta-compromiso-carreras.component';
import { AddImagenesComponent } from './pages/programa/opciones/diagnostico y problema/anexos e imagenes/add-imagenes/add-imagenes.component';
import { ListImagenesComponent } from './pages/programa/opciones/diagnostico y problema/anexos e imagenes/list-imagenes/list-imagenes.component';
@NgModule({
schemas: [CUSTOM_ELEMENTS_SCHEMA],
declarations: [
......@@ -231,8 +231,6 @@ import { AddInformeComponent } from './pages/Proyectos/Ejecución/informes de av
ActaConsejoDepartamentoComponent,
ActaDirectorProyectoComponent,
ListCompromisoComponent,
ListarActaCompromisoCarrerasComponent,
ListarActaConsejoDepartamentoComponent,
AddCronogramaActiComponent,
AddHitosComponent,
InicialProyectoComponent,
......@@ -315,7 +313,6 @@ import { AddInformeComponent } from './pages/Proyectos/Ejecución/informes de av
ConvocatoriasAgregarComponent,
ConvocatoriasEditarComponent,
ConvocatoriasListarComponent,
CalificacionComiComponent,
MenusComponent,
AgregarProgramaComponent,
CoberturaComponent,
......@@ -381,7 +378,6 @@ import { AddInformeComponent } from './pages/Proyectos/Ejecución/informes de av
ListCompromisoComponent,
ListDocumentosComponent,
AddDocumentosComponent,
CartaCompromisoComuComponent,
ListInstiComponent,
EditInstiComponent,
PdfComponent,
......@@ -397,7 +393,10 @@ import { AddInformeComponent } from './pages/Proyectos/Ejecución/informes de av
ErrorTextoComponent,
ComisionAsigComponent,
EditInformeBodyComponent,
AddInformeComponent
AddInformeComponent,
AddCalificacionVinculacionComponent,
AddImagenesComponent,
ListImagenesComponent,
],
imports: [
MatTreeModule,
......@@ -454,7 +453,9 @@ import { AddInformeComponent } from './pages/Proyectos/Ejecución/informes de av
planvprograma,
programaeplanv,
actproy,
detactproy
detactproy,
CabEvalProyService,
]
})
export class MainModule {
......
/* Estilos para el formulario */
.formulario {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
max-width: 96%;
margin: 0 auto;
background-color: white;
border-radius: 10px;
}
.botones{
width: 100px;
height: 40px;
text-align: center;
padding: 0;
}
/* Estilos para la columna única */
.columna-unico {
width: 100%;
box-sizing: border-box;
padding-right: 0;
padding-left: 0;
}
/* Estilos para los labels */
label {
display: block;
margin-bottom: 8px;
font-weight: bold;
}
/* Estilos para los inputs y selects */
input[type="text"],
select {
width: 100%;
padding: 10px;
border: none;
border-bottom: 1px solid #ccc;
background-color: transparent;
font-size: 16px;
margin-bottom: 16px;
transition: border-color 0.3s ease;
}
input[type="text"]:focus,
select:focus {
outline: none;
border-color: #4caf50;
}
/* Estilos para los mensajes de error */
.error-message {
color: red;
font-size: 14px;
margin-top: 4px;
}
/* Estilos para el botón */
button {
display: block;
margin: 20px auto;
padding: 10px 20px;
background-color: rgb(71, 127, 75);
color: #fff;
border: none;
border-radius: 5px;
font-size: 16px;
cursor: pointer;
transition: background-color 0.3s ease;
}
button:hover {
background-color: rgb(90, 159, 95);
}
/* Estilos para el contenedor principal */
.contenedor {
width: 96%;
margin-left: 2%;
margin-right: 2%;
margin-top: 10%;
border-radius: 10px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
background-color: #ffffff;
position: relative;
z-index: 1;
}
/* Estilos para el contenedor del formulario */
.contenedor-dos {
margin-top: 30px;
}
/* Estilos para el título sobremontado */
.sobremontado {
position: relative;
width: 96%;
top: -20px;
left: 2%;
background-color: #477f4b;
color: #fff;
text-align: center;
padding: 10px;
box-sizing: border-box;
margin-bottom: -50px;
z-index: 2;
border-radius: 10px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
}
/* Estilos para el icono de instituciones */
.icono-instituciones {
display: flex;
align-items: center;
justify-content: center;
margin-right: 5px;
font-size: 20px;
}
.volver{
position: absolute;
top: 25%;
right: 10px;
transform: translateY(-50%);
border-radius: 50%;
background-color: white;
display: flex;
color: rgb(71, 127, 75);
align-items: center;
justify-content: center;
padding: 0;
width: 32px;
height: 32px;
border: none;
outline: none;
cursor: pointer;
}
.save-button {
display: flex;
justify-content: flex-end;
margin-bottom: 16px;
}
.input-container {
width: 100%;
display: flex;
flex-direction: column;
margin-bottom: 16px;
}
\ No newline at end of file
<div class="contenedor-dos">
<form class="formulario" [formGroup]="myForm" (ngSubmit)="onSubmit()">
<!-- Información de la institución -->
<div class="columna-unico">
<!-- Control de fechas inicio -->
<div class="save-button">
<button mat-raised-button class="botones" color="primary" *ngIf="!cambio" (click)="cambiar()">Editar</button>
<button mat-raised-button class="botones"
[disabled]="myForm.invalid" color="primary" *ngIf="cambio">Guardar</button>
<span class="separator"></span>
<button mat-raised-button class="botones" color="warn" *ngIf="cambio" (click)="cancelado()">Cancelar</button>
</div>
<div class="input-container">
<mat-form-field>
<mat-label>Fecha:</mat-label>
<input matInput [matDatepicker]="pickerInicio" placeholder="Seleccione una fecha"
formControlName="fechaInicio" required>
<mat-datepicker-toggle matSuffix [for]="pickerInicio"></mat-datepicker-toggle>
<mat-datepicker #pickerInicio></mat-datepicker>
<mat-error
*ngIf="myForm.get('fechaInicio').invalid && (myForm.get('fechaInicio').dirty || myForm.get('fechaInicio').touched)">
Por favor, ingrese la fecha de Inicio.
</mat-error>
</mat-form-field>
</div>
<div class="input-container">
<mat-form-field>
<mat-label>Descripción:</mat-label>
<input matInput formControlName="descripcion" required>
<mat-error
*ngIf="myForm.get('descripcion').invalid && (myForm.get('descripcion').dirty || myForm.get('descripcion').touched)">
Por favor, ingrese la descripción.
</mat-error>
</mat-form-field>
</div>
<div class="container">
<div class="mat-elevation-z8">
<table mat-table [dataSource]="dataSource" matSort>
<!-- Nro Column -->
<ng-container matColumnDef="Nro" class="Column1">
<th class="Column1 negrita" mat-header-cell *matHeaderCellDef mat-sort-header> Nro </th>
<td class="Column1" mat-cell *matCellDef="let i = index"> {{ i+1 }}
</td>
</ng-container>
<ng-container matColumnDef="Parametro" class="Column">
<th class="Column" mat-header-cell *matHeaderCellDef mat-sort-header>
Parámetro</th>
<td class="Column" mat-cell *matCellDef="let dato">
{{dato.uzytavparaeva_descrip}}
</td>
</ng-container>
<ng-container [formGroup]="dynamicForm" (ngSubmit)="onSubmit()" matColumnDef="Valoracion"
class="Column" >
<th class="Column" mat-header-cell *matHeaderCellDef mat-sort-header> Valoración</th>
<td class="Column" mat-cell *matCellDef="let dato" let i=index>
<mat-form-field class="form-field">
<mat-label>Seleccione un Item</mat-label>
<mat-select [formControlName]="'valoracion' + dato.uzytavparaeva_id">
<mat-option *ngFor="let opcion of dato.opcionesRespuesta"
[value]="opcion.uzytavaloruzytparametros_id">
{{ opcion.uzytavalorpar_descrip }}
</mat-option>
</mat-select>
</mat-form-field>
</td>
</ng-container>
<ng-container matColumnDef="Puntaje" class="Column">
<th class="Column" mat-header-cell *matHeaderCellDef mat-sort-header> Puntaje </th>
<td class="Column" mat-cell *matCellDef="let dato">
{{ getSelectedPuntaje(dato.uzytavparaeva_id) }}
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
<!--
<table class="principal">
<thead class="colorsito">
<tr>
<th class="colorsito">Nro</th>
<th class="colorsito">Parametro</th>
<th class="colorsito">Valoracion</th>
<th class="colorsito">Puntaje</th>
</tr>
</thead>
<tbody>
<ng-container *ngFor="let parametro of parametrosEvaluacion; let i = index">
<tr>
<td>{{ i+1 }}</td>
<td>{{ parametro.uzytavparaeva_descrip }}</td>
<td>
<mat-form-field class="form-field">
<mat-label>Seleccione un Item</mat-label>
<mat-select [formControl]="valoracionControls[i]">
<mat-option *ngFor="let subopcion of parametro.opcion" [value]="subopcion.uzytavaloruzytparametros_id">
{{ subopcion.uzytavalorpar_descrip }}
</mat-option>
</mat-select>
</mat-form-field>
</td>
<td>
{{ obtenerPuntajeSeleccionado(parametro.selectedOption) }}
</td>
</tr>
</ng-container>
</tbody>
</table>
-->
</div>
</div>
</div>
</form>
</div>
\ No newline at end of file
/* tslint:disable:no-unused-variable */
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { By } from '@angular/platform-browser';
import { DebugElement } from '@angular/core';
import { AddCalificacionVinculacionComponent } from './add-calificacion-vinculacion.component';
describe('AddCalificacionVinculacionComponent', () => {
let component: AddCalificacionVinculacionComponent;
let fixture: ComponentFixture<AddCalificacionVinculacionComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ AddCalificacionVinculacionComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(AddCalificacionVinculacionComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
import { Component, OnInit, ViewChild } from '@angular/core';
import { FormBuilder, Validators, FormGroup, FormControl, FormArray, AbstractControl } from '@angular/forms';
import { MatDialog } from '@angular/material/dialog';
import { EnvioFormularioComponent } from '../../programa/opciones/envio-formulario/envio-formulario.component';
import { MatTable, MatTableDataSource } from '@angular/material/table';
import { ParametrosEvaluacion } from '../../../Models/parametro-evaluacion';
import { ParametrosEvaService } from '../../../services/parametros-evaluacion/parametros-eva.service';
import { MostrarOcultarService } from '../../../services/mostrar-ocultar.service';
import { Proyectos } from '../../../Models/proyectos';
import { OpcionesRespuesta } from '../../../Models/opciones-respuesta';
import { OpcionesRespuestaService } from '../../../services/opciones-respuesta/opciones-respuesta.service';
import { Observable, forkJoin } from 'rxjs';
import { map, tap } from 'rxjs/operators';
import { CabeEvalProy } from '../../../Models/cabevalp';
import { UsuariosService } from '../../../services/usuarios/usuarios.service';
import { Usuario } from '../../../Models/usuario';
import { CabEvalProyService } from '../../../services/cabecera-eval-proye/cab-eval-proy.service';
import { EvaluacionProy } from '../../../Models/eval-proy';
import { EvaluacionProyectoService } from '../../../services/evaluacion-proyecto/evaluacion-proyecto.service';
@Component({
selector: 'app-add-calificacion-vinculacion',
templateUrl: './add-calificacion-vinculacion.component.html',
styleUrls: ['./add-calificacion-vinculacion.component.css']
})
export class AddCalificacionVinculacionComponent implements OnInit {
cambio: boolean = false;
dynamicForm: FormGroup; // Declare a FormGroup
idRecuperado: number;
myForm: FormGroup;
enviarSolicitud = false;
formularioEnviado: boolean
dataSource: MatTableDataSource<ParametrosEvaluacion>;
parametrosEvaluacion: any[] = [];
proyecto: Proyectos;
usuario: Usuario;
cabeceraEvalProy: CabeEvalProy
evaluacionProy: EvaluacionProy
opcionesRespuesta!: OpcionesRespuesta[];
selectedParametroId: number;
opcionesArray$: Observable<OpcionesRespuesta[]>;
data: any[] = []; // Datos de la tabla
// Añade esto en tu componente
puntajes: { [key: number]: number } = {}; // Objeto para almacenar los puntajes
items: FormArray;
valoracionControls: FormControl[] = [];
displayedColumns: string[] = [
'Nro',
'Parametro',
'Valoracion',
'Puntaje'
];
@ViewChild(MatTable) table: MatTable<any>;
constructor(
private formBuilder: FormBuilder,
private dialog: MatDialog,
private parametrosEvaService: ParametrosEvaService,
private mostrarOcultarService: MostrarOcultarService,
private opcionesRespuestaService: OpcionesRespuestaService,
private datosUsuarioService: UsuariosService,
private cabEvalProyService: CabEvalProyService,
private evaluacionProyectoService: EvaluacionProyectoService,
) {
this.proyecto = new Proyectos();
this.dataSource = new MatTableDataSource<ParametrosEvaluacion>([]);
this.cabeceraEvalProy = new CabeEvalProy();
this.usuario = new Usuario();
this.evaluacionProy = new EvaluacionProy()
}
ngOnInit(): void {
this.idRecuperado = parseInt(localStorage.getItem('proyectoId'), 10);
this.proyecto = this.mostrarOcultarService.editProyecto;
this.initializeForm()
this.obtenerDatosUsuario()
this.myForm = this.formBuilder.group({
fechaInicio: [{ value: '', disabled: true }, Validators.required],
descripcion: [{ value: '', disabled: true }, Validators.required],
});
// Obtener los parámetros iniciales y asignar los valores al formulario
this.obtenerParametrosIniciales(this.proyecto.uzytavconparaeva_id);
}
initializeForm() {
this.dynamicForm = this.formBuilder.group({});
this.dynamicForm.disable(); // Disable all form controls
}
obtenerParametrosIniciales(id: number) {
if (id != undefined) {
this.parametrosEvaService.obtenerParametrosIniciales(id).subscribe(data => {
if (data !== undefined) {
const parametrosWithOpciones$: Observable<ParametrosEvaluacion>[] = data.map(parametro => {
return this.obtenerOpcionesRespuesta(parametro.uzytavparaeva_id).pipe(
map(opciones => {
this.createDynamicFormControls(opciones);
return {
...parametro,
opcion: opciones,
opcionesRespuesta: opciones // Agrega una propiedad opcionesRespuesta al objeto parametro
};
})
);
});
forkJoin(parametrosWithOpciones$).subscribe(parametros => {
this.parametrosEvaluacion = parametros;
this.dataSource.data = parametros;
});
}else{
console.log('Nose ha encontrado registros');
}
});
}else{
}
}
createDynamicFormControls(opciones: OpcionesRespuesta[]) {
opciones.forEach(opcion => {
this.dynamicForm.addControl('valoracion' + opcion.uzytavparaeva_id,
this.formBuilder.control({ value: ' ', disabled: true },
[Validators.required]));
});
this.dynamicForm.disable();
}
getSelectedPuntaje(uzytavparaeva_id: number): number {
const controlName = 'valoracion' + uzytavparaeva_id;
const selectedValueId = this.dynamicForm.get(controlName)?.value;
// Encuentra las opcionesRespuesta específicas para el parámetro actual
const opcionesRespuesta = this.parametrosEvaluacion.find(parametro =>
parametro.uzytavparaeva_id === uzytavparaeva_id)?.opcionesRespuesta;
if (selectedValueId !== null && selectedValueId !== undefined && opcionesRespuesta) {
const selectedOpcion = opcionesRespuesta.find(opcion =>
opcion.uzytavaloruzytparametros_id === selectedValueId);
if (selectedOpcion) {
return selectedOpcion.uzytavalorpar_puntaje;
} else {
return 0;
}
} else {
return 0;
}
}
obtenerOpcionesRespuesta(id: number) {
return this.opcionesRespuestaService.obtenerParametrosId(id).pipe(
tap(opciones => {
this.opcionesRespuesta = opciones; // Carga los datos en opcionesRespuesta
})
);
}
openModal() {
const dialogRef = this.dialog.open(EnvioFormularioComponent, {
disableClose: true
});
dialogRef.afterClosed().subscribe(result => {
this.formularioEnviado = true;
});
}
obtenerDatosUsuario() {
this.datosUsuarioService.obtenerDatosUsuario().
subscribe(data => {
this.usuario = data
},
error => {
console.log('Error al obtener los parámetros:', error);
}
);
}
onSubmit() {
if (this.myForm.valid) {
this.cabeceraEvalProy.uzytavproyec_id = this.idRecuperado;
this.cabeceraEvalProy.uzytavcabevalp_fec_crea = this.myForm.value.apellido;
this.cabeceraEvalProy.uzytavcabevalp_observa = this.myForm.value.apellido;
this.cabeceraEvalProy.uzytusuario_id = this.usuario.uzytusuario_id;
console.log("usuario que califica ", this.usuario.uzytusuario_id)
this.cabEvalProyService.guardarParametros(this.cabeceraEvalProy).subscribe(() => {
this.enviarEvaluacion(this.cabEvalProyService.obtenerId())
console.log("cabecera enviada ", this.cabeceraEvalProy)
this.openModal()
});
}
}
enviarEvaluacion2(idCabecera: number) {
this.enviarSolicitud = false;
if (!this.enviarSolicitud) {
this.enviarSolicitud = true;
this.evaluacionProy.uzytavcabevalp_id = idCabecera;
this.evaluacionProy.uzytavaloruzytparametros_id
this.evaluacionProyectoService.guardarParametros(this.evaluacionProy).subscribe(() => {
console.log("enviado ", this.evaluacionProy)
});
}
}
enviarEvaluacion(idCabecera: number) {
if (!this.enviarSolicitud) {
this.enviarSolicitud = true;
// Iterar a través de las opciones de respuesta
this.opcionesRespuesta.forEach(opcion => {
const controlName = 'valoracion' + opcion.uzytavparaeva_id;
const selectedValueId = this.dynamicForm.get(controlName)?.value;
if (selectedValueId !== null && selectedValueId !== undefined) {
// Crear el objeto EvaluacionProy con los valores necesarios
const evaluacionProy: EvaluacionProy = {
uzytavcabevalp_id: idCabecera,
uzytavaloruzytparametros_id: selectedValueId,
uzytavparaeva_id: opcion.uzytavparaeva_id
// Agregar otros campos si es necesario
};
this.evaluacionProyectoService.guardarParametros(evaluacionProy).subscribe(() => {
console.log("enviado evalproy", evaluacionProy);
});
}
});
}
}
/*
onSubmit() {
if (this.myForm.valid) {
this.anexosImagenes.uzytavproyec_id = this.idRecuperado;
this.anexosImagenes.uzytavanexospr_fech_subida = this.myForm.value.fechaInicio
this.anexosImagenesService.guardarParametrosSeparados(this.file, this.anexosImagenes).subscribe(
response => {
this.openModal();
this.guardar()
this.datosCompartidos.actualizarDatos(this.anexosImagenes);
this.actualizarAnexosService.actualizarDatos(this.file);
},
error => {
console.log(error)
//this.router.navigate(['main/Convocatorias']);
}
);
}
}
*/
cambiar() {
this.cambio = true;
this.myForm.enable();
this.dynamicForm.enable();
}
cancelado() {
this.cambio = false;
this.myForm.disable();
this.dynamicForm.disable();
}
guardar() {
this.cambio = false;
this.myForm.disable();
this.dynamicForm.disable();
this.myForm.reset()
this.dynamicForm.reset()
}
}
......@@ -30,6 +30,12 @@
font-weight: bold;
}
.separator {
margin: 0 5px;
opacity: 0;
pointer-events: none;
}
/* Estilos para los inputs y selects */
input[type="text"],
select {
......@@ -56,23 +62,6 @@
margin-top: 4px;
}
/* Estilos para el botón */
button {
display: block;
margin: 20px auto;
padding: 10px 20px;
background-color: rgb(71, 127, 75);
color: #fff;
border: none;
border-radius: 5px;
font-size: 16px;
cursor: pointer;
transition: background-color 0.3s ease;
}
button:hover {
background-color: rgb(90, 159, 95);
}
/* Estilos para el contenedor principal */
.contenedor {
......@@ -152,5 +141,6 @@
display: flex;
flex-direction: column;
margin-bottom: 16px;
align-items: center;
}
\ No newline at end of file
<div class="contenedor-dos">
<form class="formulario" [formGroup]="myForm" (ngSubmit)="onSubmit()">
<!-- Información de la institución -->
<div class="columna-unico">
<div class="save-button">
<button mat-raised-button color="primary" *ngIf="!cambio" (click)="cambiar()">Editar</button>
<button mat-raised-button color="primary" *ngIf="cambio">Guardar</button>
<span class="separator"></span>
<button mat-raised-button color="warn" *ngIf="cambio" (click)="cancelado()">Cancelar</button>
</div>
<div class="save-button">
<button mat-raised-button color="primary" *ngIf="!cambio" (click)="cambiar()">Editar</button>
<button mat-raised-button color="primary" *ngIf="cambio">Guardar</button>
<span class="separator"></span>
<button mat-raised-button color="warn" *ngIf="cambio" (click)="cancelado()">Cancelar</button>
</div>
<!-- Control de PDF -->
<div class="input-container">
<label>Subir Archivo</label>
<input type="file" id="uzytavconvoca_digital" (change)="onFileChange($event)"
formControlName="archivo">
<div class="input-container" *ngIf="proyecto.uzytavproyec_com_part1_url == null && !cambio">
<label>Subir Archivo</label>
<input type="file" id="uzytavconvoca_digital" (change)="onFileChange($event)" formControlName="archivo">
</div>
</div>
<div class="input-container" *ngIf="proyecto.uzytavproyec_com_part1_url == null && cambio">
<label>Subir Archivo</label>
<input type="file" id="uzytavconvoca_digital" (change)="onFileChange($event)" formControlName="archivo">
</div>
<button class="input-container" *ngIf="proyecto.uzytavproyec_com_part1_url != null && !cambio">
<img src="../../../../../../../assets/img/icons/pdf.png" style="width: 50px; height: 50px;"
(click)="verPDF(proyecto.uzytavproyec_com_part1_url,proyecto.uzytavproyec_com_part1_nom)"
aria-placeholder="Ver PDF">
</button>
<div class="input-container" *ngIf="proyecto.uzytavproyec_com_part1_url != null && cambio">
<label>Subir Archivo</label>
<input type="file" id="uzytavconvoca_digital" (change)="onFileChange($event)" formControlName="archivo">
</div>
</form>
</div>
\ No newline at end of file
</div>
......@@ -13,6 +13,8 @@ import { ProyectosService } from 'src/app/modules/main/services/proyectos/proyec
import { ProyectoComponent } from '../../Proyectos/Proyecto/Proyecto.component';
import { Proyectos } from 'src/app/modules/main/Models/proyectos';
import { DatosEspeService } from 'src/app/modules/main/services/APIs Externas/Datos espe/datos-espe.service';
import { MostrarOcultarService } from 'src/app/modules/main/services/mostrar-ocultar.service';
import { saveAs } from 'file-saver';
@Component({
selector: 'app-acta-director-proyecto',
......@@ -29,7 +31,8 @@ export class ActaDirectorProyectoComponent implements OnInit {
formularioEnviado: boolean
cambio: boolean;
proyecto: Proyectos
showPdfButton: number = 0; // 0 para ocultar, 1 para mostrar
public idRecuperado
constructor(
private formBuilder: FormBuilder,
private proyectosService: ProyectosService,
......@@ -38,12 +41,16 @@ export class ActaDirectorProyectoComponent implements OnInit {
private datosCompartidos: Actualiza_datosService,
private idCompartido: Compartir_idService,
private datosEspeService: DatosEspeService,
private mostrarOcultarService: MostrarOcultarService,
) {
this.proyecto = new Proyectos();
}
ngOnInit(): void {
this.idRecuperado = parseInt(localStorage.getItem('proyectoId'),10);
this.proyecto = this.mostrarOcultarService.editProyecto;
this.cambio = false;
this.myForm = this.formBuilder.group({
archivo: [{ value: '', disabled: true }, Validators.required],
......@@ -78,8 +85,7 @@ export class ActaDirectorProyectoComponent implements OnInit {
async onSubmit() {
if (this.myForm.valid) {
this.proyecto.uzytavproyec_id = this.idCompartido.getIdGuardado();
this.proyecto.uzytavproyec_id = this.idRecuperado;
const pdfData = await this.enviarPDF();
this.proyecto.uzytavproyec_com_part1_url = pdfData.idPDF;
this.proyecto.uzytavproyec_com_part1_nom = pdfData.filename;
......@@ -114,6 +120,38 @@ export class ActaDirectorProyectoComponent implements OnInit {
}
}
verPDF(id: string, nombre: string) {
console.log("uid pasado ", id)
console.log("nombre pasado ", nombre)
this.datosEspeService.verPDF(id, nombre).subscribe(
(response: any) => {
if (response) {
const contentDispositionHeader = response.headers.get('content-disposition');
const filename = this.getFilenameFromResponse(contentDispositionHeader);
const blob = new Blob([response.body], { type: 'application/pdf' });
saveAs(blob, nombre);
} else {
console.error('No se pudieron obtener las cabeceras de la respuesta.');
}
},
error => {
console.error('Error al obtener el PDF:', error);
}
);
}
getFilenameFromResponse(contentDispositionHeader: string | null): string {
if (contentDispositionHeader) {
const matches = /filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/.exec(contentDispositionHeader);
if (matches != null && matches[1]) {
return matches[1].replace(/['"]/g, '');
}
}
return 'document.pdf'; // Nombre predeterminado si no se puede obtener el nombre del archivo
}
cambiar() {
this.cambio = true;
this.myForm.get('archivo').enable();
......
/* Estilos para el formulario */
.formulario {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
max-width: 96%;
margin: 0 auto;
background-color: white;
border-radius: 10px;
}
.botones{
width: 100px;
height: 40px;
text-align: center;
padding: 0;
}
/* Estilos para la columna única */
.columna-unico {
width: 100%;
box-sizing: border-box;
padding-right: 0;
padding-left: 0;
}
/* Estilos para los labels */
label {
display: block;
margin-bottom: 8px;
font-weight: bold;
}
/* Estilos para los inputs y selects */
input[type="text"],
select {
width: 100%;
padding: 10px;
border: none;
border-bottom: 1px solid #ccc;
background-color: transparent;
font-size: 16px;
margin-bottom: 16px;
transition: border-color 0.3s ease;
}
input[type="text"]:focus,
select:focus {
outline: none;
border-color: #4caf50;
}
/* Estilos para los mensajes de error */
.error-message {
color: red;
font-size: 14px;
margin-top: 4px;
}
/* Estilos para el botón */
button {
display: block;
margin: 20px auto;
padding: 10px 20px;
background-color: rgb(71, 127, 75);
color: #fff;
border: none;
border-radius: 5px;
font-size: 16px;
cursor: pointer;
transition: background-color 0.3s ease;
}
button:hover {
background-color: rgb(90, 159, 95);
}
/* Estilos para el contenedor principal */
.contenedor {
width: 96%;
margin-left: 2%;
margin-right: 2%;
margin-top: 10%;
border-radius: 10px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
background-color: #ffffff;
position: relative;
z-index: 1;
}
/* Estilos para el contenedor del formulario */
.contenedor-dos {
margin-top: 30px;
padding: 0.9375rem 20px;
position: relative;
}
/* Estilos para el título sobremontado */
.sobremontado {
position: relative;
width: 96%;
top: -20px;
left: 2%;
background-color: #477f4b;
color: #fff;
text-align: center;
padding: 10px;
box-sizing: border-box;
margin-bottom: -50px;
z-index: 2;
border-radius: 10px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
}
/* Estilos para el icono de instituciones */
.icono-instituciones {
display: flex;
align-items: center;
justify-content: center;
margin-right: 5px;
font-size: 20px;
}
.volver{
position: absolute;
top: 25%;
right: 10px;
transform: translateY(-50%);
border-radius: 50%;
background-color: white;
display: flex;
color: rgb(71, 127, 75);
align-items: center;
justify-content: center;
padding: 0;
width: 32px;
height: 32px;
border: none;
outline: none;
cursor: pointer;
}
.save-button {
display: flex;
justify-content: flex-end;
margin-bottom: 16px;
}
.input-container {
width: 100%;
display: flex;
flex-direction: column;
margin-bottom: 16px;
}
\ No newline at end of file
display: flex;
flex-wrap: wrap;
justify-content: space-between;
max-width: 96%;
margin: 0 auto;
background-color: white;
border-radius: 10px;
}
.botones{
width: 100px;
height: 40px;
text-align: center;
padding: 0;
}
/* Estilos para la columna única */
.columna-unico {
width: 100%;
box-sizing: border-box;
padding-right: 0;
padding-left: 0;
}
/* Estilos para los labels */
label {
display: block;
margin-bottom: 8px;
font-weight: bold;
}
.separator {
margin: 0 5px;
opacity: 0;
pointer-events: none;
}
/* Estilos para los inputs y selects */
input[type="text"],
select {
width: 100%;
padding: 10px;
border: none;
border-bottom: 1px solid #ccc;
background-color: transparent;
font-size: 16px;
margin-bottom: 16px;
transition: border-color 0.3s ease;
}
input[type="text"]:focus,
select:focus {
outline: none;
border-color: #4caf50;
}
/* Estilos para los mensajes de error */
.error-message {
color: red;
font-size: 14px;
margin-top: 4px;
}
/* Estilos para el contenedor principal */
.contenedor {
width: 96%;
margin-left: 2%;
margin-right: 2%;
margin-top: 10%;
border-radius: 10px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
background-color: #ffffff;
position: relative;
z-index: 1;
}
/* Estilos para el contenedor del formulario */
.contenedor-dos {
margin-top: 30px;
padding: 0.9375rem 20px;
position: relative;
}
/* Estilos para el título sobremontado */
.sobremontado {
position: relative;
width: 96%;
top: -20px;
left: 2%;
background-color: #477f4b;
color: #fff;
text-align: center;
padding: 10px;
box-sizing: border-box;
margin-bottom: -50px;
z-index: 2;
border-radius: 10px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
}
/* Estilos para el icono de instituciones */
.icono-instituciones {
display: flex;
align-items: center;
justify-content: center;
margin-right: 5px;
font-size: 20px;
}
.volver{
position: absolute;
top: 25%;
right: 10px;
transform: translateY(-50%);
border-radius: 50%;
background-color: white;
display: flex;
color: rgb(71, 127, 75);
align-items: center;
justify-content: center;
padding: 0;
width: 32px;
height: 32px;
border: none;
outline: none;
cursor: pointer;
}
.save-button {
display: flex;
justify-content: flex-end;
margin-bottom: 16px;
}
.input-container {
width: 100%;
display: flex;
flex-direction: column;
margin-bottom: 16px;
align-items: center;
}
<div class="contenedor-dos">
<form class="formulario" [formGroup]="myForm" (ngSubmit)="onSubmit()">
<!-- Información de la institución -->
<div class="columna-unico">
<div class="save-button">
<button mat-raised-button color="primary" *ngIf="!cambio" (click)="cambiar()">Editar</button>
<button mat-raised-button color="primary" *ngIf="cambio">Guardar</button>
<span class="separator"></span>
<button mat-raised-button color="warn" *ngIf="cambio" (click)="cancelado()">Cancelar</button>
</div>
<div class="save-button">
<button mat-raised-button color="primary" *ngIf="!cambio" (click)="cambiar()">Editar</button>
<button mat-raised-button color="primary" *ngIf="cambio">Guardar</button>
<span class="separator"></span>
<button mat-raised-button color="warn" *ngIf="cambio" (click)="cancelado()">Cancelar</button>
</div>
<!-- Control de PDF -->
<div class="input-container">
<label>Subir Archivo</label>
<input type="file" id="uzytavconvoca_digital" (change)="onFileChange($event)"
formControlName="archivo">
<div class="input-container" *ngIf="proyecto.uzytavproyec_com_part2_url == null && !cambio">
<label>Subir Archivo</label>
<input type="file" id="uzytavconvoca_digital" (change)="onFileChange($event)" formControlName="archivo">
</div>
</div>
<div class="input-container" *ngIf="proyecto.uzytavproyec_com_part2_url == null && cambio">
<label>Subir Archivo</label>
<input type="file" id="uzytavconvoca_digital" (change)="onFileChange($event)" formControlName="archivo">
</div>
<button class="input-container" *ngIf="proyecto.uzytavproyec_com_part2_url != null && !cambio">
<img src="../../../../../../../assets/img/icons/pdf.png" style="width: 50px; height: 50px;"
(click)="verPDF(proyecto.uzytavproyec_com_part2_url,proyecto.uzytavproyec_com_part2_nom)"
aria-placeholder="Ver PDF">
</button>
<div class="input-container" *ngIf="proyecto.uzytavproyec_com_part2_url != null && cambio">
<label>Subir Archivo</label>
<input type="file" id="uzytavconvoca_digital" (change)="onFileChange($event)" formControlName="archivo">
</div>
</form>
</div>
\ No newline at end of file
</div>
......@@ -13,6 +13,8 @@ import { ProyectosService } from 'src/app/modules/main/services/proyectos/proyec
import { ProyectoComponent } from '../../Proyectos/Proyecto/Proyecto.component';
import { Proyectos } from 'src/app/modules/main/Models/proyectos';
import { DatosEspeService } from 'src/app/modules/main/services/APIs Externas/Datos espe/datos-espe.service';
import { saveAs } from 'file-saver';
import { MostrarOcultarService } from 'src/app/modules/main/services/mostrar-ocultar.service';
@Component({
selector: 'app-acta-compromiso-carreras',
......@@ -29,7 +31,7 @@ export class ActaCompromisoCarrerasComponent implements OnInit {
formularioEnviado: boolean
cambio: boolean;
proyecto: Proyectos
public idRecuperado
constructor(
private formBuilder: FormBuilder,
private proyectosService: ProyectosService,
......@@ -38,12 +40,16 @@ export class ActaCompromisoCarrerasComponent implements OnInit {
private datosCompartidos: Actualiza_datosService,
private idCompartido: Compartir_idService,
private datosEspeService: DatosEspeService,
private mostrarOcultarService: MostrarOcultarService,
) {
this.proyecto = new Proyectos();
}
ngOnInit(): void {
this.idRecuperado = parseInt(localStorage.getItem('proyectoId'),10);
this.proyecto = this.mostrarOcultarService.editProyecto;
this.cambio = false;
this.myForm = this.formBuilder.group({
archivo: [{ value: '', disabled: true }, Validators.required],
......@@ -79,7 +85,7 @@ export class ActaCompromisoCarrerasComponent implements OnInit {
async onSubmit() {
if (this.myForm.valid) {
this.proyecto.uzytavproyec_id = this.idCompartido.getIdGuardado();
this.proyecto.uzytavproyec_id = this.idRecuperado;
const pdfData = await this.enviarPDF();
this.proyecto.uzytavproyec_com_part2_url = pdfData.idPDF;
this.proyecto.uzytavproyec_com_part2_nom = pdfData.filename;
......@@ -114,6 +120,35 @@ export class ActaCompromisoCarrerasComponent implements OnInit {
}
}
verPDF(id: string, nombre: string) {
console.log("uid pasado ", id)
console.log("nombre pasado ", nombre)
this.datosEspeService.verPDF(id, nombre).subscribe(
(response: any) => {
if (response) {
const contentDispositionHeader = response.headers.get('content-disposition');
const filename = this.getFilenameFromResponse(contentDispositionHeader);
const blob = new Blob([response.body], { type: 'application/pdf' });
saveAs(blob, nombre);
} else {
console.error('No se pudieron obtener las cabeceras de la respuesta.');
}
},
error => {
console.error('Error al obtener el PDF:', error);
}
);
}
getFilenameFromResponse(contentDispositionHeader: string | null): string {
if (contentDispositionHeader) {
const matches = /filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/.exec(contentDispositionHeader);
if (matches != null && matches[1]) {
return matches[1].replace(/['"]/g, '');
}
}
return 'document.pdf'; // Nombre predeterminado si no se puede obtener el nombre del archivo
}
cambiar() {
this.cambio = true;
this.myForm.get('archivo').enable();
......
/* Estilos para el formulario */
.formulario {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
max-width: 96%;
margin: 0 auto;
background-color: white;
border-radius: 10px;
}
.botones{
width: 100px;
height: 40px;
text-align: center;
padding: 0;
}
/* Estilos para la columna única */
.columna-unico {
width: 100%;
box-sizing: border-box;
padding-right: 0;
padding-left: 0;
}
/* Estilos para los labels */
label {
display: block;
margin-bottom: 8px;
font-weight: bold;
}
/* Estilos para los inputs y selects */
input[type="text"],
select {
width: 100%;
padding: 10px;
border: none;
border-bottom: 1px solid #ccc;
background-color: transparent;
font-size: 16px;
margin-bottom: 16px;
transition: border-color 0.3s ease;
}
input[type="text"]:focus,
select:focus {
outline: none;
border-color: #4caf50;
}
/* Estilos para los mensajes de error */
.error-message {
color: red;
font-size: 14px;
margin-top: 4px;
}
/* Estilos para el botón */
button {
display: block;
margin: 20px auto;
padding: 10px 20px;
background-color: rgb(71, 127, 75);
color: #fff;
border: none;
border-radius: 5px;
font-size: 16px;
cursor: pointer;
transition: background-color 0.3s ease;
}
button:hover {
background-color: rgb(90, 159, 95);
}
/* Estilos para el contenedor principal */
.contenedor {
width: 96%;
margin-left: 2%;
margin-right: 2%;
margin-top: 10%;
border-radius: 10px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
background-color: #ffffff;
position: relative;
z-index: 1;
}
/* Estilos para el contenedor del formulario */
.contenedor-dos {
margin-top: 30px;
padding: 0.9375rem 20px;
position: relative;
}
/* Estilos para el título sobremontado */
.sobremontado {
position: relative;
width: 96%;
top: -20px;
left: 2%;
background-color: #477f4b;
color: #fff;
text-align: center;
padding: 10px;
box-sizing: border-box;
margin-bottom: -50px;
z-index: 2;
border-radius: 10px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
}
/* Estilos para el icono de instituciones */
.icono-instituciones {
display: flex;
align-items: center;
justify-content: center;
margin-right: 5px;
font-size: 20px;
}
.volver{
position: absolute;
top: 25%;
right: 10px;
transform: translateY(-50%);
border-radius: 50%;
background-color: white;
display: flex;
color: rgb(71, 127, 75);
align-items: center;
justify-content: center;
padding: 0;
width: 32px;
height: 32px;
border: none;
outline: none;
cursor: pointer;
}
.save-button {
display: flex;
justify-content: flex-end;
margin-bottom: 16px;
}
.input-container {
width: 100%;
display: flex;
flex-direction: column;
margin-bottom: 16px;
}
\ No newline at end of file
display: flex;
flex-wrap: wrap;
justify-content: space-between;
max-width: 96%;
margin: 0 auto;
background-color: white;
border-radius: 10px;
}
.botones{
width: 100px;
height: 40px;
text-align: center;
padding: 0;
}
/* Estilos para la columna única */
.columna-unico {
width: 100%;
box-sizing: border-box;
padding-right: 0;
padding-left: 0;
}
/* Estilos para los labels */
label {
display: block;
margin-bottom: 8px;
font-weight: bold;
}
.separator {
margin: 0 5px;
opacity: 0;
pointer-events: none;
}
/* Estilos para los inputs y selects */
input[type="text"],
select {
width: 100%;
padding: 10px;
border: none;
border-bottom: 1px solid #ccc;
background-color: transparent;
font-size: 16px;
margin-bottom: 16px;
transition: border-color 0.3s ease;
}
input[type="text"]:focus,
select:focus {
outline: none;
border-color: #4caf50;
}
/* Estilos para los mensajes de error */
.error-message {
color: red;
font-size: 14px;
margin-top: 4px;
}
/* Estilos para el contenedor principal */
.contenedor {
width: 96%;
margin-left: 2%;
margin-right: 2%;
margin-top: 10%;
border-radius: 10px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
background-color: #ffffff;
position: relative;
z-index: 1;
}
/* Estilos para el contenedor del formulario */
.contenedor-dos {
margin-top: 30px;
padding: 0.9375rem 20px;
position: relative;
}
/* Estilos para el título sobremontado */
.sobremontado {
position: relative;
width: 96%;
top: -20px;
left: 2%;
background-color: #477f4b;
color: #fff;
text-align: center;
padding: 10px;
box-sizing: border-box;
margin-bottom: -50px;
z-index: 2;
border-radius: 10px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
}
/* Estilos para el icono de instituciones */
.icono-instituciones {
display: flex;
align-items: center;
justify-content: center;
margin-right: 5px;
font-size: 20px;
}
.volver{
position: absolute;
top: 25%;
right: 10px;
transform: translateY(-50%);
border-radius: 50%;
background-color: white;
display: flex;
color: rgb(71, 127, 75);
align-items: center;
justify-content: center;
padding: 0;
width: 32px;
height: 32px;
border: none;
outline: none;
cursor: pointer;
}
.save-button {
display: flex;
justify-content: flex-end;
margin-bottom: 16px;
}
.input-container {
width: 100%;
display: flex;
flex-direction: column;
margin-bottom: 16px;
align-items: center;
}
<div class="contenedor-dos">
<form class="formulario" [formGroup]="myForm" (ngSubmit)="onSubmit()">
<!-- Información de la institución -->
<div class="columna-unico">
<div class="save-button">
<button mat-raised-button color="primary" *ngIf="!cambio" (click)="cambiar()">Editar</button>
<button mat-raised-button color="primary" *ngIf="cambio">Guardar</button>
<span class="separator"></span>
<button mat-raised-button color="warn" *ngIf="cambio" (click)="cancelado()">Cancelar</button>
</div>
<div class="save-button">
<button mat-raised-button color="primary" *ngIf="!cambio" (click)="cambiar()">Editar</button>
<button mat-raised-button color="primary" *ngIf="cambio">Guardar</button>
<span class="separator"></span>
<button mat-raised-button color="warn" *ngIf="cambio" (click)="cancelado()">Cancelar</button>
</div>
<!-- Control de PDF -->
<div class="input-container">
<label>Subir Archivo</label>
<input type="file" id="uzytavconvoca_digital" (change)="onFileChange($event)"
formControlName="archivo">
</div>
<div class="input-container" *ngIf="proyecto.uzytavproyec_aprob_con_dep_url == null && !cambio">
<label>Subir Archivo</label>
<input type="file" id="uzytavconvoca_digital" (change)="onFileChange($event)" formControlName="archivo">
</div>
<div class="input-container" *ngIf="proyecto.uzytavproyec_aprob_con_dep_url == null && cambio">
<label>Subir Archivo</label>
<input type="file" id="uzytavconvoca_digital" (change)="onFileChange($event)" formControlName="archivo">
</div>
<button class="input-container" *ngIf="proyecto.uzytavproyec_aprob_con_dep_url != null && !cambio">
<img src="../../../../../../../assets/img/icons/pdf.png" style="width: 50px; height: 50px;"
(click)="verPDF(proyecto.uzytavproyec_aprob_con_dep_url,proyecto.uzytavproyec_aprob_con_dep_nom)"
aria-placeholder="Ver PDF">
</button>
<div class="input-container" *ngIf="proyecto.uzytavproyec_aprob_con_dep_url != null && cambio">
<label>Subir Archivo</label>
<input type="file" id="uzytavconvoca_digital" (change)="onFileChange($event)" formControlName="archivo">
</div>
</form>
</div>
\ No newline at end of file
</div>
......@@ -13,6 +13,8 @@ import { ProyectosService } from 'src/app/modules/main/services/proyectos/proyec
import { ProyectoComponent } from '../../Proyectos/Proyecto/Proyecto.component';
import { Proyectos } from 'src/app/modules/main/Models/proyectos';
import { DatosEspeService } from 'src/app/modules/main/services/APIs Externas/Datos espe/datos-espe.service';
import { MostrarOcultarService } from 'src/app/modules/main/services/mostrar-ocultar.service';
import { saveAs } from 'file-saver';
@Component({
selector: 'app-acta-consejo-departamento',
......@@ -29,6 +31,8 @@ export class ActaConsejoDepartamentoComponent implements OnInit {
formularioEnviado: boolean
cambio: boolean;
proyecto: Proyectos
public idRecuperado;
showPdfButton: number = 0; // 0 para ocultar, 1 para mostrar
constructor(
private formBuilder: FormBuilder,
......@@ -38,15 +42,19 @@ export class ActaConsejoDepartamentoComponent implements OnInit {
private datosCompartidos: Actualiza_datosService,
private idCompartido: Compartir_idService,
private datosEspeService: DatosEspeService,
private mostrarOcultarService: MostrarOcultarService,
) {
this.proyecto = new Proyectos();
}
ngOnInit(): void {
this.idRecuperado = parseInt(localStorage.getItem('proyectoId'),10);
this.proyecto = this.mostrarOcultarService.editProyecto;
this.cambio = false;
this.myForm = this.formBuilder.group({
archivo: [{ value: '', disabled: true }, Validators.required],
archivo: [{ value: "", disabled: true }, Validators.required],
});
}
......@@ -78,8 +86,7 @@ export class ActaConsejoDepartamentoComponent implements OnInit {
async onSubmit() {
if (this.myForm.valid) {
this.proyecto.uzytavproyec_id = this.idCompartido.getIdGuardado();
this.proyecto.uzytavproyec_id = this.idRecuperado;
const pdfData = await this.enviarPDF();
this.proyecto.uzytavproyec_aprob_con_dep_url = pdfData.idPDF;
this.proyecto.uzytavproyec_aprob_con_dep_nom = pdfData.filename;
......@@ -114,6 +121,39 @@ export class ActaConsejoDepartamentoComponent implements OnInit {
}
}
verPDF(id: string, nombre: string) {
console.log("uid pasado ", id)
console.log("nombre pasado ", nombre)
this.datosEspeService.verPDF(id, nombre).subscribe(
(response: any) => {
if (response) {
const contentDispositionHeader = response.headers.get('content-disposition');
const filename = this.getFilenameFromResponse(contentDispositionHeader);
const blob = new Blob([response.body], { type: 'application/pdf' });
saveAs(blob, nombre);
} else {
console.error('No se pudieron obtener las cabeceras de la respuesta.');
}
},
error => {
console.error('Error al obtener el PDF:', error);
}
);
}
getFilenameFromResponse(contentDispositionHeader: string | null): string {
if (contentDispositionHeader) {
const matches = /filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/.exec(contentDispositionHeader);
if (matches != null && matches[1]) {
return matches[1].replace(/['"]/g, '');
}
}
return 'document.pdf'; // Nombre predeterminado si no se puede obtener el nombre del archivo
}
cambiar() {
this.cambio = true;
this.myForm.get('archivo').enable();
......@@ -124,3 +164,4 @@ export class ActaConsejoDepartamentoComponent implements OnInit {
}
}
......@@ -186,7 +186,7 @@ export class AddDatosGeneralesComponent implements OnInit {
this.proyectosService.modificarParametros(this.idGuardado, this.proyectos).subscribe(response => {
console.log("codigo proyecto actualizado", this.proyectos.uzytavproyec_codigo)
});
this.router.navigate(['main/Proyecto']);
this.router.navigate(['main/editar-proyecto']);
});
} catch (error) {
......
......@@ -19,3 +19,9 @@
.editor-separator {
margin-top: 15px;
}
.error-message {
color: red;
font-size: 14px;
margin-top: 5px;
}
......@@ -23,3 +23,9 @@
.custom-ckeditor {
height: 400px;
}
.error-message {
color: red;
font-size: 14px;
margin-top: 5px;
}
......@@ -17,12 +17,19 @@
<div>
<label class="label-negrita"> Bienes:</label>
<ckeditor formControlName="bienes" class="custom-ckeditor" [disabled]="!isEditorEnabled" [style.height]="editorHeight" [editor]="Editor"></ckeditor>
<div *ngIf="myForm.get('bienes').hasError('maxlength')"
class="error-message">
El contenido no puede exceder los 3000 caracteres.
</div>
</div>
<div class="editor-separator"></div>
<div>
<label class="label-negrita"> Servicos:</label>
<ckeditor formControlName="servicios" class="custom-ckeditor" [disabled]="!isEditorEnabled" [style.height]="editorHeight" [editor]="Editor"></ckeditor>
<div *ngIf="myForm.get('servicios').hasError('maxlength')"
class="error-message">
El contenido no puede exceder los 3000 caracteres.
</div>
</div>
</mat-card-content>
......
......@@ -46,8 +46,8 @@ export class EditEntregablesComponent implements OnInit {
this.obtenerRegistros();
this.myForm = this.formBuilder.group({
bienes: [this.proyectos.uzytavproyec_bienes],
servicios: [this.proyectos.uzytavproyec_servicios]
bienes: [this.proyectos.uzytavproyec_bienes, [Validators.required, Validators.maxLength(3000)]],
servicios: [this.proyectos.uzytavproyec_servicios, [Validators.required, Validators.maxLength(3000)]]
});
}
......
<div class="container">
<form class="example-form" [formGroup]="myForm" (ngSubmit)="onSubmit()" >
<form class="example-form" [formGroup]="myForm" (ngSubmit)="onSubmit()">
<mat-card>
<mat-card-header>
<div class="save-button">
......@@ -17,14 +17,24 @@
<div>
<label class="label-negrita"> Descripción de la situación actual del
área de intervención del proyecto:</label>
<ckeditor formControlName="diagnostico" [style.height]="editorHeight" [disabled]="!isEditorEnabled" [editor]="Editor"></ckeditor>
<ckeditor formControlName="diagnostico" [style.height]="editorHeight"
[disabled]="!isEditorEnabled" [editor]="Editor"></ckeditor>
<div *ngIf="myForm.get('diagnostico').hasError('maxlength')"
class="error-message">
El contenido no puede exceder los 3000 caracteres.
</div>
</div>
<div class="editor-separator"></div>
<div>
<label class="label-negrita"> Identificación, descripción y
diagnóstico del problema:</label>
<ckeditor formControlName="identificacion" [style.height]="editorHeight" [disabled]="!isEditorEnabled" [editor]="Editor"></ckeditor>
<ckeditor formControlName="identificacion"
[style.height]="editorHeight" [disabled]="!isEditorEnabled"
[editor]="Editor"></ckeditor>
<div *ngIf="myForm.get('identificacion').hasError('maxlength')"
class="error-message">
El contenido no puede exceder los 3000 caracteres.
</div>
</div>
</mat-card-content>
......
......@@ -19,3 +19,15 @@
.editor-separator {
margin-top: 15px;
}
.editor-separator{
margin-top: 4%;
}
.error-message {
color: red;
font-size: 14px;
margin-top: 5px;
}
......@@ -48,8 +48,8 @@ export class EditDiagnosticoComponent implements OnInit {
this.obtenerRegistros();
this.myForm = this.formBuilder.group({
diagnostico: [this.proyectos.uzytavproyec_diagnostico],
identificacion: [this.proyectos.uzytavproyec_situactual]
diagnostico: [this.proyectos.uzytavproyec_diagnostico, [Validators.required, Validators.maxLength(3000)]],
identificacion: [this.proyectos.uzytavproyec_situactual, [Validators.required, Validators.maxLength(3000)]]
});
}
......
......@@ -4,13 +4,94 @@
<mat-label *ngIf="ocultar"><strong>Seleccione una Actividad</strong></mat-label>
<mat-form-field class="form-field" *ngIf="ocultar">
<mat-label>Seleccione un Item</mat-label>
<mat-select formControlName="Actividades">
<mat-select formControlName="Actividades"
(selectionChange)="obtenerActi($event.value)">
<mat-option *ngFor="let item of objetivosE"
[value]="item.uzytavobjetivo_programa_id">
{{ item.uzytavobjetivo_programaobjetivo_proy}}
</mat-option>
</mat-select>
</mat-form-field>
<div class="save-button">
<button mat-raised-button color="primary" *ngIf="ocultar"
(click)="AgregarF()" [disabled]="myForm.get('Actividades').invalid">Agregar</button>
<button mat-raised-button color="primary" *ngIf="showDataAdd"
[disabled]="myForm.invalid">Guardar</button>
<span class="separator"></span>
<button mat-raised-button color="warn" *ngIf="showDataAdd"
(click)="cancelarF()">Cancelar</button>
</div>
<div *ngIf="showDataAdd">
<mat-form-field class="form-field">
<mat-label>Fecha (dd/mm/aa)</mat-label>
<input matInput [matDatepicker]="picker" formControlName="fecha">
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker></mat-datepicker>
</mat-form-field>
<mat-form-field class="form-field">
<mat-label>Observación</mat-label>
<input matInput formControlName="observa">
</mat-form-field>
<!--seccion de la tabla-->
<mat-card class="card">
<table mat-table [dataSource]="objetivosA" class="mat-elevation-z8">
<ng-container matColumnDef="Nro">
<th mat-header-cell *matHeaderCellDef> Nro </th>
<td mat-cell *matCellDef="let i = index"> {{ i+1 }} </td>
</ng-container>
<ng-container matColumnDef="actividad">
<th mat-header-cell *matHeaderCellDef> Actividad </th>
<td mat-cell *matCellDef="let actividad"> {{
actividad.uzytavobjetivo_programaobjetivo_proy }} </td>
</ng-container>
<ng-container matColumnDef="fechaIni">
<th mat-header-cell *matHeaderCellDef> Fecha Inicio </th>
<td mat-cell *matCellDef="let actividad"> {{
formatFecha(actividad.uzytavobjetivo_programafec_ini) }} </td>
</ng-container>
<ng-container matColumnDef="fechaFin">
<th mat-header-cell *matHeaderCellDef> Fecha Fin </th>
<td mat-cell *matCellDef="let actividad"> {{
formatFecha(actividad.uzytavobjetivo_programafec_fin) }} </td>
</ng-container>
<div [formGroup]="dynamicForm" (ngSubmit)="onUpdate()">
<ng-container matColumnDef="resultado">
<th mat-header-cell *matHeaderCellDef> Resultado </th>
<td mat-cell *matCellDef="let actividad">
<input matInput [formControlName]="'resultado' + actividad.uzytavobjetivo_programa_id"
placeholder="Resultado">
</td>
</ng-container>
<ng-container matColumnDef="avance">
<th mat-header-cell *matHeaderCellDef> Avance </th>
<td mat-cell *matCellDef="let actividad">
<input matInput [formControlName]="'porcentaje' + actividad.uzytavobjetivo_programa_id" placeholder="Avance">
</td>
</ng-container>
<ng-container matColumnDef="observacion">
<th mat-header-cell *matHeaderCellDef> Observación </th>
<td mat-cell *matCellDef="let actividad">
<input matInput [formControlName]="'observacion' + actividad.uzytavobjetivo_programa_id"
placeholder="Observación">
</td>
</ng-container>
</div>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</mat-card>
</div>
</form>
</div>
</div>
import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { Component, OnInit, ViewChild } from '@angular/core';
import { FormArray, FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';
import { objetivoprograma } from 'src/app/modules/main/Models/objetivoPrograma';
import { Actualiza_datosService } from 'src/app/modules/main/services/actualiza_datos/actualiza_datos.service';
import { Objetivo_programaService } from 'src/app/modules/main/services/objetivo_programa/objetivo_programa.service';
import { format } from 'date-fns';
import { EnvioFormularioComponent } from '../../../../programa/opciones/envio-formulario/envio-formulario.component';
import { MatDialog } from '@angular/material/dialog';
import { Informes_avanceService } from 'src/app/modules/main/services/informes_avance/informes_avance.service';
import { actproy } from 'src/app/modules/main/Models/actproy';
import * as moment from 'moment';
import { MatTable, MatTableDataSource } from '@angular/material/table';
import { detactproy } from 'src/app/modules/main/Models/detactproy';
@Component({
selector: 'vex-add-informe',
templateUrl: './add-informe.component.html',
......@@ -12,25 +19,46 @@ import { Objetivo_programaService } from 'src/app/modules/main/services/objetivo
export class AddInformeComponent implements OnInit {
myForm: FormGroup;
dynamicForm: FormGroup;
showData: boolean = false;
ShowDataAdd: boolean = false;
showDataAdd: boolean = false;
ocultar: boolean = true;
idRecuperado: number;
//arreglo para la tabla
actividadesFormArray: FormArray;
//arreglos
objetivosE: objetivoprograma[]=[];
detactproy!: detactproy ;
objetivosE: objetivoprograma[] = [];
objetivosA: objetivoprograma[] = [];
cabecera: actproy[] = [];
formularioEnviado: boolean;
formControlsMap: { [key: number]: FormGroup };
displayedColumns: string[] = [
'Nro',
'actividad',
'fechaIni',
'fechaFin',
'resultado',
'avance',
'observacion'
];
constructor(
private objetS: Objetivo_programaService,
private datosCompartidos: Actualiza_datosService,
private formBuilder: FormBuilder
private formBuilder: FormBuilder,
private dialog: MatDialog,
private informeS: Informes_avanceService,
private cabeM: actproy,
private bodyM: detactproy
) {
this.myForm = this.formBuilder.group({
Actividades: ['', Validators.required]
});
}
ngOnInit(): void {
this.idRecuperado = parseInt(localStorage.getItem('proyectoId'),10);
this.initializeForm();
this.formControlsMap = {};
this.idRecuperado = parseInt(localStorage.getItem('proyectoId'), 10);
this.datosCompartidos.datos$.subscribe(() => {
this.obtenerRegistros();
});
......@@ -40,24 +68,167 @@ export class AddInformeComponent implements OnInit {
});
}
obtenerRegistros(){
this.objetS.registrosRelacionadosConProyecto(this.idRecuperado).subscribe(data =>{
this.objetivosE = data.filter( item => item.uzytavobjetivo_programatipo === 3);
console.log('impresión del arreglo', this.objetivosE)
initializeForm() {
//this.actividadesFormArray = this.formBuilder.array([]);
this.myForm = this.formBuilder.group({
Actividades: ['', Validators.required],
observa: ['', Validators.required],
fecha: [{ value: new Date(), disabled: true }],
});
this.dynamicForm = this.formBuilder.group({});
}
obtenerRegistros() {
// Obtener los registros de objetivoprograma relacionados con el proyecto
this.objetS.registrosRelacionadosConProyecto(this.idRecuperado).subscribe(objetivosData => {
// Filtrar los registros de objetivoprograma según el primer filtro
this.objetivosE = objetivosData.filter(item => item.uzytavobjetivo_programatipo === 3);
//controles para los inputs en el form
// Obtener los registros de cabecera relacionados con el proyecto
this.informeS.obtenerCabecera().subscribe(cabeceraData => {
this.cabecera = cabeceraData.filter(item => item.uzytavproyec_id === this.idRecuperado);
// Filtrar nuevamente los registros de objetivoprograma excluyendo aquellos que ya tienen cabecera
this.objetivosE = this.objetivosE.filter(objetivo =>
!this.cabecera.some(cab => cab.uzytavobjetivo_programa_id === objetivo.uzytavobjetivo_programa_id)
);
});
// Filtrar los registros de objetivoprograma excluyendo aquellos que ya están en actproy
this.objetivosE = this.objetivosE.filter(objetivo =>
!this.cabecera.some(act => act.uzytavobjetivo_programa_id === objetivo.uzytavobjetivo_programa_id)
);
});
}
obtenerActi(id: number) {
this.objetS.obtenerParametros().subscribe(data => {
this.objetivosA = data.map(obje => {
// Create dynamic form control
this.createDynamicFormControls(obje.uzytavobjetivo_programa_id);
return obje
});
this.objetivosA = data.filter(item => item.uzytavproyec_id === this.idRecuperado && item.uzytavobjetivo_programatipo === 4 && item.uzytavobjetivo_programa_id_padre === id);
});
}
createDynamicFormControls(opciones: number) {
this.dynamicForm.addControl('resultado' + opciones,
this.formBuilder.control({ value: "", disabled: false },
[Validators.required]));
this.dynamicForm.addControl('porcentaje' + opciones,
this.formBuilder.control({ value: "", disabled: false },
[Validators.required]));
this.dynamicForm.addControl('observacion' + opciones,
this.formBuilder.control({ value: "", disabled: false },
[Validators.required]));
}
/*
actividadForm(actividad: any): FormGroup {
return this.formBuilder.group({
resultado: [' ', Validators.required],
avance: [' ', Validators.required],
observacion: [' ', Validators.required]
});
}
*/
AgregarF() {
this.showDataAdd = true;
this.ocultar = false;
}
cancelarF() {
this.showDataAdd = false;
this.ocultar = true;
this.myForm.get('Actividades').reset();
this.myForm.reset();
}
onUpdate() {
if (this.myForm.valid) {
this.cabeM.uzytavproyec_id = this.idRecuperado;
const fechaIni = moment(this.myForm.get('fecha').value).utc().toDate();
const fechaHoraIni = new Date(fechaIni);
fechaHoraIni.setUTCHours(fechaHoraIni.getUTCHours() - 5);
AgregarF(){
this.cabeM.uzytavactproy_fech_regis = fechaHoraIni;
this.cabeM.uzytavobjetivo_programa_id = this.myForm.get('Actividades').value;
this.cabeM.uzytavactproy_observa = this.myForm.get('observa').value;
this.informeS.guardarCabecera(this.cabeM).subscribe(response => {
this.guardarBody(this.informeS.obtenerIdCabe());
this.cancelarF();
this.datosCompartidos.actualizarDatos(this.cabeM);
this.openModal();
});
}
}
cancelarF(){
guardarBody(id: number){
if (this.myForm.valid) {
this.bodyM.uzytavactproy_id = id;
console.log('arreglo', this.objetivosA)
this.objetivosA.forEach(
opcion => {
const controlNameResultado = 'resultado' + opcion.uzytavobjetivo_programa_id;
const controlNamePorcentaje = 'porcentaje' + opcion.uzytavobjetivo_programa_id;
const controlNameObservacion = 'observacion' + opcion.uzytavobjetivo_programa_id;
const selectedValueId = this.dynamicForm.get(controlNameResultado)?.value;
const selectedValueIdPorcentaje = this.dynamicForm.get(controlNamePorcentaje)?.value;
const selectedValueIdObservacion = this.dynamicForm.get(controlNameObservacion)?.value;
if (selectedValueId !== null && selectedValueId !== undefined && selectedValueIdPorcentaje !== null && selectedValueIdPorcentaje !== undefined && selectedValueIdObservacion !== null && selectedValueIdObservacion !== undefined) {
// Crear el objeto EvaluacionProy con los valores necesarios
const detactproy: detactproy = {
uzytavactproy_id: id,
uzytavobjetivo_programa_id: opcion.uzytavobjetivo_programa_id,
uzytavdetactproyporcent: selectedValueIdPorcentaje,
uzytavdetactproyobserva: selectedValueIdObservacion,
uzytavdetactproyresultado: selectedValueId
// Agregar otros campos si es necesario
};
this.informeS.guardarParametros(detactproy).subscribe(() => {
});
}
});
}
}
onUpdate(){
formatFecha(fecha: Date): string {
if (fecha === null) {
console.log('Agregar fecha:')
} else {
const dateObj = new Date(fecha);
return format(dateObj, 'dd-MM-yyyy');
}
}
openModal() {
const dialogRef = this.dialog.open(EnvioFormularioComponent, {
disableClose: true
});
dialogRef.afterClosed().subscribe(result => {
this.formularioEnviado = true;
});
}
}
......@@ -31,7 +31,7 @@
<td>
{{i+1}}
</td>
<td>{{item.uzytavactproy_fech_regis}}</td>
<td>{{formatFecha(item.uzytavactproy_fech_regis)}}</td>
<td>{{item.uzytavactproy_observa}}</td>
<td>
<button>
......
import { Component, ElementRef, OnInit, ViewChild } from '@angular/core';
import { format } from 'date-fns';
import { actproy } from 'src/app/modules/main/Models/actproy';
import { detactproy } from 'src/app/modules/main/Models/detactproy';
import { objetivoprograma } from 'src/app/modules/main/Models/objetivoPrograma';
......@@ -110,4 +111,10 @@ export class ListInformeComponent implements OnInit {
this.activitySection.nativeElement.scrollIntoView({ behavior: 'smooth' });
}
}
formatFecha(fecha: Date): string {
const dateObj = new Date(fecha);
return format(dateObj, 'dd-MM-yyyy');
}
}
<div class="modal-container">
<div class="modal-content">
<h2>Documento (Convenio o Carta de Participación) (.pdf)</h2>
<form (ngSubmit)="submitForm()" #documentForm="ngForm">
<form (ngSubmit)="onSubmit()" [formGroup]="myForm">
<div class="form-group">
<label for="pdfFile">Seleccionar archivo PDF:</label>
<input type="file" id="pdfFile" name="pdfFile" accept=".pdf" required #pdfInput>
<input type="file" accept=".pdf" (change)="onFileChange($event)" formControlName="archivo">
</div>
<div class="form-actions">
<button type="submit" [disabled]="!documentForm.form.valid">Guardar</button>
<button type="submit" [disabled]="myForm.invalid">Guardar</button>
<button type="button" (click)="cerrarModal()">Cerrar</button>
</div>
</form>
......
import { Component, OnInit, Inject } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { docompar } from 'src/app/modules/main/Models/docompar';
import { DatosEspeService } from 'src/app/modules/main/services/APIs Externas/Datos espe/datos-espe.service';
import { saveAs } from 'file-saver';
import { parametrosdet } from 'src/app/modules/main/Models/parametrosdet';
import { ParametrosdetService } from 'src/app/modules/main/services/parametrosdet/parametrosdet.service';
import { Actualiza_datosService } from 'src/app/modules/main/services/actualiza_datos/actualiza_datos.service';
@Component({
selector: 'vex-add-documentos',
templateUrl: './add-documentos.component.html',
styleUrls: ['./add-documentos.component.css']
})
export class AddDocumentosComponent implements OnInit {
myForm: FormGroup;
selectedFile: File | null = null;
file: File;
enviarSolicitud = false;
formularioEnviado: boolean;
docompar: docompar;
constructor(
private dialogRef: MatDialogRef<AddDocumentosComponent>,
@Inject(MAT_DIALOG_DATA) public data: { idConf: number }
) { }
@Inject(MAT_DIALOG_DATA) public data: { idConf: number },
private formBuilder: FormBuilder,
private datosEspeService: DatosEspeService,
private pdfService: ParametrosdetService,
private datosCompartidos: Actualiza_datosService
) {
this.docompar = new docompar();
}
ngOnInit(): void {
this.myForm = this.formBuilder.group({
archivo: [ '', Validators.required]
});
console.log('ID recibido:', this.data.idConf);
}
onFileSelected(event: any) {
this.selectedFile = event.target.files[0];
}
onFileChange(event: any) {
// Obtener el archivo seleccionado
const fileList: FileList = event.target.files;
if (fileList.length > 0) {
this.file = fileList[0];
}
}
async onSubmit() {
if (this.myForm.valid) {
const pdfData = await this.enviarPDF();
this.docompar.uzytavinstproy_id = this.data.idConf;
this.docompar.uzytavdocompar_nombre_url = pdfData.idPDF;
this.docompar.uzytavdocompar_nombre_doc = pdfData.filename;
this.pdfService.guardarPDF(this.docompar).subscribe(
response => {
this.datosCompartidos.actualizarDatos(this.docompar);
this.submitForm();
console.log('pdf enviado')
},
error => {
console.log(error)
}
);
}
}
async enviarPDF() {
const formData = new FormData();
formData.append('files', this.file);
formData.append('sistema', 'vinculacion');
try {
const response = await this.datosEspeService.saveDocument(formData);
return {
idPDF: response.uuid,
filename: response.fileName
};
} catch (error) {
console.error('Error al guardar el PDF en el servidor:', error);
throw error;
}
}
submitForm(){
this.dialogRef.close();
}
......@@ -25,5 +97,4 @@ export class AddDocumentosComponent implements OnInit {
this.dialogRef.close();
}
}
......@@ -20,6 +20,10 @@
background-color: rgb(248, 249, 250);
}
.btn{
padding: 0 2% 0 2%;
}
.rounder-nuevo {
border-radius: 50%;
background-color: rgb(71, 127, 75);
......
......@@ -18,14 +18,13 @@
<ng-container *ngIf="documentoInst.length > 0; else noRegistros">
<tr *ngFor="let dato of documentoInst; let i = index" >
<td>{{ i+1 }}</td>
<td>{{ dato.UZYTAVDOCOMPAR_NOMBRE_DOC }}</td>
<td>{{ dato.uzytavdocompar_nombre_doc }}</td>
<td>
<button>
<mat-icon class="warn" (click)="eliminarPDF()">delete</mat-icon>
<button class="btn" (click)="verPDF(dato.uzytavdocompar_nombre_url,dato.uzytavdocompar_nombre_doc)">
<mat-icon aria-placeholder="Ver PDF">visibility</mat-icon>
</button>
<button>
<mat-icon color="azul" (click)="descargar()">download</mat-icon>
<button >
<mat-icon color="warn" (click)="eliminarParametro(dato.uzytavdocompar_code)">delete</mat-icon>
</button>
</td>
</tr>
......
......@@ -2,7 +2,10 @@ import { Component, OnInit,Input } from '@angular/core';
import { MatDialog } from '@angular/material/dialog';
import { docompar } from 'src/app/modules/main/Models/docompar';
import { AddDocumentosComponent } from '../add-documentos/add-documentos.component';
import { ParametrosdetService } from 'src/app/modules/main/services/parametrosdet/parametrosdet.service';
import { ActualizarAnexosService } from 'src/app/modules/main/services/actualizar_anexos/actualizar-anexos.service';
import { saveAs } from 'file-saver';
import { Actualiza_datosService } from 'src/app/modules/main/services/actualiza_datos/actualiza_datos.service';
@Component({
selector: 'vex-list-documentos',
templateUrl: './list-documentos.component.html',
......@@ -11,31 +14,87 @@ import { AddDocumentosComponent } from '../add-documentos/add-documentos.compone
export class ListDocumentosComponent implements OnInit {
@Input() idConf: number;
documentoInst: docompar[] = [];
documentoInst!: docompar[];
showModal = false;
constructor(
private dialog: MatDialog
private dialog: MatDialog,
private pdfService: ParametrosdetService,
private datosCompartidos: Actualiza_datosService
) { }
ngOnInit(): void {
this.datosCompartidos.datos$.subscribe(() =>{
this.obtenerDocumentos();
});
this.pdfService.parametrosActualizados.subscribe(() =>{
this.obtenerDocumentos();
});
}
GuardarParametro(){
const dialogRef = this.dialog.open(AddDocumentosComponent, {
data: { idConf: this.idConf } // Puedes pasar datos al componente modal si es necesario
data: { idConf: this.idConf }
});
dialogRef.afterClosed().subscribe(result => {
// Puedes realizar acciones después de que la ventana modal se cierra si lo deseas
});
}
verPDF(id: string, nombre: string) {
this.pdfService.verPDF(id, nombre).subscribe(
(response: any) => {
if (response) {
const contentDispositionHeader = response.headers.get('content-disposition');
const filename = this.getFilenameFromResponse(contentDispositionHeader);
const blob = new Blob([response.body], { type: 'application/pdf' });
saveAs(blob, nombre);
} else {
console.error('No se pudieron obtener las cabeceras de la respuesta.');
}
},
error => {
console.error('Error al obtener el PDF:', error);
}
);
}
getFilenameFromResponse(contentDispositionHeader: string | null): string {
if (contentDispositionHeader) {
const matches = /filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/.exec(contentDispositionHeader);
if (matches != null && matches[1]) {
return matches[1].replace(/['"]/g, '');
}
}
return 'document.pdf'; // Nombre predeterminado si no se puede obtener el nombre del archivo
}
obtenerDocumentos(){
this.pdfService.obtenerNombrePDF().subscribe(data => {
this.documentoInst = data.filter(item => item.uzytavinstproy_id === this.idConf);
});
}
descargar(){
}
eliminarPDF(){
eliminarParametro(id: number) {
const confirmacion = confirm('¿Estás seguro de que quieres eliminar este parámetro?');
if (confirmacion) {
this.pdfService.eliminarPDF(id).subscribe(
() => {
// Manejar la eliminación exitosa
console.log('Registro eliminado correctamente');
this.obtenerDocumentos();
},
(error) => {
this.obtenerDocumentos();
// Manejar el error en caso de que ocurra
console.error('Error al eliminar el registro', error);
}
);
}
}
}
......@@ -5,7 +5,7 @@
justify-content: space-between;
align-items: center;
}
.contenedorP {
width: 96%;
margin-left: 2%;
......@@ -16,20 +16,20 @@
margin-top: 10%;
background-color: white;
}
.mat-mdc-radio-button ~ .mat-mdc-radio-button {
margin-left: 16px;
}
.mat-radio-button{
margin-right: 10px;
}
.form-container {
display: flex;
flex-direction: column;
align-items: center;
}
.formulario {
display: flex;
flex-wrap: wrap;
......@@ -39,53 +39,53 @@
background-color: white;
border-radius: 10px;
}
.contenedor-dos {
margin-top: 30px;
padding: 0.9375rem 20px;
position: relative;
}
.form-field {
width: 100%;
margin-bottom: 20px;
}
.save-button {
display: flex;
justify-content: flex-end;
margin-bottom: 16px;
}
.dos-secciones {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.form-field-dos{
flex-basis: 48%;
}
.separator {
margin: 0 5px;
opacity: 0;
pointer-events: none;
}
/*Estilos para utilizar con la tabla*/
.principal {
text-align: center;
margin-bottom: 2%;
}
.grid-container {
display: grid;
grid-template-columns: 5% 10% 45% 10% 5% 10% 15%;
border: 1px solid #ccc;
}
#cabecera {
background: linear-gradient(135deg,
var(--background-base) 22px,
......@@ -108,8 +108,8 @@
background-color: var(--background-base);
background-size: 64px 128px;
}
.Column {
padding-left: 0px;
padding-right: 0px;
......@@ -120,7 +120,7 @@
overflow: hidden;
text-overflow: ellipsis; */
}
.Column1 {
padding-left: 0px;
padding-right: 0px;
......@@ -128,13 +128,13 @@
white-space: normal;
overflow: visible;
}
.Column2 {
width: 25px;
padding-left: 0px;
padding-right: 0px;
}
.volver{
position: absolute;
top: 50%;
......@@ -152,52 +152,52 @@
border: none;
outline: none;
cursor: pointer;
}
.grid-item {
font-weight: bold;
}
.grid-opciones {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
}
.titulo {
display: flex;
align-items: center;
justify-content: center;
}
.titulo-texto {
font-weight: bold;
font-size: 18px;
font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
margin-right: 10px;
}
.componente {
justify-content: center;
align-items: center;
}
.card {
background-color: rgb(252, 252, 251)
}
.colorEditar {
color: blue;
}
.colorEditar svg {
fill: blue;
}
.contenedorP {
width: 96%;
margin-left: 2%;
......@@ -211,7 +211,7 @@
.contenedor:not(:last-child) {
margin-bottom: 2px;
}
.separador{
margin-top: 5%;
}
......@@ -225,7 +225,7 @@
position: relative;
z-index: 1;
}
.sobremontado {
position: relative;
align-items: center;
......@@ -244,19 +244,19 @@
border-radius: 10px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
}
.sobremontado span {
display: flex;
align-items: center;
justify-content: center;
margin: 0;
}
.sobremontado mat-icon {
margin-right: 5px;
}
.icono-instituciones {
display: flex;
align-items: center;
......@@ -265,7 +265,7 @@
font-size: 20px;
cursor: pointer;
}
table {
width: 100%;
border-collapse: collapse;
......@@ -273,24 +273,24 @@
font-family: 'Roboto', sans-serif;
color: #333;
}
table th,
table td {
padding: 12px;
text-align: left;
border-bottom: 1px solid #e0e0e0;
}
table th {
background-color: rgb(248, 249, 250);
font-weight: bold;
text-transform: uppercase;
}
table td {
position: relative;
}
table td::after {
content: "";
position: absolute;
......@@ -300,8 +300,8 @@
height: 1px;
background-color: #e0e0e0;
}
input[type="text"] {
width: 200px;
padding: 8px;
......@@ -309,36 +309,36 @@
border-radius: 5px;
margin-left: 10px;
}
.area-busqueda {
padding: 20px;
margin-top: 30px;
text-align: right;
}
@media (max-width: 600px) {
table {
font-size: 14px;
}
table th,
table td {
padding: 8px;
}
}
.btn-observar {
border-radius: 50%;
width: 36px;
height: 36px;
}
.colorsito{
background-color: rgb(248, 249, 250);
}
.rounder{
border-radius: 50%;
background-color: rgb(71, 127, 75);
......@@ -352,63 +352,63 @@
outline: none;
cursor: pointer;
}
.rounder mat-icon {
font-size: 24px;
color: #fff;
}
@media (max-width: 768px) {
.rounder {
width: 30%;
}
}
@media (max-width: 480px) {
.rounder {
width: 40%;
}
}
.margen{
margin: 10px;
padding: 10px;
margin-bottom: 10px;
}
.bordes {
border-collapse: collapse;
width: 100%;
}
.bordes th,
.bordes td {
border: 1px solid black;
padding: 8px;
}
.bordes th {
background-color: #f5f5f5;
font-weight: bold;
}
.bordes td {
background-color: #ffffff;
}
.bordes tr:nth-child(even) {
background-color: #f9f9f9;
}
.bordes tr:hover {
background-color: #eaeaea;
}
.bordes th:last-child,
.bordes td:last-child {
border-bottom: none;
}
.rounder-nuevo {
border-radius: 50%;
background-color: rgb(71, 127, 75);
......@@ -423,26 +423,26 @@
cursor: pointer;
margin-left: 5px;
}
.white-icon {
color: white;
}
.btn{
padding: 0 2% 0 2%;
}
.azul {
color: blue;
}
.institution {
display: flex;
align-items: center;
}
.institution-name {
font-size: 20px;
/* Tamaño de fuente deseado */
......@@ -451,7 +451,7 @@
margin-right: 30px;
/* Espacio entre el icono y el nombre */
}
.add-icon {
display: flex;
align-items: center;
......@@ -468,22 +468,18 @@
/* Color del signo "+" en el círculo */
font-size: 25px;
/* Tamaño del signo "+" */
}
.label-negrita{
font-weight: bold;
margin-right: 10px;
}
.separa{
margin-top: 3%;
}
.div-container {
display: flex;
align-items: center;
}
\ No newline at end of file
......@@ -6,7 +6,8 @@
<mat-card>
<mat-card-header>
<div class="save-button">
<button mat-raised-button color="primary" *ngIf="cambio">Guardar</button>
<button mat-raised-button color="primary" *ngIf="cambio"
[disabled]="myForm.invalid">Guardar</button>
<span class="separator"></span>
<button mat-raised-button color="warn" *ngIf="cambio"
(click)="cancelado()">Cancelar</button>
......@@ -33,7 +34,8 @@
<!--valor del indicador-->
<mat-form-field class="form-field-dos">
<mat-label>Valor Indicador</mat-label>
<input matInput formControlName="valorindicadorFin" type="number" max="100">
<input matInput formControlName="valorindicadorFin" type="number"
max="100">
<mat-error>El valor no puede ser mayor que 100</mat-error>
</mat-form-field>
</div>
......@@ -69,7 +71,8 @@
<mat-card>
<mat-card-header>
<div class="save-button">
<button mat-raised-button color="primary" *ngIf="cambio2">Guardar</button>
<button mat-raised-button color="primary" *ngIf="cambio2"
[disabled]="myForm2.invalid">Guardar</button>
<span class="separator"></span>
<button mat-raised-button color="warn" *ngIf="cambio2"
(click)="cancelado2()">Cancelar</button>
......@@ -96,7 +99,8 @@
<!--valor del indicador-->
<mat-form-field class="form-field-dos">
<mat-label>Valor Indicador:</mat-label>
<input matInput formControlName="valorindicadorObjG" type="number" max="100">
<input matInput formControlName="valorindicadorObjG" type="number"
max="100">
<mat-error>El valor no puede ser mayor que 100</mat-error>
</mat-form-field>
</div>
......@@ -125,68 +129,69 @@
</div>
<div class="subir3">
<!--formulario para agregar objetivos especificos-->
<div class="container" #activitySection>
<form class="example-form" [formGroup]="myForm3"
(ngSubmit)="onSubmitObjetivoEspe()" *ngIf="cambio3">
<mat-card>
<mat-card-header>
<div class="save-button">
<button mat-raised-button color="primary" *ngIf="cambio3">Guardar</button>
<span class="separator"></span>
<button mat-raised-button color="warn" *ngIf="cambio3"
(click)="canceladoObjEs()">Cancelar</button>
</div>
</mat-card-header>
<mat-card-content>
<!--ingreso del fin-->
<mat-form-field class="form-field">
<mat-label>Objetivo Especifico:</mat-label>
<input matInput formControlName="objetivoEspe">
</mat-form-field>
<!--formulario para agregar objetivos especificos-->
<div class="container" #activitySection>
<form class="example-form" [formGroup]="myForm3"
(ngSubmit)="onSubmitObjetivoEspe()" *ngIf="cambio3">
<mat-card>
<mat-card-header>
<div class="save-button">
<button mat-raised-button color="primary" *ngIf="cambio3"
[disabled]="myForm3.invalid">Guardar</button>
<span class="separator"></span>
<button mat-raised-button color="warn" *ngIf="cambio3"
(click)="canceladoObjEs()">Cancelar</button>
</div>
</mat-card-header>
<div class="dos-secciones">
<!--seleccion del tipo indicador existen dos tipos-->
<mat-form-field class="form-field-dos">
<mat-label>Tipo Indicador</mat-label>
<mat-select formControlName="tipoindiObjEspe">
<mat-option value="1">Valor</mat-option>
<mat-option value="2">Porcentaje</mat-option>
</mat-select>
<mat-card-content>
<!--ingreso del fin-->
<mat-form-field class="form-field">
<mat-label>Objetivo Especifico:</mat-label>
<input matInput formControlName="objetivoEspe">
</mat-form-field>
<!--valor del indicador-->
<mat-form-field class="form-field-dos">
<mat-label>Valor Indicador:</mat-label>
<input matInput formControlName="valorindicadorObjEspe" type="number" max="100">
<mat-error>El valor no puede ser mayor que 100</mat-error>
</mat-form-field>
</div>
<div class="dos-secciones">
<!--seleccion del tipo indicador existen dos tipos-->
<mat-form-field class="form-field-dos">
<mat-label>Tipo Indicador</mat-label>
<mat-select formControlName="tipoindiObjEspe">
<mat-option value="1">Valor</mat-option>
<mat-option value="2">Porcentaje</mat-option>
</mat-select>
</mat-form-field>
<!--Descripción Indicador-->
<mat-form-field class="form-field">
<mat-label>Descripción Indicador: </mat-label>
<input matInput formControlName="indicadorObjEspe">
</mat-form-field>
<!--valor del indicador-->
<mat-form-field class="form-field-dos">
<mat-label>Valor Indicador:</mat-label>
<input matInput formControlName="valorindicadorObjEspe"
type="number" max="100">
<mat-error>El valor no puede ser mayor que 100</mat-error>
</mat-form-field>
</div>
<!--Medio de verificaicón-->
<mat-form-field class="form-field">
<mat-label>Medio de Verificación: </mat-label>
<input matInput formControlName="medioVeriObjEspe">
</mat-form-field>
<!--Descripción Indicador-->
<mat-form-field class="form-field">
<mat-label>Descripción Indicador: </mat-label>
<input matInput formControlName="indicadorObjEspe">
</mat-form-field>
<!--Supuestos-->
<mat-form-field class="form-field">
<mat-label>Supuestos: </mat-label>
<input matInput formControlName="supuestoObjEspe">
</mat-form-field>
</mat-card-content>
</mat-card>
</form>
</div>
</div>
<!--Medio de verificaicón-->
<mat-form-field class="form-field">
<mat-label>Medio de Verificación: </mat-label>
<input matInput formControlName="medioVeriObjEspe">
</mat-form-field>
<!--Supuestos-->
<mat-form-field class="form-field">
<mat-label>Supuestos: </mat-label>
<input matInput formControlName="supuestoObjEspe">
</mat-form-field>
</mat-card-content>
</mat-card>
</form>
</div>
</div>
<!--Formulario para ingresar las actividades-->
<div class="container" #activitySection>
......@@ -195,7 +200,8 @@
<mat-card>
<mat-card-header>
<div class="save-button">
<button mat-raised-button color="primary" *ngIf="cambio4">Guardar</button>
<button mat-raised-button color="primary" *ngIf="cambio4"
[disabled]="myForm4.invalid">Guardar</button>
<span class="separator"></span>
<button mat-raised-button color="warn" *ngIf="cambio4"
(click)="canceladoActi()">Cancelar</button>
......@@ -219,11 +225,12 @@
</mat-select>
</mat-form-field>
<!--valor del indicador-->
<!--valor del indicador-->
<mat-form-field class="form-field-dos">
<mat-label>Valor Indicador:</mat-label>
<input matInput formControlName="valorindicadorActi">
<input matInput formControlName="valorindicadorActi" type="number" max="100">
<mat-label>Valor Indicador</mat-label>
<input matInput formControlName="valorindicadorActi" type="number"
max="100">
<mat-error>El valor no puede ser mayor que 100</mat-error>
</mat-form-field>
</div>
......@@ -254,76 +261,78 @@
<div class="container">
<div class="mat-elevation-z8">
<mat-card class="card">
<table>
<tr>
<th class="Column1 negrita"></th>
<th class="Column1 negrita">Descripción</th>
<th class="Column1 negrita">Tipo Indicador</th>
<th class="Column1 negrita">Valor Indicador</th>
<th class="Column1 negrita">Descripción Indicador</th>
<th class="Column1 negrita">Medio de Verificación</th>
<th class="Column1 negrita">Supuestos</th>
<th class="Column1 negrita">Acciones</th>
</tr>
<tr *ngIf="objetivoPro.length === 0">
<td colspan="7" class="Column1">Fin</td>
<td class="Column1">
<button>
<mat-icon color="primary"
(click)="editar()">edit</mat-icon>
</button>
</td>
</tr>
<table>
<tr>
<th class="Column1 negrita"></th>
<th class="Column1 negrita">Descripción</th>
<th class="Column1 negrita">Tipo Indicador</th>
<th class="Column1 negrita">Valor Indicador</th>
<th class="Column1 negrita">Descripción Indicador</th>
<th class="Column1 negrita">Medio de Verificación</th>
<th class="Column1 negrita">Supuestos</th>
<th class="Column1 negrita">Acciones</th>
</tr>
<tr *ngIf="objetivoPro.length === 0">
<td colspan="7" class="Column1">Fin</td>
<td class="Column1">
<button>
<mat-icon color="primary"
(click)="editar()">edit</mat-icon>
</button>
</td>
</tr>
<tr *ngFor="let item of objetivoPro">
<td class="Column1">Fin</td>
<td class="Column1">{{item.uzytavobjetivo_programaobjetivo_proy || ''}}</td>
<td class="Column1">{{especificarValor(item.uzytavobjetivo_programaindicador_tipo)
|| ''}}</td>
<td class="Column1">{{item.uzytavobjetivo_programaindicador_valor || ''}}</td>
<td class="Column1">{{item.uzytavobjetivo_programaindicador || ''}}</td>
<td class="Column1">{{item.uzytavobjetivo_programamverifica || ''}}</td>
<td class="Column1">{{item.uzytavobjetivo_programasupuestos || ''}}</td>
<td class="Column1">
<!--<button>
<tr *ngFor="let item of objetivoPro">
<td class="Column1">Fin</td>
<td class="Column1">{{item.uzytavobjetivo_programaobjetivo_proy || ''}}</td>
<td class="Column1">{{especificarValor(item.uzytavobjetivo_programaindicador_tipo)
|| ''}}</td>
<td class="Column1">{{item.uzytavobjetivo_programaindicador_valor ||
''}}</td>
<td class="Column1">{{item.uzytavobjetivo_programaindicador || ''}}</td>
<td class="Column1">{{item.uzytavobjetivo_programamverifica || ''}}</td>
<td class="Column1">{{item.uzytavobjetivo_programasupuestos || ''}}</td>
<td class="Column1">
<!--<button>
<mat-icon color="primary"
(click)="editar()">edit</mat-icon>
</button>-->
<button>
<mat-icon color="warn"
(click)="eliminarFin(item.uzytavobjetivo_programa_id)">delete</mat-icon>
</button>
</td>
</tr>
<tr *ngIf="objetivoProObj.length === 0">
<td colspan="7" class="Column1">Proposito(Objetivo General)</td>
<td class="Column1">
<button>
<mat-icon color="primary"
(click)="addOBJG()">edit</mat-icon>
</button>
</td>
</tr>
<tr *ngFor="let objG of objetivoProObj">
<td class="Column1">Proposito(Objetivo General)</td>
<td class="Column1">{{ objG.uzytavobjetivo_programaobjetivo_proy || ''}}</td>
<td class="Column1">{{
especificarValor(objG.uzytavobjetivo_programaindicador_tipo) || ''}}</td>
<td class="Column1">{{ objG.uzytavobjetivo_programaindicador_valor || ''}}</td>
<td class="Column1">{{ objG.uzytavobjetivo_programaindicador || ''}}</td>
<td class="Column1">{{ objG.uzytavobjetivo_programamverifica || ''}}</td>
<td class="Column1">{{ objG.uzytavobjetivo_programasupuestos || ''}}</td>
<td class="Column1">
<button>
<mat-icon color="warn"
(click)="eliminarObjG(objG.uzytavobjetivo_programa_id)">delete</mat-icon>
</button>
</td>
</tr>
</table>
<button>
<mat-icon color="warn"
(click)="eliminarFin(item.uzytavobjetivo_programa_id)">delete</mat-icon>
</button>
</td>
</tr>
<tr *ngIf="objetivoProObj.length === 0">
<td colspan="7" class="Column1">Proposito(Objetivo General)</td>
<td class="Column1">
<button>
<mat-icon color="primary"
(click)="addOBJG()">edit</mat-icon>
</button>
</td>
</tr>
<tr *ngFor="let objG of objetivoProObj">
<td class="Column1">Proposito(Objetivo General)</td>
<td class="Column1">{{ objG.uzytavobjetivo_programaobjetivo_proy || ''}}</td>
<td class="Column1">{{
especificarValor(objG.uzytavobjetivo_programaindicador_tipo) || ''}}</td>
<td class="Column1">{{ objG.uzytavobjetivo_programaindicador_valor ||
''}}</td>
<td class="Column1">{{ objG.uzytavobjetivo_programaindicador || ''}}</td>
<td class="Column1">{{ objG.uzytavobjetivo_programamverifica || ''}}</td>
<td class="Column1">{{ objG.uzytavobjetivo_programasupuestos || ''}}</td>
<td class="Column1">
<button>
<mat-icon color="warn"
(click)="eliminarObjG(objG.uzytavobjetivo_programa_id)">delete</mat-icon>
</button>
</td>
</tr>
</table>
</mat-card>
</div>
</div>
<div class="separa"></div>
......@@ -331,103 +340,110 @@
<!--este apartado lo uso para mostrar a sus hijos-->
<div class="container">
<div class="mat-elevation-z8">
<div class="div-container">
<label class="label-negrita">Componentes (objetivos específicos):</label>
<button (click)="AddObjEspe()">
<mat-icon color="primary">add_circle</mat-icon>
</button>
</div>
<table>
<thead>
<tr>
<th class="Column1"></th>
<th class="Column1 negrita">Nro</th>
<th class="Column1 negrita">Descripción</th>
<th class="Column1 negrita">Tipo Indicador</th>
<th class="Column1 negrita">Valor Indicador</th>
<th class="Column1 negrita">Descripción Indicador</th>
<th class="Column1 negrita">Medio de Verificación</th>
<th class="Column1 negrita">Supuestos</th>
<th class="Column1 negrita">Acciones</th>
</tr>
</thead>
<tbody>
<ng-container *ngFor="let item of objetivoProEsp; let i = index">
<tr id="fila-{{i}}">
<td>
<button (click)="toggleDiv(i)">
<mat-icon>{{ mostrarDiv[i] ? 'keyboard_arrow_down' :
'keyboard_arrow_right' }}</mat-icon>
</button>
</td>
<td>
{{i+1}}
</td>
<td>{{item.uzytavobjetivo_programaobjetivo_proy}}</td>
<td>{{especificarValor(item.uzytavobjetivo_programaindicador_tipo)}}</td>
<td>{{item.uzytavobjetivo_programaindicador_valor}}</td>
<td>{{item.uzytavobjetivo_programaindicador}}</td>
<td>{{item.uzytavobjetivo_programamverifica}}</td>
<td>{{item.uzytavobjetivo_programasupuestos}}</td>
<td>
<button>
<mat-icon color="warn"
(click)="eliminarObjEsp(item.uzytavobjetivo_programa_id)">delete</mat-icon>
</button>
</td>
<mat-card class="card">
<div >
<label class="label-negrita">Componentes (objetivos específicos):</label>
<button (click)="AddObjEspe()">
<mat-icon color="primary">add_circle</mat-icon>
</button>
</div>
<table>
<thead>
<tr>
<th class="Column1"></th>
<th class="Column1 negrita">Nro</th>
<th class="Column1 negrita">Descripción</th>
<th class="Column1 negrita">Tipo Indicador</th>
<th class="Column1 negrita">Valor Indicador</th>
<th class="Column1 negrita">Descripción Indicador</th>
<th class="Column1 negrita">Medio de Verificación</th>
<th class="Column1 negrita">Supuestos</th>
<th class="Column1 negrita">Acciones</th>
</tr>
</thead>
<tbody>
<ng-container *ngFor="let item of objetivoProEsp; let i = index">
<tr id="fila-{{i}}">
<td>
<button (click)="toggleDiv(i)">
<mat-icon>{{ mostrarDiv[i] ? 'keyboard_arrow_down' :
'keyboard_arrow_right' }}</mat-icon>
</button>
</td>
<td>
{{i+1}}
</td>
<td>{{item.uzytavobjetivo_programaobjetivo_proy}}</td>
<td>{{especificarValor(item.uzytavobjetivo_programaindicador_tipo)}}</td>
<td>{{item.uzytavobjetivo_programaindicador_valor}}</td>
<td>{{item.uzytavobjetivo_programaindicador}}</td>
<td>{{item.uzytavobjetivo_programamverifica}}</td>
<td>{{item.uzytavobjetivo_programasupuestos}}</td>
<td>
<button>
<mat-icon color="warn"
(click)="eliminarObjEsp(item.uzytavobjetivo_programa_id)">delete</mat-icon>
</button>
</td>
</tr>
<!-- tabla interna para cada item -->
<tr *ngIf="mostrarDiv[i]">
<td colspan="8">
<div class="container">
<div class>
<div>
<label class="label-negrita">Actividades: </label>
<button (click)="AddActi(item.uzytavobjetivo_programa_id)">
<mat-icon color="primary">add_circle</mat-icon>
</button>
</div>
<mat-card class="card">
<table>
<thead>
<tr>
<th class="Column1 negrita">Nro</th>
<th class="Column1 negrita">Descripción</th>
<th class="Column1 negrita">Tipo Indicador</th>
<th class="Column1 negrita">Valor Indicador</th>
<th class="Column1 negrita">Descripción Indicador</th>
<th class="Column1 negrita">Medio de Verificación</th>
<th class="Column1 negrita">Supuestos</th>
<th class="Column1 negrita">Acciones</th>
</tr>
</thead>
<tbody>
<tr
*ngFor="let acti of objetivoProAct; let i = index">
<ng-container
*ngIf="acti.uzytavobjetivo_programa_id_padre === item.uzytavobjetivo_programa_id">
<td>{{ i+1 }}</td>
<td>{{acti.uzytavobjetivo_programaobjetivo_proy}}</td>
<td>{{especificarValor(acti.uzytavobjetivo_programaindicador_tipo)}}</td>
<td>{{acti.uzytavobjetivo_programaindicador_valor}}</td>
<td>{{acti.uzytavobjetivo_programaindicador}}</td>
<td>{{acti.uzytavobjetivo_programamverifica}}</td>
<td>{{acti.uzytavobjetivo_programasupuestos}}</td>
<td>
<button>
<mat-icon color="warn"
(click)="eliminarActividad(item.uzytavobjetivo_programa_id)">delete</mat-icon>
</button>
</td>
</ng-container>
</tr>
</tbody>
</table>
</mat-card>
<!-- tabla interna para cada item -->
<tr *ngIf="mostrarDiv[i]">
<td colspan="8">
<div class="container">
<div class="">
<div>
<label class="label-negrita">Actividades: </label>
<button (click)="AddActi(item.uzytavobjetivo_programa_id)">
<mat-icon color="primary">add_circle</mat-icon>
</button>
</div>
<table>
<thead>
<tr>
<th class="Column1 negrita">Nro</th>
<th class="Column1 negrita">Descripción</th>
<th class="Column1 negrita">Tipo Indicador</th>
<th class="Column1 negrita">Valor Indicador</th>
<th class="Column1 negrita">Descripción Indicador</th>
<th class="Column1 negrita">Medio de Verificación</th>
<th class="Column1 negrita">Supuestos</th>
<th class="Column1 negrita">Acciones</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let acti of objetivoProAct; let i = index">
<ng-container
*ngIf="acti.uzytavobjetivo_programa_id_padre === item.uzytavobjetivo_programa_id">
<td>{{ i+1 }}</td>
<td>{{acti.uzytavobjetivo_programaobjetivo_proy}}</td>
<td>{{especificarValor(acti.uzytavobjetivo_programaindicador_tipo)}}</td>
<td>{{acti.uzytavobjetivo_programaindicador_valor}}</td>
<td>{{acti.uzytavobjetivo_programaindicador}}</td>
<td>{{acti.uzytavobjetivo_programamverifica}}</td>
<td>{{acti.uzytavobjetivo_programasupuestos}}</td>
<td>
<button>
<mat-icon color="warn"
(click)="eliminarActividad(item.uzytavobjetivo_programa_id)">delete</mat-icon>
</button>
</td>
</ng-container>
</tr>
</tbody>
</table>
</div>
</div>
</td>
</tr>
</ng-container>
</tbody>
</table>
</td>
</tr>
</ng-container>
</tbody>
</table>
</mat-card>
</div>
</div>
import { Component, OnInit, ElementRef, ViewChild } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { objetivoprograma } from 'src/app/modules/main/Models/objetivoPrograma';
import { Actualiza_datosService } from 'src/app/modules/main/services/actualiza_datos/actualiza_datos.service';
import { Compartir_idService } from 'src/app/modules/main/services/compartir_id/compartir_id.service';
......@@ -62,39 +62,39 @@ export class AddMatrizLogicoComponent implements OnInit {
ngOnInit(): void {
this.idRecuperado = parseInt(localStorage.getItem('proyectoId'), 10);
this.myForm = this.formBuilder.group({
fin: [],
tipoindiFin: [],
valorindicadorFin: [],
indicadorFin: [],
medioVeriFin: [],
supuestoFin: []
fin: ['', Validators.required],
tipoindiFin: ['', Validators.required],
valorindicadorFin: ['', Validators.required],
indicadorFin: ['', Validators.required],
medioVeriFin: ['', Validators.required],
supuestoFin: ['', Validators.required]
});
this.myForm2 = this.formBuilder.group({
objetivoG: [],
tipoindiObjG: [],
valorindicadorObjG: [],
indicadorObjG: [],
medioVeriObjG: [],
supuestoObjG: []
objetivoG: ['', Validators.required],
tipoindiObjG: ['', Validators.required],
valorindicadorObjG: ['', Validators.required],
indicadorObjG: ['', Validators.required],
medioVeriObjG: ['', Validators.required],
supuestoObjG: ['', Validators.required]
});
this.myForm3 = this.formBuilder.group({
objetivoEspe: [],
tipoindiObjEspe: [],
valorindicadorObjEspe: [],
indicadorObjEspe: [],
medioVeriObjEspe: [],
supuestoObjEspe: []
objetivoEspe: ['', Validators.required],
tipoindiObjEspe: ['', Validators.required],
valorindicadorObjEspe: ['', Validators.required],
indicadorObjEspe: ['', Validators.required],
medioVeriObjEspe: ['', Validators.required],
supuestoObjEspe: ['', Validators.required]
});
this.myForm4 = this.formBuilder.group({
actividadEspe: [],
tipoindiActi: [],
valorindicadorActi: [],
indicadorObjActi: [],
medioVeriActi: [],
supuestoActi: []
actividadEspe: ['', Validators.required],
tipoindiActi: ['', Validators.required],
valorindicadorActi: ['', Validators.required],
indicadorObjActi: ['', Validators.required],
medioVeriActi: ['', Validators.required],
supuestoActi: ['', Validators.required]
});
this.datosCompartidos.datos$.subscribe(() => {
......
......@@ -454,6 +454,31 @@
<!--Stepper version dos-->
</mat-expansion-panel>
<!--Calificación-->
<mat-expansion-panel hideToggle>
<mat-expansion-panel-header>
<mat-panel-title>
<strong>Calificación Comisión de Evaluación</strong>
</mat-panel-title>
</mat-expansion-panel-header>
<!--Resultados del proyecto-->
<mat-expansion-panel (opened)="contraccion = true"
(closed)="contraccion = false">
<mat-expansion-panel-header>
<mat-panel-title>
<mat-icon
[ngClass]="{'expanded': contraccion, 'collapsed': !contraccion}">keyboard_arrow_right</mat-icon>
1.- Calificación Comisión
</mat-panel-title>
</mat-expansion-panel-header>
<app-add-calificacion-vinculacion></app-add-calificacion-vinculacion>
<!--fin-->
</mat-expansion-panel>
</mat-expansion-panel>
<!--Seguimiento-->
<mat-expansion-panel hideToggle>
<mat-expansion-panel-header>
......@@ -511,19 +536,6 @@
<!--fin-->
</mat-expansion-panel>
<mat-expansion-panel (opened)="contraccion = true"
(closed)="contraccion = false">
<mat-expansion-panel-header>
<mat-panel-title>
<mat-icon
[ngClass]="{'expanded': contraccion, 'collapsed': !contraccion}">keyboard_arrow_right</mat-icon>
4.- Carta Compromiso Comunidad
</mat-panel-title>
</mat-expansion-panel-header>
<vex-carta-compromiso-comu></vex-carta-compromiso-comu>
<!--fin-->
</mat-expansion-panel>
</mat-expansion-panel>
<!--Ejecución-->
......
......@@ -18,3 +18,9 @@
.editor-separator {
margin-top: 15px;
}
.error-message {
color: red;
font-size: 14px;
margin-top: 5px;
}
......@@ -18,3 +18,9 @@
.editor-separator {
margin-top: 15px;
}
.error-message {
color: red;
font-size: 14px;
margin-top: 5px;
}
......@@ -6,7 +6,7 @@
<button mat-raised-button color="primary" *ngIf="!cambio"
(click)="cambiar()">Editar</button>
<button mat-raised-button color="primary" *ngIf="cambio"
(click)="onSubmit()">Guardar</button>
>Guardar</button>
<span class="separator"></span>
<button mat-raised-button color="warn" *ngIf="cambio"
(click)="cancelado()">Cancelar</button>
......@@ -19,6 +19,10 @@
<ckeditor formControlName="viabilidad" class="custom-ckeditor"
[disabled]="!isEditorEnabled" [style.height]="editorHeight"
[editor]="Editor"></ckeditor>
<div *ngIf="myForm.get('viabilidad').hasError('maxlength')"
class="error-message">
El contenido no puede exceder los 3000 caracteres.
</div>
</div>
<div class="editor-separator"></div>
<div>
......@@ -27,6 +31,10 @@
<ckeditor formControlName="perderia" class="custom-ckeditor"
[disabled]="!isEditorEnabled" [style.height]="editorHeight"
[editor]="Editor"></ckeditor>
<div *ngIf="myForm.get('perderia').hasError('maxlength')"
class="error-message">
El contenido no puede exceder los 3000 caracteres.
</div>
</div>
<div class="editor-separator"></div>
<div>
......@@ -35,6 +43,10 @@
<ckeditor formControlName="resultadoO" class="custom-ckeditor"
[disabled]="!isEditorEnabled" [style.height]="editorHeight"
[editor]="Editor"></ckeditor>
<div *ngIf="myForm.get('resultadoO').hasError('maxlength')"
class="error-message">
El contenido no puede exceder los 3000 caracteres.
</div>
</div>
</mat-card-content>
</mat-card>
......
......@@ -47,9 +47,9 @@ export class EditViabilidadComponent implements OnInit {
this.obtenerRegistros();
this.myForm = this.formBuilder.group({
viabilidad: [this.proyectos.uzytavproyec_viabilidad],
perderia: [this.proyectos.uzytavproyec_perderia],
resultadoO: [this.proyectos.uzytavproyec_resultados]
viabilidad: [this.proyectos.uzytavproyec_viabilidad,[Validators.required, Validators.maxLength(3000)]],
perderia: [this.proyectos.uzytavproyec_perderia,[Validators.required, Validators.maxLength(3000)]],
resultadoO: [this.proyectos.uzytavproyec_resultados,[Validators.required, Validators.maxLength(3000)]]
});
}
......
......@@ -26,8 +26,7 @@
<!--boton para agregar las fechas-->
<div class="save-button">
<button mat-raised-button color="primary"
[disabled]="!myForm.valid">Agregar
Fecha</button>
[disabled]="!myForm.valid">Asignar Comisión</button>
<span class="separator"></span>
</div>
<div class="separator2"></div>
......
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { AddImagenesComponent } from './add-imagenes.component';
describe('AddImagenesComponent', () => {
let component: AddImagenesComponent;
let fixture: ComponentFixture<AddImagenesComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ AddImagenesComponent ]
})
.compileComponents();
fixture = TestBed.createComponent(AddImagenesComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { MatDialog } from '@angular/material/dialog';
import { AnexosImagenes } from 'src/app/modules/main/Models/anexos-imagenes';
import { Actualiza_datosService } from 'src/app/modules/main/services/actualiza_datos/actualiza_datos.service';
import { ActualizarAnexosService } from 'src/app/modules/main/services/actualizar_anexos/actualizar-anexos.service';
import { AnexosImagenesService } from 'src/app/modules/main/services/anexos-imagenes/anexos-imagenes.service';
import { Compartir_idService } from 'src/app/modules/main/services/compartir_id/compartir_id.service';
import { EnvioFormularioComponent } from '../../../envio-formulario/envio-formulario.component';
@Component({
selector: 'vex-add-imagenes',
templateUrl: './add-imagenes.component.html',
styleUrls: ['./add-imagenes.component.css']
})
export class AddImagenesComponent implements OnInit {
idRecuperado: number;
myForm: FormGroup;
selectedFile: File | null = null;
file: File;
anexosImagenes: AnexosImagenes = {};
enviarSolicitud = false;
formularioEnviado: boolean
cambio: boolean;
constructor(
private formBuilder: FormBuilder,
private anexosImagenesService: AnexosImagenesService,
private dialog: MatDialog,
private actualizarAnexosService: ActualizarAnexosService,
private datosCompartidos: Actualiza_datosService,
private idCompartido: Compartir_idService,
) { }
ngOnInit(): void {
this.idRecuperado = this.idCompartido.getIdGuardado();
this.cambio = false;
this.myForm = this.formBuilder.group({
archivo: [{ value: '', disabled: true }, Validators.required]
});
}
onFileSelected(event: any) {
this.selectedFile = event.target.files[0];
}
onFileChange(event: any) {
// Obtener el archivo seleccionado
const fileList: FileList = event.target.files;
if (fileList.length > 0) {
this.file = fileList[0];
}
}
openModal() {
const dialogRef = this.dialog.open(EnvioFormularioComponent, {
disableClose: true
});
dialogRef.afterClosed().subscribe(result => {
this.formularioEnviado = true;
});
}
onSubmit() {
if (this.myForm.valid) {
this.anexosImagenes.uzytavproyec_id = this.idRecuperado;
this.anexosImagenesService.guardarParametrosSeparados(this.file, this.anexosImagenes).subscribe(
response => {
this.openModal();
this.guardar();
this.datosCompartidos.actualizarDatos(this.anexosImagenes);
this.actualizarAnexosService.actualizarDatos(this.file);
},
error => {
console.log(error)
//this.router.navigate(['main/Convocatorias']);
}
);
}
}
cambiar() {
this.cambio = true;
//this.myForm.get('fechaInicio').enable();
this.myForm.get('archivo').enable();
}
cancelado() {
this.cambio = false;
this.myForm.disable();
}
guardar() {
this.cambio = false;
this.myForm.disable();
this.myForm.reset()
}
}
.principal {
text-align: center;
margin-bottom: 2%;
}
.grid-container {
display: grid;
grid-template-columns: 5% 10% 45% 10% 5% 10% 15%;
border: 1px solid #ccc;
}
#cabecera {
background: linear-gradient(135deg,
var(--background-base) 22px,
var(--background-hover) 22px,
var(--background-hover) 24px,
transparent 24px,
transparent 67px,
var(--background-hover) 67px,
var(--background-hover) 69px,
transparent 69px),
linear-gradient(225deg,
var(--background-base) 22px,
var(--background-hover) 22px,
var(--background-hover) 24px,
transparent 24px,
transparent 67px,
var(--background-hover) 67px,
var(--background-hover) 69px,
transparent 69px) 0 64px;
background-color: var(--background-base);
background-size: 64px 128px;
}
.Column {
padding-left: 0px;
padding-right: 0px;
width: 100px;
white-space: inherit;
/* overflow: visible;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis; */
}
.Column1 {
padding-left: 0px;
padding-right: 0px;
width: 10px;
white-space: normal;
overflow: visible;
}
.Column2 {
width: 25px;
padding-left: 0px;
padding-right: 0px;
}
.volver{
position: absolute;
top: 50%;
right: 10px;
transform: translateY(-50%);
border-radius: 50%;
background-color: white;
display: flex;
color: rgb(71, 127, 75);
align-items: center;
justify-content: center;
padding: 0;
width: 32px;
height: 32px;
border: none;
outline: none;
cursor: pointer;
}
.grid-item {
font-weight: bold;
}
.grid-opciones {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
}
.titulo {
display: flex;
align-items: center;
justify-content: center;
}
.titulo-texto {
font-weight: bold;
font-size: 18px;
font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
margin-right: 10px;
}
.componente {
justify-content: center;
align-items: center;
}
.card {
background-color: rgb(252, 252, 251)
}
.colorEditar {
color: blue;
}
.colorEditar svg {
fill: blue;
}
.contenedorP {
width: 96%;
margin-left: 2%;
margin-right: 2%;
margin: 10px auto;
border-radius: 10px;
text-align: center;
margin-top: 10%;
background-color: white;
}
.contenedor:not(:last-child) {
margin-bottom: 2px;
}
.separador{
margin-top: 5%;
}
.contenedor {
width: 96%;
margin-left: 2%;
margin-right: 2%;
padding-bottom: 2%;
border-radius: 10px;
background-color: white;
position: relative;
z-index: 1;
}
.sobremontado {
position: relative;
align-items: center;
justify-content: center;
padding: 10px;
width: 96%;
top: -20px;
left: 2%;
background-color: rgb(71, 127, 75);
color: #fff;
text-align: center;
padding: 10px;
box-sizing: border-box;
margin-bottom: -50px;
z-index: 2;
border-radius: 10px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
}
.sobremontado span {
display: flex;
align-items: center;
justify-content: center;
margin: 0;
}
.sobremontado mat-icon {
margin-right: 5px;
}
.icono-instituciones {
display: flex;
align-items: center;
justify-content: center;
margin-right: 5px;
font-size: 20px;
cursor: pointer;
}
table {
width: 100%;
border-collapse: collapse;
margin-top: 20px;
font-family: 'Roboto', sans-serif;
color: #333;
}
table th,
table td {
padding: 12px;
text-align: left;
border-bottom: 1px solid #e0e0e0;
}
table th {
background-color: rgb(248, 249, 250);
font-weight: bold;
text-transform: uppercase;
}
table td {
position: relative;
}
table td::after {
content: "";
position: absolute;
bottom: -1px;
left: 0;
width: 100%;
height: 1px;
background-color: #e0e0e0;
}
input[type="text"] {
width: 200px;
padding: 8px;
border: 1px solid #ccc;
border-radius: 5px;
margin-left: 10px;
}
.area-busqueda {
padding: 20px;
margin-top: 30px;
text-align: right;
}
@media (max-width: 600px) {
table {
font-size: 14px;
}
table th,
table td {
padding: 8px;
}
}
.btn-observar {
border-radius: 50%;
width: 36px;
height: 36px;
}
.colorsito{
background-color: rgb(248, 249, 250);
}
.rounder{
border-radius: 50%;
background-color: rgb(71, 127, 75);
display: flex;
align-items: center;
justify-content: center;
padding: 0;
width: 15%;
height: 40px;
border: none;
outline: none;
cursor: pointer;
}
.rounder mat-icon {
font-size: 24px;
color: #fff;
}
@media (max-width: 768px) {
.rounder {
width: 30%;
}
}
@media (max-width: 480px) {
.rounder {
width: 40%;
}
}
.margen{
margin: 10px;
padding: 10px;
margin-bottom: 10px;
}
.bordes {
border-collapse: collapse;
width: 100%;
}
.bordes th,
.bordes td {
border: 1px solid black;
padding: 8px;
}
.bordes th {
background-color: #f5f5f5;
font-weight: bold;
}
.bordes td {
background-color: #ffffff;
}
.bordes tr:nth-child(even) {
background-color: #f9f9f9;
}
.bordes tr:hover {
background-color: #eaeaea;
}
.bordes th:last-child,
.bordes td:last-child {
border-bottom: none;
}
.rounder-nuevo {
border-radius: 50%;
background-color: rgb(71, 127, 75);
display: flex;
align-items: center;
justify-content: center;
padding: 0;
width: 36px;
height: 36px;
border: none;
outline: none;
cursor: pointer;
margin-left: 5px;
}
.white-icon {
color: white;
}
.btn{
padding: 0 2% 0 2%;
}
.azul {
color: blue;
}
.institution {
display: flex;
align-items: center;
}
.institution-name {
font-size: 20px;
/* Tamaño de fuente deseado */
font-weight: bold;
/* Opcional, para hacerlo más destacado */
margin-right: 30px;
/* Espacio entre el icono y el nombre */
}
.add-icon {
display: flex;
align-items: center;
justify-content: center;
width: 25px;
/* Ancho del círculo */
height: 25px;
/* Altura del círculo */
border-radius: 50%;
/* Para crear la forma de círculo */
background-color: white;
/* Color de fondo del círculo */
color: black;
/* Color del signo "+" en el círculo */
font-size: 25px;
/* Tamaño del signo "+" */
}
<div class="container">
<div class="mat-elevation-z8">
<table mat-table [dataSource]="dataSource" matSort>
<!-- Nro Column -->
<ng-container matColumnDef="Nro" class="Column1">
<th class="Column1 negrita" mat-header-cell *matHeaderCellDef
mat-sort-header> Nro </th>
<td class="Column1" mat-cell *matCellDef="let i = index"> {{ i+1 }}
</td>
</ng-container>
<!-- Dirección Column -->
<ng-container matColumnDef="Fecha Inicio" class="Column">
<th class="Column" mat-header-cell *matHeaderCellDef mat-sort-header> Fecha de Subida </th>
<td class="Column" mat-cell *matCellDef="let dato"> {{formatFecha(dato.uzytavanexospr_fech_subida)}} </td>
</ng-container>
<ng-container matColumnDef="Nombre" class="Column">
<th class="Column" mat-header-cell *matHeaderCellDef mat-sort-header> Nombre </th>
<td class="Column" mat-cell *matCellDef="let dato"> {{dato.uzytavanexospr_nombre}} </td>
</ng-container>
<ng-container matColumnDef="Acciones" class="Column">
<th class="Column" mat-header-cell *matHeaderCellDef mat-sort-header>Acciones</th>
<td class="Column" mat-cell *matCellDef="let dato">
<button class="btn" (click)="verImagen(dato.uzytavanexospr_id)">
<mat-icon aria-placeholder="Ver PDF">visibility</mat-icon>
</button>
<!--eliminar-->
<button>
<mat-icon color="warn"
(click)="eliminarParametro(dato.uzytavanexospr_id)">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>
</div>
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ListImagenesComponent } from './list-imagenes.component';
describe('ListImagenesComponent', () => {
let component: ListImagenesComponent;
let fixture: ComponentFixture<ListImagenesComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ ListImagenesComponent ]
})
.compileComponents();
fixture = TestBed.createComponent(ListImagenesComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
import { Component, OnInit } from '@angular/core';
import { MatTableDataSource } from '@angular/material/table';
import { AnexosImagenes } from 'src/app/modules/main/Models/anexos-imagenes';
import { Actualiza_datosService } from 'src/app/modules/main/services/actualiza_datos/actualiza_datos.service';
import { AnexosImagenesService } from 'src/app/modules/main/services/anexos-imagenes/anexos-imagenes.service';
import { Compartir_idService } from 'src/app/modules/main/services/compartir_id/compartir_id.service';
import { format } from 'date-fns';
@Component({
selector: 'vex-list-imagenes',
templateUrl: './list-imagenes.component.html',
styleUrls: ['./list-imagenes.component.css']
})
export class ListImagenesComponent implements OnInit {
idRecuperado: number;
dataSource: MatTableDataSource<AnexosImagenes>;
anexosImagenes: AnexosImagenes[] = [];
displayedColumns: string[] = ['Nro', 'Fecha Inicio', 'Nombre', 'Acciones'];
constructor(
private idCompartido: Compartir_idService,
private datosCompar: Actualiza_datosService,
private anexosImagenesService: AnexosImagenesService
) {
this.dataSource = new MatTableDataSource<AnexosImagenes>([]);
}
ngOnInit(): void {
this.idRecuperado = this.idCompartido.getIdGuardado();
this.datosCompar.datos$.subscribe(() => {
this.obtenerRegistros();
});
this.anexosImagenesService.parametrosActualizados.subscribe(() => {
this.obtenerRegistros();
});
}
obtenerRegistros() {
if (this.idRecuperado !== undefined) {
this.anexosImagenesService.obtenerParametros(this.idRecuperado).subscribe(data => {
this.anexosImagenes = data;
this.dataSource.data = this.anexosImagenes;
});
}
}
verImagen(id: number): void {
this.anexosImagenesService.verImagen(id).subscribe(response => {
const filename = this.getFilenameFromResponse(response); // Obtener el nombre del archivo desde la respuesta
const blob = new Blob([response.body], { type: 'image/jpeg' }); // Ajustar el tipo de contenido a 'image/jpeg' o el tipo adecuado para tu caso
const url = window.URL.createObjectURL(blob);
const newTab = window.open();
if (newTab) {
newTab.location.href = url;
} else {
window.open(url, '_blank');
}
});
}
getFilenameFromResponse(response: any): string {
const contentDispositionHeader = response.headers.get('content-disposition');
if (contentDispositionHeader) {
const matches = /filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/.exec(contentDispositionHeader);
if (matches != null && matches[1]) {
return matches[1].replace(/['"]/g, '');
}
}
return 'image.jpg'; // Nombre predeterminado si no se puede obtener el nombre del archivo
}
eliminarParametro(id: number) {
const confirmacion = confirm('¿Desea eliminar el registro?');
if (confirmacion) {
this.anexosImagenesService.eliminarParametros(id).subscribe(
() => {
console.log('El registro se ha eliminado');
this.obtenerRegistros();
},
(error) => {
// No mostrar el error en la consola
this.obtenerRegistros();
}
);
}
}
formatFecha(fecha: Date): string {
const dateObj = new Date(fecha);
return format(dateObj, 'dd-MM-yyyy');
}
}
.editor-separator{
margin-top: 4%;
}
.error-message {
color: red;
font-size: 14px;
margin-top: 5px;
}
......@@ -6,7 +6,7 @@
<button mat-raised-button color="primary" *ngIf="!cambio"
(click)="cambiar()">Editar</button>
<button mat-raised-button color="primary" *ngIf="cambio"
(click)="onSubmit()">Guardar</button>
>Guardar</button>
<span class="separator"></span>
<button mat-raised-button color="warn" *ngIf="cambio"
(click)="cancelado()">Cancelar</button>
......@@ -16,20 +16,29 @@
<div>
<label class="label-negrita"> Ubicación geográfica o área de intervención del programa:</label>
<angular-editor formControlName="ubicacion" [config]="editorConfig"></angular-editor>
<ckeditor formControlName="ubicacion" [style.height]="editorHeight" [disabled]="!isEditorEnabled" [editor]="Editor"></ckeditor>
<div *ngIf="myForm.get('ubicacion').hasError('maxlength')"
class="error-message">
El contenido no puede exceder los 3000 caracteres.
</div>
</div>
<div class="editor-separator"></div>
<div>
<label class="label-negrita"> Identificación, descripción y diagnóstico del problema que requiere solución:</label>
<angular-editor formControlName="problema" [config]="editorConfig"></angular-editor>
<ckeditor formControlName="problema" [style.height]="editorHeight" [disabled]="!isEditorEnabled" [editor]="Editor"></ckeditor>
<div *ngIf="myForm.get('problema').hasError('maxlength')"
class="error-message">
El contenido no puede exceder los 3000 caracteres.
</div>
</div>
<div class="editor-separator"></div>
<div>
<label class="label-negrita"> Línea base del programa:</label>
<angular-editor formControlName="base" [config]="editorConfig"></angular-editor>
<ckeditor formControlName="base" [style.height]="editorHeight" [disabled]="!isEditorEnabled" [editor]="Editor"></ckeditor>
<div *ngIf="myForm.get('base').hasError('maxlength')"
class="error-message">
El contenido no puede exceder los 3000 caracteres.
</div>
</div>
</mat-card-content>
......
import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { AngularEditorConfig } from '@kolkov/angular-editor';
import { Programa } from 'src/app/modules/main/Models/programa-v';
import { Compartir_idService } from 'src/app/modules/main/services/compartir_id/compartir_id.service';
import { ProgramaService } from 'src/app/modules/main/services/programa/programa.service';
import { EnvioFormularioComponent } from '../../envio-formulario/envio-formulario.component';
import { MatDialog } from '@angular/material/dialog';
import ClassicEditor from '../../../../Proyectos/ckeditor-custom/build/ckeditor';
@Component({
selector: 'vex-diagnostico',
......@@ -13,70 +14,46 @@ import { MatDialog } from '@angular/material/dialog';
styleUrls: ['./diagnostico.component.css']
})
export class DiagnosticoComponent implements OnInit {
public Editor = ClassicEditor;
editorHeight = '400px';
htmlContent: string = '';
idRecuperado: number;
myForm: FormGroup;
cambio: boolean;
isEditorEnabled = false;
formularioEnviado: boolean;
private programa: Programa = new Programa();
editorConfig: AngularEditorConfig = {
editable: false,
spellcheck: true,
height: '10rem',
minHeight: '5rem',
translate: 'yes',
enableToolbar: true,
showToolbar: true,
placeholder: 'Enter text here...',
defaultParagraphSeparator: '',
defaultFontName: '',
defaultFontSize: '',
fonts: [
{ class: 'arial', name: 'Arial' },
{ class: 'times-new-roman', name: 'Times New Roman' },
{ class: 'calibri', name: 'Calibri' },
{ class: 'comic-sans-ms', name: 'Comic Sans MS' }
],
customClasses: [
{
name: 'quote',
class: 'quote',
},
{
name: 'redText',
class: 'redText'
},
{
name: 'titleText',
class: 'titleText',
tag: 'h1',
},
]
};
constructor(private formBuilder: FormBuilder,
constructor(
private formBuilder: FormBuilder,
private programaService: ProgramaService,
private compartiId: Compartir_idService,
private dialog: MatDialog) { }
cambiar() {
this.cambio = true;
this.editorConfig.editable = true;
}
cancelado() {
this.cambio = false;
this.editorConfig.editable = false;
}
cambiar() {
this.cambio = true;
this.isEditorEnabled = true;
}
cancelado() {
this.cambio = false;
this.isEditorEnabled = false;
}
ngOnInit(): void {
this.idRecuperado = parseInt(localStorage.getItem('proyectoId'),10);
this.programa = new Programa();
this.obtenerRegistros();
this.myForm = this.formBuilder.group({
ubicacion: [this.programa.uzytavprograma_vubicacion],
problema: [this.programa.uzytavprograma_vdiagnostico],
base: [this.programa.uzytavprograma_vlinea_base]
ubicacion: [this.programa.uzytavprograma_vubicacion, [Validators.required, Validators.maxLength(3000)]],
problema: [this.programa.uzytavprograma_vdiagnostico, [Validators.required, Validators.maxLength(3000)]],
base: [this.programa.uzytavprograma_vlinea_base, [Validators.required, Validators.maxLength(3000)]]
});
}
onSubmit() {
if (this.myForm.valid) {
try {
......@@ -85,7 +62,7 @@ export class DiagnosticoComponent implements OnInit {
this.programa.uzytavprograma_vdiagnostico = this.myForm.get('problema').value;
this.programa.uzytavprograma_vlinea_base = this.myForm.get('base').value;
this.programaService.modificarParametros(id_recuperado, this.programa).subscribe(response => {
this.editorConfig.editable = false;
this.isEditorEnabled = false;
this.cambio = false;
this.openModal();
});
......@@ -101,7 +78,7 @@ export class DiagnosticoComponent implements OnInit {
this.programaService.obtenerParametrosId(id_recuperado).subscribe(data => {
this.programa = data;
this.myForm.patchValue({
resumen: this.programa.uzytavprograma_vresumen,
ubicacion: this.programa.uzytavprograma_vubicacion,
problema: this.programa.uzytavprograma_vdiagnostico,
base: this.programa.uzytavprograma_vlinea_base
});
......
.error-message {
color: red;
font-size: 14px;
margin-top: 5px;
}
......@@ -16,14 +16,24 @@
<div>
<label class="label-negrita"> Metas del Programa:</label>
<angular-editor formControlName="metas" [config]="editorConfig"></angular-editor>
<ckeditor formControlName="metas" class="custom-ckeditor"
[disabled]="!isEditorEnabled" [style.height]="editorHeight"
[editor]="Editor"></ckeditor>
<div *ngIf="myForm.get('metas').hasError('maxlength')"
class="error-message">
El contenido no puede exceder los 3000 caracteres.
</div>
</div>
<div>
<label class="label-negrita"> Políticas del Programa para la ejecución de Proyectos:</label>
<angular-editor formControlName="politica" [config]="editorConfig"></angular-editor>
<ckeditor formControlName="politica" class="custom-ckeditor"
[disabled]="!isEditorEnabled" [style.height]="editorHeight"
[editor]="Editor"></ckeditor>
<div *ngIf="myForm.get('politica').hasError('maxlength')"
class="error-message">
El contenido no puede exceder los 3000 caracteres.
</div>
</div>
</mat-card-content>
......
import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { AngularEditorConfig } from '@kolkov/angular-editor';
import { Programa } from 'src/app/modules/main/Models/programa-v';
import { Compartir_idService } from 'src/app/modules/main/services/compartir_id/compartir_id.service';
import { ProgramaService } from 'src/app/modules/main/services/programa/programa.service';
import ClassicEditor from '../../../Proyectos/ckeditor-custom/build/ckeditor';
import { MatDialog } from '@angular/material/dialog';
import { EnvioFormularioComponent } from '../envio-formulario/envio-formulario.component';
......@@ -14,45 +15,14 @@ import { EnvioFormularioComponent } from '../envio-formulario/envio-formulario.c
styleUrls: ['./estra-e.component.css']
})
export class EstraEComponent implements OnInit {
htmlContent: string = '';
public Editor = ClassicEditor;
myForm: FormGroup;
cambio: boolean;
idRecuperado: number;
formularioEnviado: boolean;
private programa: Programa = new Programa();
editorConfig: AngularEditorConfig = {
editable: false,
spellcheck: true,
height: '10rem',
minHeight: '5rem',
translate: 'yes',
enableToolbar: true,
showToolbar: true,
placeholder: 'Enter text here...',
defaultParagraphSeparator: '',
defaultFontName: '',
defaultFontSize: '',
fonts: [
{ class: 'arial', name: 'Arial' },
{ class: 'times-new-roman', name: 'Times New Roman' },
{ class: 'calibri', name: 'Calibri' },
{ class: 'comic-sans-ms', name: 'Comic Sans MS' }
],
customClasses: [
{
name: 'quote',
class: 'quote',
},
{
name: 'redText',
class: 'redText'
},
{
name: 'titleText',
class: 'titleText',
tag: 'h1',
},
]
};
editorHeight = '400px';
isEditorEnabled = false;
constructor(private formBuilder: FormBuilder,
private programaService: ProgramaService,
......@@ -61,31 +31,33 @@ export class EstraEComponent implements OnInit {
cambiar() {
this.cambio = true;
this.editorConfig.editable = true;
this.isEditorEnabled = true;
}
cancelado() {
this.cambio = false;
this.editorConfig.editable = false;
this.isEditorEnabled = false;
}
ngOnInit(): void {
this.idRecuperado = this.compartiId.getIdGuardado();
this.programa = new Programa();
this.obtenerRegistros();
this.myForm = this.formBuilder.group({
metas: [this.programa.uzytavprograma_vmetas],
politica: [this.programa.uzytavprograma_vpoliticas],
metas: [this.programa.uzytavprograma_vmetas,[Validators.required, Validators.maxLength(3000)]],
politica: [this.programa.uzytavprograma_vpoliticas,[Validators.required, Validators.maxLength(3000)]],
});
}
onSubmit() {
if (this.myForm.valid) {
try {
const id_recuperado = this.compartiId.getIdGuardado();
this.programa.uzytavprograma_vmetas = this.myForm.get('metas').value;
this.programa.uzytavprograma_vpoliticas = this.myForm.get('politica').value;
this.programaService.modificarParametros(id_recuperado, this.programa).subscribe(response => {
this.editorConfig.editable = false;
this.programaService.modificarParametros(this.idRecuperado, this.programa).subscribe(response => {
this.cambio = false;
this.isEditorEnabled = false;
this.openModal();
});
} catch (error) {
......@@ -95,9 +67,9 @@ export class EstraEComponent implements OnInit {
}
obtenerRegistros() {
const id_recuperado = this.compartiId.getIdGuardado();
if (typeof id_recuperado !== 'undefined') {
this.programaService.obtenerParametrosId(id_recuperado).subscribe(data => {
if (typeof this.idRecuperado !== 'undefined') {
this.programaService.obtenerParametrosId(this.idRecuperado).subscribe(data => {
this.programa = data;
this.myForm.patchValue({
metas: this.programa.uzytavprograma_vmetas,
......
......@@ -7,9 +7,6 @@
<mat-card-content>
<mat-card-actions class="button-container">
<button mat-raised-button color="primary" (click)="confirmarFinalizar()">Finalizar</button>
<button mat-icon-button color="warn" *ngIf="finalizado" (click)="generarPDF()">
<mat-icon>picture_as_pdf</mat-icon>
</button>
</mat-card-actions>
</mat-card-content>
</mat-card>
......
......@@ -13,11 +13,8 @@ export class FinalizarPComponent implements OnInit {
}
confirmarFinalizar() {
if (confirm('¿Estás seguro de que deseas finalizar?')) {
this.finalizado = true;
}
}
generarPDF() {
// Generrar el pedf con los datos ingresad
}
}
......@@ -6,7 +6,7 @@
<button mat-raised-button color="primary" *ngIf="!cambio"
(click)="cambiar()">Editar</button>
<button mat-raised-button color="primary" *ngIf="cambio"
(click)="onSubmit()">Guardar</button>
>Guardar</button>
<span class="separator"></span>
<button mat-raised-button color="warn" *ngIf="cambio"
(click)="cancelado()">Cancelar</button>
......@@ -16,8 +16,13 @@
<div>
<label class="label-negrita"> Resumen del Programa:</label>
<angular-editor formControlName="resumen" [config]="editorConfig"></angular-editor>
<ckeditor formControlName="resumen" class="custom-ckeditor"
[disabled]="!isEditorEnabled" [style.height]="editorHeight"
[editor]="Editor"></ckeditor>
<div *ngIf="myForm.get('resumen').hasError('maxlength')"
class="error-message">
El contenido no puede exceder los 3000 caracteres.
</div>
</div>
</mat-card-content>
......
import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { MatDialog } from '@angular/material/dialog';
import { AngularEditorConfig } from '@kolkov/angular-editor';
import { Programa } from 'src/app/modules/main/Models/programa-v';
......@@ -7,53 +7,21 @@ import { Compartir_idService } from 'src/app/modules/main/services/compartir_id/
import { MostrarOcultarService } from 'src/app/modules/main/services/mostrar-ocultar.service';
import { ProgramaService } from 'src/app/modules/main/services/programa/programa.service';
import { EnvioFormularioComponent } from '../../../envio-formulario/envio-formulario.component';
import ClassicEditor from '../../../../../Proyectos/ckeditor-custom/build/ckeditor';
@Component({
selector: 'vex-resumen-progra',
templateUrl: './resumen-progra.component.html',
styleUrls: ['./resumen-progra.component.css']
})
export class ResumenPrograComponent implements OnInit {
htmlContent: string = '';
public Editor = ClassicEditor;
myForm: FormGroup;
cambio: boolean;
idRecuperado: number;
formularioEnviado: boolean;
private programa: Programa = new Programa();
editorConfig: AngularEditorConfig = {
editable: false,
spellcheck: true,
height: '10rem',
minHeight: '5rem',
translate: 'yes',
enableToolbar: true,
showToolbar: true,
placeholder: 'Enter text here...',
defaultParagraphSeparator: '',
defaultFontName: '',
defaultFontSize: '',
fonts: [
{ class: 'arial', name: 'Arial' },
{ class: 'times-new-roman', name: 'Times New Roman' },
{ class: 'calibri', name: 'Calibri' },
{ class: 'comic-sans-ms', name: 'Comic Sans MS' }
],
customClasses: [
{
name: 'quote',
class: 'quote',
},
{
name: 'redText',
class: 'redText'
},
{
name: 'titleText',
class: 'titleText',
tag: 'h1',
},
]
};
editorHeight = '400px';
isEditorEnabled = false;
constructor(
private formBuilder: FormBuilder,
private programaService: ProgramaService,
......@@ -63,19 +31,21 @@ export class ResumenPrograComponent implements OnInit {
cambiar() {
this.cambio = true;
this.editorConfig.editable = true;
this.isEditorEnabled = true;
}
cancelado() {
this.cambio = false;
this.editorConfig.editable = false;
this.isEditorEnabled = false;
}
ngOnInit(): void {
this.idRecuperado = this.compartiId.getIdGuardado();
this.programa = new Programa();
this.obtenerRegistros();
this.myForm = this.formBuilder.group({
resumen: [this.programa.uzytavprograma_vresumen]
resumen: [this.programa.uzytavprograma_vresumen, [Validators.required, Validators.maxLength(3000)]]
});
}
......@@ -84,11 +54,11 @@ export class ResumenPrograComponent implements OnInit {
onSubmit() {
if (this.myForm.valid) {
try {
const id_recuperado = this.compartiId.getIdGuardado();
this.programa.uzytavprograma_vresumen = this.myForm.get('resumen').value;
this.programaService.modificarParametros(id_recuperado, this.programa).subscribe(response => {
this.editorConfig.editable = false;
this.programaService.modificarParametros(this.idRecuperado, this.programa).subscribe(response => {
this.cambio = false;
this.isEditorEnabled = false;
this.openModal();
});
} catch (error) {
......@@ -98,9 +68,8 @@ export class ResumenPrograComponent implements OnInit {
}
obtenerRegistros() {
const id_recuperado = this.compartiId.getIdGuardado();
if (typeof id_recuperado !== 'undefined') {
this.programaService.obtenerParametrosId(id_recuperado).subscribe(data => {
if (typeof this.idRecuperado !== 'undefined') {
this.programaService.obtenerParametrosId(this.idRecuperado).subscribe(data => {
this.programa = data;
this.myForm.patchValue({
resumen: this.programa.uzytavprograma_vresumen
......
......@@ -16,20 +16,35 @@
<div>
<label class="label-negrita"> Viabilidad Técnica:</label>
<angular-editor formControlName="viabilidad" [config]="editorConfig"></angular-editor>
<ckeditor formControlName="viabilidad" class="custom-ckeditor"
[disabled]="!isEditorEnabled" [style.height]="editorHeight"
[editor]="Editor"></ckeditor>
<div *ngIf="myForm.get('viabilidad').hasError('maxlength')"
class="error-message">
El contenido no puede exceder los 3000 caracteres.
</div>
</div>
<div>
<label class="label-negrita"> ¿Qué perderia el país si el programa no se ejecuta?:</label>
<angular-editor formControlName="perderia" [config]="editorConfig"></angular-editor>
<ckeditor formControlName="perderia" class="custom-ckeditor"
[disabled]="!isEditorEnabled" [style.height]="editorHeight"
[editor]="Editor"></ckeditor>
<div *ngIf="myForm.get('perderia').hasError('maxlength')"
class="error-message">
El contenido no puede exceder los 3000 caracteres.
</div>
</div>
<div>
<label class="label-negrita"> ¿Cuáles son los resultados o impactos esperados del programa?:</label>
<angular-editor formControlName="resultados" [config]="editorConfig"></angular-editor>
<ckeditor formControlName="resultados" class="custom-ckeditor"
[disabled]="!isEditorEnabled" [style.height]="editorHeight"
[editor]="Editor"></ckeditor>
<div *ngIf="myForm.get('resultados').hasError('maxlength')"
class="error-message">
El contenido no puede exceder los 3000 caracteres.
</div>
</div>
</mat-card-content>
......
import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { AngularEditorConfig } from '@kolkov/angular-editor';
import { Programa } from 'src/app/modules/main/Models/programa-v';
import { Compartir_idService } from 'src/app/modules/main/services/compartir_id/compartir_id.service';
import { ProgramaService } from 'src/app/modules/main/services/programa/programa.service';
import ClassicEditor from '../../../Proyectos/ckeditor-custom/build/ckeditor';
import { MatDialog } from '@angular/material/dialog';
import { EnvioFormularioComponent } from '../envio-formulario/envio-formulario.component';
......@@ -14,45 +14,14 @@ import { EnvioFormularioComponent } from '../envio-formulario/envio-formulario.c
styleUrls: ['./viabi-plan.component.css']
})
export class ViabiPlanComponent implements OnInit {
htmlContent: string = '';
public Editor = ClassicEditor;
myForm: FormGroup;
cambio: boolean;
idRecuperado: number;
formularioEnviado: boolean;
private programa: Programa = new Programa();
editorConfig: AngularEditorConfig = {
editable: false,
spellcheck: true,
height: '10rem',
minHeight: '5rem',
translate: 'yes',
enableToolbar: true,
showToolbar: true,
placeholder: 'Enter text here...',
defaultParagraphSeparator: '',
defaultFontName: '',
defaultFontSize: '',
fonts: [
{ class: 'arial', name: 'Arial' },
{ class: 'times-new-roman', name: 'Times New Roman' },
{ class: 'calibri', name: 'Calibri' },
{ class: 'comic-sans-ms', name: 'Comic Sans MS' }
],
customClasses: [
{
name: 'quote',
class: 'quote',
},
{
name: 'redText',
class: 'redText'
},
{
name: 'titleText',
class: 'titleText',
tag: 'h1',
},
]
};
editorHeight = '400px';
isEditorEnabled = false;
constructor(private formBuilder: FormBuilder,
private programaService: ProgramaService,
......@@ -61,21 +30,23 @@ export class ViabiPlanComponent implements OnInit {
cambiar() {
this.cambio = true;
this.editorConfig.editable = true;
this.isEditorEnabled = true;
}
cancelado() {
this.cambio = false;
this.editorConfig.editable = false;
this.isEditorEnabled = false;
}
ngOnInit(): void {
this.idRecuperado = this.compartiId.getIdGuardado();
this.programa = new Programa();
this.obtenerRegistros();
this.myForm = this.formBuilder.group({
viabilidad: [this.programa.uzytavprograma_vviabilidad_tecnica],
perderia: [this.programa.uzytavprograma_vperderia_no_ejecuta],
resultados: [this.programa.uzytavprograma_vresultados_impacto]
viabilidad: [this.programa.uzytavprograma_vviabilidad_tecnica,[Validators.required, Validators.maxLength(3000)]],
perderia: [this.programa.uzytavprograma_vperderia_no_ejecuta,[Validators.required, Validators.maxLength(3000)]],
resultados: [this.programa.uzytavprograma_vresultados_impacto,[Validators.required, Validators.maxLength(3000)]]
});
}
onSubmit() {
......@@ -86,8 +57,8 @@ export class ViabiPlanComponent implements OnInit {
this.programa.uzytavprograma_vperderia_no_ejecuta = this.myForm.get('perderia').value;
this.programa.uzytavprograma_vresultados_impacto = this.myForm.get('resultados').value;
this.programaService.modificarParametros(id_recuperado, this.programa).subscribe(response => {
this.editorConfig.editable = false;
this.cambio = false;
this.isEditorEnabled = false;
this.openModal();
});
} catch (error) {
......@@ -97,9 +68,8 @@ export class ViabiPlanComponent implements OnInit {
}
obtenerRegistros() {
const id_recuperado = this.compartiId.getIdGuardado();
if (typeof id_recuperado !== 'undefined') {
this.programaService.obtenerParametrosId(id_recuperado).subscribe(data => {
if (typeof this.idRecuperado !== 'undefined') {
this.programaService.obtenerParametrosId(this.idRecuperado).subscribe(data => {
this.programa = data;
this.myForm.patchValue({
viabilidad: this.programa.uzytavprograma_vviabilidad_tecnica,
......@@ -108,7 +78,7 @@ export class ViabiPlanComponent implements OnInit {
});
});
} else {
console.log('Este ingreso es un proyecto nuevo.');
}
}
......
......@@ -12,12 +12,12 @@ export class DatosEspeService {
parametrosActualizados: Subject<void> = new Subject<void>();
private idPDF: string; // Agregar una variable para almacenar el último ID guardado
private fileName: string; // Agregar una variable para almacenar el último ID guardado
private carrera = 'https://api-ufa-test.espe.edu.ec/api/v1.0/private/academico/carreras'
private getPDF = 'https://api-ufa-test.espe.edu.ec/api/v1.0/private/files/getFile'
private savePDF = 'https://api-ufa-test.espe.edu.ec/api/v1.0/private/files/saveFile'
private getPDF = 'https://api-ufa.espe.edu.ec/api/v1.0/private/files/getFile'
private savePDF = 'https://api-ufa.espe.edu.ec/api/v1.0/private/files/saveFile'
private getDepartamentos = 'https://api-ufa-test.espe.edu.ec/api/v1.0/private/departamental/departamentos'
private getCampus = 'https://api-ufa-test.espe.edu.ec/api/v1.0/private/academico/campus'
private apiUrl = 'https://api-ufa-test.espe.edu.ec/api/v1.0/private/Docente/informacionServidorP';
......@@ -69,10 +69,10 @@ export class DatosEspeService {
// Construir la URL con los parámetros
return `${this.getPDF}?uiidFile=${id}&filename=${nombre}`;
}
async saveDocument(formData: FormData): Promise<any> {
console.log("pdf", formData);
try {
const response: any = await this.http.post(this.savePDF, formData).toPromise();
this.idPDF = response.uuid;
......
/* tslint:disable:no-unused-variable */
import { TestBed, async, inject } from '@angular/core/testing';
import { CabEvalProyService } from './cab-eval-proy.service';
describe('Service: CabEvalProy', () => {
beforeEach(() => {
TestBed.configureTestingModule({
providers: [CabEvalProyService]
});
});
it('should ...', inject([CabEvalProyService], (service: CabEvalProyService) => {
expect(service).toBeTruthy();
}));
});
import { Injectable } from '@angular/core';
import { environment } from 'src/environments/environment';
import { HttpClient } from '@angular/common/http';
import { Observable, Subject } from 'rxjs';
import { CabeEvalProy } from '../../Models/cabevalp';
import { tap } from 'rxjs/operators';
@Injectable()
export class CabEvalProyService {
private readonly URL = environment.appApiUrl + '/cabevalp';
parametrosActualizados: Subject<void> = new Subject<void>();
private idCabEvalProy: number;
constructor(private httpClient: HttpClient) {}
//método para obtener los Parametross desde el backed, por lo que retorna un arreglo de tipo Parametros
obtenerParametros(): Observable<CabeEvalProy[]> {
return this.httpClient.get<CabeEvalProy[]>(`${this.URL+"/getAll"}`);
}
guardarParametros(parametros: CabeEvalProy):Observable<Object>{
return this.httpClient.post(`${this.URL+"/guardar"}`, parametros).pipe(
tap((response: any) => {
this.idCabEvalProy = response.uzytavcabevalp_id;
console.log("id cabecera evaluacion", this.idCabEvalProy) // Captura el ID devuelto por el servidor
})
);
}
/*
guardarParametros(parametros: Proyectos): Observable<any> {
return this.httpClient.post(`${this.URL}/guardar`, parametros).pipe(
tap((response: any) => {
this.idGuardado = response.uzytavproyec_id;
console.log("id servicio proyecto", this.idGuardado) // Captura el ID devuelto por el servidor
})
);
}
*/
modificarParametros(id: number, parametros: CabeEvalProy): Observable<any> {
return this.httpClient.put<any>(`${this.URL}/editar/${id}`, parametros)
}
eliminarParametros(id: number): Observable<any> {
return this.httpClient.delete(`${this.URL}/eliminar/${id}`, { responseType: 'text' });
}
obtenerId(): number {
console.log("id cabecera2 ",this.idCabEvalProy)
return this.idCabEvalProy;
}
}
/* tslint:disable:no-unused-variable */
import { TestBed, async, inject } from '@angular/core/testing';
import { EvaluacionProyectoService } from './evaluacion-proyecto.service';
describe('Service: EvaluacionProyecto', () => {
beforeEach(() => {
TestBed.configureTestingModule({
providers: [EvaluacionProyectoService]
});
});
it('should ...', inject([EvaluacionProyectoService], (service: EvaluacionProyectoService) => {
expect(service).toBeTruthy();
}));
});
import { Injectable } from '@angular/core';
import { environment } from 'src/environments/environment';
import { HttpClient } from '@angular/common/http';
import { Observable, Subject } from 'rxjs';
import { EvaluacionProy } from '../../Models/eval-proy';
@Injectable({
providedIn: 'root'
})
export class EvaluacionProyectoService {
private readonly URL = environment.appApiUrl + '/evalproy';
parametrosActualizados: Subject<void> = new Subject<void>();
constructor(private httpClient: HttpClient) {}
//método para obtener los Parametross desde el backed, por lo que retorna un arreglo de tipo Parametros
obtenerParametros(): Observable<EvaluacionProy[]> {
return this.httpClient.get<EvaluacionProy[]>(`${this.URL+"/getAll"}`);
}
guardarParametros(parametros: EvaluacionProy):Observable<Object>{
return this.httpClient.post(`${this.URL+"/guardar"}`, parametros)
}
modificarParametros(id: number, parametros: EvaluacionProy): Observable<any> {
return this.httpClient.put<any>(`${this.URL}/editar/${id}`, parametros)
}
eliminarParametros(id: number): Observable<any> {
return this.httpClient.delete(`${this.URL}/eliminar/${id}`, { responseType: 'text' });
}
}
import { HttpClient } from '@angular/common/http';
import { HttpClient, HttpResponse, HttpHeaders } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Observable, Subject } from 'rxjs';
import { environment } from 'src/environments/environment';
import { parametrosdet } from '../../Models/parametrosdet';
import { instproy } from '../../Models/instproy';
import { docompar } from '../../Models/docompar';
@Injectable({
providedIn: 'root'
......@@ -15,6 +16,10 @@ export class ParametrosdetService {
private readonly URL_INSTP = environment.appApiUrl + '/instproy';
private readonly URL_INSTP_RELA = environment.appApiUrl + '/instproy/obtenerRegistrosProyec';
private readonly URL_doc = environment.appApiUrl + '/docompar';
private getPDF = 'https://api-ufa.espe.edu.ec/api/v1.0/private/files/getFile'
constructor(private httpClient: HttpClient) { }
/*obtiene los registros que van en el radio button y en el select*/
......@@ -42,4 +47,31 @@ export class ParametrosdetService {
modificarParametros(id: number, parametros: instproy): Observable<any> {
return this.httpClient.put<any>(`${this.URL_INSTP}/editar/${id}`, parametros);
}
/*apis para poder guardar*/
guardarPDF(parametros: docompar){
return this.httpClient.post(this.URL_doc + '/guardar', parametros);
}
obtenerNombrePDF(): Observable<docompar[]> {
return this.httpClient.get<docompar[]>(`${this.URL_doc}/getAll`);
}
eliminarPDF(id: number): Observable<any> {
return this.httpClient.delete(`${this.URL_doc}/eliminar/${id}`, { responseType: 'text' });
}
verPDF(uiidFile: string, filename: string): Observable<HttpResponse<Blob>> {
const params = {
uiidFile,
filename
};
console.log("params",params)
return this.httpClient.get(`${this.getPDF}`, {
responseType: 'blob',
params,
observe: 'response', // Agregar esta opción para obtener la respuesta completa
headers: new HttpHeaders().append('Accept', 'application/pdf')
});
}
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment