feat(inscripcion-profesionales): agrega imagenes nro de trmite

andes · Mar 22, 2021 · 52b3334 · 52b3334
1 parent dbb33d5
commit 52b3334
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 9 deletions.
diff --git a/...components/profesional/inscripcion-profesionales/inscripcion-profesionales.component.html b/...components/profesional/inscripcion-profesionales/inscripcion-profesionales.component.html
@@ -1,12 +1,13 @@
 <plex-layout>
     <plex-layout-main>
-        <plex-title titulo="Inscripción para emision de certificados para vacunación COVID 19">
+        <plex-title titulo="Inscripción para emisión de certificados para vacunación COVID 19">
             <plex-button *ngIf="estaValidado" type="warning" (click)="resetForm()">
                 VOLVER</plex-button>
         </plex-title>
-        <plex-grid cols="3" size="xl">
-            <div></div>
-            <form #formInscripcion="ngForm">
+        <section justify="center">
+            <div class="w-100" *mobile="false">
+            </div>
+            <form class="w-100" #formInscripcion="ngForm">
                 <plex-wrapper *ngIf="!estaValidado">
                     <plex-text [(ngModel)]="profesional.documento" name="documento" label="Documento" required="true"
                                grow="full">
@@ -17,6 +18,17 @@
                     <plex-int [(ngModel)]="profesional.nroTramite" name="nroTramite" label="Número de Trámite del DNI"
                               required="true" grow="full">
                     </plex-int>
+                    <div>
+                        <a class="d-inline-block" href="javascript:void(0)" (click)="infoTramite()">
+                            <plex-icon name="{{ infoNroTramite ? 'chevron-down' : 'chevron-right' }}" type="info">
+                            </plex-icon>
+                            Consulta donde encontrar el número de trámite
+                        </a>
+                        <plex-grid cols="2" *ngIf="infoNroTramite">
+                            <img src="assets/img/andes-dni-frente.jpg">
+                            <img src="assets/img/andes-dni-dorso.jpg">
+                        </plex-grid>
+                    </div>
                     <div class="mt-3" grow="full" *ngIf="captchaEnabled">
                         <re-captcha [(ngModel)]=" profesional.recaptcha" name="recaptcha" (resolved)="resolved($event)">
                         </re-captcha>
@@ -29,9 +41,13 @@
                         VALIDAR</plex-button>
                 </plex-wrapper>
             </form>
-            <div></div>
-            <div></div>
-            <form #formValidado="ngForm">
+            <div class="w-100" *mobile="false">
+            </div>
+        </section>
+        <section justify="center">
+            <div class="w-100" *mobile="false">
+            </div>
+            <form class="w-100" #formValidado="ngForm">
                 <plex-wrapper *ngIf="estaValidado">
                     <plex-text [(ngModel)]="profesional.nombreCompleto" name="nombreCompleto" label="Apellido y Nombre"
                                readonly="true" grow="full">
@@ -79,7 +95,8 @@
                     </div>
                 </plex-wrapper>
             </form>
-            <div></div>
-        </plex-grid>
+            <div class="w-100" *mobile="false">
+            </div>
+        </section>
     </plex-layout-main>
 </plex-layout>
diff --git a/...p/components/profesional/inscripcion-profesionales/inscripcion-profesionales.component.ts b/...p/components/profesional/inscripcion-profesionales/inscripcion-profesionales.component.ts
@@ -22,6 +22,7 @@ export class InscripcionProfesionalesComponent implements OnInit {
   public enProceso = false;
   public token = '';
   public captchaEnabled = true;
+  public infoNroTramite = false;
   public profesional = {
     id: '',
     documento: '',
@@ -235,4 +236,8 @@ export class InscripcionProfesionalesComponent implements OnInit {
   renovarMatricula() {
     this.router.navigate(['matriculaciones']);
   }
+
+  infoTramite() {
+    this.infoNroTramite = !this.infoNroTramite;
+  }
 }