RUP - Registro en rup para colposcopia

src/app/modules/rup/components/elementos/colposcopia.component.html

@@ -0,0 +1,56 @@
+<ng-container *ngIf="!soloValores">
+    <form #formColposcopia="ngForm">
+        <plex-select label='Colposcopia' [(ngModel)]="colposcopiaRegistro.colposcopia" name="colposcopia1"
+                     [data]="colposcopia" (change)="onChange()">
+        </plex-select>
+        <plex-text [(ngModel)]="colposcopiaRegistro.detalle" label="Detalle colposcopia" name="detalle" multiline="true"
+                   grow="full" (change)="onChange()">
+        </plex-text>
+        <plex-select label='Visibilidad de la unión escamocolumnar' [(ngModel)]="colposcopiaRegistro.visibilidadUEC"
+                     name="visibilidadUEC" [data]="visibilidadUEC" (change)="onChange()">
+        </plex-select>
+        <plex-radio [(ngModel)]="colposcopiaRegistro.zona" label="Zona de transformación" [data]="zonaTransformacion"
+                    name="zona" (change)="onChange()">
+        </plex-radio>
+        <plex-select label='Hallazgos colposcopicos' [(ngModel)]="colposcopiaRegistro.hallazgos" name="hallazgos"
+                     [data]="hallazgos" (change)="onChange()">
+        </plex-select>
+        <hr>
+        <plex-wrapper>
+            <plex-bool type="checkbox" label="¿Se toma biopsia?" [(ngModel)]="colposcopiaRegistro.biopsia"
+                       name="biopsia" (change)="onChange()">
+            </plex-bool>
+            <plex-text *ngIf="colposcopiaRegistro.biopsia" [(ngModel)]="colposcopiaRegistro.descripcionBiopsia"
+                       label="Descripción Biopsia" name="biopsiaDescripcion" multiline="true" grow="full" (change)="onChange()">
+            </plex-text>
+        </plex-wrapper>
+        <plex-bool type="checkbox" label="¿Se evalua conducto endocervical?"
+                   [(ngModel)]="colposcopiaRegistro.evaluacionEndocervical" name="evaluacionEndocervical" (change)="onChange()">
+        </plex-bool>
+        <plex-radio label="Test de Schiller" [(ngModel)]="colposcopiaRegistro.testSchiller" name="testSchiller"
+                    [data]="testSchiller" (change)="onChange()">
+        </plex-radio>
+    </form>
+</ng-container>
+<div *ngIf="soloValores">
+    <plex-label [tituloBold]="true" titulo="Colposcopia {{registro.valor.colposcopia?.colposcopia?.nombre }}"
+                subtitulo="{{ registro.valor.colposcopia?.detalle}}"></plex-label>
+    <plex-badge *ngIf="registro.valor.colposcopia?.zona" type="info" hintIcon="informacion">Zona Transformación
+        {{registro.valor.colposcopia.zona}}</plex-badge>
+    <plex-badge *ngIf="registro.valor.colposcopia.hallazgos"
+                type="info">{{registro.valor.colposcopia?.hallazgos?.nombre}}
+    </plex-badge>
+    <plex-badge *ngIf="registro.valor.colposcopia.visibilidadUEC" type="info"> UEC
+        {{registro.valor.colposcopia.visibilidadUEC.nombre}}
+    </plex-badge>
+    <plex-badge *ngIf="registro.valor.colposcopia.biopsia" type="info"> Se toma biopsia
+    </plex-badge>
+    <plex-badge *ngIf="!registro.valor.colposcopia.biopsia" type="info"> No toma biopsia
+    </plex-badge>
+    <plex-badge *ngIf="registro.valor.colposcopia.testSchiller" type="info">Test Schiller positivo
+    </plex-badge>
+    <plex-badge *ngIf="!registro.valor.colposcopia.testSchiller" type="info"> Test Schiller negativo
+    </plex-badge>
+    <plex-badge *ngIf="registro.valor.colposcopia.evaluacionEndocervical" type="info">Conducto endocervical evaluado
+    </plex-badge>
+</div>

src/app/modules/rup/components/elementos/colposcopia.component.ts

@@ -0,0 +1,67 @@
+import { Component, OnInit } from '@angular/core';
+import { RupElement } from '.';
+import { RUPComponent } from '../core/rup.component';
+import { Unsubscribe } from '@andes/shared';
+
+@Component({
+    selector: 'app-colposcopia', templateUrl: './colposcopia.component.html'
+}
+)
+@RupElement('ColposcopiaComponent')
+
+export class ColposcopiaComponent extends RUPComponent implements OnInit {
+    public colposcopiaRegistro: any =
+    {
+        colposcopia: null,
+        detalle: null,
+        visibilidadUEC: null,
+        zona: null,
+        hallazgos: null,
+        biopsia: null,
+        descripcionBiopsia: null,
+        evaluacionEndocervical: null,
+        testSchiller: null
+    };
+
+    @Unsubscribe()
+    ngOnInit() {
+        if (!this.registro.valor) {
+            this.registro.valor = {};
+        }
+        if (!this.registro.valor.colposcopia) {
+            this.registro.valor.colposcopia = { ...this.colposcopiaRegistro };
+        } else {
+            this.colposcopiaRegistro = { ...this.colposcopiaRegistro, ...this.registro.valor.colposcopia };
+        }
+    }
+
+    onChange() {
+        // Sincronizamos el valor con el registro
+        if (!this.registro.valor) {
+            this.registro.valor = {};
+        }
+        this.registro.valor.colposcopia = { ...this.colposcopiaRegistro };
+        this.emitChange();
+    }
+
+    public colposcopia = [
+        { id: 'adecuada', nombre: 'adecuada' },
+        { id: 'inadecuada', nombre: 'inadecuada' }
+    ];
+    public visibilidadUEC = [
+        { id: 'completamenteV', nombre: 'completamente visible' },
+        { id: 'parcialmeteV', nombre: 'parcialmente visible' },
+        { id: 'noVisible', nombre: 'no visible' }
+
+    ];
+    public zonaTransformacion = [{ id: '1', label: '1' }, { id: '2', label: '2' }, { id: '3', label: '3' }];
+    public hallazgos = [
+        { id: 'normal', nombre: 'normal' },
+        { id: 'grado 1', nombre: 'grado 1' },
+        { id: 'grado 2', nombre: 'grado 2' },
+        { id: 'sospechaInvasion', nombre: 'sospecha invasión' },
+        { id: 'hallazgosVarios', nombre: 'hallazgos varios' }];
+    public testSchiller = [{ id: 'positivo', label: 'positivo' }, { id: 'negativo', label: 'negativo' }];
+
+
+}

src/app/modules/rup/elementos-rup.module.ts

@@ -75,6 +75,7 @@ import { SemanticClassPipe } from './pipes/semantic-class.pipes';
 import { SemanticIconPipe } from './pipes/semantic-icon.pipes';
 import { RUPSoloValorPipe } from './pipes/elemento-rup-valor.pipes';
 import { DirectiveLibModule } from '../../directives/directives.module';
+import { ColposcopiaComponent } from './components/elementos/colposcopia.component';
 
 const RUPComponentsArray = [
     RUPComponent,
@@ -159,7 +160,8 @@ const RUPComponentsArray = [
         SemanticClassPipe,
         ElementoRUPByIdPipes,
         RUPSoloValorPipe,
-        RUPMedicamentosBusquedaDetalleComponent
+        RUPMedicamentosBusquedaDetalleComponent,
+        ColposcopiaComponent
     ],
     entryComponents: [
         ...RUPComponentsArray