metag-sdk-ionic 1.2.7-dev-0.58 → 1.2.7-dev-0.60

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/dist/src/app/pages/id-vision/components/camara-video-selfie/camara-video-selfie.component.js +405 -405
  2. package/dist/src/app/pages/id-vision/components/direct-photo-selfie/direct-photo-selfie.component.d.ts +37 -37
  3. package/dist/src/app/pages/id-vision/components/direct-photo-selfie/direct-photo-selfie.component.js +204 -204
  4. package/dist/src/app/pages/id-vision/components/photo-selfie-camera/photo-selfie-camera.component.d.ts +48 -48
  5. package/dist/src/app/pages/id-vision/components/photo-selfie-camera/photo-selfie-camera.component.js +261 -261
  6. package/dist/src/app/pages/id-vision/components/simple-acuerdo-video/simple-acuerdo-video.component.js +480 -480
  7. package/dist/src/app/pages/id-vision/id-vision.component.d.ts +122 -122
  8. package/dist/src/app/pages/id-vision/id-vision.component.js +1414 -1409
  9. package/dist/src/app/pages/id-vision/id-vision.component.js.map +1 -1
  10. package/dist/src/app/pages/id-vision/services/modal-services/sdk-communication-services.js +21 -21
  11. package/package.json +1 -1
package/dist/src/app/pages/id-vision/id-vision.component.js CHANGED
@@ -1,1410 +1,1415 @@
1
- import { CommonModule } from '@angular/common';
2
- import { HttpClientModule } from '@angular/common/http';
3
- import { Component, CUSTOM_ELEMENTS_SCHEMA, Input, signal, ViewChild, ElementRef, ViewEncapsulation, } from '@angular/core';
4
- import { IonicModule } from '@ionic/angular';
5
- import { Clipboard } from '@capacitor/clipboard';
6
- import { CameraWithOverlayComponent } from './components/camera-with-overlay/camera-with-overlay.component';
7
- import { CamaraVideoSelfieComponent } from './components/camara-video-selfie/camara-video-selfie.component';
8
- import { PhotoSelfieCameraComponent } from './components/photo-selfie-camera/photo-selfie-camera.component';
9
- import { CamaraAcuerdoVideoComponent } from './components/camara-acuerdo-video/camara-acuerdo.video.component';
10
- import { SimpleAcuerdoVideoComponent } from './components/simple-acuerdo-video/simple-acuerdo-video.component';
11
- import { App } from '@capacitor/app';
12
- import { ConfigurationService } from './services/configuration/configuration.service';
13
- import { ValidationService } from './services/validation/validation.service';
14
- import { NavigationService } from './services/navigation/navigation.service';
15
- import { ProcessingService } from './services/processing/processing.service';
16
- import { DpiService } from './services/dpi/dpi-service.service';
17
- import { register } from './../../../swiper-wrapper';
18
- import { DirectPhotoSelfieComponent } from './components/direct-photo-selfie/direct-photo-selfie.component';
19
- import * as i0 from "@angular/core";
20
- import * as i1 from "@ionic/angular";
21
- import * as i2 from "./services/modal-services/modal-dpi-services";
22
- import * as i3 from "./services/modal-services/sdk-communication-services";
23
- import * as i4 from "./services/configuration/configuration.service";
24
- import * as i5 from "./services/validation/validation.service";
25
- import * as i6 from "./services/navigation/navigation.service";
26
- import * as i7 from "./services/processing/processing.service";
27
- import * as i8 from "./services/dpi/dpi-service.service";
28
- import * as i9 from "@angular/common";
29
- const _c0 = ["dpi"];
30
- const _c1 = ["swiperContainer"];
31
- const _c2 = a0 => ({ "content-simple-process": a0 });
32
- const _c3 = a0 => ({ "blur-effect": a0 });
33
- function IdVisionComponent_swiper_container_1_swiper_slide_2_Template(rf, ctx) { if (rf & 1) {
34
- const _r2 = i0.ɵɵgetCurrentView();
35
- i0.ɵɵelementStart(0, "swiper-slide")(1, "div", 19)(2, "div", 20)(3, "h2", 21);
36
- i0.ɵɵtext(4, "Verifiquemos tu identidad");
37
- i0.ɵɵelementEnd();
38
- i0.ɵɵelementStart(5, "p", 22);
39
- i0.ɵɵtext(6, "Para completar tu verificaci\u00F3n, por favor ingresa tu n\u00FAmero de identificaci\u00F3n (DPI).");
40
- i0.ɵɵelementEnd();
41
- i0.ɵɵelementStart(7, "ion-item", 23);
42
- i0.ɵɵelement(8, "ion-input", 24, 1);
43
- i0.ɵɵelementEnd()();
44
- i0.ɵɵelementStart(10, "ion-grid", 25)(11, "ion-row")(12, "div", 26);
45
- i0.ɵɵelement(13, "img", 27);
46
- i0.ɵɵelementEnd();
47
- i0.ɵɵelementStart(14, "div", 28)(15, "p", 29);
48
- i0.ɵɵtext(16, "Sube fotos de documentos que prueben tu identidad");
49
- i0.ɵɵelementEnd()()();
50
- i0.ɵɵelementStart(17, "ion-row")(18, "div", 26);
51
- i0.ɵɵelement(19, "img", 30);
52
- i0.ɵɵelementEnd();
53
- i0.ɵɵelementStart(20, "div", 28)(21, "p", 29);
54
- i0.ɵɵtext(22, "Graba un video selfie, mant\u00E9n tu rostro centrado en la pantalla y evita moverte.");
55
- i0.ɵɵelementEnd()()()();
56
- i0.ɵɵelementStart(23, "div", 31)(24, "ion-button", 18);
57
- i0.ɵɵlistener("click", function IdVisionComponent_swiper_container_1_swiper_slide_2_Template_ion_button_click_24_listener() { i0.ɵɵrestoreView(_r2); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.handleClick()); });
58
- i0.ɵɵtext(25, "Empecemos");
59
- i0.ɵɵelementEnd()()()();
60
- } }
61
- function IdVisionComponent_swiper_container_1_swiper_slide_3_div_2_Template(rf, ctx) { if (rf & 1) {
62
- const _r4 = i0.ɵɵgetCurrentView();
63
- i0.ɵɵelementStart(0, "div", 36)(1, "div", 20)(2, "h2", 21);
64
- i0.ɵɵtext(3, "Acuerdo de v\u00EDdeo");
65
- i0.ɵɵelementEnd();
66
- i0.ɵɵelementStart(4, "p", 29);
67
- i0.ɵɵtext(5, "Graba un breve video para completar tu proceso de identificaci\u00F3n.");
68
- i0.ɵɵelementEnd()();
69
- i0.ɵɵelementStart(6, "ion-grid", 25)(7, "ion-row")(8, "div", 26);
70
- i0.ɵɵelement(9, "img", 37);
71
- i0.ɵɵelementEnd();
72
- i0.ɵɵelementStart(10, "div", 28)(11, "p");
73
- i0.ɵɵtext(12, "Si est\u00E1s en interiores, aseg\u00FArate de que la luz est\u00E9 frente a ti, no detr\u00E1s.");
74
- i0.ɵɵelementEnd()()();
75
- i0.ɵɵelementStart(13, "ion-row")(14, "div", 26);
76
- i0.ɵɵelement(15, "img", 30);
77
- i0.ɵɵelementEnd();
78
- i0.ɵɵelementStart(16, "div", 28)(17, "p");
79
- i0.ɵɵtext(18, "Aseg\u00FArate de que tu rostro sea visible y de no usar anteojos ni sombreros.");
80
- i0.ɵɵelementEnd()()()();
81
- i0.ɵɵelementStart(19, "div", 31)(20, "ion-button", 18);
82
- i0.ɵɵlistener("click", function IdVisionComponent_swiper_container_1_swiper_slide_3_div_2_Template_ion_button_click_20_listener() { i0.ɵɵrestoreView(_r4); const step_r5 = i0.ɵɵnextContext().$implicit; return i0.ɵɵresetView(step_r5.action()); });
83
- i0.ɵɵtext(21, "Abrir la c\u00E1mara");
84
- i0.ɵɵelementEnd()()();
85
- } if (rf & 2) {
86
- const ctx_r2 = i0.ɵɵnextContext(3);
87
- i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(1, _c3, ctx_r2.simpleProcess));
88
- } }
89
- function IdVisionComponent_swiper_container_1_swiper_slide_3_div_3_Template(rf, ctx) { if (rf & 1) {
90
- const _r6 = i0.ɵɵgetCurrentView();
91
- i0.ɵɵelementStart(0, "div")(1, "div", 20)(2, "h2", 21);
92
- i0.ɵɵtext(3, "Coloca la parte frontal de tu DPI");
93
- i0.ɵɵelementEnd();
94
- i0.ɵɵelementStart(4, "p", 38);
95
- i0.ɵɵtext(5, "Evita sombras, reflejos y coloca tu documento dentro del recuadro.");
96
- i0.ɵɵelementEnd()();
97
- i0.ɵɵelementStart(6, "div", 39);
98
- i0.ɵɵelement(7, "img", 40);
99
- i0.ɵɵelementEnd();
100
- i0.ɵɵelementStart(8, "div", 31)(9, "ion-button", 18);
101
- i0.ɵɵlistener("click", function IdVisionComponent_swiper_container_1_swiper_slide_3_div_3_Template_ion_button_click_9_listener() { i0.ɵɵrestoreView(_r6); const step_r5 = i0.ɵɵnextContext().$implicit; return i0.ɵɵresetView(step_r5.action()); });
102
- i0.ɵɵtext(10, "Tomar una foto");
103
- i0.ɵɵelementEnd()()();
104
- } }
105
- function IdVisionComponent_swiper_container_1_swiper_slide_3_div_4_Template(rf, ctx) { if (rf & 1) {
106
- const _r7 = i0.ɵɵgetCurrentView();
107
- i0.ɵɵelementStart(0, "div")(1, "div", 20)(2, "h2", 21);
108
- i0.ɵɵtext(3, "Coloca el reverso de tu DPI");
109
- i0.ɵɵelementEnd();
110
- i0.ɵɵelementStart(4, "p", 38);
111
- i0.ɵɵtext(5, "Evita sombras, reflejos y coloca tu documento dentro del recuadro.");
112
- i0.ɵɵelementEnd()();
113
- i0.ɵɵelementStart(6, "div", 39);
114
- i0.ɵɵelement(7, "img", 41);
115
- i0.ɵɵelementEnd();
116
- i0.ɵɵelementStart(8, "div", 31)(9, "ion-button", 18);
117
- i0.ɵɵlistener("click", function IdVisionComponent_swiper_container_1_swiper_slide_3_div_4_Template_ion_button_click_9_listener() { i0.ɵɵrestoreView(_r7); const step_r5 = i0.ɵɵnextContext().$implicit; return i0.ɵɵresetView(step_r5.action()); });
118
- i0.ɵɵtext(10, "Tomar una foto");
119
- i0.ɵɵelementEnd()()();
120
- } }
121
- function IdVisionComponent_swiper_container_1_swiper_slide_3_div_5_Template(rf, ctx) { if (rf & 1) {
122
- const _r8 = i0.ɵɵgetCurrentView();
123
- i0.ɵɵelementStart(0, "div")(1, "div", 20)(2, "h2", 21);
124
- i0.ɵɵtext(3, "Video Selfie");
125
- i0.ɵɵelementEnd();
126
- i0.ɵɵelementStart(4, "p", 22);
127
- i0.ɵɵtext(5, "Graba un breve video para completar tu proceso de identificaci\u00F3n.");
128
- i0.ɵɵelementEnd()();
129
- i0.ɵɵelementStart(6, "ion-grid", 25)(7, "ion-row")(8, "ion-row")(9, "div", 26);
130
- i0.ɵɵelement(10, "img", 37);
131
- i0.ɵɵelementEnd();
132
- i0.ɵɵelementStart(11, "div", 28)(12, "p", 29);
133
- i0.ɵɵtext(13, "Si est\u00E1s en interiores, aseg\u00FArate de que la luz est\u00E9 frente a ti, no detr\u00E1s.");
134
- i0.ɵɵelementEnd()()();
135
- i0.ɵɵelementStart(14, "ion-row")(15, "div", 26);
136
- i0.ɵɵelement(16, "img", 30);
137
- i0.ɵɵelementEnd();
138
- i0.ɵɵelementStart(17, "div", 28)(18, "p", 29);
139
- i0.ɵɵtext(19, "Aseg\u00FArate de que tu rostro sea visible y de no usar anteojos ni sombreros.");
140
- i0.ɵɵelementEnd()()()()();
141
- i0.ɵɵelementStart(20, "div", 31)(21, "ion-button", 18);
142
- i0.ɵɵlistener("click", function IdVisionComponent_swiper_container_1_swiper_slide_3_div_5_Template_ion_button_click_21_listener() { i0.ɵɵrestoreView(_r8); const step_r5 = i0.ɵɵnextContext().$implicit; return i0.ɵɵresetView(step_r5.action()); });
143
- i0.ɵɵtext(22, "Abrir la c\u00E1mara");
144
- i0.ɵɵelementEnd()()();
145
- } }
146
- function IdVisionComponent_swiper_container_1_swiper_slide_3_div_6_Template(rf, ctx) { if (rf & 1) {
147
- const _r9 = i0.ɵɵgetCurrentView();
148
- i0.ɵɵelementStart(0, "div")(1, "div", 20)(2, "h2", 21);
149
- i0.ɵɵtext(3, "Foto Selfie");
150
- i0.ɵɵelementEnd();
151
- i0.ɵɵelementStart(4, "p", 29);
152
- i0.ɵɵtext(5, "Toma una foto para completar tu proceso de identificaci\u00F3n.");
153
- i0.ɵɵelementEnd()();
154
- i0.ɵɵelementStart(6, "ion-grid", 25)(7, "ion-row")(8, "ion-row")(9, "div", 26);
155
- i0.ɵɵelement(10, "img", 37);
156
- i0.ɵɵelementEnd();
157
- i0.ɵɵelementStart(11, "div", 28)(12, "p");
158
- i0.ɵɵtext(13, "Si est\u00E1s en interiores, aseg\u00FArate de que la luz est\u00E9 frente a ti, no detr\u00E1s.");
159
- i0.ɵɵelementEnd()()();
160
- i0.ɵɵelementStart(14, "ion-row")(15, "div", 26);
161
- i0.ɵɵelement(16, "img", 30);
162
- i0.ɵɵelementEnd();
163
- i0.ɵɵelementStart(17, "div", 28)(18, "p");
164
- i0.ɵɵtext(19, "Aseg\u00FArate de que tu rostro sea visible y de no usar anteojos ni sombreros.");
165
- i0.ɵɵelementEnd()()()()();
166
- i0.ɵɵelementStart(20, "div", 31)(21, "ion-button", 18);
167
- i0.ɵɵlistener("click", function IdVisionComponent_swiper_container_1_swiper_slide_3_div_6_Template_ion_button_click_21_listener() { i0.ɵɵrestoreView(_r9); const step_r5 = i0.ɵɵnextContext().$implicit; return i0.ɵɵresetView(step_r5.action()); });
168
- i0.ɵɵtext(22, "Abrir la c\u00E1mara");
169
- i0.ɵɵelementEnd()()();
170
- } }
171
- function IdVisionComponent_swiper_container_1_swiper_slide_3_div_7_Template(rf, ctx) { if (rf & 1) {
172
- i0.ɵɵelementStart(0, "div")(1, "h2");
173
- i0.ɵɵtext(2, "Paso desconocido");
174
- i0.ɵɵelementEnd()();
175
- } }
176
- function IdVisionComponent_swiper_container_1_swiper_slide_3_Template(rf, ctx) { if (rf & 1) {
177
- i0.ɵɵelementStart(0, "swiper-slide")(1, "div", 32);
178
- i0.ɵɵtemplate(2, IdVisionComponent_swiper_container_1_swiper_slide_3_div_2_Template, 22, 3, "div", 33)(3, IdVisionComponent_swiper_container_1_swiper_slide_3_div_3_Template, 11, 0, "div", 34)(4, IdVisionComponent_swiper_container_1_swiper_slide_3_div_4_Template, 11, 0, "div", 34)(5, IdVisionComponent_swiper_container_1_swiper_slide_3_div_5_Template, 23, 0, "div", 34)(6, IdVisionComponent_swiper_container_1_swiper_slide_3_div_6_Template, 23, 0, "div", 34)(7, IdVisionComponent_swiper_container_1_swiper_slide_3_div_7_Template, 3, 0, "div", 35);
179
- i0.ɵɵelementEnd()();
180
- } if (rf & 2) {
181
- const step_r5 = ctx.$implicit;
182
- const ctx_r2 = i0.ɵɵnextContext(2);
183
- i0.ɵɵadvance();
184
- i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(7, _c2, ctx_r2.simpleProcess))("ngSwitch", step_r5.type);
185
- i0.ɵɵadvance();
186
- i0.ɵɵproperty("ngSwitchCase", 1);
187
- i0.ɵɵadvance();
188
- i0.ɵɵproperty("ngSwitchCase", 2);
189
- i0.ɵɵadvance();
190
- i0.ɵɵproperty("ngSwitchCase", 3);
191
- i0.ɵɵadvance();
192
- i0.ɵɵproperty("ngSwitchCase", 4);
193
- i0.ɵɵadvance();
194
- i0.ɵɵproperty("ngSwitchCase", 5);
195
- } }
196
- function IdVisionComponent_swiper_container_1_div_6_Template(rf, ctx) { if (rf & 1) {
197
- i0.ɵɵelementStart(0, "div", 42)(1, "p", 42);
198
- i0.ɵɵtext(2, "Informaci\u00F3n procesada de manera correcta");
199
- i0.ɵɵelementEnd()();
200
- } }
201
- function IdVisionComponent_swiper_container_1_div_7_Template(rf, ctx) { if (rf & 1) {
202
- i0.ɵɵelementStart(0, "div", 42)(1, "p", 42);
203
- i0.ɵɵtext(2, "Ocurri\u00F3 un error al procesar la informaci\u00F3n");
204
- i0.ɵɵelementEnd()();
205
- } }
206
- function IdVisionComponent_swiper_container_1_Template(rf, ctx) { if (rf & 1) {
207
- const _r1 = i0.ɵɵgetCurrentView();
208
- i0.ɵɵelementStart(0, "swiper-container", 10, 0);
209
- i0.ɵɵtemplate(2, IdVisionComponent_swiper_container_1_swiper_slide_2_Template, 26, 0, "swiper-slide", 11)(3, IdVisionComponent_swiper_container_1_swiper_slide_3_Template, 8, 9, "swiper-slide", 12);
210
- i0.ɵɵelementStart(4, "swiper-slide")(5, "div", 13);
211
- i0.ɵɵtemplate(6, IdVisionComponent_swiper_container_1_div_6_Template, 3, 0, "div", 14)(7, IdVisionComponent_swiper_container_1_div_7_Template, 3, 0, "div", 14);
212
- i0.ɵɵelementStart(8, "div", 15);
213
- i0.ɵɵelement(9, "img", 16);
214
- i0.ɵɵelementEnd();
215
- i0.ɵɵelementStart(10, "div", 17)(11, "ion-button", 18);
216
- i0.ɵɵlistener("click", function IdVisionComponent_swiper_container_1_Template_ion_button_click_11_listener() { i0.ɵɵrestoreView(_r1); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.handleExit()); });
217
- i0.ɵɵtext(12, "Salir");
218
- i0.ɵɵelementEnd()()()()();
219
- } if (rf & 2) {
220
- const ctx_r2 = i0.ɵɵnextContext();
221
- i0.ɵɵadvance(2);
222
- i0.ɵɵproperty("ngIf", !ctx_r2.simpleProcess);
223
- i0.ɵɵadvance();
224
- i0.ɵɵproperty("ngForOf", ctx_r2.validationConfig);
225
- i0.ɵɵadvance(3);
226
- i0.ɵɵproperty("ngIf", ctx_r2.isValid);
227
- i0.ɵɵadvance();
228
- i0.ɵɵproperty("ngIf", !ctx_r2.isValid);
229
- } }
230
- function IdVisionComponent_ion_fab_4_Template(rf, ctx) { if (rf & 1) {
231
- const _r10 = i0.ɵɵgetCurrentView();
232
- i0.ɵɵelementStart(0, "ion-fab", 43)(1, "ion-fab-button", 44);
233
- i0.ɵɵlistener("click", function IdVisionComponent_ion_fab_4_Template_ion_fab_button_click_1_listener() { i0.ɵɵrestoreView(_r10); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.copyProccess()); });
234
- i0.ɵɵelement(2, "ion-icon", 45);
235
- i0.ɵɵelementEnd()();
236
- } }
237
- register();
238
- export class IdVisionComponent {
239
- constructor(modalController, alertController, platform, modalDpiServices, sdkCommunicationService, navController, cdRef, toastController, loadingController, configurationService, validationService, navigationService, processingService, dpiService) {
240
- this.modalController = modalController;
241
- this.alertController = alertController;
242
- this.platform = platform;
243
- this.modalDpiServices = modalDpiServices;
244
- this.sdkCommunicationService = sdkCommunicationService;
245
- this.navController = navController;
246
- this.cdRef = cdRef;
247
- this.toastController = toastController;
248
- this.loadingController = loadingController;
249
- this.configurationService = configurationService;
250
- this.validationService = validationService;
251
- this.navigationService = navigationService;
252
- this.processingService = processingService;
253
- this.dpiService = dpiService;
254
- // Tutorial images
255
- this.tutoImage1 = 'assets/imagesIdvision/documentsImage.png';
256
- this.tutoImage2 = 'assets/imagesIdvision/documentsImage.png';
257
- this.tutoImage3 = 'assets/imagesIdvision/56.png';
258
- this.tutoImage4 = 'assets/imagesIdvision/57.png';
259
- // Component inputs
260
- this.isSwipe = false;
261
- this.dpiCode = '';
262
- this.connection = '';
263
- this.apikey = '';
264
- this.env = '';
265
- this.validationConfig = [];
266
- // Component state
267
- this.swiperElement = signal(null);
268
- this.modalRef = null;
269
- this.showDebug = false;
270
- this.versionSDK = '';
271
- this.hasInternet = true;
272
- this.simpleProcess = false;
273
- this.typeProccess = '';
274
- this.backButtonListenerActive = false;
275
- // Estados obtenidos de los servicios
276
- this.validateMetaG = {
277
- acuerdoVideo: false,
278
- dpiFront: false,
279
- dpiBack: false,
280
- videoSelfie: false,
281
- photoSelfie: false
282
- };
283
- this.stepVisibility = {
284
- showAcuerdoVideo: false,
285
- showDpiFront: false,
286
- showDpiBack: false,
287
- showVideoSelfie: false,
288
- showPhotoSelfie: false
289
- };
290
- this.isValid = false;
291
- this.configEnv = { env_endpoint: '', error: false };
292
- this.loadingElement = null;
293
- this.isAndroid = this.platform.is('android');
294
- this.isIOS = this.platform.is('ios');
295
- // Bind de los event handlers UNA SOLA VEZ en el constructor
296
- // this.boundOnBackButton = this.onBackButton.bind(this);
297
- this.boundOnBeforeUnload = this.onBeforeUnload.bind(this);
298
- this.boundOnPopState = this.onPopState.bind(this);
299
- }
300
- async ngOnInit() {
301
- try {
302
- // Ejecutar tareas en paralelo para mejor rendimiento
303
- const [configResult, sdkVersion] = await Promise.all([
304
- this.getURL(this.env == "" || this.env == null ? "PROD_IT_01" : this.env),
305
- this.getSDKVersion(),
306
- this.simulateLoadingProgress()
307
- ]);
308
- this.configEnv = configResult;
309
- this.versionSDK = sdkVersion;
310
- if (!this.configEnv.error) {
311
- const stepActionMapper = (type) => this.getStepAction(type);
312
- const validationResponse = await this.configurationService.loadValidationConfiguration(this.connection, this.configEnv, stepActionMapper);
313
- this.typeProccess = validationResponse.typeProccess;
314
- this.validationConfig = validationResponse.steps;
315
- console.log('validationConfig', this.validationConfig);
316
- console.log('typeProccess', this.typeProccess);
317
- if (this.typeProccess === "BiometricToken") {
318
- this.simpleProcess = true;
319
- // Deshabilitar botón de atrás para simpleProcess
320
- // this.disableBackButton();
321
- await this.showLoading();
322
- // Configurar para simpleProcess usando la configuración real
323
- await this.loadSimpleProcessConfig();
324
- this.setupModalSubscriptions();
325
- await this.InitProccess();
326
- await this.hideLoading();
327
- // Pequeño delay para asegurar que el loading se cierre completamente
328
- await new Promise(resolve => setTimeout(resolve, 100));
329
- // NO llamar a executeFirstAvailableAction aquí - ya se llama dentro de InitProccess
330
- // executeFirstAvailableAction() se ejecuta automáticamente en InitProccess cuando no hay continuation
331
- }
332
- else {
333
- // Proceso normal completo
334
- this.simpleProcess = false;
335
- this.setupModalSubscriptions();
336
- // Para el proceso normal, recargar configuración con acciones correctas
337
- await this.loadNormalProcessConfig();
338
- }
339
- }
340
- else {
341
- await this.hideLoading();
342
- alert('Error en opción de ambiente');
343
- }
344
- // if (this.simpleProcess) {
345
- // // Para simpleProcess, mostrar loading nativo de Ionic
346
- // await this.showLoading();
347
- // if (!this.configEnv.error) {
348
- // this.setupModalSubscriptions();
349
- // await this.InitProccess();
350
- // // Configuración rápida para simpleProcess
351
- // await this.loadSimpleProcessConfig();
352
- // await this.hideLoading();
353
- // await this.openPhotoSelfie();
354
- // } else {
355
- // alert('Error en opción de ambiente');
356
- // }
357
- // } else {
358
- // if (!this.configEnv.error) {
359
- // await this.loadMockValidationConfig();
360
- // // Obtener versión del SDK
361
- // if (this.isAndroid || this.isIOS) {
362
- // const info = await App.getInfo();
363
- // this.versionSDK = info.version;
364
- // } else {
365
- // this.versionSDK = 'web';
366
- // }
367
- // this.setupModalSubscriptions();
368
- // } else {
369
- // alert('Error en opción de ambiente');
370
- // }
371
- // }
372
- }
373
- catch (error) {
374
- await this.hideLoading();
375
- console.error('Error en inicialización:', error);
376
- }
377
- }
378
- ngAfterViewInit() {
379
- console.log('🟢 [Component] ngAfterViewInit() llamado');
380
- console.log('🟢 [Component] simpleProcess:', this.simpleProcess);
381
- console.log('🟢 [Component] swiperContainerRef:', this.swiperContainerRef);
382
- console.log('🟢 [Component] swiperContainerRef?.nativeElement:', this.swiperContainerRef?.nativeElement);
383
- // Solo inicializar si el swiper está en el DOM
384
- if (this.swiperContainerRef && !this.simpleProcess) {
385
- console.log('✅ [Component] Condiciones cumplidas, inicializando Swiper...');
386
- console.log('✅ [Component] Pasando elemento al servicio:', this.swiperContainerRef.nativeElement);
387
- this.navigationService.initializeSwiper(this.swiperContainerRef.nativeElement);
388
- this.swiperElement.set(this.navigationService.getSwiperRef());
389
- }
390
- else {
391
- console.warn('⚠️ [Component] SwiperContainer no está disponible en ngAfterViewInit');
392
- console.warn('⚠️ [Component] Razón: swiperContainerRef =', !!this.swiperContainerRef, ', simpleProcess =', this.simpleProcess);
393
- }
394
- if (this.dpi) {
395
- this.dpi.value = this.dpiCode ?? '';
396
- }
397
- else {
398
- console.error('IonInput no está disponible en ngAfterViewInit');
399
- }
400
- }
401
- async ngOnDestroy() {
402
- this.navigationService.destroy();
403
- // Rehabilitar el botón de atrás al salir del componente
404
- this.enableBackButton();
405
- }
406
- // Handler para cancelar el proceso completamente
407
- handleCancelProcess() {
408
- try {
409
- console.log('🔄 Usuario canceló el proceso');
410
- // IMPORTANTE: Deshabilitar listeners del botón de atrás
411
- this.enableBackButton();
412
- console.log('✅ Listeners del botón de atrás deshabilitados');
413
- // Limpiar cualquier loader activo
414
- this.dpiService.forceCloseAllLoaders();
415
- // Emitir resultado falso al SDK
416
- this.sdkCommunicationService.emitExit(false);
417
- console.log('✅ Resultado false enviado al SDK padre');
418
- console.log('⚠️ La app padre debe manejar el cierre del componente <app-id-vision>');
419
- }
420
- catch (error) {
421
- console.error('❌ Error al cancelar proceso:', error);
422
- // Intentar emitir de todos modos
423
- try {
424
- this.sdkCommunicationService.emitExit(false);
425
- }
426
- catch (e) {
427
- console.error('❌ No se pudo emitir resultado:', e);
428
- }
429
- }
430
- }
431
- // Método para mostrar modal de confirmación de cancelación
432
- async showCancelConfirmationModal() {
433
- const alert = await this.alertController.create({
434
- header: 'Cancelar proceso',
435
- message: '¿Estás seguro que deseas cancelar el proceso de validación?',
436
- backdropDismiss: false,
437
- buttons: [
438
- {
439
- text: 'No, continuar',
440
- role: 'cancel',
441
- cssClass: 'alert-button-cancel'
442
- },
443
- {
444
- text: 'Sí, cancelar',
445
- role: 'confirm',
446
- cssClass: 'alert-button-confirm'
447
- }
448
- ]
449
- });
450
- await alert.present();
451
- const { role } = await alert.onDidDismiss();
452
- if (role === 'confirm') {
453
- console.log('🚪 Usuario confirmó cancelación del proceso');
454
- return true;
455
- }
456
- else {
457
- console.log('🔄 Usuario decidió continuar con el proceso');
458
- return false;
459
- }
460
- }
461
- // Método para deshabilitar el botón de atrás en simpleProcess
462
- disableBackButton() {
463
- // Evitar duplicación de listeners
464
- if (this.backButtonListenerActive) {
465
- console.log('⚠️ Back button listeners ya están activos');
466
- return;
467
- }
468
- console.log('🔒 Deshabilitando botón de atrás');
469
- if (this.platform.is('android')) {
470
- // Para Android, interceptar el botón de atrás físico
471
- // document.addEventListener('backbutton', this.boundOnBackButton, false);
472
- }
473
- // Para todas las plataformas, interceptar la navegación del navegador
474
- window.addEventListener('beforeunload', this.boundOnBeforeUnload);
475
- window.addEventListener('popstate', this.boundOnPopState);
476
- this.backButtonListenerActive = true;
477
- }
478
- // Método para rehabilitar el botón de atrás
479
- enableBackButton() {
480
- if (!this.backButtonListenerActive) {
481
- console.log('⚠️ Back button listeners no estaban activos');
482
- return;
483
- }
484
- console.log('🔓 Rehabilitando botón de atrás');
485
- if (this.platform.is('android')) {
486
- document.removeEventListener('backbutton', this.boundOnBackButton, false);
487
- }
488
- window.removeEventListener('beforeunload', this.boundOnBeforeUnload);
489
- window.removeEventListener('popstate', this.boundOnPopState);
490
- this.backButtonListenerActive = false;
491
- }
492
- // Handler para el botón de atrás en Android
493
- // private async onBackButton(event: Event): Promise<void> {
494
- // console.log('� Botón de atrás presionado');
495
- // event.preventDefault();
496
- // event.stopPropagation();
497
- // // Mostrar modal de confirmación
498
- // const shouldCancel = await this.showCancelConfirmationModal();
499
- // if (shouldCancel) {
500
- // // Usuario confirmó la cancelación
501
- // console.log('❌ Proceso cancelado por el usuario');
502
- // this.handleCancelProcess();
503
- // } else {
504
- // // Usuario decidió continuar
505
- // console.log('✅ Usuario decidió continuar');
506
- // }
507
- // }
508
- // Handler para beforeunload
509
- onBeforeUnload(event) {
510
- console.log('🚫 Navegación bloqueada en simpleProcess');
511
- event.preventDefault();
512
- event.returnValue = '';
513
- }
514
- // Handler para popstate (navegación del navegador)
515
- onPopState(event) {
516
- console.log('🚫 Popstate bloqueado en simpleProcess');
517
- event.preventDefault();
518
- // Forzar que se mantenga en la página actual
519
- window.history.pushState(null, '', window.location.href);
520
- }
521
- // Configuration methods
522
- async getURL(environment = 'PROD_IT_01') {
523
- try {
524
- return await this.configurationService.getEnvironmentUrl(environment);
525
- }
526
- catch (error) {
527
- console.error('Error al obtener la URL:', error);
528
- throw error;
529
- }
530
- }
531
- // Método optimizado para obtener versión SDK
532
- async getSDKVersion() {
533
- if (this.isAndroid || this.isIOS) {
534
- const info = await App.getInfo();
535
- return info.version;
536
- }
537
- else {
538
- return 'web';
539
- }
540
- }
541
- // Métodos para manejar el loading nativo de Ionic
542
- async showLoading(message) {
543
- // Primero cerrar cualquier loading existente
544
- await this.hideLoading();
545
- // Crear y mostrar el nuevo loading
546
- this.loadingElement = await this.loadingController.create({
547
- message: message || 'Preparando la cámara del dispositivo...',
548
- spinner: 'crescent',
549
- backdropDismiss: false
550
- });
551
- await this.loadingElement.present();
552
- }
553
- async hideLoading() {
554
- console.log('🔄 hideLoading() ejecutándose...');
555
- // Cerrar nuestro loading específico
556
- if (this.loadingElement) {
557
- try {
558
- console.log('🔄 Cerrando loadingElement...');
559
- await this.loadingElement.dismiss();
560
- console.log('✅ loadingElement cerrado');
561
- }
562
- catch (error) {
563
- // Ignorar errores si el loading ya fue cerrado
564
- console.log('⚠️ Loading ya fue cerrado:', error);
565
- }
566
- this.loadingElement = null;
567
- }
568
- else {
569
- console.log('⚠️ No hay loadingElement activo');
570
- }
571
- // Forzar cierre de TODOS los loadings que puedan estar activos
572
- let attempts = 0;
573
- const maxAttempts = 3;
574
- while (attempts < maxAttempts) {
575
- try {
576
- console.log(`🔄 Verificando top loader (intento ${attempts + 1})...`);
577
- const topLoader = await this.loadingController.getTop();
578
- if (topLoader) {
579
- console.log('🔄 Cerrando top loader...');
580
- await topLoader.dismiss();
581
- console.log('✅ Top loader cerrado');
582
- attempts++;
583
- }
584
- else {
585
- console.log('ℹ️ No hay más top loaders activos');
586
- break;
587
- }
588
- }
589
- catch (error) {
590
- console.log('⚠️ Error verificando top loader:', error);
591
- break;
592
- }
593
- }
594
- // Limpieza final: usar método nuclear si es necesario
595
- try {
596
- const allLoadings = document.querySelectorAll('ion-loading');
597
- if (allLoadings.length > 0) {
598
- console.log(`⚠️ Encontrados ${allLoadings.length} loadings DOM, eliminando...`);
599
- allLoadings.forEach(loading => {
600
- try {
601
- loading.dismiss();
602
- }
603
- catch (e) {
604
- console.log('Error cerrando loading DOM:', e);
605
- }
606
- });
607
- }
608
- }
609
- catch (error) {
610
- console.log('Error en limpieza DOM:', error);
611
- }
612
- console.log('✅ hideLoading() completado');
613
- } // Simular progreso de carga atractivo
614
- async simulateLoadingProgress() {
615
- await new Promise(resolve => setTimeout(resolve, 100)); // Duración total de 0.5 segundos
616
- }
617
- // Configuración rápida para simpleProcess
618
- async loadSimpleProcessConfig() {
619
- // Usar la configuración real obtenida del servicio, pero solo el primer paso [0]
620
- if (this.validationConfig && this.validationConfig.length > 0) {
621
- const firstStep = this.validationConfig[0]; // Siempre usar el primer paso
622
- // Mantener la funcionalidad: si el tipo es 5, usar openPhotoSelfie
623
- if (firstStep.type === 5) {
624
- firstStep.action = () => this.openPhotoSelfie();
625
- }
626
- // Asegurar que solo tenemos un único paso
627
- this.validationConfig = [firstStep];
628
- }
629
- else {
630
- // Fallback si no hay configuración
631
- this.validationConfig = [{
632
- id: 1,
633
- type: 5, // Photo selfie
634
- order: 1,
635
- action: () => this.openPhotoSelfie()
636
- }];
637
- }
638
- // Setup mínimo de estados basado en el tipo del primer paso
639
- const stepType = this.validationConfig[0].type;
640
- this.stepVisibility = {
641
- showAcuerdoVideo: stepType === 1,
642
- showDpiFront: stepType === 2,
643
- showDpiBack: stepType === 3,
644
- showVideoSelfie: stepType === 4,
645
- showPhotoSelfie: stepType === 5
646
- };
647
- this.validateMetaG = {
648
- acuerdoVideo: false,
649
- dpiFront: false,
650
- dpiBack: false,
651
- videoSelfie: false,
652
- photoSelfie: false
653
- };
654
- this.isValid = false;
655
- }
656
- // Configuración para proceso normal
657
- async loadNormalProcessConfig() {
658
- // Para el proceso normal, usar la configuración completa y reconfigurar las acciones
659
- // asegurando que simpleProcess sea false cuando se mapeen las acciones
660
- this.simpleProcess = false;
661
- // Reconfigurar las acciones para cada paso basándose en el estado actual de simpleProcess
662
- this.validationConfig.forEach(step => {
663
- step.action = this.getStepAction(step.type);
664
- });
665
- // Configurar el sistema de validación con la configuración completa
666
- this.setValidationConfig();
667
- }
668
- async loadMockValidationConfig() {
669
- try {
670
- // Configuración temporal para photo-selfie mientras implementas el servicio
671
- if (this.simpleProcess) {
672
- // Configuración temporal: solo photo-selfie
673
- this.validationConfig = [{
674
- id: 1,
675
- type: 5,
676
- order: 1,
677
- action: () => this.openPhotoSelfie()
678
- }];
679
- this.typeProccess = 'simple';
680
- // Abrir photo-selfie automáticamente después de un pequeño delay
681
- setTimeout(() => {
682
- this.openPhotoSelfie();
683
- }, 10);
684
- }
685
- else {
686
- // Proceso normal con servicio
687
- const stepActionMapper = (type) => this.getStepAction(type);
688
- const validationResponse = await this.configurationService.loadValidationConfiguration(this.connection, this.configEnv, stepActionMapper);
689
- this.typeProccess = validationResponse.typeProccess;
690
- this.validationConfig = validationResponse.steps;
691
- }
692
- this.setValidationConfig();
693
- }
694
- catch (error) {
695
- console.error('Error loading validation config:', error);
696
- // En caso de error, usar configuración temporal
697
- this.validationConfig = [{
698
- id: 1,
699
- type: 5,
700
- order: 1,
701
- action: () => this.openPhotoSelfie()
702
- }];
703
- this.typeProccess = 'fallback';
704
- this.setValidationConfig();
705
- }
706
- }
707
- setValidationConfig() {
708
- this.validationService.setStepVisibility(this.validationConfig);
709
- this.navigationService.setValidationConfig(this.validationConfig);
710
- // Suscribirse a los cambios de visibilidad
711
- this.validationService.stepVisibility$.subscribe(visibility => {
712
- this.stepVisibility = visibility;
713
- this.cdRef.detectChanges();
714
- });
715
- // Suscribirse a los cambios de validación
716
- this.validationService.validation$.subscribe(validation => {
717
- this.validateMetaG = validation;
718
- });
719
- // Suscribirse al estado de validez general
720
- this.validationService.isValid$.subscribe(isValid => {
721
- this.isValid = isValid;
722
- });
723
- }
724
- getStepAction(type) {
725
- const actions = {
726
- 1: () => this.openSimpleAcuerdo(),
727
- 2: () => this.openCameraOverlayFrontal(),
728
- 3: () => this.openCameraOverlayTrasero(),
729
- 4: () => this.openVideoSelfie(),
730
- 5: () => this.openPhotoSelfie(),
731
- 6: () => this.openAcuerdoVideo(),
732
- };
733
- return this.configurationService.getStepAction(type, actions);
734
- }
735
- getSlideIndexForType(type) {
736
- const stepIndex = this.validationConfig.findIndex(step => step.type === type);
737
- return stepIndex >= 0 ? stepIndex + 1 : 1; // +1 porque el slide 0 es el inicial
738
- }
739
- // Navigation methods
740
- handleClick() {
741
- this.InitProccess();
742
- }
743
- async handleSlide(slide) {
744
- this.navigationService.navigateToSlide(slide);
745
- }
746
- handleGetInit() {
747
- this.navigationService.navigateToStart();
748
- }
749
- handleNext() {
750
- this.navigationService.navigateNext();
751
- }
752
- handleSkipTutorial() {
753
- this.navigationService.skipTutorial();
754
- }
755
- moveToNextStep(currentType) {
756
- this.navigationService.moveToNextStep(currentType);
757
- }
758
- // Validation methods
759
- handleExit() {
760
- const result = this.validationService.isAllValid();
761
- this.sdkCommunicationService.emitExit(result);
762
- this.navController.back();
763
- }
764
- // Método para manejar salida con resultado específico (para simpleProcess)
765
- async handleExitWithResult(result, source = 'unknown') {
766
- console.log(`🚪 handleExitWithResult llamado desde: ${source}, resultado: ${result}`);
767
- console.log('📊 Estado del SDK:', {
768
- simpleProcess: this.simpleProcess,
769
- source: source,
770
- result: result
771
- });
772
- try {
773
- // Cerrar cualquier loading pendiente
774
- await this.hideLoading();
775
- console.log('✅ Loading cerrado');
776
- // IMPORTANTE: Deshabilitar listeners del botón de atrás cuando el proceso termina
777
- this.enableBackButton();
778
- console.log('✅ Listeners del botón de atrás deshabilitados');
779
- // Enviar resultado al SDK padre
780
- console.log('🔔 Emitiendo resultado a través de sdkCommunicationService...');
781
- this.sdkCommunicationService.emitExit(result);
782
- console.log(`✅ Resultado ${result} enviado al SDK padre`);
783
- console.log('⚠️ La app padre debe ocultar el componente <app-id-vision> escuchando onExit$');
784
- console.log('⚠️ Si no se oculta, verificar que la app padre tenga:');
785
- console.log(' this.sdkCommunicationService.onExit$.subscribe(result => { showSDK = false; })');
786
- }
787
- catch (error) {
788
- console.error('Error en handleExitWithResult:', error);
789
- // Intentar emitir de todos modos
790
- try {
791
- this.sdkCommunicationService.emitExit(result);
792
- }
793
- catch (e) {
794
- console.error('❌ No se pudo emitir resultado o cerrar:', e);
795
- }
796
- }
797
- }
798
- // Método para forzar el cierre del SDK de manera agresiva
799
- // Processing methods
800
- async InitProccess() {
801
- // Debug: Verificar que configEnv tenga la URL correcta
802
- console.log('🔍 InitProccess - configEnv:', this.configEnv);
803
- console.log('🔍 InitProccess - URL endpoint:', this.configEnv?.env_endpoint);
804
- console.log('🔍 InitProccess - simpleProcess:', this.simpleProcess);
805
- try {
806
- const response = await this.processingService.initProcess(this.dpiCode + '', this.connection, this.apikey, this.versionSDK, this.configEnv);
807
- if (!response.error) {
808
- if (response.continuation) {
809
- const completedItem = this.validationService.processContinuationStatus(response.statusAct || []);
810
- if (this.simpleProcess) {
811
- // En simpleProcess, ejecutar directamente la siguiente acción
812
- this.executeNextActionForSimpleProcess(completedItem);
813
- }
814
- else {
815
- this.handleSlide(completedItem);
816
- }
817
- }
818
- else if (response.completed) {
819
- this.validationService.completeAllSteps();
820
- this.navigationService.navigateToCompletion();
821
- }
822
- else {
823
- if (this.simpleProcess) {
824
- // En simpleProcess, ejecutar directamente la primera acción disponible
825
- this.executeFirstAvailableAction();
826
- }
827
- else {
828
- this.handleSlide(1);
829
- }
830
- }
831
- }
832
- else {
833
- this.handleInitProcessError(response.message || 'Error desconocido');
834
- }
835
- }
836
- catch (error) {
837
- console.error('Error en InitProcess:', error);
838
- }
839
- }
840
- executeFirstAvailableAction() {
841
- console.log('🎬 executeFirstAvailableAction()');
842
- if (this.validationConfig.length > 0) {
843
- const firstStep = this.validationConfig[0];
844
- console.log('🎬 Ejecutando acción del primer paso, tipo:', firstStep.type);
845
- // Ejecutar la acción del paso (que ya está configurada en loadSimpleProcessConfig)
846
- firstStep.action();
847
- }
848
- }
849
- executeNextActionForSimpleProcess(completedStep) {
850
- // Buscar el siguiente paso no completado
851
- const nextStep = this.validationConfig.find(step => {
852
- const stepKey = this.getValidationKeyForType(step.type);
853
- return stepKey && !this.validateMetaG[stepKey];
854
- });
855
- if (nextStep) {
856
- nextStep.action();
857
- }
858
- else {
859
- // Si no hay más pasos, navegar a completación
860
- this.navigationService.navigateToCompletion();
861
- }
862
- }
863
- getValidationKeyForType(type) {
864
- switch (type) {
865
- case 1: return 'acuerdoVideo';
866
- case 2: return 'dpiFront';
867
- case 3: return 'dpiBack';
868
- case 4: return 'videoSelfie';
869
- case 5: return 'photoSelfie';
870
- default: return null;
871
- }
872
- }
873
- handleInitProcessError(message) {
874
- const dpiValue = this.dpi.value ?? '';
875
- if (!dpiValue || dpiValue.trim().length === 0) {
876
- this.showAlert('Error', 'El campo DPI no puede estar vacío', []);
877
- }
878
- else if (dpiValue.length > 12) {
879
- this.showAlert('Error', message, []);
880
- }
881
- else {
882
- this.showAlert('Error', message, []);
883
- }
884
- }
885
- // DPI Processing methods
886
- async DpiFrontProccess(filePath) {
887
- // Debug: Verificar que configEnv tenga la URL correcta
888
- console.log('🔍 DpiFrontProccess - configEnv:', this.configEnv);
889
- console.log('🔍 DpiFrontProccess - URL endpoint:', this.configEnv?.env_endpoint);
890
- try {
891
- // El loading se maneja completamente dentro del ProcessingService
892
- const result = await this.processingService.processFrontDPI(filePath, this.connection, this.apikey, this.configEnv, this.hasInternet);
893
- if (result.success) {
894
- this.closeModalFromParent();
895
- this.modalController.dismiss();
896
- this.validationService.updateValidationStep('dpiFront', true);
897
- if (this.simpleProcess) {
898
- this.executeNextActionForSimpleProcess(2);
899
- }
900
- else {
901
- this.moveToNextStep(2);
902
- }
903
- }
904
- else if (result.shouldResumeCamera) {
905
- this.resumeCameraFromParent();
906
- }
907
- }
908
- catch (error) {
909
- console.error('Error processing front DPI:', error);
910
- }
911
- }
912
- async DpiBackProccess(filePath) {
913
- // Debug: Verificar que configEnv tenga la URL correcta
914
- console.log('🔍 DpiBackProccess - configEnv:', this.configEnv);
915
- console.log('🔍 DpiBackProccess - URL endpoint:', this.configEnv?.env_endpoint);
916
- try {
917
- // El loading se maneja completamente dentro del ProcessingService
918
- const result = await this.processingService.processBackDPI(filePath, this.connection, this.apikey, this.configEnv, this.hasInternet);
919
- if (result.success) {
920
- this.closeModalFromParent();
921
- this.modalController.dismiss();
922
- this.validationService.updateValidationStep('dpiBack', true);
923
- if (this.simpleProcess) {
924
- this.executeNextActionForSimpleProcess(3);
925
- }
926
- else {
927
- this.moveToNextStep(3);
928
- }
929
- }
930
- else {
931
- this.validationService.updateValidationStep('dpiBack', false);
932
- if (result.shouldResumeCamera) {
933
- this.resumeCameraFromParent();
934
- }
935
- else {
936
- this.sdkCommunicationService.emitExit(false);
937
- this.navController.back();
938
- }
939
- }
940
- }
941
- catch (error) {
942
- console.error('Error processing back DPI:', error);
943
- }
944
- }
945
- // Video Selfie Processing
946
- async VideoSelfieProcccess(file) {
947
- try {
948
- // El loading se maneja completamente dentro del ProcessingService
949
- const result = await this.processingService.processVideoSelfie(file, this.connection, this.apikey, this.configEnv, this.hasInternet);
950
- if (result.success) {
951
- this.closeModalVideoSelfie();
952
- this.modalController.dismiss();
953
- this.validationService.updateValidationStep('videoSelfie', true);
954
- if (this.simpleProcess) {
955
- this.executeNextActionForSimpleProcess(4);
956
- }
957
- else {
958
- this.moveToNextStep(4);
959
- }
960
- }
961
- else {
962
- this.validationService.updateValidationStep('videoSelfie', false);
963
- if (result.shouldResumeCamera) {
964
- this.closeModalVideoSelfie();
965
- }
966
- else {
967
- this.sdkCommunicationService.emitExit(false);
968
- this.navController.back();
969
- }
970
- }
971
- }
972
- catch (error) {
973
- console.error('Error processing video selfie:', error);
974
- }
975
- }
976
- // Photo Selfie Processing
977
- async photoVideoSelfieFile(filePath) {
978
- console.log('🔄 Iniciando procesamiento de foto selfie...');
979
- // Debug: Verificar que configEnv tenga la URL correcta
980
- console.log('🔍 photoVideoSelfieFile - configEnv:', this.configEnv);
981
- console.log('🔍 photoVideoSelfieFile - URL endpoint:', this.configEnv?.env_endpoint);
982
- console.log('🔍 photoVideoSelfieFile - simpleProcess:', this.simpleProcess);
983
- try {
984
- // El loading se maneja completamente dentro del ProcessingService
985
- const result = await this.processingService.processPhotoSelfie(filePath, this.connection, this.apikey, this.configEnv, this.simpleProcess, // Pasar flag de proceso simple
986
- () => {
987
- // Callback para simpleProcess - cerrar overlay y SDK
988
- console.log('🚪 Callback ejecutándose - cerrando overlay y SDK automáticamente');
989
- this.closePhotoSelfieFromParent();
990
- this.modalController.dismiss();
991
- // Usar 'auto' para indicar que es cierre automático después del procesamiento
992
- this.handleExitWithResult(true, 'auto');
993
- });
994
- if (result.success) {
995
- // Cerrar el overlay de la cámara inmediatamente
996
- this.closePhotoSelfieFromParent();
997
- this.modalController.dismiss();
998
- this.validationService.updateValidationStep('photoSelfie', true);
999
- if (this.simpleProcess) {
1000
- // Para simpleProcess, no hacer nada aquí - el callback se encarga de todo
1001
- console.log('✅ SimpleProcess: esperando callback para cierre completo');
1002
- }
1003
- else {
1004
- this.moveToNextStep(5);
1005
- }
1006
- }
1007
- else {
1008
- this.validationService.updateValidationStep('photoSelfie', false);
1009
- if (result.shouldResumeCamera) {
1010
- this.resumePhotoFromParent();
1011
- }
1012
- }
1013
- }
1014
- catch (error) {
1015
- console.error('Error processing photo selfie:', error);
1016
- }
1017
- }
1018
- // Acuerdo Video Processing
1019
- async getAcuerdoVideo(file) {
1020
- try {
1021
- const result = await this.processingService.processAcuerdoVideo(file);
1022
- if (result.success) {
1023
- this.closeModalAcuerdoVideo();
1024
- this.modalController.dismiss();
1025
- this.validationService.updateValidationStep('acuerdoVideo', true);
1026
- if (this.simpleProcess) {
1027
- this.executeNextActionForSimpleProcess(1);
1028
- }
1029
- else {
1030
- this.moveToNextStep(1);
1031
- }
1032
- }
1033
- else {
1034
- this.validationService.updateValidationStep('acuerdoVideo', false);
1035
- }
1036
- }
1037
- catch (error) {
1038
- console.error('Error processing acuerdo video:', error);
1039
- }
1040
- }
1041
- // Modal handling methods
1042
- setupModalSubscriptions() {
1043
- this.modalDpiServices.closeOverlay$.subscribe(() => {
1044
- this.closeOverlay();
1045
- });
1046
- this.modalDpiServices.closeModalAndChangeBrightness$.subscribe(() => {
1047
- this.closeModalOverlay();
1048
- });
1049
- this.modalDpiServices.closePhotoSelfieSubject$.subscribe(() => {
1050
- this.closePhotoSelfie();
1051
- });
1052
- }
1053
- closeModalFromParent() {
1054
- this.modalDpiServices.requestCloseOverlay();
1055
- }
1056
- closeModalVideoSelfie() {
1057
- this.modalDpiServices.requestCloseModalAndBrightness();
1058
- }
1059
- closeModalAcuerdoVideo() {
1060
- this.modalDpiServices.requestCloseModalAcuerdoVideo();
1061
- }
1062
- resumePhotoFromParent() {
1063
- this.modalDpiServices.requestResumePhotoSubject();
1064
- }
1065
- resumeCameraFromParent() {
1066
- this.modalDpiServices.requestResumeCamera();
1067
- }
1068
- closePhotoSelfieFromParent() {
1069
- this.modalDpiServices.requestClosePhotoSelfieSubject();
1070
- }
1071
- async closeOverlay() {
1072
- // console.log('Modal cerrada desde el componente padre');
1073
- }
1074
- async closeModalOverlay() {
1075
- // console.log('test videoselfie');
1076
- }
1077
- async closePhotoSelfie() {
1078
- // console.log('test videoselfie');
1079
- }
1080
- // Camera modal methods
1081
- async openCameraOverlayFrontal() {
1082
- this.modalRef = await this.modalController.create({
1083
- component: CameraWithOverlayComponent,
1084
- componentProps: {
1085
- text1: 'Coloca la parte frontal de tu DPI.',
1086
- text2: '',
1087
- overlaySrc: 'assets/imagesIdvision/overlay-dpi-frontal.png',
1088
- onTakePicture: this.DpiFrontProccess.bind(this),
1089
- closeRequested: async () => {
1090
- console.log('🚪 Callback closeRequested invocado en camera-frontal');
1091
- // await this.modalRef?.dismiss();
1092
- await this.handleExitWithResult(false, 'auto');
1093
- await this.modalRef?.dismiss();
1094
- // if (this.simpleProcess) {
1095
- // // Para simpleProcess: Cerrar el modal primero, luego cerrar el SDK
1096
- // this.closeOverlay();
1097
- // await this.modalRef?.dismiss();
1098
- // await this.handleExitWithResult(false, 'camera-frontal-close');
1099
- // } else {
1100
- // // Para proceso normal, solo cerrar overlay
1101
- // this.closeOverlay();
1102
- // }
1103
- },
1104
- },
1105
- backdropDismiss: false,
1106
- // Optimización: sin animación para simpleProcess
1107
- animated: !this.simpleProcess
1108
- });
1109
- await this.modalRef.present();
1110
- }
1111
- async openCameraOverlayTrasero() {
1112
- const modal = await this.modalController.create({
1113
- component: CameraWithOverlayComponent,
1114
- componentProps: {
1115
- text1: 'Coloca la parte reversa de tu DPI.',
1116
- text2: '',
1117
- overlaySrc: 'assets/imagesIdvision/overlay-dpi-trasero.png',
1118
- onTakePicture: this.DpiBackProccess.bind(this),
1119
- closeRequested: async () => {
1120
- if (this.simpleProcess) {
1121
- // Para simpleProcess: Cerrar el modal primero, luego cerrar el SDK
1122
- await modal.dismiss();
1123
- await this.handleExitWithResult(false, 'camera-trasero-close');
1124
- }
1125
- else {
1126
- // Para proceso normal, comportamiento default
1127
- return;
1128
- }
1129
- },
1130
- },
1131
- backdropDismiss: false,
1132
- // Optimización: sin animación para simpleProcess
1133
- animated: !this.simpleProcess
1134
- });
1135
- await modal.present();
1136
- const { data } = await modal.onWillDismiss();
1137
- if (data && data.executeFuncion) {
1138
- data.executeFuncion();
1139
- }
1140
- }
1141
- async openVideoSelfie() {
1142
- // Cerrar cualquier loading antes de abrir la modal
1143
- await this.hideLoading();
1144
- const modal = await this.modalController.create({
1145
- component: CamaraVideoSelfieComponent,
1146
- componentProps: {
1147
- cssClass: 'my-custom-class',
1148
- text1: 'Video Selfie',
1149
- text2: 'Guatemala',
1150
- overlaySrc: 'assets/overlay-image.png',
1151
- backFunction: async (file) => {
1152
- await this.getBackModal(file);
1153
- },
1154
- closeRequested: async () => {
1155
- if (this.simpleProcess) {
1156
- // Para simpleProcess: Cerrar el modal primero, luego cerrar el SDK
1157
- await modal.dismiss();
1158
- await this.handleExitWithResult(false, 'video-selfie-close');
1159
- }
1160
- else {
1161
- // Para proceso normal, solo cerrar modal
1162
- this.closeModalOverlay();
1163
- }
1164
- },
1165
- },
1166
- backdropDismiss: false,
1167
- // Optimización: sin animación para simpleProcess
1168
- animated: !this.simpleProcess
1169
- });
1170
- await modal.present();
1171
- }
1172
- async openPhotoSelfie() {
1173
- const modal = await this.modalController.create({
1174
- component: PhotoSelfieCameraComponent,
1175
- componentProps: {
1176
- cssClass: 'my-custom-class',
1177
- text1: 'Foto Selfie',
1178
- text2: 'Guatemala',
1179
- overlaySrc: 'assets/overlay-image.png',
1180
- onTakePicture: async (file) => {
1181
- await this.photoVideoSelfieFile(file);
1182
- },
1183
- closeRequested: async () => {
1184
- if (this.simpleProcess) {
1185
- console.log('🚪 Usuario cerró photo-selfie manualmente - cerrando SDK');
1186
- // Para simpleProcess: Cerrar el modal primero, luego cerrar el SDK
1187
- await modal.dismiss();
1188
- await this.handleExitWithResult(false, 'photo-selfie-close');
1189
- }
1190
- else {
1191
- // Para proceso normal, solo cerrar modal
1192
- this.closeModalOverlay();
1193
- }
1194
- },
1195
- },
1196
- backdropDismiss: false,
1197
- // Optimización: sin animación para simpleProcess para mayor velocidad
1198
- animated: !this.simpleProcess
1199
- });
1200
- await modal.present();
1201
- }
1202
- async openDirectPhotoSelfie() {
1203
- console.log('🎬 Abriendo DirectPhotoSelfie modal...');
1204
- // Cerrar cualquier loading antes de abrir la modal
1205
- await this.hideLoading();
1206
- const closeRequestedCallback = async () => {
1207
- console.log('═══════════════════════════════════════════════════════');
1208
- console.log('🚪 Callback closeRequested invocado en id-vision');
1209
- console.log('═══════════════════════════════════════════════════════');
1210
- if (this.simpleProcess) {
1211
- console.log('🚪 Usuario cerró direct-photo-selfie - cerrando modal y emitiendo resultado');
1212
- // Cerrar el modal primero
1213
- await modal.dismiss();
1214
- console.log('✅ Modal cerrado desde padre');
1215
- // Ejecutar handleExitWithResult que emite el resultado
1216
- // La app padre recibirá onExit$ y hará showSDK = false
1217
- await this.handleExitWithResult(false, 'direct-photo-selfie-close');
1218
- }
1219
- else {
1220
- // Para proceso normal, cerrar modal y limpiar
1221
- await modal.dismiss();
1222
- this.closeModalOverlay();
1223
- }
1224
- };
1225
- console.log('📦 Creando modal con props...');
1226
- console.log('📦 closeRequested callback definido:', !!closeRequestedCallback);
1227
- const modal = await this.modalController.create({
1228
- component: DirectPhotoSelfieComponent,
1229
- componentProps: {
1230
- onTakePicture: async (file) => {
1231
- await this.photoVideoSelfieFile(file);
1232
- },
1233
- closeRequested: closeRequestedCallback,
1234
- },
1235
- backdropDismiss: false,
1236
- // Optimización: sin animación para simpleProcess
1237
- animated: !this.simpleProcess
1238
- });
1239
- console.log('✅ Modal creado, presentando...');
1240
- await modal.present();
1241
- console.log('✅ Modal presentado correctamente');
1242
- }
1243
- async openAcuerdoVideo() {
1244
- // Cerrar cualquier loading antes de abrir la modal
1245
- await this.hideLoading();
1246
- const modal = await this.modalController.create({
1247
- component: CamaraAcuerdoVideoComponent,
1248
- componentProps: {
1249
- backFunction: async (file) => {
1250
- await this.getAcuerdoVideo(file);
1251
- },
1252
- closeRequested: async () => {
1253
- await modal.dismiss();
1254
- await this.handleExitWithResult(false, 'acuerdo-video-close');
1255
- },
1256
- },
1257
- backdropDismiss: false,
1258
- // Optimización: sin animación para simpleProcess
1259
- animated: !this.simpleProcess
1260
- });
1261
- await modal.present();
1262
- }
1263
- async openSimpleAcuerdo() {
1264
- // Cerrar cualquier loading antes de abrir la modal
1265
- await this.hideLoading();
1266
- const modal = await this.modalController.create({
1267
- component: SimpleAcuerdoVideoComponent,
1268
- componentProps: {
1269
- cssClass: 'my-custom-class',
1270
- backFunction: async (file) => {
1271
- await this.getAcuerdoVideo(file);
1272
- },
1273
- closeRequested: async () => {
1274
- if (this.simpleProcess) {
1275
- console.log('🚪 Usuario cerró simple-acuerdo-video manualmente - cerrando SDK');
1276
- // Para simpleProcess: Cerrar el modal primero, luego cerrar el SDK
1277
- await modal.dismiss();
1278
- await this.handleExitWithResult(false, 'simple-acuerdo-video-close');
1279
- }
1280
- else {
1281
- // Para proceso normal, solo cerrar modal
1282
- this.closeModalOverlay();
1283
- }
1284
- },
1285
- },
1286
- backdropDismiss: false,
1287
- // Optimización: sin animación para simpleProcess
1288
- animated: !this.simpleProcess
1289
- });
1290
- await modal.present();
1291
- }
1292
- // Legacy validation methods (kept for compatibility)
1293
- async validateDPIFront(filePath) {
1294
- await this.DpiFrontProccess(filePath);
1295
- return true;
1296
- }
1297
- async validateDPIBack(filePath) {
1298
- this.modalController.dismiss();
1299
- await this.DpiBackProccess(filePath);
1300
- return true;
1301
- }
1302
- async getBackModal(file) {
1303
- if (!file || file.size === 0) {
1304
- return;
1305
- }
1306
- await this.VideoSelfieProcccess(file);
1307
- }
1308
- async convertImagePathToFile(imagePath, fileName) {
1309
- return await this.processingService.convertImagePathToFile(imagePath, fileName);
1310
- }
1311
- // Utility methods
1312
- async showAlert(header, message, details, onConfirm) {
1313
- const detailsMessage = Array.isArray(details)
1314
- ? details.map((detail) => `${detail} `).join('')
1315
- : '';
1316
- const fullMessage = message + (detailsMessage ? `${detailsMessage}` : '');
1317
- const alert = await this.alertController.create({
1318
- backdropDismiss: false,
1319
- header,
1320
- message: fullMessage,
1321
- buttons: [
1322
- {
1323
- text: 'Continuar',
1324
- handler: () => {
1325
- if (onConfirm) {
1326
- onConfirm();
1327
- }
1328
- },
1329
- cssClass: 'boton-personalizado'
1330
- },
1331
- ],
1332
- });
1333
- await alert.present();
1334
- }
1335
- async copyProccess() {
1336
- const codigo = localStorage.getItem('codigo') ?? '';
1337
- this.copiarTexto(codigo);
1338
- }
1339
- async copiarTexto(texto) {
1340
- await Clipboard.write({
1341
- string: texto
1342
- });
1343
- const toast = await this.toastController.create({
1344
- message: 'Proceso copiado!',
1345
- duration: 2000,
1346
- color: 'success'
1347
- });
1348
- await toast.present();
1349
- }
1350
- static { this.ɵfac = function IdVisionComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || IdVisionComponent)(i0.ɵɵdirectiveInject(i1.ModalController), i0.ɵɵdirectiveInject(i1.AlertController), i0.ɵɵdirectiveInject(i1.Platform), i0.ɵɵdirectiveInject(i2.ModalDpiServices), i0.ɵɵdirectiveInject(i3.SdkCommunicationService), i0.ɵɵdirectiveInject(i1.NavController), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i1.ToastController), i0.ɵɵdirectiveInject(i1.LoadingController), i0.ɵɵdirectiveInject(i4.ConfigurationService), i0.ɵɵdirectiveInject(i5.ValidationService), i0.ɵɵdirectiveInject(i6.NavigationService), i0.ɵɵdirectiveInject(i7.ProcessingService), i0.ɵɵdirectiveInject(i8.DpiService)); }; }
1351
- static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: IdVisionComponent, selectors: [["app-id-vision"]], viewQuery: function IdVisionComponent_Query(rf, ctx) { if (rf & 1) {
1352
- i0.ɵɵviewQuery(_c0, 5);
1353
- i0.ɵɵviewQuery(_c1, 5, ElementRef);
1354
- } if (rf & 2) {
1355
- let _t;
1356
- i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.dpi = _t.first);
1357
- i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.swiperContainerRef = _t.first);
1358
- } }, inputs: { isSwipe: "isSwipe", dpiCode: "dpiCode", connection: "connection", apikey: "apikey", env: "env", validationConfig: "validationConfig" }, standalone: true, features: [i0.ɵɵProvidersFeature([DpiService, ConfigurationService, ValidationService, NavigationService, ProcessingService]), i0.ɵɵStandaloneFeature], decls: 15, vars: 8, consts: [["swiperContainer", ""], ["dpi", ""], ["init", "false", "class", "custom-swiper", 4, "ngIf"], [1, "version"], ["vertical", "top", "horizontal", "end", "slot", "fixed", 4, "ngIf"], [1, "wrapper-no-internet"], [1, "content-no-internet"], [1, "title-no-internet"], ["src", "assets/imagesIdvision/no-internet.svg", "alt", "Error conexi\u00F3n img", 1, "icon-no-internet"], [1, "description-no-internet"], ["init", "false", 1, "custom-swiper"], [4, "ngIf"], [4, "ngFor", "ngForOf"], [1, "confirmation-screen"], ["class", "font-confirmation", 4, "ngIf"], [1, "image-confirmation"], ["src", "assets/imagesIdvision/blue-check.png", "alt", "Check morado"], [1, "button-container"], ["expand", "block", 1, "custom-button", 3, "click"], [1, "content"], [1, "head"], [1, "h-title"], [1, "p-justify", "p-margin"], [1, "rounded-input"], ["type", "number", "disabled", "true", "placeholder", "Digita tu n\u00FAmero de DPI"], [1, "verify-container"], [1, "image-container"], ["src", "assets/imagesIdvision/documentsImage.png", "alt", ""], [1, "container-text"], [1, "p-justify"], ["src", "assets/imagesIdvision/rostroImage.png", "alt", ""], [1, "fixed-footer"], [1, "content", 3, "ngClass", "ngSwitch"], [3, "ngClass", 4, "ngSwitchCase"], [4, "ngSwitchCase"], [4, "ngSwitchDefault"], [3, "ngClass"], ["src", "assets/imagesIdvision/Foco.png", "alt", ""], [1, "p-center", "p-info", "p-margin"], [1, "dpi-container"], ["src", "assets/imagesIdvision/dpi-front-1.png", "alt", ""], ["src", "assets/imagesIdvision/dpi-back-1.png", "alt", ""], [1, "font-confirmation"], ["vertical", "top", "horizontal", "end", "slot", "fixed"], [1, "button-debug", 3, "click"], ["name", "bug-outline"]], template: function IdVisionComponent_Template(rf, ctx) { if (rf & 1) {
1359
- i0.ɵɵelementStart(0, "ion-content");
1360
- i0.ɵɵtemplate(1, IdVisionComponent_swiper_container_1_Template, 13, 4, "swiper-container", 2);
1361
- i0.ɵɵelementStart(2, "div", 3);
1362
- i0.ɵɵtext(3);
1363
- i0.ɵɵelementEnd();
1364
- i0.ɵɵtemplate(4, IdVisionComponent_ion_fab_4_Template, 3, 0, "ion-fab", 4);
1365
- i0.ɵɵelementEnd();
1366
- i0.ɵɵelementStart(5, "ion-content")(6, "div", 5)(7, "div", 6)(8, "h2", 7);
1367
- i0.ɵɵtext(9, "Error de conexi\u00F3n");
1368
- i0.ɵɵelementEnd();
1369
- i0.ɵɵelement(10, "img", 8);
1370
- i0.ɵɵelementStart(11, "p", 9);
1371
- i0.ɵɵtext(12, " No pudimos cargar la p\u00E1gina. ");
1372
- i0.ɵɵelement(13, "br");
1373
- i0.ɵɵtext(14, " Verifica tu internet y prueba de nuevo. ");
1374
- i0.ɵɵelementEnd()()()();
1375
- } if (rf & 2) {
1376
- i0.ɵɵstyleProp("display", ctx.hasInternet ? "block" : "none");
1377
- i0.ɵɵadvance();
1378
- i0.ɵɵproperty("ngIf", !ctx.simpleProcess);
1379
- i0.ɵɵadvance(2);
1380
- i0.ɵɵtextInterpolate2("", ctx.versionSDK, " ", ctx.configEnv.show_label ? ctx.configEnv.env_name : "", "");
1381
- i0.ɵɵadvance();
1382
- i0.ɵɵproperty("ngIf", ctx.showDebug);
1383
- i0.ɵɵadvance();
1384
- i0.ɵɵstyleProp("display", !ctx.hasInternet ? "block" : "none");
1385
- } }, dependencies: [IonicModule, i1.IonButton, i1.IonContent, i1.IonFab, i1.IonFabButton, i1.IonGrid, i1.IonIcon, i1.IonInput, i1.IonItem, i1.IonRow, i1.NumericValueAccessor, CommonModule, i9.NgClass, i9.NgForOf, i9.NgIf, i9.NgSwitch, i9.NgSwitchCase, i9.NgSwitchDefault, HttpClientModule], styles: ["// ============================================\r\n// ESTILOS AISLADOS DEL SDK - NO AFECTAN AL PADRE\r\n// ============================================\r\n// Usamos :host para encapsular todo dentro del componente\r\n// y evitar que los estilos globales del padre nos afecten\r\n\r\n:host {\r\n display: block;\r\n position: relative;\r\n width: 100%;\r\n height: 100%;\r\n \r\n // Reset de estilos globales del padre\r\n * {\r\n box-sizing: border-box;\r\n }\r\n}\r\n\r\n.content {\r\n padding: 10px;\r\n align-items: center;\r\n justify-content: center;\r\n height: 90vh;\r\n background-color: #fff;\r\n font-size: 18px;\r\n background-image: url('assets/imagesIdvision/background.png');\r\n background-size: cover;\r\n background-repeat: no-repeat;\r\n background-position: center;\r\n}\r\n\r\n// Cuando es simpleProcess, levanta el contenido un 10%\r\n.content-simple-process {\r\n margin-top: 10vh;\r\n height: 90vh;\r\n}\r\n\r\n.h-title {\r\n font-size: 1.5em;\r\n font-weight: bold;\r\n color: #F38301;\r\n text-align: center;\r\n margin-top: 20px;\r\n}\r\n\r\n:host p {\r\n font-size: 1em;\r\n color: #666;\r\n text-align: center;\r\n margin: 0;\r\n}\r\n\r\n:host ion-grid {\r\n margin-top: 20px;\r\n}\r\n\r\n:host ion-row {\r\n margin: 15px 0;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n}\r\n\r\n:host ion-col {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n text-align: center;\r\n}\r\n\r\n:host ion-icon {\r\n font-size: 3em;\r\n color: #ff8c00;\r\n margin-bottom: 10px;\r\n}\r\n\r\n.container-text {\r\n text-align: justify !important;\r\n width: 180px;\r\n}\r\n\r\n:host p {\r\n text-align: start;\r\n}\r\n\r\n.p-center {\r\n text-align: center;\r\n}\r\n\r\n.p-justify {\r\n text-align: start;\r\n}\r\n\r\n.head {\r\n padding: 20px;\r\n margin-top: 20px;\r\n margin-bottom: 80px;\r\n}\r\n\r\n\r\n.verify-container {\r\n // padding: 60px;\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n justify-content: center;\r\n height: 40%; // Ocupa todo el espacio disponible en el ion-content\r\n text-align: center;\r\n //background-color: black;\r\n}\r\n\r\n.fixed-footer {\r\n position: fixed;\r\n bottom: 0;\r\n left: 0;\r\n width: 100%;\r\n padding: 0px 10px 25px 10px;\r\n // background-color: black; // Color de fondo, opcional\r\n // box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1); // Sombra suave para que resalte\r\n\r\n ion-button {\r\n width: 90%;\r\n max-width: 300px;\r\n margin: 0 auto;\r\n background-color: #ffcc00;\r\n color: #ffffff;\r\n font-weight: bold;\r\n border-radius: 20px;\r\n\r\n &:hover {\r\n background-color: #ffb300;\r\n }\r\n\r\n &:active {\r\n background-color: #e6a800;\r\n }\r\n }\r\n}\r\n\r\n.dpi-container {\r\n display: flex;\r\n //width: 100%;\r\n justify-content: center;\r\n align-items: center;\r\n height: 45vh;\r\n}\r\n\r\n.dpi-image {\r\n width: 200px;\r\n}\r\n\r\n.image-container {\r\n width: 100px;\r\n max-width: 90px;\r\n}\r\n\r\n.col-confirmation {\r\n margin-top: 100px;\r\n padding: 20px;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 20px;\r\n /* Ajusta el espacio entre los elementos */\r\n}\r\n\r\n.image-item {\r\n margin-top: 50px;\r\n padding-top: 70px;\r\n}\r\n\r\n.font-confirmation {\r\n font-size: 26px;\r\n text-align: center;\r\n // color: #005da9;\r\n color: #82298F;\r\n font-weight: bold;\r\n}\r\n\r\n\r\n.rounded-input {\r\n margin-top: 15px;\r\n background-color: #f4f6fc;\r\n /* Color de fondo suave */\r\n border-radius: 10px;\r\n /* Bordes redondeados */\r\n padding: 5px 5px;\r\n /* Espaciado interno */\r\n box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);\r\n /* Sombra suave */\r\n --ion-border-color: transparent;\r\n /* Quita cualquier borde por defecto */\r\n}\r\n\r\n:host ion-input {\r\n text-align: center;\r\n color: #F38301;\r\n --padding-start: 8px;\r\n}\r\n\r\n:host .custom-footer {\r\n position: fixed;\r\n bottom: 0;\r\n left: 0;\r\n width: 100%;\r\n padding: 10px;\r\n display: flex;\r\n justify-content: space-between;\r\n background-color: #ffffff;\r\n}\r\n\r\n:host .custom-footer ion-button {\r\n flex: 0 0 48%;\r\n}\r\n\r\n:host .custom-footer .left-button {\r\n max-width: 140px;\r\n color: black;\r\n --background: white;\r\n --color: #82298F;\r\n --border-radius: 20px;\r\n --border-color: white;\r\n margin-right: auto;\r\n --box-shadow: 0 2px 6px 0 rgb(0, 0, 0, 0.0);\r\n}\r\n\r\n:host .custom-footer .right-button {\r\n margin-left: auto;\r\n}\r\n\r\n.tutorial-head {\r\n padding-top: 50px;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n color: black;\r\n}\r\n\r\n.center-container {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n height: 60vh;\r\n /* Ajusta este valor si quieres m\u00E1s o menos espacio vertical */\r\n width: 100%;\r\n}\r\n\r\n.tutorial-title {\r\n text-align: center;\r\n}\r\n\r\n.rounded-input ion-input {\r\n font-size: 14px;\r\n /* Tama\u00F1o de texto */\r\n color: #333;\r\n /* Color del texto */\r\n}\r\n\r\n.rounded-input::part(native) {\r\n background: transparent;\r\n /* Fondo transparente para evitar conflictos */\r\n}\r\n\r\n.p-info {\r\n font-weight: bold;\r\n color: #714e93\r\n}\r\n\r\n.custom-button {\r\n --background: var(--purple-primary, #82298F) !important;\r\n --background-hover: var(--purple-secondary, #2b0d30) !important;\r\n --background-activated: var(--purple-secondary, #2b0d30) !important;\r\n --color: #ffffff !important;\r\n --border-radius: 20px !important;\r\n --padding-top: 10px !important;\r\n --padding-bottom: 10px !important;\r\n --box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.25) !important;\r\n text-transform: none;\r\n pointer-events: auto;\r\n\r\n}\r\n\r\n//blur effect\r\n\r\n.blur-effect {\r\n filter: blur(5px);\r\n pointer-events: none;\r\n}\r\n\r\n.blur-overlay {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 100%;\r\n background-color: rgba(255, 255, 255, 0.7);\r\n z-index: 999;\r\n filter: blur(5px);\r\n}\r\n\r\n.boton-personalizado {\r\n background-color: #4caf50;\r\n /* Verde, por ejemplo */\r\n color: white;\r\n font-size: 16px;\r\n}\r\n\r\n.version {\r\n position: fixed;\r\n bottom: 10px;\r\n right: 10px;\r\n font-size: 12px;\r\n color: #888;\r\n z-index: 1000;\r\n}\r\n\r\n.button-debug {\r\n --background: #ff4081;\r\n --color: #fff;\r\n}\r\n\r\n\r\n.wrapper-no-internet {\r\n background-color: #fff;\r\n height: 100vh;\r\n display: flex;\r\n justify-content: center; /* centra en eje vertical */\r\n align-items: center; /* centra en eje horizontal */\r\n padding: 40px;\r\n background-image: url('assets/imagesIdvision/background.png') !important;\r\n background-size: cover;\r\n background-repeat: no-repeat;\r\n background-position: center;\r\n \r\n}\r\n\r\n.content-no-internet {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n text-align: center;\r\n gap: 16px;\r\n}\r\n\r\n.title-no-internet{\r\n color: #000;\r\n font-size: 32px;\r\n font-weight: bold;\r\n}\r\n\r\n.icon-no-internet {\r\n width: 125px;\r\n display: block;\r\n margin-top: 25px;\r\n}\r\n\r\n.description-no-internet {\r\n margin-top: 25px;\r\n font-size: 22px;\r\n color: #000;\r\n line-height: 1.5;\r\n text-align: center;\r\n}\r\n.no-border{\r\n --border-width: 0 !important;\r\n}\r\n\r\n.confirmation-screen {\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: space-between;\r\n height: 100vh; \r\n padding: 25px;\r\n box-sizing: border-box;\r\n background-image: url('assets/imagesIdvision/background.png');\r\n background-size: cover;\r\n background-repeat: no-repeat;\r\n background-position: center;\r\n background-color: white;\r\n}\r\n\r\n.image-confirmation {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n flex-grow: 1;\r\n width: 100%;\r\n}\r\n\r\n.image-confirmation img {\r\n max-width: 500px;\r\n width: 80%;\r\n height: auto;\r\n}\r\n\r\n\r\n.close-button {\r\n position: absolute;\r\n top: 12px;\r\n right: 12px; \r\n z-index: 1000;\r\n font-size: 15px;\r\n --color: #888; \r\n}\r\n\r\n.p-margin {\r\n margin-top: 50px !important;\r\n}\r\n\r\n"], encapsulation: 2 }); }
1386
- }
1387
- (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(IdVisionComponent, [{
1388
- type: Component,
1389
- args: [{ selector: 'app-id-vision', standalone: true, schemas: [CUSTOM_ELEMENTS_SCHEMA], imports: [IonicModule, CommonModule, HttpClientModule], providers: [DpiService, ConfigurationService, ValidationService, NavigationService, ProcessingService], encapsulation: ViewEncapsulation.None, template: "\r\n\r\n<ion-content [style.display]=\"hasInternet ? 'block' : 'none'\">\r\n \r\n <swiper-container *ngIf=\"!simpleProcess\" init=\"false\" class=\"custom-swiper\" #swiperContainer>\r\n\r\n <!-- \uD83D\uDD39 PASO 1: Verificaci\u00F3n de Identidad (Est\u00E1tico) -->\r\n <swiper-slide *ngIf=\"!simpleProcess\">\r\n <div class=\"content\">\r\n <div class=\"head\">\r\n <h2 class=\"h-title\">Verifiquemos tu identidad</h2>\r\n <p class=\"p-justify p-margin\">Para completar tu verificaci\u00F3n, por favor ingresa tu n\u00FAmero de identificaci\u00F3n (DPI).</p>\r\n <ion-item class=\"rounded-input\">\r\n <ion-input #dpi type=\"number\" disabled=\"true\" placeholder=\"Digita tu n\u00FAmero de DPI\"></ion-input>\r\n </ion-item>\r\n </div>\r\n <ion-grid class=\"verify-container\">\r\n <ion-row>\r\n <div class=\"image-container\">\r\n <img src=\"assets/imagesIdvision/documentsImage.png\" alt=\"\" />\r\n </div>\r\n <div class=\"container-text\">\r\n <p class=\"p-justify\">Sube fotos de documentos que prueben tu identidad</p>\r\n </div>\r\n </ion-row>\r\n <ion-row>\r\n <div class=\"image-container\">\r\n <img src=\"assets/imagesIdvision/rostroImage.png\" alt=\"\" />\r\n </div>\r\n <div class=\"container-text\">\r\n <p class=\"p-justify\">Graba un video selfie, mant\u00E9n tu rostro centrado en la pantalla y evita moverte.</p>\r\n </div>\r\n </ion-row>\r\n </ion-grid>\r\n <div class=\"fixed-footer\">\r\n <ion-button class=\"custom-button\" expand=\"block\" (click)=\"handleClick()\">Empecemos</ion-button>\r\n </div>\r\n </div>\r\n </swiper-slide>\r\n\r\n <!-- \uD83D\uDD39 PASOS INTERMEDIOS: Se generan din\u00E1micamente seg\u00FAn el `order` -->\r\n <swiper-slide *ngFor=\"let step of validationConfig\">\r\n <div class=\"content\" [ngClass]=\"{'content-simple-process': simpleProcess}\" [ngSwitch]=\"step.type\">\r\n <!--Acuerdo de video-->\r\n <div *ngSwitchCase=\"1\" [ngClass]=\"{'blur-effect': simpleProcess}\">\r\n <div class=\"head\">\r\n <h2 class=\"h-title\">Acuerdo de v\u00EDdeo</h2>\r\n <p class=\"p-justify\">Graba un breve video para completar tu proceso de identificaci\u00F3n.</p>\r\n </div>\r\n <ion-grid class=\"verify-container\">\r\n <ion-row>\r\n <div class=\"image-container\">\r\n <img src=\"assets/imagesIdvision/Foco.png\" alt=\"\" />\r\n </div>\r\n <div class=\"container-text\">\r\n <p>Si est\u00E1s en interiores, aseg\u00FArate de que la luz est\u00E9 frente a ti, no detr\u00E1s.</p>\r\n </div>\r\n </ion-row>\r\n <ion-row>\r\n <div class=\"image-container\">\r\n <img src=\"assets/imagesIdvision/rostroImage.png\" alt=\"\" />\r\n </div>\r\n <div class=\"container-text\">\r\n <p>Aseg\u00FArate de que tu rostro sea visible y de no usar anteojos ni sombreros.</p>\r\n </div>\r\n </ion-row>\r\n </ion-grid>\r\n <div class=\"fixed-footer\">\r\n <ion-button class=\"custom-button\" expand=\"block\" (click)=\"step.action()\">Abrir la c\u00E1mara</ion-button>\r\n </div>\r\n </div>\r\n <!-- \uD83D\uDD39 DPI Frontal -->\r\n <div *ngSwitchCase=\"2\">\r\n <div class=\"head\">\r\n <h2 class=\"h-title\">Coloca la parte frontal de tu DPI</h2>\r\n <p class=\"p-center p-info p-margin\">Evita sombras, reflejos y coloca tu documento dentro del recuadro.</p>\r\n </div>\r\n <div class=\"dpi-container\">\r\n <img src=\"assets/imagesIdvision/dpi-front-1.png\" alt=\"\" />\r\n </div>\r\n <div class=\"fixed-footer\">\r\n <ion-button class=\"custom-button\" expand=\"block\" (click)=\"step.action()\">Tomar una foto</ion-button>\r\n </div>\r\n </div>\r\n\r\n <!-- \uD83D\uDD39 DPI Trasero -->\r\n <div *ngSwitchCase=\"3\">\r\n <div class=\"head\">\r\n <h2 class=\"h-title\">Coloca el reverso de tu DPI</h2>\r\n <p class=\"p-center p-info p-margin\">Evita sombras, reflejos y coloca tu documento dentro del recuadro.</p>\r\n </div>\r\n <div class=\"dpi-container\">\r\n <img src=\"assets/imagesIdvision/dpi-back-1.png\" alt=\"\" />\r\n </div>\r\n <div class=\"fixed-footer\">\r\n <ion-button class=\"custom-button\" expand=\"block\" (click)=\"step.action()\">Tomar una foto</ion-button>\r\n </div>\r\n </div>\r\n\r\n <!-- \uD83D\uDD39 Video Selfie -->\r\n <div *ngSwitchCase=\"4\">\r\n <div class=\"head\">\r\n <h2 class=\"h-title\">Video Selfie</h2>\r\n <p class=\"p-justify p-margin\">Graba un breve video para completar tu proceso de identificaci\u00F3n.</p>\r\n </div>\r\n <ion-grid class=\"verify-container\">\r\n <ion-row>\r\n <ion-row>\r\n <div class=\"image-container\">\r\n <img src=\"assets/imagesIdvision/Foco.png\" alt=\"\" />\r\n </div>\r\n <div class=\"container-text\">\r\n <p class=\"p-justify\">Si est\u00E1s en interiores, aseg\u00FArate de que la luz est\u00E9 frente a ti, no detr\u00E1s.</p>\r\n </div>\r\n </ion-row>\r\n <ion-row>\r\n <div class=\"image-container\">\r\n <img src=\"assets/imagesIdvision/rostroImage.png\" alt=\"\" />\r\n </div>\r\n <div class=\"container-text\">\r\n <p class=\"p-justify\">Aseg\u00FArate de que tu rostro sea visible y de no usar anteojos ni sombreros.</p>\r\n </div>\r\n </ion-row>\r\n </ion-row>\r\n </ion-grid>\r\n <div class=\"fixed-footer\">\r\n <ion-button class=\"custom-button\" expand=\"block\" (click)=\"step.action()\">Abrir la c\u00E1mara</ion-button>\r\n </div>\r\n </div>\r\n <!-- Photo Selfie -->\r\n <!-- TODO Se debera cambiar a 5, se dejo 1 por acuerdo de video -->\r\n <div *ngSwitchCase=\"5\">\r\n <div class=\"head\">\r\n <h2 class=\"h-title\">Foto Selfie</h2>\r\n <p class=\"p-justify\">Toma una foto para completar tu proceso de identificaci\u00F3n.</p>\r\n </div>\r\n <ion-grid class=\"verify-container\">\r\n <ion-row>\r\n <ion-row>\r\n <div class=\"image-container\">\r\n <img src=\"assets/imagesIdvision/Foco.png\" alt=\"\" />\r\n </div>\r\n <div class=\"container-text\">\r\n <p>Si est\u00E1s en interiores, aseg\u00FArate de que la luz est\u00E9 frente a ti, no detr\u00E1s.</p>\r\n </div>\r\n </ion-row>\r\n <ion-row>\r\n <div class=\"image-container\">\r\n <img src=\"assets/imagesIdvision/rostroImage.png\" alt=\"\" />\r\n </div>\r\n <div class=\"container-text\">\r\n <p>Aseg\u00FArate de que tu rostro sea visible y de no usar anteojos ni sombreros.</p>\r\n </div>\r\n </ion-row>\r\n </ion-row>\r\n </ion-grid>\r\n <div class=\"fixed-footer\">\r\n <ion-button class=\"custom-button\" expand=\"block\" (click)=\"step.action()\">Abrir la c\u00E1mara</ion-button>\r\n </div>\r\n </div>\r\n <div *ngSwitchDefault>\r\n <h2>Paso desconocido</h2>\r\n </div>\r\n </div>\r\n </swiper-slide>\r\n <swiper-slide>\r\n <div class=\"confirmation-screen\">\r\n <div class=\"font-confirmation\" *ngIf=\"isValid\">\r\n <p class=\"font-confirmation\">Informaci\u00F3n procesada de manera correcta</p>\r\n </div>\r\n <div class=\"font-confirmation\" *ngIf=\"!isValid\">\r\n <p class=\"font-confirmation\">Ocurri\u00F3 un error al procesar la informaci\u00F3n</p>\r\n </div>\r\n <div class=\"image-confirmation\">\r\n <img src=\"assets/imagesIdvision/blue-check.png\" alt=\"Check morado\" />\r\n </div>\r\n <div class=\"button-container\">\r\n <ion-button class=\"custom-button\" expand=\"block\" (click)=\"handleExit()\">Salir</ion-button>\r\n </div>\r\n </div>\r\n\r\n\r\n </swiper-slide>\r\n\r\n </swiper-container>\r\n <div class=\"version\">{{versionSDK}} {{configEnv.show_label ? configEnv.env_name: ''}}</div>\r\n <ion-fab vertical=\"top\" horizontal=\"end\" slot=\"fixed\" *ngIf=\"showDebug\">\r\n <ion-fab-button class=\"button-debug\" (click)=\"copyProccess()\">\r\n <ion-icon name=\"bug-outline\"></ion-icon>\r\n </ion-fab-button>\r\n </ion-fab>\r\n\r\n</ion-content>\r\n<!-- pantalla para cuando no exista internet -->\r\n<ion-content [style.display]=\"!hasInternet ? 'block' : 'none'\">\r\n <div class=\"wrapper-no-internet\">\r\n <div class=\"content-no-internet\">\r\n <h2 class=\"title-no-internet\">Error de conexi\u00F3n</h2>\r\n <img src=\"assets/imagesIdvision/no-internet.svg\" alt=\"Error conexi\u00F3n img\" class=\"icon-no-internet\" />\r\n <p class=\"description-no-internet\">\r\n No pudimos cargar la p\u00E1gina. <br>\r\n Verifica tu internet y prueba de nuevo.\r\n </p>\r\n </div>\r\n </div>\r\n</ion-content>", styles: ["// ============================================\r\n// ESTILOS AISLADOS DEL SDK - NO AFECTAN AL PADRE\r\n// ============================================\r\n// Usamos :host para encapsular todo dentro del componente\r\n// y evitar que los estilos globales del padre nos afecten\r\n\r\n:host {\r\n display: block;\r\n position: relative;\r\n width: 100%;\r\n height: 100%;\r\n \r\n // Reset de estilos globales del padre\r\n * {\r\n box-sizing: border-box;\r\n }\r\n}\r\n\r\n.content {\r\n padding: 10px;\r\n align-items: center;\r\n justify-content: center;\r\n height: 90vh;\r\n background-color: #fff;\r\n font-size: 18px;\r\n background-image: url('assets/imagesIdvision/background.png');\r\n background-size: cover;\r\n background-repeat: no-repeat;\r\n background-position: center;\r\n}\r\n\r\n// Cuando es simpleProcess, levanta el contenido un 10%\r\n.content-simple-process {\r\n margin-top: 10vh;\r\n height: 90vh;\r\n}\r\n\r\n.h-title {\r\n font-size: 1.5em;\r\n font-weight: bold;\r\n color: #F38301;\r\n text-align: center;\r\n margin-top: 20px;\r\n}\r\n\r\n:host p {\r\n font-size: 1em;\r\n color: #666;\r\n text-align: center;\r\n margin: 0;\r\n}\r\n\r\n:host ion-grid {\r\n margin-top: 20px;\r\n}\r\n\r\n:host ion-row {\r\n margin: 15px 0;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n}\r\n\r\n:host ion-col {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n text-align: center;\r\n}\r\n\r\n:host ion-icon {\r\n font-size: 3em;\r\n color: #ff8c00;\r\n margin-bottom: 10px;\r\n}\r\n\r\n.container-text {\r\n text-align: justify !important;\r\n width: 180px;\r\n}\r\n\r\n:host p {\r\n text-align: start;\r\n}\r\n\r\n.p-center {\r\n text-align: center;\r\n}\r\n\r\n.p-justify {\r\n text-align: start;\r\n}\r\n\r\n.head {\r\n padding: 20px;\r\n margin-top: 20px;\r\n margin-bottom: 80px;\r\n}\r\n\r\n\r\n.verify-container {\r\n // padding: 60px;\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n justify-content: center;\r\n height: 40%; // Ocupa todo el espacio disponible en el ion-content\r\n text-align: center;\r\n //background-color: black;\r\n}\r\n\r\n.fixed-footer {\r\n position: fixed;\r\n bottom: 0;\r\n left: 0;\r\n width: 100%;\r\n padding: 0px 10px 25px 10px;\r\n // background-color: black; // Color de fondo, opcional\r\n // box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1); // Sombra suave para que resalte\r\n\r\n ion-button {\r\n width: 90%;\r\n max-width: 300px;\r\n margin: 0 auto;\r\n background-color: #ffcc00;\r\n color: #ffffff;\r\n font-weight: bold;\r\n border-radius: 20px;\r\n\r\n &:hover {\r\n background-color: #ffb300;\r\n }\r\n\r\n &:active {\r\n background-color: #e6a800;\r\n }\r\n }\r\n}\r\n\r\n.dpi-container {\r\n display: flex;\r\n //width: 100%;\r\n justify-content: center;\r\n align-items: center;\r\n height: 45vh;\r\n}\r\n\r\n.dpi-image {\r\n width: 200px;\r\n}\r\n\r\n.image-container {\r\n width: 100px;\r\n max-width: 90px;\r\n}\r\n\r\n.col-confirmation {\r\n margin-top: 100px;\r\n padding: 20px;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 20px;\r\n /* Ajusta el espacio entre los elementos */\r\n}\r\n\r\n.image-item {\r\n margin-top: 50px;\r\n padding-top: 70px;\r\n}\r\n\r\n.font-confirmation {\r\n font-size: 26px;\r\n text-align: center;\r\n // color: #005da9;\r\n color: #82298F;\r\n font-weight: bold;\r\n}\r\n\r\n\r\n.rounded-input {\r\n margin-top: 15px;\r\n background-color: #f4f6fc;\r\n /* Color de fondo suave */\r\n border-radius: 10px;\r\n /* Bordes redondeados */\r\n padding: 5px 5px;\r\n /* Espaciado interno */\r\n box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);\r\n /* Sombra suave */\r\n --ion-border-color: transparent;\r\n /* Quita cualquier borde por defecto */\r\n}\r\n\r\n:host ion-input {\r\n text-align: center;\r\n color: #F38301;\r\n --padding-start: 8px;\r\n}\r\n\r\n:host .custom-footer {\r\n position: fixed;\r\n bottom: 0;\r\n left: 0;\r\n width: 100%;\r\n padding: 10px;\r\n display: flex;\r\n justify-content: space-between;\r\n background-color: #ffffff;\r\n}\r\n\r\n:host .custom-footer ion-button {\r\n flex: 0 0 48%;\r\n}\r\n\r\n:host .custom-footer .left-button {\r\n max-width: 140px;\r\n color: black;\r\n --background: white;\r\n --color: #82298F;\r\n --border-radius: 20px;\r\n --border-color: white;\r\n margin-right: auto;\r\n --box-shadow: 0 2px 6px 0 rgb(0, 0, 0, 0.0);\r\n}\r\n\r\n:host .custom-footer .right-button {\r\n margin-left: auto;\r\n}\r\n\r\n.tutorial-head {\r\n padding-top: 50px;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n color: black;\r\n}\r\n\r\n.center-container {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n height: 60vh;\r\n /* Ajusta este valor si quieres m\u00E1s o menos espacio vertical */\r\n width: 100%;\r\n}\r\n\r\n.tutorial-title {\r\n text-align: center;\r\n}\r\n\r\n.rounded-input ion-input {\r\n font-size: 14px;\r\n /* Tama\u00F1o de texto */\r\n color: #333;\r\n /* Color del texto */\r\n}\r\n\r\n.rounded-input::part(native) {\r\n background: transparent;\r\n /* Fondo transparente para evitar conflictos */\r\n}\r\n\r\n.p-info {\r\n font-weight: bold;\r\n color: #714e93\r\n}\r\n\r\n.custom-button {\r\n --background: var(--purple-primary, #82298F) !important;\r\n --background-hover: var(--purple-secondary, #2b0d30) !important;\r\n --background-activated: var(--purple-secondary, #2b0d30) !important;\r\n --color: #ffffff !important;\r\n --border-radius: 20px !important;\r\n --padding-top: 10px !important;\r\n --padding-bottom: 10px !important;\r\n --box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.25) !important;\r\n text-transform: none;\r\n pointer-events: auto;\r\n\r\n}\r\n\r\n//blur effect\r\n\r\n.blur-effect {\r\n filter: blur(5px);\r\n pointer-events: none;\r\n}\r\n\r\n.blur-overlay {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 100%;\r\n background-color: rgba(255, 255, 255, 0.7);\r\n z-index: 999;\r\n filter: blur(5px);\r\n}\r\n\r\n.boton-personalizado {\r\n background-color: #4caf50;\r\n /* Verde, por ejemplo */\r\n color: white;\r\n font-size: 16px;\r\n}\r\n\r\n.version {\r\n position: fixed;\r\n bottom: 10px;\r\n right: 10px;\r\n font-size: 12px;\r\n color: #888;\r\n z-index: 1000;\r\n}\r\n\r\n.button-debug {\r\n --background: #ff4081;\r\n --color: #fff;\r\n}\r\n\r\n\r\n.wrapper-no-internet {\r\n background-color: #fff;\r\n height: 100vh;\r\n display: flex;\r\n justify-content: center; /* centra en eje vertical */\r\n align-items: center; /* centra en eje horizontal */\r\n padding: 40px;\r\n background-image: url('assets/imagesIdvision/background.png') !important;\r\n background-size: cover;\r\n background-repeat: no-repeat;\r\n background-position: center;\r\n \r\n}\r\n\r\n.content-no-internet {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n text-align: center;\r\n gap: 16px;\r\n}\r\n\r\n.title-no-internet{\r\n color: #000;\r\n font-size: 32px;\r\n font-weight: bold;\r\n}\r\n\r\n.icon-no-internet {\r\n width: 125px;\r\n display: block;\r\n margin-top: 25px;\r\n}\r\n\r\n.description-no-internet {\r\n margin-top: 25px;\r\n font-size: 22px;\r\n color: #000;\r\n line-height: 1.5;\r\n text-align: center;\r\n}\r\n.no-border{\r\n --border-width: 0 !important;\r\n}\r\n\r\n.confirmation-screen {\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: space-between;\r\n height: 100vh; \r\n padding: 25px;\r\n box-sizing: border-box;\r\n background-image: url('assets/imagesIdvision/background.png');\r\n background-size: cover;\r\n background-repeat: no-repeat;\r\n background-position: center;\r\n background-color: white;\r\n}\r\n\r\n.image-confirmation {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n flex-grow: 1;\r\n width: 100%;\r\n}\r\n\r\n.image-confirmation img {\r\n max-width: 500px;\r\n width: 80%;\r\n height: auto;\r\n}\r\n\r\n\r\n.close-button {\r\n position: absolute;\r\n top: 12px;\r\n right: 12px; \r\n z-index: 1000;\r\n font-size: 15px;\r\n --color: #888; \r\n}\r\n\r\n.p-margin {\r\n margin-top: 50px !important;\r\n}\r\n\r\n"] }]
1390
- }], () => [{ type: i1.ModalController }, { type: i1.AlertController }, { type: i1.Platform }, { type: i2.ModalDpiServices }, { type: i3.SdkCommunicationService }, { type: i1.NavController }, { type: i0.ChangeDetectorRef }, { type: i1.ToastController }, { type: i1.LoadingController }, { type: i4.ConfigurationService }, { type: i5.ValidationService }, { type: i6.NavigationService }, { type: i7.ProcessingService }, { type: i8.DpiService }], { dpi: [{
1391
- type: ViewChild,
1392
- args: ['dpi', { static: false }]
1393
- }], swiperContainerRef: [{
1394
- type: ViewChild,
1395
- args: ['swiperContainer', { static: false, read: ElementRef }]
1396
- }], isSwipe: [{
1397
- type: Input
1398
- }], dpiCode: [{
1399
- type: Input
1400
- }], connection: [{
1401
- type: Input
1402
- }], apikey: [{
1403
- type: Input
1404
- }], env: [{
1405
- type: Input
1406
- }], validationConfig: [{
1407
- type: Input
1408
- }] }); })();
1409
- (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(IdVisionComponent, { className: "IdVisionComponent", filePath: "src\\app\\pages\\id-vision\\id-vision.component.ts", lineNumber: 55 }); })();
1
+ import { CommonModule } from '@angular/common';
2
+ import { HttpClientModule } from '@angular/common/http';
3
+ import { Component, CUSTOM_ELEMENTS_SCHEMA, Input, signal, ViewChild, ElementRef, ViewEncapsulation, } from '@angular/core';
4
+ import { IonicModule } from '@ionic/angular';
5
+ import { Clipboard } from '@capacitor/clipboard';
6
+ import { CameraWithOverlayComponent } from './components/camera-with-overlay/camera-with-overlay.component';
7
+ import { CamaraVideoSelfieComponent } from './components/camara-video-selfie/camara-video-selfie.component';
8
+ import { PhotoSelfieCameraComponent } from './components/photo-selfie-camera/photo-selfie-camera.component';
9
+ import { CamaraAcuerdoVideoComponent } from './components/camara-acuerdo-video/camara-acuerdo.video.component';
10
+ import { SimpleAcuerdoVideoComponent } from './components/simple-acuerdo-video/simple-acuerdo-video.component';
11
+ import { App } from '@capacitor/app';
12
+ import { ConfigurationService } from './services/configuration/configuration.service';
13
+ import { ValidationService } from './services/validation/validation.service';
14
+ import { NavigationService } from './services/navigation/navigation.service';
15
+ import { ProcessingService } from './services/processing/processing.service';
16
+ import { DpiService } from './services/dpi/dpi-service.service';
17
+ import { register } from './../../../swiper-wrapper';
18
+ import { DirectPhotoSelfieComponent } from './components/direct-photo-selfie/direct-photo-selfie.component';
19
+ import * as i0 from "@angular/core";
20
+ import * as i1 from "@ionic/angular";
21
+ import * as i2 from "./services/modal-services/modal-dpi-services";
22
+ import * as i3 from "./services/modal-services/sdk-communication-services";
23
+ import * as i4 from "./services/configuration/configuration.service";
24
+ import * as i5 from "./services/validation/validation.service";
25
+ import * as i6 from "./services/navigation/navigation.service";
26
+ import * as i7 from "./services/processing/processing.service";
27
+ import * as i8 from "./services/dpi/dpi-service.service";
28
+ import * as i9 from "@angular/common";
29
+ const _c0 = ["dpi"];
30
+ const _c1 = ["swiperContainer"];
31
+ const _c2 = a0 => ({ "content-simple-process": a0 });
32
+ const _c3 = a0 => ({ "blur-effect": a0 });
33
+ function IdVisionComponent_swiper_container_1_swiper_slide_2_Template(rf, ctx) { if (rf & 1) {
34
+ const _r2 = i0.ɵɵgetCurrentView();
35
+ i0.ɵɵelementStart(0, "swiper-slide")(1, "div", 19)(2, "div", 20)(3, "h2", 21);
36
+ i0.ɵɵtext(4, "Verifiquemos tu identidad");
37
+ i0.ɵɵelementEnd();
38
+ i0.ɵɵelementStart(5, "p", 22);
39
+ i0.ɵɵtext(6, "Para completar tu verificaci\u00F3n, por favor ingresa tu n\u00FAmero de identificaci\u00F3n (DPI).");
40
+ i0.ɵɵelementEnd();
41
+ i0.ɵɵelementStart(7, "ion-item", 23);
42
+ i0.ɵɵelement(8, "ion-input", 24, 1);
43
+ i0.ɵɵelementEnd()();
44
+ i0.ɵɵelementStart(10, "ion-grid", 25)(11, "ion-row")(12, "div", 26);
45
+ i0.ɵɵelement(13, "img", 27);
46
+ i0.ɵɵelementEnd();
47
+ i0.ɵɵelementStart(14, "div", 28)(15, "p", 29);
48
+ i0.ɵɵtext(16, "Sube fotos de documentos que prueben tu identidad");
49
+ i0.ɵɵelementEnd()()();
50
+ i0.ɵɵelementStart(17, "ion-row")(18, "div", 26);
51
+ i0.ɵɵelement(19, "img", 30);
52
+ i0.ɵɵelementEnd();
53
+ i0.ɵɵelementStart(20, "div", 28)(21, "p", 29);
54
+ i0.ɵɵtext(22, "Graba un video selfie, mant\u00E9n tu rostro centrado en la pantalla y evita moverte.");
55
+ i0.ɵɵelementEnd()()()();
56
+ i0.ɵɵelementStart(23, "div", 31)(24, "ion-button", 18);
57
+ i0.ɵɵlistener("click", function IdVisionComponent_swiper_container_1_swiper_slide_2_Template_ion_button_click_24_listener() { i0.ɵɵrestoreView(_r2); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.handleClick()); });
58
+ i0.ɵɵtext(25, "Empecemos");
59
+ i0.ɵɵelementEnd()()()();
60
+ } }
61
+ function IdVisionComponent_swiper_container_1_swiper_slide_3_div_2_Template(rf, ctx) { if (rf & 1) {
62
+ const _r4 = i0.ɵɵgetCurrentView();
63
+ i0.ɵɵelementStart(0, "div", 36)(1, "div", 20)(2, "h2", 21);
64
+ i0.ɵɵtext(3, "Acuerdo de v\u00EDdeo");
65
+ i0.ɵɵelementEnd();
66
+ i0.ɵɵelementStart(4, "p", 29);
67
+ i0.ɵɵtext(5, "Graba un breve video para completar tu proceso de identificaci\u00F3n.");
68
+ i0.ɵɵelementEnd()();
69
+ i0.ɵɵelementStart(6, "ion-grid", 25)(7, "ion-row")(8, "div", 26);
70
+ i0.ɵɵelement(9, "img", 37);
71
+ i0.ɵɵelementEnd();
72
+ i0.ɵɵelementStart(10, "div", 28)(11, "p");
73
+ i0.ɵɵtext(12, "Si est\u00E1s en interiores, aseg\u00FArate de que la luz est\u00E9 frente a ti, no detr\u00E1s.");
74
+ i0.ɵɵelementEnd()()();
75
+ i0.ɵɵelementStart(13, "ion-row")(14, "div", 26);
76
+ i0.ɵɵelement(15, "img", 30);
77
+ i0.ɵɵelementEnd();
78
+ i0.ɵɵelementStart(16, "div", 28)(17, "p");
79
+ i0.ɵɵtext(18, "Aseg\u00FArate de que tu rostro sea visible y de no usar anteojos ni sombreros.");
80
+ i0.ɵɵelementEnd()()()();
81
+ i0.ɵɵelementStart(19, "div", 31)(20, "ion-button", 18);
82
+ i0.ɵɵlistener("click", function IdVisionComponent_swiper_container_1_swiper_slide_3_div_2_Template_ion_button_click_20_listener() { i0.ɵɵrestoreView(_r4); const step_r5 = i0.ɵɵnextContext().$implicit; return i0.ɵɵresetView(step_r5.action()); });
83
+ i0.ɵɵtext(21, "Abrir la c\u00E1mara");
84
+ i0.ɵɵelementEnd()()();
85
+ } if (rf & 2) {
86
+ const ctx_r2 = i0.ɵɵnextContext(3);
87
+ i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(1, _c3, ctx_r2.simpleProcess));
88
+ } }
89
+ function IdVisionComponent_swiper_container_1_swiper_slide_3_div_3_Template(rf, ctx) { if (rf & 1) {
90
+ const _r6 = i0.ɵɵgetCurrentView();
91
+ i0.ɵɵelementStart(0, "div")(1, "div", 20)(2, "h2", 21);
92
+ i0.ɵɵtext(3, "Coloca la parte frontal de tu DPI");
93
+ i0.ɵɵelementEnd();
94
+ i0.ɵɵelementStart(4, "p", 38);
95
+ i0.ɵɵtext(5, "Evita sombras, reflejos y coloca tu documento dentro del recuadro.");
96
+ i0.ɵɵelementEnd()();
97
+ i0.ɵɵelementStart(6, "div", 39);
98
+ i0.ɵɵelement(7, "img", 40);
99
+ i0.ɵɵelementEnd();
100
+ i0.ɵɵelementStart(8, "div", 31)(9, "ion-button", 18);
101
+ i0.ɵɵlistener("click", function IdVisionComponent_swiper_container_1_swiper_slide_3_div_3_Template_ion_button_click_9_listener() { i0.ɵɵrestoreView(_r6); const step_r5 = i0.ɵɵnextContext().$implicit; return i0.ɵɵresetView(step_r5.action()); });
102
+ i0.ɵɵtext(10, "Tomar una foto");
103
+ i0.ɵɵelementEnd()()();
104
+ } }
105
+ function IdVisionComponent_swiper_container_1_swiper_slide_3_div_4_Template(rf, ctx) { if (rf & 1) {
106
+ const _r7 = i0.ɵɵgetCurrentView();
107
+ i0.ɵɵelementStart(0, "div")(1, "div", 20)(2, "h2", 21);
108
+ i0.ɵɵtext(3, "Coloca el reverso de tu DPI");
109
+ i0.ɵɵelementEnd();
110
+ i0.ɵɵelementStart(4, "p", 38);
111
+ i0.ɵɵtext(5, "Evita sombras, reflejos y coloca tu documento dentro del recuadro.");
112
+ i0.ɵɵelementEnd()();
113
+ i0.ɵɵelementStart(6, "div", 39);
114
+ i0.ɵɵelement(7, "img", 41);
115
+ i0.ɵɵelementEnd();
116
+ i0.ɵɵelementStart(8, "div", 31)(9, "ion-button", 18);
117
+ i0.ɵɵlistener("click", function IdVisionComponent_swiper_container_1_swiper_slide_3_div_4_Template_ion_button_click_9_listener() { i0.ɵɵrestoreView(_r7); const step_r5 = i0.ɵɵnextContext().$implicit; return i0.ɵɵresetView(step_r5.action()); });
118
+ i0.ɵɵtext(10, "Tomar una foto");
119
+ i0.ɵɵelementEnd()()();
120
+ } }
121
+ function IdVisionComponent_swiper_container_1_swiper_slide_3_div_5_Template(rf, ctx) { if (rf & 1) {
122
+ const _r8 = i0.ɵɵgetCurrentView();
123
+ i0.ɵɵelementStart(0, "div")(1, "div", 20)(2, "h2", 21);
124
+ i0.ɵɵtext(3, "Video Selfie");
125
+ i0.ɵɵelementEnd();
126
+ i0.ɵɵelementStart(4, "p", 22);
127
+ i0.ɵɵtext(5, "Graba un breve video para completar tu proceso de identificaci\u00F3n.");
128
+ i0.ɵɵelementEnd()();
129
+ i0.ɵɵelementStart(6, "ion-grid", 25)(7, "ion-row")(8, "ion-row")(9, "div", 26);
130
+ i0.ɵɵelement(10, "img", 37);
131
+ i0.ɵɵelementEnd();
132
+ i0.ɵɵelementStart(11, "div", 28)(12, "p", 29);
133
+ i0.ɵɵtext(13, "Si est\u00E1s en interiores, aseg\u00FArate de que la luz est\u00E9 frente a ti, no detr\u00E1s.");
134
+ i0.ɵɵelementEnd()()();
135
+ i0.ɵɵelementStart(14, "ion-row")(15, "div", 26);
136
+ i0.ɵɵelement(16, "img", 30);
137
+ i0.ɵɵelementEnd();
138
+ i0.ɵɵelementStart(17, "div", 28)(18, "p", 29);
139
+ i0.ɵɵtext(19, "Aseg\u00FArate de que tu rostro sea visible y de no usar anteojos ni sombreros.");
140
+ i0.ɵɵelementEnd()()()()();
141
+ i0.ɵɵelementStart(20, "div", 31)(21, "ion-button", 18);
142
+ i0.ɵɵlistener("click", function IdVisionComponent_swiper_container_1_swiper_slide_3_div_5_Template_ion_button_click_21_listener() { i0.ɵɵrestoreView(_r8); const step_r5 = i0.ɵɵnextContext().$implicit; return i0.ɵɵresetView(step_r5.action()); });
143
+ i0.ɵɵtext(22, "Abrir la c\u00E1mara");
144
+ i0.ɵɵelementEnd()()();
145
+ } }
146
+ function IdVisionComponent_swiper_container_1_swiper_slide_3_div_6_Template(rf, ctx) { if (rf & 1) {
147
+ const _r9 = i0.ɵɵgetCurrentView();
148
+ i0.ɵɵelementStart(0, "div")(1, "div", 20)(2, "h2", 21);
149
+ i0.ɵɵtext(3, "Foto Selfie");
150
+ i0.ɵɵelementEnd();
151
+ i0.ɵɵelementStart(4, "p", 29);
152
+ i0.ɵɵtext(5, "Toma una foto para completar tu proceso de identificaci\u00F3n.");
153
+ i0.ɵɵelementEnd()();
154
+ i0.ɵɵelementStart(6, "ion-grid", 25)(7, "ion-row")(8, "ion-row")(9, "div", 26);
155
+ i0.ɵɵelement(10, "img", 37);
156
+ i0.ɵɵelementEnd();
157
+ i0.ɵɵelementStart(11, "div", 28)(12, "p");
158
+ i0.ɵɵtext(13, "Si est\u00E1s en interiores, aseg\u00FArate de que la luz est\u00E9 frente a ti, no detr\u00E1s.");
159
+ i0.ɵɵelementEnd()()();
160
+ i0.ɵɵelementStart(14, "ion-row")(15, "div", 26);
161
+ i0.ɵɵelement(16, "img", 30);
162
+ i0.ɵɵelementEnd();
163
+ i0.ɵɵelementStart(17, "div", 28)(18, "p");
164
+ i0.ɵɵtext(19, "Aseg\u00FArate de que tu rostro sea visible y de no usar anteojos ni sombreros.");
165
+ i0.ɵɵelementEnd()()()()();
166
+ i0.ɵɵelementStart(20, "div", 31)(21, "ion-button", 18);
167
+ i0.ɵɵlistener("click", function IdVisionComponent_swiper_container_1_swiper_slide_3_div_6_Template_ion_button_click_21_listener() { i0.ɵɵrestoreView(_r9); const step_r5 = i0.ɵɵnextContext().$implicit; return i0.ɵɵresetView(step_r5.action()); });
168
+ i0.ɵɵtext(22, "Abrir la c\u00E1mara");
169
+ i0.ɵɵelementEnd()()();
170
+ } }
171
+ function IdVisionComponent_swiper_container_1_swiper_slide_3_div_7_Template(rf, ctx) { if (rf & 1) {
172
+ i0.ɵɵelementStart(0, "div")(1, "h2");
173
+ i0.ɵɵtext(2, "Paso desconocido");
174
+ i0.ɵɵelementEnd()();
175
+ } }
176
+ function IdVisionComponent_swiper_container_1_swiper_slide_3_Template(rf, ctx) { if (rf & 1) {
177
+ i0.ɵɵelementStart(0, "swiper-slide")(1, "div", 32);
178
+ i0.ɵɵtemplate(2, IdVisionComponent_swiper_container_1_swiper_slide_3_div_2_Template, 22, 3, "div", 33)(3, IdVisionComponent_swiper_container_1_swiper_slide_3_div_3_Template, 11, 0, "div", 34)(4, IdVisionComponent_swiper_container_1_swiper_slide_3_div_4_Template, 11, 0, "div", 34)(5, IdVisionComponent_swiper_container_1_swiper_slide_3_div_5_Template, 23, 0, "div", 34)(6, IdVisionComponent_swiper_container_1_swiper_slide_3_div_6_Template, 23, 0, "div", 34)(7, IdVisionComponent_swiper_container_1_swiper_slide_3_div_7_Template, 3, 0, "div", 35);
179
+ i0.ɵɵelementEnd()();
180
+ } if (rf & 2) {
181
+ const step_r5 = ctx.$implicit;
182
+ const ctx_r2 = i0.ɵɵnextContext(2);
183
+ i0.ɵɵadvance();
184
+ i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(7, _c2, ctx_r2.simpleProcess))("ngSwitch", step_r5.type);
185
+ i0.ɵɵadvance();
186
+ i0.ɵɵproperty("ngSwitchCase", 1);
187
+ i0.ɵɵadvance();
188
+ i0.ɵɵproperty("ngSwitchCase", 2);
189
+ i0.ɵɵadvance();
190
+ i0.ɵɵproperty("ngSwitchCase", 3);
191
+ i0.ɵɵadvance();
192
+ i0.ɵɵproperty("ngSwitchCase", 4);
193
+ i0.ɵɵadvance();
194
+ i0.ɵɵproperty("ngSwitchCase", 5);
195
+ } }
196
+ function IdVisionComponent_swiper_container_1_div_6_Template(rf, ctx) { if (rf & 1) {
197
+ i0.ɵɵelementStart(0, "div", 42)(1, "p", 42);
198
+ i0.ɵɵtext(2, "Informaci\u00F3n procesada de manera correcta");
199
+ i0.ɵɵelementEnd()();
200
+ } }
201
+ function IdVisionComponent_swiper_container_1_div_7_Template(rf, ctx) { if (rf & 1) {
202
+ i0.ɵɵelementStart(0, "div", 42)(1, "p", 42);
203
+ i0.ɵɵtext(2, "Ocurri\u00F3 un error al procesar la informaci\u00F3n");
204
+ i0.ɵɵelementEnd()();
205
+ } }
206
+ function IdVisionComponent_swiper_container_1_Template(rf, ctx) { if (rf & 1) {
207
+ const _r1 = i0.ɵɵgetCurrentView();
208
+ i0.ɵɵelementStart(0, "swiper-container", 10, 0);
209
+ i0.ɵɵtemplate(2, IdVisionComponent_swiper_container_1_swiper_slide_2_Template, 26, 0, "swiper-slide", 11)(3, IdVisionComponent_swiper_container_1_swiper_slide_3_Template, 8, 9, "swiper-slide", 12);
210
+ i0.ɵɵelementStart(4, "swiper-slide")(5, "div", 13);
211
+ i0.ɵɵtemplate(6, IdVisionComponent_swiper_container_1_div_6_Template, 3, 0, "div", 14)(7, IdVisionComponent_swiper_container_1_div_7_Template, 3, 0, "div", 14);
212
+ i0.ɵɵelementStart(8, "div", 15);
213
+ i0.ɵɵelement(9, "img", 16);
214
+ i0.ɵɵelementEnd();
215
+ i0.ɵɵelementStart(10, "div", 17)(11, "ion-button", 18);
216
+ i0.ɵɵlistener("click", function IdVisionComponent_swiper_container_1_Template_ion_button_click_11_listener() { i0.ɵɵrestoreView(_r1); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.handleExit()); });
217
+ i0.ɵɵtext(12, "Salir");
218
+ i0.ɵɵelementEnd()()()()();
219
+ } if (rf & 2) {
220
+ const ctx_r2 = i0.ɵɵnextContext();
221
+ i0.ɵɵadvance(2);
222
+ i0.ɵɵproperty("ngIf", !ctx_r2.simpleProcess);
223
+ i0.ɵɵadvance();
224
+ i0.ɵɵproperty("ngForOf", ctx_r2.validationConfig);
225
+ i0.ɵɵadvance(3);
226
+ i0.ɵɵproperty("ngIf", ctx_r2.isValid);
227
+ i0.ɵɵadvance();
228
+ i0.ɵɵproperty("ngIf", !ctx_r2.isValid);
229
+ } }
230
+ function IdVisionComponent_ion_fab_4_Template(rf, ctx) { if (rf & 1) {
231
+ const _r10 = i0.ɵɵgetCurrentView();
232
+ i0.ɵɵelementStart(0, "ion-fab", 43)(1, "ion-fab-button", 44);
233
+ i0.ɵɵlistener("click", function IdVisionComponent_ion_fab_4_Template_ion_fab_button_click_1_listener() { i0.ɵɵrestoreView(_r10); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.copyProccess()); });
234
+ i0.ɵɵelement(2, "ion-icon", 45);
235
+ i0.ɵɵelementEnd()();
236
+ } }
237
+ register();
238
+ export class IdVisionComponent {
239
+ constructor(modalController, alertController, platform, modalDpiServices, sdkCommunicationService, navController, cdRef, toastController, loadingController, configurationService, validationService, navigationService, processingService, dpiService) {
240
+ this.modalController = modalController;
241
+ this.alertController = alertController;
242
+ this.platform = platform;
243
+ this.modalDpiServices = modalDpiServices;
244
+ this.sdkCommunicationService = sdkCommunicationService;
245
+ this.navController = navController;
246
+ this.cdRef = cdRef;
247
+ this.toastController = toastController;
248
+ this.loadingController = loadingController;
249
+ this.configurationService = configurationService;
250
+ this.validationService = validationService;
251
+ this.navigationService = navigationService;
252
+ this.processingService = processingService;
253
+ this.dpiService = dpiService;
254
+ // Tutorial images
255
+ this.tutoImage1 = 'assets/imagesIdvision/documentsImage.png';
256
+ this.tutoImage2 = 'assets/imagesIdvision/documentsImage.png';
257
+ this.tutoImage3 = 'assets/imagesIdvision/56.png';
258
+ this.tutoImage4 = 'assets/imagesIdvision/57.png';
259
+ // Component inputs
260
+ this.isSwipe = false;
261
+ this.dpiCode = '';
262
+ this.connection = '';
263
+ this.apikey = '';
264
+ this.env = '';
265
+ this.validationConfig = [];
266
+ // Component state
267
+ this.swiperElement = signal(null);
268
+ this.modalRef = null;
269
+ this.showDebug = false;
270
+ this.versionSDK = '';
271
+ this.hasInternet = true;
272
+ this.simpleProcess = false;
273
+ this.typeProccess = '';
274
+ this.backButtonListenerActive = false;
275
+ // Estados obtenidos de los servicios
276
+ this.validateMetaG = {
277
+ acuerdoVideo: false,
278
+ dpiFront: false,
279
+ dpiBack: false,
280
+ videoSelfie: false,
281
+ photoSelfie: false
282
+ };
283
+ this.stepVisibility = {
284
+ showAcuerdoVideo: false,
285
+ showDpiFront: false,
286
+ showDpiBack: false,
287
+ showVideoSelfie: false,
288
+ showPhotoSelfie: false
289
+ };
290
+ this.isValid = false;
291
+ this.configEnv = { env_endpoint: '', error: false };
292
+ this.loadingElement = null;
293
+ this.isAndroid = this.platform.is('android');
294
+ this.isIOS = this.platform.is('ios');
295
+ // Bind de los event handlers UNA SOLA VEZ en el constructor
296
+ // this.boundOnBackButton = this.onBackButton.bind(this);
297
+ this.boundOnBeforeUnload = this.onBeforeUnload.bind(this);
298
+ this.boundOnPopState = this.onPopState.bind(this);
299
+ }
300
+ async ngOnInit() {
301
+ try {
302
+ // Ejecutar tareas en paralelo para mejor rendimiento
303
+ const [configResult, sdkVersion] = await Promise.all([
304
+ this.getURL(this.env == "" || this.env == null ? "PROD_IT_01" : this.env),
305
+ this.getSDKVersion(),
306
+ this.simulateLoadingProgress()
307
+ ]);
308
+ this.configEnv = configResult;
309
+ this.versionSDK = sdkVersion;
310
+ if (!this.configEnv.error) {
311
+ const stepActionMapper = (type) => this.getStepAction(type);
312
+ const validationResponse = await this.configurationService.loadValidationConfiguration(this.connection, this.configEnv, stepActionMapper);
313
+ this.typeProccess = validationResponse.typeProccess;
314
+ this.validationConfig = validationResponse.steps;
315
+ console.log('validationConfig', this.validationConfig);
316
+ console.log('typeProccess', this.typeProccess);
317
+ if (this.typeProccess === "BiometricToken") {
318
+ this.simpleProcess = true;
319
+ // Deshabilitar botón de atrás para simpleProcess
320
+ // this.disableBackButton();
321
+ await this.showLoading();
322
+ // Configurar para simpleProcess usando la configuración real
323
+ await this.loadSimpleProcessConfig();
324
+ this.setupModalSubscriptions();
325
+ await this.InitProccess();
326
+ await this.hideLoading();
327
+ // Pequeño delay para asegurar que el loading se cierre completamente
328
+ await new Promise(resolve => setTimeout(resolve, 100));
329
+ // NO llamar a executeFirstAvailableAction aquí - ya se llama dentro de InitProccess
330
+ // executeFirstAvailableAction() se ejecuta automáticamente en InitProccess cuando no hay continuation
331
+ }
332
+ else {
333
+ // Proceso normal completo
334
+ this.simpleProcess = false;
335
+ this.setupModalSubscriptions();
336
+ // Para el proceso normal, recargar configuración con acciones correctas
337
+ await this.loadNormalProcessConfig();
338
+ }
339
+ }
340
+ else {
341
+ await this.hideLoading();
342
+ alert('Error en opción de ambiente');
343
+ }
344
+ // if (this.simpleProcess) {
345
+ // // Para simpleProcess, mostrar loading nativo de Ionic
346
+ // await this.showLoading();
347
+ // if (!this.configEnv.error) {
348
+ // this.setupModalSubscriptions();
349
+ // await this.InitProccess();
350
+ // // Configuración rápida para simpleProcess
351
+ // await this.loadSimpleProcessConfig();
352
+ // await this.hideLoading();
353
+ // await this.openPhotoSelfie();
354
+ // } else {
355
+ // alert('Error en opción de ambiente');
356
+ // }
357
+ // } else {
358
+ // if (!this.configEnv.error) {
359
+ // await this.loadMockValidationConfig();
360
+ // // Obtener versión del SDK
361
+ // if (this.isAndroid || this.isIOS) {
362
+ // const info = await App.getInfo();
363
+ // this.versionSDK = info.version;
364
+ // } else {
365
+ // this.versionSDK = 'web';
366
+ // }
367
+ // this.setupModalSubscriptions();
368
+ // } else {
369
+ // alert('Error en opción de ambiente');
370
+ // }
371
+ // }
372
+ }
373
+ catch (error) {
374
+ await this.hideLoading();
375
+ console.error('Error en inicialización:', error);
376
+ }
377
+ }
378
+ ngAfterViewInit() {
379
+ console.log('🟢 [Component] ngAfterViewInit() llamado');
380
+ console.log('🟢 [Component] simpleProcess:', this.simpleProcess);
381
+ console.log('🟢 [Component] swiperContainerRef:', this.swiperContainerRef);
382
+ console.log('🟢 [Component] swiperContainerRef?.nativeElement:', this.swiperContainerRef?.nativeElement);
383
+ // Solo inicializar si el swiper está en el DOM
384
+ if (this.swiperContainerRef && !this.simpleProcess) {
385
+ console.log('✅ [Component] Condiciones cumplidas, inicializando Swiper...');
386
+ console.log('✅ [Component] Pasando elemento al servicio:', this.swiperContainerRef.nativeElement);
387
+ this.navigationService.initializeSwiper(this.swiperContainerRef.nativeElement);
388
+ this.swiperElement.set(this.navigationService.getSwiperRef());
389
+ }
390
+ else {
391
+ console.warn('⚠️ [Component] SwiperContainer no está disponible en ngAfterViewInit');
392
+ console.warn('⚠️ [Component] Razón: swiperContainerRef =', !!this.swiperContainerRef, ', simpleProcess =', this.simpleProcess);
393
+ }
394
+ if (this.dpi) {
395
+ this.dpi.value = this.dpiCode ?? '';
396
+ }
397
+ else {
398
+ console.error('IonInput no está disponible en ngAfterViewInit');
399
+ }
400
+ }
401
+ async ngOnDestroy() {
402
+ this.navigationService.destroy();
403
+ // Rehabilitar el botón de atrás al salir del componente
404
+ this.enableBackButton();
405
+ }
406
+ // Handler para cancelar el proceso completamente
407
+ handleCancelProcess() {
408
+ try {
409
+ console.log('🔄 Usuario canceló el proceso');
410
+ // IMPORTANTE: Deshabilitar listeners del botón de atrás
411
+ this.enableBackButton();
412
+ console.log('✅ Listeners del botón de atrás deshabilitados');
413
+ // Limpiar cualquier loader activo
414
+ this.dpiService.forceCloseAllLoaders();
415
+ // Emitir resultado falso al SDK
416
+ this.sdkCommunicationService.emitExit(false);
417
+ console.log('✅ Resultado false enviado al SDK padre');
418
+ console.log('⚠️ La app padre debe manejar el cierre del componente <app-id-vision>');
419
+ }
420
+ catch (error) {
421
+ console.error('❌ Error al cancelar proceso:', error);
422
+ // Intentar emitir de todos modos
423
+ try {
424
+ this.sdkCommunicationService.emitExit(false);
425
+ }
426
+ catch (e) {
427
+ console.error('❌ No se pudo emitir resultado:', e);
428
+ }
429
+ }
430
+ }
431
+ // Método para mostrar modal de confirmación de cancelación
432
+ async showCancelConfirmationModal() {
433
+ const alert = await this.alertController.create({
434
+ header: 'Cancelar proceso',
435
+ message: '¿Estás seguro que deseas cancelar el proceso de validación?',
436
+ backdropDismiss: false,
437
+ buttons: [
438
+ {
439
+ text: 'No, continuar',
440
+ role: 'cancel',
441
+ cssClass: 'alert-button-cancel'
442
+ },
443
+ {
444
+ text: 'Sí, cancelar',
445
+ role: 'confirm',
446
+ cssClass: 'alert-button-confirm'
447
+ }
448
+ ]
449
+ });
450
+ await alert.present();
451
+ const { role } = await alert.onDidDismiss();
452
+ if (role === 'confirm') {
453
+ console.log('🚪 Usuario confirmó cancelación del proceso');
454
+ return true;
455
+ }
456
+ else {
457
+ console.log('🔄 Usuario decidió continuar con el proceso');
458
+ return false;
459
+ }
460
+ }
461
+ // Método para deshabilitar el botón de atrás en simpleProcess
462
+ disableBackButton() {
463
+ // Evitar duplicación de listeners
464
+ if (this.backButtonListenerActive) {
465
+ console.log('⚠️ Back button listeners ya están activos');
466
+ return;
467
+ }
468
+ console.log('🔒 Deshabilitando botón de atrás');
469
+ if (this.platform.is('android')) {
470
+ // Para Android, interceptar el botón de atrás físico
471
+ // document.addEventListener('backbutton', this.boundOnBackButton, false);
472
+ }
473
+ // Para todas las plataformas, interceptar la navegación del navegador
474
+ window.addEventListener('beforeunload', this.boundOnBeforeUnload);
475
+ window.addEventListener('popstate', this.boundOnPopState);
476
+ this.backButtonListenerActive = true;
477
+ }
478
+ // Método para rehabilitar el botón de atrás
479
+ enableBackButton() {
480
+ if (!this.backButtonListenerActive) {
481
+ console.log('⚠️ Back button listeners no estaban activos');
482
+ return;
483
+ }
484
+ console.log('🔓 Rehabilitando botón de atrás');
485
+ if (this.platform.is('android')) {
486
+ document.removeEventListener('backbutton', this.boundOnBackButton, false);
487
+ }
488
+ window.removeEventListener('beforeunload', this.boundOnBeforeUnload);
489
+ window.removeEventListener('popstate', this.boundOnPopState);
490
+ this.backButtonListenerActive = false;
491
+ }
492
+ // Handler para el botón de atrás en Android
493
+ // private async onBackButton(event: Event): Promise<void> {
494
+ // console.log('� Botón de atrás presionado');
495
+ // event.preventDefault();
496
+ // event.stopPropagation();
497
+ // // Mostrar modal de confirmación
498
+ // const shouldCancel = await this.showCancelConfirmationModal();
499
+ // if (shouldCancel) {
500
+ // // Usuario confirmó la cancelación
501
+ // console.log('❌ Proceso cancelado por el usuario');
502
+ // this.handleCancelProcess();
503
+ // } else {
504
+ // // Usuario decidió continuar
505
+ // console.log('✅ Usuario decidió continuar');
506
+ // }
507
+ // }
508
+ // Handler para beforeunload
509
+ onBeforeUnload(event) {
510
+ console.log('🚫 Navegación bloqueada en simpleProcess');
511
+ event.preventDefault();
512
+ event.returnValue = '';
513
+ }
514
+ // Handler para popstate (navegación del navegador)
515
+ onPopState(event) {
516
+ console.log('🚫 Popstate bloqueado en simpleProcess');
517
+ event.preventDefault();
518
+ // Forzar que se mantenga en la página actual
519
+ window.history.pushState(null, '', window.location.href);
520
+ }
521
+ // Configuration methods
522
+ async getURL(environment = 'PROD_IT_01') {
523
+ try {
524
+ return await this.configurationService.getEnvironmentUrl(environment);
525
+ }
526
+ catch (error) {
527
+ console.error('Error al obtener la URL:', error);
528
+ throw error;
529
+ }
530
+ }
531
+ // Método optimizado para obtener versión SDK
532
+ async getSDKVersion() {
533
+ if (this.isAndroid || this.isIOS) {
534
+ try {
535
+ const info = await App.getInfo();
536
+ return info.version;
537
+ }
538
+ catch (error) {
539
+ return 'web';
540
+ }
541
+ }
542
+ else {
543
+ return 'web';
544
+ }
545
+ }
546
+ // Métodos para manejar el loading nativo de Ionic
547
+ async showLoading(message) {
548
+ // Primero cerrar cualquier loading existente
549
+ await this.hideLoading();
550
+ // Crear y mostrar el nuevo loading
551
+ this.loadingElement = await this.loadingController.create({
552
+ message: message || 'Preparando la cámara del dispositivo...',
553
+ spinner: 'crescent',
554
+ backdropDismiss: false
555
+ });
556
+ await this.loadingElement.present();
557
+ }
558
+ async hideLoading() {
559
+ console.log('🔄 hideLoading() ejecutándose...');
560
+ // Cerrar nuestro loading específico
561
+ if (this.loadingElement) {
562
+ try {
563
+ console.log('🔄 Cerrando loadingElement...');
564
+ await this.loadingElement.dismiss();
565
+ console.log('✅ loadingElement cerrado');
566
+ }
567
+ catch (error) {
568
+ // Ignorar errores si el loading ya fue cerrado
569
+ console.log('⚠️ Loading ya fue cerrado:', error);
570
+ }
571
+ this.loadingElement = null;
572
+ }
573
+ else {
574
+ console.log('⚠️ No hay loadingElement activo');
575
+ }
576
+ // Forzar cierre de TODOS los loadings que puedan estar activos
577
+ let attempts = 0;
578
+ const maxAttempts = 3;
579
+ while (attempts < maxAttempts) {
580
+ try {
581
+ console.log(`🔄 Verificando top loader (intento ${attempts + 1})...`);
582
+ const topLoader = await this.loadingController.getTop();
583
+ if (topLoader) {
584
+ console.log('🔄 Cerrando top loader...');
585
+ await topLoader.dismiss();
586
+ console.log('✅ Top loader cerrado');
587
+ attempts++;
588
+ }
589
+ else {
590
+ console.log('ℹ️ No hay más top loaders activos');
591
+ break;
592
+ }
593
+ }
594
+ catch (error) {
595
+ console.log('⚠️ Error verificando top loader:', error);
596
+ break;
597
+ }
598
+ }
599
+ // Limpieza final: usar método nuclear si es necesario
600
+ try {
601
+ const allLoadings = document.querySelectorAll('ion-loading');
602
+ if (allLoadings.length > 0) {
603
+ console.log(`⚠️ Encontrados ${allLoadings.length} loadings DOM, eliminando...`);
604
+ allLoadings.forEach(loading => {
605
+ try {
606
+ loading.dismiss();
607
+ }
608
+ catch (e) {
609
+ console.log('Error cerrando loading DOM:', e);
610
+ }
611
+ });
612
+ }
613
+ }
614
+ catch (error) {
615
+ console.log('Error en limpieza DOM:', error);
616
+ }
617
+ console.log('✅ hideLoading() completado');
618
+ } // Simular progreso de carga atractivo
619
+ async simulateLoadingProgress() {
620
+ await new Promise(resolve => setTimeout(resolve, 100)); // Duración total de 0.5 segundos
621
+ }
622
+ // Configuración rápida para simpleProcess
623
+ async loadSimpleProcessConfig() {
624
+ // Usar la configuración real obtenida del servicio, pero solo el primer paso [0]
625
+ if (this.validationConfig && this.validationConfig.length > 0) {
626
+ const firstStep = this.validationConfig[0]; // Siempre usar el primer paso
627
+ // Mantener la funcionalidad: si el tipo es 5, usar openPhotoSelfie
628
+ if (firstStep.type === 5) {
629
+ firstStep.action = () => this.openPhotoSelfie();
630
+ }
631
+ // Asegurar que solo tenemos un único paso
632
+ this.validationConfig = [firstStep];
633
+ }
634
+ else {
635
+ // Fallback si no hay configuración
636
+ this.validationConfig = [{
637
+ id: 1,
638
+ type: 5, // Photo selfie
639
+ order: 1,
640
+ action: () => this.openPhotoSelfie()
641
+ }];
642
+ }
643
+ // Setup mínimo de estados basado en el tipo del primer paso
644
+ const stepType = this.validationConfig[0].type;
645
+ this.stepVisibility = {
646
+ showAcuerdoVideo: stepType === 1,
647
+ showDpiFront: stepType === 2,
648
+ showDpiBack: stepType === 3,
649
+ showVideoSelfie: stepType === 4,
650
+ showPhotoSelfie: stepType === 5
651
+ };
652
+ this.validateMetaG = {
653
+ acuerdoVideo: false,
654
+ dpiFront: false,
655
+ dpiBack: false,
656
+ videoSelfie: false,
657
+ photoSelfie: false
658
+ };
659
+ this.isValid = false;
660
+ }
661
+ // Configuración para proceso normal
662
+ async loadNormalProcessConfig() {
663
+ // Para el proceso normal, usar la configuración completa y reconfigurar las acciones
664
+ // asegurando que simpleProcess sea false cuando se mapeen las acciones
665
+ this.simpleProcess = false;
666
+ // Reconfigurar las acciones para cada paso basándose en el estado actual de simpleProcess
667
+ this.validationConfig.forEach(step => {
668
+ step.action = this.getStepAction(step.type);
669
+ });
670
+ // Configurar el sistema de validación con la configuración completa
671
+ this.setValidationConfig();
672
+ }
673
+ async loadMockValidationConfig() {
674
+ try {
675
+ // Configuración temporal para photo-selfie mientras implementas el servicio
676
+ if (this.simpleProcess) {
677
+ // Configuración temporal: solo photo-selfie
678
+ this.validationConfig = [{
679
+ id: 1,
680
+ type: 5,
681
+ order: 1,
682
+ action: () => this.openPhotoSelfie()
683
+ }];
684
+ this.typeProccess = 'simple';
685
+ // Abrir photo-selfie automáticamente después de un pequeño delay
686
+ setTimeout(() => {
687
+ this.openPhotoSelfie();
688
+ }, 10);
689
+ }
690
+ else {
691
+ // Proceso normal con servicio
692
+ const stepActionMapper = (type) => this.getStepAction(type);
693
+ const validationResponse = await this.configurationService.loadValidationConfiguration(this.connection, this.configEnv, stepActionMapper);
694
+ this.typeProccess = validationResponse.typeProccess;
695
+ this.validationConfig = validationResponse.steps;
696
+ }
697
+ this.setValidationConfig();
698
+ }
699
+ catch (error) {
700
+ console.error('Error loading validation config:', error);
701
+ // En caso de error, usar configuración temporal
702
+ this.validationConfig = [{
703
+ id: 1,
704
+ type: 5,
705
+ order: 1,
706
+ action: () => this.openPhotoSelfie()
707
+ }];
708
+ this.typeProccess = 'fallback';
709
+ this.setValidationConfig();
710
+ }
711
+ }
712
+ setValidationConfig() {
713
+ this.validationService.setStepVisibility(this.validationConfig);
714
+ this.navigationService.setValidationConfig(this.validationConfig);
715
+ // Suscribirse a los cambios de visibilidad
716
+ this.validationService.stepVisibility$.subscribe(visibility => {
717
+ this.stepVisibility = visibility;
718
+ this.cdRef.detectChanges();
719
+ });
720
+ // Suscribirse a los cambios de validación
721
+ this.validationService.validation$.subscribe(validation => {
722
+ this.validateMetaG = validation;
723
+ });
724
+ // Suscribirse al estado de validez general
725
+ this.validationService.isValid$.subscribe(isValid => {
726
+ this.isValid = isValid;
727
+ });
728
+ }
729
+ getStepAction(type) {
730
+ const actions = {
731
+ 1: () => this.openSimpleAcuerdo(),
732
+ 2: () => this.openCameraOverlayFrontal(),
733
+ 3: () => this.openCameraOverlayTrasero(),
734
+ 4: () => this.openVideoSelfie(),
735
+ 5: () => this.openPhotoSelfie(),
736
+ 6: () => this.openAcuerdoVideo(),
737
+ };
738
+ return this.configurationService.getStepAction(type, actions);
739
+ }
740
+ getSlideIndexForType(type) {
741
+ const stepIndex = this.validationConfig.findIndex(step => step.type === type);
742
+ return stepIndex >= 0 ? stepIndex + 1 : 1; // +1 porque el slide 0 es el inicial
743
+ }
744
+ // Navigation methods
745
+ handleClick() {
746
+ this.InitProccess();
747
+ }
748
+ async handleSlide(slide) {
749
+ this.navigationService.navigateToSlide(slide);
750
+ }
751
+ handleGetInit() {
752
+ this.navigationService.navigateToStart();
753
+ }
754
+ handleNext() {
755
+ this.navigationService.navigateNext();
756
+ }
757
+ handleSkipTutorial() {
758
+ this.navigationService.skipTutorial();
759
+ }
760
+ moveToNextStep(currentType) {
761
+ this.navigationService.moveToNextStep(currentType);
762
+ }
763
+ // Validation methods
764
+ handleExit() {
765
+ const result = this.validationService.isAllValid();
766
+ this.sdkCommunicationService.emitExit(result);
767
+ this.navController.back();
768
+ }
769
+ // Método para manejar salida con resultado específico (para simpleProcess)
770
+ async handleExitWithResult(result, source = 'unknown') {
771
+ console.log(`🚪 handleExitWithResult llamado desde: ${source}, resultado: ${result}`);
772
+ console.log('📊 Estado del SDK:', {
773
+ simpleProcess: this.simpleProcess,
774
+ source: source,
775
+ result: result
776
+ });
777
+ try {
778
+ // Cerrar cualquier loading pendiente
779
+ await this.hideLoading();
780
+ console.log('✅ Loading cerrado');
781
+ // IMPORTANTE: Deshabilitar listeners del botón de atrás cuando el proceso termina
782
+ this.enableBackButton();
783
+ console.log('✅ Listeners del botón de atrás deshabilitados');
784
+ // Enviar resultado al SDK padre
785
+ console.log('🔔 Emitiendo resultado a través de sdkCommunicationService...');
786
+ this.sdkCommunicationService.emitExit(result);
787
+ console.log(`✅ Resultado ${result} enviado al SDK padre`);
788
+ console.log('⚠️ La app padre debe ocultar el componente <app-id-vision> escuchando onExit$');
789
+ console.log('⚠️ Si no se oculta, verificar que la app padre tenga:');
790
+ console.log(' this.sdkCommunicationService.onExit$.subscribe(result => { showSDK = false; })');
791
+ }
792
+ catch (error) {
793
+ console.error('Error en handleExitWithResult:', error);
794
+ // Intentar emitir de todos modos
795
+ try {
796
+ this.sdkCommunicationService.emitExit(result);
797
+ }
798
+ catch (e) {
799
+ console.error('❌ No se pudo emitir resultado o cerrar:', e);
800
+ }
801
+ }
802
+ }
803
+ // Método para forzar el cierre del SDK de manera agresiva
804
+ // Processing methods
805
+ async InitProccess() {
806
+ // Debug: Verificar que configEnv tenga la URL correcta
807
+ console.log('🔍 InitProccess - configEnv:', this.configEnv);
808
+ console.log('🔍 InitProccess - URL endpoint:', this.configEnv?.env_endpoint);
809
+ console.log('🔍 InitProccess - simpleProcess:', this.simpleProcess);
810
+ try {
811
+ const response = await this.processingService.initProcess(this.dpiCode + '', this.connection, this.apikey, this.versionSDK, this.configEnv);
812
+ if (!response.error) {
813
+ if (response.continuation) {
814
+ const completedItem = this.validationService.processContinuationStatus(response.statusAct || []);
815
+ if (this.simpleProcess) {
816
+ // En simpleProcess, ejecutar directamente la siguiente acción
817
+ this.executeNextActionForSimpleProcess(completedItem);
818
+ }
819
+ else {
820
+ this.handleSlide(completedItem);
821
+ }
822
+ }
823
+ else if (response.completed) {
824
+ this.validationService.completeAllSteps();
825
+ this.navigationService.navigateToCompletion();
826
+ }
827
+ else {
828
+ if (this.simpleProcess) {
829
+ // En simpleProcess, ejecutar directamente la primera acción disponible
830
+ this.executeFirstAvailableAction();
831
+ }
832
+ else {
833
+ this.handleSlide(1);
834
+ }
835
+ }
836
+ }
837
+ else {
838
+ this.handleInitProcessError(response.message || 'Error desconocido');
839
+ }
840
+ }
841
+ catch (error) {
842
+ console.error('Error en InitProcess:', error);
843
+ }
844
+ }
845
+ executeFirstAvailableAction() {
846
+ console.log('🎬 executeFirstAvailableAction()');
847
+ if (this.validationConfig.length > 0) {
848
+ const firstStep = this.validationConfig[0];
849
+ console.log('🎬 Ejecutando acción del primer paso, tipo:', firstStep.type);
850
+ // Ejecutar la acción del paso (que ya está configurada en loadSimpleProcessConfig)
851
+ firstStep.action();
852
+ }
853
+ }
854
+ executeNextActionForSimpleProcess(completedStep) {
855
+ // Buscar el siguiente paso no completado
856
+ const nextStep = this.validationConfig.find(step => {
857
+ const stepKey = this.getValidationKeyForType(step.type);
858
+ return stepKey && !this.validateMetaG[stepKey];
859
+ });
860
+ if (nextStep) {
861
+ nextStep.action();
862
+ }
863
+ else {
864
+ // Si no hay más pasos, navegar a completación
865
+ this.navigationService.navigateToCompletion();
866
+ }
867
+ }
868
+ getValidationKeyForType(type) {
869
+ switch (type) {
870
+ case 1: return 'acuerdoVideo';
871
+ case 2: return 'dpiFront';
872
+ case 3: return 'dpiBack';
873
+ case 4: return 'videoSelfie';
874
+ case 5: return 'photoSelfie';
875
+ default: return null;
876
+ }
877
+ }
878
+ handleInitProcessError(message) {
879
+ const dpiValue = this.dpi.value ?? '';
880
+ if (!dpiValue || dpiValue.trim().length === 0) {
881
+ this.showAlert('Error', 'El campo DPI no puede estar vacío', []);
882
+ }
883
+ else if (dpiValue.length > 12) {
884
+ this.showAlert('Error', message, []);
885
+ }
886
+ else {
887
+ this.showAlert('Error', message, []);
888
+ }
889
+ }
890
+ // DPI Processing methods
891
+ async DpiFrontProccess(filePath) {
892
+ // Debug: Verificar que configEnv tenga la URL correcta
893
+ console.log('🔍 DpiFrontProccess - configEnv:', this.configEnv);
894
+ console.log('🔍 DpiFrontProccess - URL endpoint:', this.configEnv?.env_endpoint);
895
+ try {
896
+ // El loading se maneja completamente dentro del ProcessingService
897
+ const result = await this.processingService.processFrontDPI(filePath, this.connection, this.apikey, this.configEnv, this.hasInternet);
898
+ if (result.success) {
899
+ this.closeModalFromParent();
900
+ this.modalController.dismiss();
901
+ this.validationService.updateValidationStep('dpiFront', true);
902
+ if (this.simpleProcess) {
903
+ this.executeNextActionForSimpleProcess(2);
904
+ }
905
+ else {
906
+ this.moveToNextStep(2);
907
+ }
908
+ }
909
+ else if (result.shouldResumeCamera) {
910
+ this.resumeCameraFromParent();
911
+ }
912
+ }
913
+ catch (error) {
914
+ console.error('Error processing front DPI:', error);
915
+ }
916
+ }
917
+ async DpiBackProccess(filePath) {
918
+ // Debug: Verificar que configEnv tenga la URL correcta
919
+ console.log('🔍 DpiBackProccess - configEnv:', this.configEnv);
920
+ console.log('🔍 DpiBackProccess - URL endpoint:', this.configEnv?.env_endpoint);
921
+ try {
922
+ // El loading se maneja completamente dentro del ProcessingService
923
+ const result = await this.processingService.processBackDPI(filePath, this.connection, this.apikey, this.configEnv, this.hasInternet);
924
+ if (result.success) {
925
+ this.closeModalFromParent();
926
+ this.modalController.dismiss();
927
+ this.validationService.updateValidationStep('dpiBack', true);
928
+ if (this.simpleProcess) {
929
+ this.executeNextActionForSimpleProcess(3);
930
+ }
931
+ else {
932
+ this.moveToNextStep(3);
933
+ }
934
+ }
935
+ else {
936
+ this.validationService.updateValidationStep('dpiBack', false);
937
+ if (result.shouldResumeCamera) {
938
+ this.resumeCameraFromParent();
939
+ }
940
+ else {
941
+ this.sdkCommunicationService.emitExit(false);
942
+ this.navController.back();
943
+ }
944
+ }
945
+ }
946
+ catch (error) {
947
+ console.error('Error processing back DPI:', error);
948
+ }
949
+ }
950
+ // Video Selfie Processing
951
+ async VideoSelfieProcccess(file) {
952
+ try {
953
+ // El loading se maneja completamente dentro del ProcessingService
954
+ const result = await this.processingService.processVideoSelfie(file, this.connection, this.apikey, this.configEnv, this.hasInternet);
955
+ if (result.success) {
956
+ this.closeModalVideoSelfie();
957
+ this.modalController.dismiss();
958
+ this.validationService.updateValidationStep('videoSelfie', true);
959
+ if (this.simpleProcess) {
960
+ this.executeNextActionForSimpleProcess(4);
961
+ }
962
+ else {
963
+ this.moveToNextStep(4);
964
+ }
965
+ }
966
+ else {
967
+ this.validationService.updateValidationStep('videoSelfie', false);
968
+ if (result.shouldResumeCamera) {
969
+ this.closeModalVideoSelfie();
970
+ }
971
+ else {
972
+ this.sdkCommunicationService.emitExit(false);
973
+ this.navController.back();
974
+ }
975
+ }
976
+ }
977
+ catch (error) {
978
+ console.error('Error processing video selfie:', error);
979
+ }
980
+ }
981
+ // Photo Selfie Processing
982
+ async photoVideoSelfieFile(filePath) {
983
+ console.log('🔄 Iniciando procesamiento de foto selfie...');
984
+ // Debug: Verificar que configEnv tenga la URL correcta
985
+ console.log('🔍 photoVideoSelfieFile - configEnv:', this.configEnv);
986
+ console.log('🔍 photoVideoSelfieFile - URL endpoint:', this.configEnv?.env_endpoint);
987
+ console.log('🔍 photoVideoSelfieFile - simpleProcess:', this.simpleProcess);
988
+ try {
989
+ // El loading se maneja completamente dentro del ProcessingService
990
+ const result = await this.processingService.processPhotoSelfie(filePath, this.connection, this.apikey, this.configEnv, this.simpleProcess, // Pasar flag de proceso simple
991
+ () => {
992
+ // Callback para simpleProcess - cerrar overlay y SDK
993
+ console.log('🚪 Callback ejecutándose - cerrando overlay y SDK automáticamente');
994
+ this.closePhotoSelfieFromParent();
995
+ this.modalController.dismiss();
996
+ // Usar 'auto' para indicar que es cierre automático después del procesamiento
997
+ this.handleExitWithResult(true, 'auto');
998
+ });
999
+ if (result.success) {
1000
+ // Cerrar el overlay de la cámara inmediatamente
1001
+ this.closePhotoSelfieFromParent();
1002
+ this.modalController.dismiss();
1003
+ this.validationService.updateValidationStep('photoSelfie', true);
1004
+ if (this.simpleProcess) {
1005
+ // Para simpleProcess, no hacer nada aquí - el callback se encarga de todo
1006
+ console.log('✅ SimpleProcess: esperando callback para cierre completo');
1007
+ }
1008
+ else {
1009
+ this.moveToNextStep(5);
1010
+ }
1011
+ }
1012
+ else {
1013
+ this.validationService.updateValidationStep('photoSelfie', false);
1014
+ if (result.shouldResumeCamera) {
1015
+ this.resumePhotoFromParent();
1016
+ }
1017
+ }
1018
+ }
1019
+ catch (error) {
1020
+ console.error('Error processing photo selfie:', error);
1021
+ }
1022
+ }
1023
+ // Acuerdo Video Processing
1024
+ async getAcuerdoVideo(file) {
1025
+ try {
1026
+ const result = await this.processingService.processAcuerdoVideo(file);
1027
+ if (result.success) {
1028
+ this.closeModalAcuerdoVideo();
1029
+ this.modalController.dismiss();
1030
+ this.validationService.updateValidationStep('acuerdoVideo', true);
1031
+ if (this.simpleProcess) {
1032
+ this.executeNextActionForSimpleProcess(1);
1033
+ }
1034
+ else {
1035
+ this.moveToNextStep(1);
1036
+ }
1037
+ }
1038
+ else {
1039
+ this.validationService.updateValidationStep('acuerdoVideo', false);
1040
+ }
1041
+ }
1042
+ catch (error) {
1043
+ console.error('Error processing acuerdo video:', error);
1044
+ }
1045
+ }
1046
+ // Modal handling methods
1047
+ setupModalSubscriptions() {
1048
+ this.modalDpiServices.closeOverlay$.subscribe(() => {
1049
+ this.closeOverlay();
1050
+ });
1051
+ this.modalDpiServices.closeModalAndChangeBrightness$.subscribe(() => {
1052
+ this.closeModalOverlay();
1053
+ });
1054
+ this.modalDpiServices.closePhotoSelfieSubject$.subscribe(() => {
1055
+ this.closePhotoSelfie();
1056
+ });
1057
+ }
1058
+ closeModalFromParent() {
1059
+ this.modalDpiServices.requestCloseOverlay();
1060
+ }
1061
+ closeModalVideoSelfie() {
1062
+ this.modalDpiServices.requestCloseModalAndBrightness();
1063
+ }
1064
+ closeModalAcuerdoVideo() {
1065
+ this.modalDpiServices.requestCloseModalAcuerdoVideo();
1066
+ }
1067
+ resumePhotoFromParent() {
1068
+ this.modalDpiServices.requestResumePhotoSubject();
1069
+ }
1070
+ resumeCameraFromParent() {
1071
+ this.modalDpiServices.requestResumeCamera();
1072
+ }
1073
+ closePhotoSelfieFromParent() {
1074
+ this.modalDpiServices.requestClosePhotoSelfieSubject();
1075
+ }
1076
+ async closeOverlay() {
1077
+ // console.log('Modal cerrada desde el componente padre');
1078
+ }
1079
+ async closeModalOverlay() {
1080
+ // console.log('test videoselfie');
1081
+ }
1082
+ async closePhotoSelfie() {
1083
+ // console.log('test videoselfie');
1084
+ }
1085
+ // Camera modal methods
1086
+ async openCameraOverlayFrontal() {
1087
+ this.modalRef = await this.modalController.create({
1088
+ component: CameraWithOverlayComponent,
1089
+ componentProps: {
1090
+ text1: 'Coloca la parte frontal de tu DPI.',
1091
+ text2: '',
1092
+ overlaySrc: 'assets/imagesIdvision/overlay-dpi-frontal.png',
1093
+ onTakePicture: this.DpiFrontProccess.bind(this),
1094
+ closeRequested: async () => {
1095
+ console.log('🚪 Callback closeRequested invocado en camera-frontal');
1096
+ // await this.modalRef?.dismiss();
1097
+ await this.handleExitWithResult(false, 'auto');
1098
+ await this.modalRef?.dismiss();
1099
+ // if (this.simpleProcess) {
1100
+ // // Para simpleProcess: Cerrar el modal primero, luego cerrar el SDK
1101
+ // this.closeOverlay();
1102
+ // await this.modalRef?.dismiss();
1103
+ // await this.handleExitWithResult(false, 'camera-frontal-close');
1104
+ // } else {
1105
+ // // Para proceso normal, solo cerrar overlay
1106
+ // this.closeOverlay();
1107
+ // }
1108
+ },
1109
+ },
1110
+ backdropDismiss: false,
1111
+ // Optimización: sin animación para simpleProcess
1112
+ animated: !this.simpleProcess
1113
+ });
1114
+ await this.modalRef.present();
1115
+ }
1116
+ async openCameraOverlayTrasero() {
1117
+ const modal = await this.modalController.create({
1118
+ component: CameraWithOverlayComponent,
1119
+ componentProps: {
1120
+ text1: 'Coloca la parte reversa de tu DPI.',
1121
+ text2: '',
1122
+ overlaySrc: 'assets/imagesIdvision/overlay-dpi-trasero.png',
1123
+ onTakePicture: this.DpiBackProccess.bind(this),
1124
+ closeRequested: async () => {
1125
+ if (this.simpleProcess) {
1126
+ // Para simpleProcess: Cerrar el modal primero, luego cerrar el SDK
1127
+ await modal.dismiss();
1128
+ await this.handleExitWithResult(false, 'camera-trasero-close');
1129
+ }
1130
+ else {
1131
+ // Para proceso normal, comportamiento default
1132
+ return;
1133
+ }
1134
+ },
1135
+ },
1136
+ backdropDismiss: false,
1137
+ // Optimización: sin animación para simpleProcess
1138
+ animated: !this.simpleProcess
1139
+ });
1140
+ await modal.present();
1141
+ const { data } = await modal.onWillDismiss();
1142
+ if (data && data.executeFuncion) {
1143
+ data.executeFuncion();
1144
+ }
1145
+ }
1146
+ async openVideoSelfie() {
1147
+ // Cerrar cualquier loading antes de abrir la modal
1148
+ await this.hideLoading();
1149
+ const modal = await this.modalController.create({
1150
+ component: CamaraVideoSelfieComponent,
1151
+ componentProps: {
1152
+ cssClass: 'my-custom-class',
1153
+ text1: 'Video Selfie',
1154
+ text2: 'Guatemala',
1155
+ overlaySrc: 'assets/overlay-image.png',
1156
+ backFunction: async (file) => {
1157
+ await this.getBackModal(file);
1158
+ },
1159
+ closeRequested: async () => {
1160
+ if (this.simpleProcess) {
1161
+ // Para simpleProcess: Cerrar el modal primero, luego cerrar el SDK
1162
+ await modal.dismiss();
1163
+ await this.handleExitWithResult(false, 'video-selfie-close');
1164
+ }
1165
+ else {
1166
+ // Para proceso normal, solo cerrar modal
1167
+ this.closeModalOverlay();
1168
+ }
1169
+ },
1170
+ },
1171
+ backdropDismiss: false,
1172
+ // Optimización: sin animación para simpleProcess
1173
+ animated: !this.simpleProcess
1174
+ });
1175
+ await modal.present();
1176
+ }
1177
+ async openPhotoSelfie() {
1178
+ const modal = await this.modalController.create({
1179
+ component: PhotoSelfieCameraComponent,
1180
+ componentProps: {
1181
+ cssClass: 'my-custom-class',
1182
+ text1: 'Foto Selfie',
1183
+ text2: 'Guatemala',
1184
+ overlaySrc: 'assets/overlay-image.png',
1185
+ onTakePicture: async (file) => {
1186
+ await this.photoVideoSelfieFile(file);
1187
+ },
1188
+ closeRequested: async () => {
1189
+ if (this.simpleProcess) {
1190
+ console.log('🚪 Usuario cerró photo-selfie manualmente - cerrando SDK');
1191
+ // Para simpleProcess: Cerrar el modal primero, luego cerrar el SDK
1192
+ await modal.dismiss();
1193
+ await this.handleExitWithResult(false, 'photo-selfie-close');
1194
+ }
1195
+ else {
1196
+ // Para proceso normal, solo cerrar modal
1197
+ this.closeModalOverlay();
1198
+ }
1199
+ },
1200
+ },
1201
+ backdropDismiss: false,
1202
+ // Optimización: sin animación para simpleProcess para mayor velocidad
1203
+ animated: !this.simpleProcess
1204
+ });
1205
+ await modal.present();
1206
+ }
1207
+ async openDirectPhotoSelfie() {
1208
+ console.log('🎬 Abriendo DirectPhotoSelfie modal...');
1209
+ // Cerrar cualquier loading antes de abrir la modal
1210
+ await this.hideLoading();
1211
+ const closeRequestedCallback = async () => {
1212
+ console.log('═══════════════════════════════════════════════════════');
1213
+ console.log('🚪 Callback closeRequested invocado en id-vision');
1214
+ console.log('═══════════════════════════════════════════════════════');
1215
+ if (this.simpleProcess) {
1216
+ console.log('🚪 Usuario cerró direct-photo-selfie - cerrando modal y emitiendo resultado');
1217
+ // Cerrar el modal primero
1218
+ await modal.dismiss();
1219
+ console.log('✅ Modal cerrado desde padre');
1220
+ // Ejecutar handleExitWithResult que emite el resultado
1221
+ // La app padre recibirá onExit$ y hará showSDK = false
1222
+ await this.handleExitWithResult(false, 'direct-photo-selfie-close');
1223
+ }
1224
+ else {
1225
+ // Para proceso normal, cerrar modal y limpiar
1226
+ await modal.dismiss();
1227
+ this.closeModalOverlay();
1228
+ }
1229
+ };
1230
+ console.log('📦 Creando modal con props...');
1231
+ console.log('📦 closeRequested callback definido:', !!closeRequestedCallback);
1232
+ const modal = await this.modalController.create({
1233
+ component: DirectPhotoSelfieComponent,
1234
+ componentProps: {
1235
+ onTakePicture: async (file) => {
1236
+ await this.photoVideoSelfieFile(file);
1237
+ },
1238
+ closeRequested: closeRequestedCallback,
1239
+ },
1240
+ backdropDismiss: false,
1241
+ // Optimización: sin animación para simpleProcess
1242
+ animated: !this.simpleProcess
1243
+ });
1244
+ console.log('✅ Modal creado, presentando...');
1245
+ await modal.present();
1246
+ console.log('✅ Modal presentado correctamente');
1247
+ }
1248
+ async openAcuerdoVideo() {
1249
+ // Cerrar cualquier loading antes de abrir la modal
1250
+ await this.hideLoading();
1251
+ const modal = await this.modalController.create({
1252
+ component: CamaraAcuerdoVideoComponent,
1253
+ componentProps: {
1254
+ backFunction: async (file) => {
1255
+ await this.getAcuerdoVideo(file);
1256
+ },
1257
+ closeRequested: async () => {
1258
+ await modal.dismiss();
1259
+ await this.handleExitWithResult(false, 'acuerdo-video-close');
1260
+ },
1261
+ },
1262
+ backdropDismiss: false,
1263
+ // Optimización: sin animación para simpleProcess
1264
+ animated: !this.simpleProcess
1265
+ });
1266
+ await modal.present();
1267
+ }
1268
+ async openSimpleAcuerdo() {
1269
+ // Cerrar cualquier loading antes de abrir la modal
1270
+ await this.hideLoading();
1271
+ const modal = await this.modalController.create({
1272
+ component: SimpleAcuerdoVideoComponent,
1273
+ componentProps: {
1274
+ cssClass: 'my-custom-class',
1275
+ backFunction: async (file) => {
1276
+ await this.getAcuerdoVideo(file);
1277
+ },
1278
+ closeRequested: async () => {
1279
+ if (this.simpleProcess) {
1280
+ console.log('🚪 Usuario cerró simple-acuerdo-video manualmente - cerrando SDK');
1281
+ // Para simpleProcess: Cerrar el modal primero, luego cerrar el SDK
1282
+ await modal.dismiss();
1283
+ await this.handleExitWithResult(false, 'simple-acuerdo-video-close');
1284
+ }
1285
+ else {
1286
+ // Para proceso normal, solo cerrar modal
1287
+ this.closeModalOverlay();
1288
+ }
1289
+ },
1290
+ },
1291
+ backdropDismiss: false,
1292
+ // Optimización: sin animación para simpleProcess
1293
+ animated: !this.simpleProcess
1294
+ });
1295
+ await modal.present();
1296
+ }
1297
+ // Legacy validation methods (kept for compatibility)
1298
+ async validateDPIFront(filePath) {
1299
+ await this.DpiFrontProccess(filePath);
1300
+ return true;
1301
+ }
1302
+ async validateDPIBack(filePath) {
1303
+ this.modalController.dismiss();
1304
+ await this.DpiBackProccess(filePath);
1305
+ return true;
1306
+ }
1307
+ async getBackModal(file) {
1308
+ if (!file || file.size === 0) {
1309
+ return;
1310
+ }
1311
+ await this.VideoSelfieProcccess(file);
1312
+ }
1313
+ async convertImagePathToFile(imagePath, fileName) {
1314
+ return await this.processingService.convertImagePathToFile(imagePath, fileName);
1315
+ }
1316
+ // Utility methods
1317
+ async showAlert(header, message, details, onConfirm) {
1318
+ const detailsMessage = Array.isArray(details)
1319
+ ? details.map((detail) => `${detail} `).join('')
1320
+ : '';
1321
+ const fullMessage = message + (detailsMessage ? `${detailsMessage}` : '');
1322
+ const alert = await this.alertController.create({
1323
+ backdropDismiss: false,
1324
+ header,
1325
+ message: fullMessage,
1326
+ buttons: [
1327
+ {
1328
+ text: 'Continuar',
1329
+ handler: () => {
1330
+ if (onConfirm) {
1331
+ onConfirm();
1332
+ }
1333
+ },
1334
+ cssClass: 'boton-personalizado'
1335
+ },
1336
+ ],
1337
+ });
1338
+ await alert.present();
1339
+ }
1340
+ async copyProccess() {
1341
+ const codigo = localStorage.getItem('codigo') ?? '';
1342
+ this.copiarTexto(codigo);
1343
+ }
1344
+ async copiarTexto(texto) {
1345
+ await Clipboard.write({
1346
+ string: texto
1347
+ });
1348
+ const toast = await this.toastController.create({
1349
+ message: 'Proceso copiado!',
1350
+ duration: 2000,
1351
+ color: 'success'
1352
+ });
1353
+ await toast.present();
1354
+ }
1355
+ static { this.ɵfac = function IdVisionComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || IdVisionComponent)(i0.ɵɵdirectiveInject(i1.ModalController), i0.ɵɵdirectiveInject(i1.AlertController), i0.ɵɵdirectiveInject(i1.Platform), i0.ɵɵdirectiveInject(i2.ModalDpiServices), i0.ɵɵdirectiveInject(i3.SdkCommunicationService), i0.ɵɵdirectiveInject(i1.NavController), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i1.ToastController), i0.ɵɵdirectiveInject(i1.LoadingController), i0.ɵɵdirectiveInject(i4.ConfigurationService), i0.ɵɵdirectiveInject(i5.ValidationService), i0.ɵɵdirectiveInject(i6.NavigationService), i0.ɵɵdirectiveInject(i7.ProcessingService), i0.ɵɵdirectiveInject(i8.DpiService)); }; }
1356
+ static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: IdVisionComponent, selectors: [["app-id-vision"]], viewQuery: function IdVisionComponent_Query(rf, ctx) { if (rf & 1) {
1357
+ i0.ɵɵviewQuery(_c0, 5);
1358
+ i0.ɵɵviewQuery(_c1, 5, ElementRef);
1359
+ } if (rf & 2) {
1360
+ let _t;
1361
+ i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.dpi = _t.first);
1362
+ i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.swiperContainerRef = _t.first);
1363
+ } }, inputs: { isSwipe: "isSwipe", dpiCode: "dpiCode", connection: "connection", apikey: "apikey", env: "env", validationConfig: "validationConfig" }, standalone: true, features: [i0.ɵɵProvidersFeature([DpiService, ConfigurationService, ValidationService, NavigationService, ProcessingService]), i0.ɵɵStandaloneFeature], decls: 15, vars: 8, consts: [["swiperContainer", ""], ["dpi", ""], ["init", "false", "class", "custom-swiper", 4, "ngIf"], [1, "version"], ["vertical", "top", "horizontal", "end", "slot", "fixed", 4, "ngIf"], [1, "wrapper-no-internet"], [1, "content-no-internet"], [1, "title-no-internet"], ["src", "assets/imagesIdvision/no-internet.svg", "alt", "Error conexi\u00F3n img", 1, "icon-no-internet"], [1, "description-no-internet"], ["init", "false", 1, "custom-swiper"], [4, "ngIf"], [4, "ngFor", "ngForOf"], [1, "confirmation-screen"], ["class", "font-confirmation", 4, "ngIf"], [1, "image-confirmation"], ["src", "assets/imagesIdvision/blue-check.png", "alt", "Check morado"], [1, "button-container"], ["expand", "block", 1, "custom-button", 3, "click"], [1, "content"], [1, "head"], [1, "h-title"], [1, "p-justify", "p-margin"], [1, "rounded-input"], ["type", "number", "disabled", "true", "placeholder", "Digita tu n\u00FAmero de DPI"], [1, "verify-container"], [1, "image-container"], ["src", "assets/imagesIdvision/documentsImage.png", "alt", ""], [1, "container-text"], [1, "p-justify"], ["src", "assets/imagesIdvision/rostroImage.png", "alt", ""], [1, "fixed-footer"], [1, "content", 3, "ngClass", "ngSwitch"], [3, "ngClass", 4, "ngSwitchCase"], [4, "ngSwitchCase"], [4, "ngSwitchDefault"], [3, "ngClass"], ["src", "assets/imagesIdvision/Foco.png", "alt", ""], [1, "p-center", "p-info", "p-margin"], [1, "dpi-container"], ["src", "assets/imagesIdvision/dpi-front-1.png", "alt", ""], ["src", "assets/imagesIdvision/dpi-back-1.png", "alt", ""], [1, "font-confirmation"], ["vertical", "top", "horizontal", "end", "slot", "fixed"], [1, "button-debug", 3, "click"], ["name", "bug-outline"]], template: function IdVisionComponent_Template(rf, ctx) { if (rf & 1) {
1364
+ i0.ɵɵelementStart(0, "ion-content");
1365
+ i0.ɵɵtemplate(1, IdVisionComponent_swiper_container_1_Template, 13, 4, "swiper-container", 2);
1366
+ i0.ɵɵelementStart(2, "div", 3);
1367
+ i0.ɵɵtext(3);
1368
+ i0.ɵɵelementEnd();
1369
+ i0.ɵɵtemplate(4, IdVisionComponent_ion_fab_4_Template, 3, 0, "ion-fab", 4);
1370
+ i0.ɵɵelementEnd();
1371
+ i0.ɵɵelementStart(5, "ion-content")(6, "div", 5)(7, "div", 6)(8, "h2", 7);
1372
+ i0.ɵɵtext(9, "Error de conexi\u00F3n");
1373
+ i0.ɵɵelementEnd();
1374
+ i0.ɵɵelement(10, "img", 8);
1375
+ i0.ɵɵelementStart(11, "p", 9);
1376
+ i0.ɵɵtext(12, " No pudimos cargar la p\u00E1gina. ");
1377
+ i0.ɵɵelement(13, "br");
1378
+ i0.ɵɵtext(14, " Verifica tu internet y prueba de nuevo. ");
1379
+ i0.ɵɵelementEnd()()()();
1380
+ } if (rf & 2) {
1381
+ i0.ɵɵstyleProp("display", ctx.hasInternet ? "block" : "none");
1382
+ i0.ɵɵadvance();
1383
+ i0.ɵɵproperty("ngIf", !ctx.simpleProcess);
1384
+ i0.ɵɵadvance(2);
1385
+ i0.ɵɵtextInterpolate2("", ctx.versionSDK, " ", ctx.configEnv.show_label ? ctx.configEnv.env_name : "", "");
1386
+ i0.ɵɵadvance();
1387
+ i0.ɵɵproperty("ngIf", ctx.showDebug);
1388
+ i0.ɵɵadvance();
1389
+ i0.ɵɵstyleProp("display", !ctx.hasInternet ? "block" : "none");
1390
+ } }, dependencies: [IonicModule, i1.IonButton, i1.IonContent, i1.IonFab, i1.IonFabButton, i1.IonGrid, i1.IonIcon, i1.IonInput, i1.IonItem, i1.IonRow, i1.NumericValueAccessor, CommonModule, i9.NgClass, i9.NgForOf, i9.NgIf, i9.NgSwitch, i9.NgSwitchCase, i9.NgSwitchDefault, HttpClientModule], styles: ["// ============================================\r\n// ESTILOS AISLADOS DEL SDK - NO AFECTAN AL PADRE\r\n// ============================================\r\n// Usamos :host para encapsular todo dentro del componente\r\n// y evitar que los estilos globales del padre nos afecten\r\n\r\n:host {\r\n display: block;\r\n position: relative;\r\n width: 100%;\r\n height: 100%;\r\n \r\n // Reset de estilos globales del padre\r\n * {\r\n box-sizing: border-box;\r\n }\r\n}\r\n\r\n.content {\r\n padding: 10px;\r\n align-items: center;\r\n justify-content: center;\r\n height: 90vh;\r\n background-color: #fff;\r\n font-size: 18px;\r\n background-image: url('assets/imagesIdvision/background.png');\r\n background-size: cover;\r\n background-repeat: no-repeat;\r\n background-position: center;\r\n}\r\n\r\n.h-title {\r\n font-size: 1.5em;\r\n font-weight: bold;\r\n color: #F38301;\r\n text-align: center;\r\n margin-top: 20px;\r\n}\r\n\r\n:host p {\r\n font-size: 1em;\r\n color: #666;\r\n text-align: center;\r\n margin: 0;\r\n}\r\n\r\n:host ion-grid {\r\n margin-top: 20px;\r\n}\r\n\r\n:host ion-row {\r\n margin: 15px 0;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n}\r\n\r\n:host ion-col {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n text-align: center;\r\n}\r\n\r\n:host ion-icon {\r\n font-size: 3em;\r\n color: #ff8c00;\r\n margin-bottom: 10px;\r\n}\r\n\r\n.container-text {\r\n text-align: justify !important;\r\n width: 180px;\r\n}\r\n\r\n:host p {\r\n text-align: start;\r\n}\r\n\r\n.p-center {\r\n text-align: center;\r\n}\r\n\r\n.p-justify {\r\n text-align: start;\r\n}\r\n\r\n.head {\r\n padding: 20px;\r\n margin-top: 20px;\r\n margin-bottom: 80px;\r\n}\r\n\r\n\r\n.verify-container {\r\n // padding: 60px;\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n justify-content: center;\r\n height: 40%; // Ocupa todo el espacio disponible en el ion-content\r\n text-align: center;\r\n //background-color: black;\r\n}\r\n\r\n.fixed-footer {\r\n position: fixed;\r\n bottom: 0;\r\n left: 0;\r\n width: 100%;\r\n padding: 0px 10px 25px 10px;\r\n // background-color: black; // Color de fondo, opcional\r\n // box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1); // Sombra suave para que resalte\r\n\r\n ion-button {\r\n width: 90%;\r\n max-width: 300px;\r\n margin: 0 auto;\r\n background-color: #ffcc00;\r\n color: #ffffff;\r\n font-weight: bold;\r\n border-radius: 20px;\r\n\r\n &:hover {\r\n background-color: #ffb300;\r\n }\r\n\r\n &:active {\r\n background-color: #e6a800;\r\n }\r\n }\r\n}\r\n\r\n.dpi-container {\r\n display: flex;\r\n //width: 100%;\r\n justify-content: center;\r\n align-items: center;\r\n height: 45vh;\r\n}\r\n\r\n.dpi-image {\r\n width: 200px;\r\n}\r\n\r\n.image-container {\r\n width: 100px;\r\n max-width: 90px;\r\n}\r\n\r\n.col-confirmation {\r\n margin-top: 100px;\r\n padding: 20px;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 20px;\r\n /* Ajusta el espacio entre los elementos */\r\n}\r\n\r\n.image-item {\r\n margin-top: 50px;\r\n padding-top: 70px;\r\n}\r\n\r\n.font-confirmation {\r\n font-size: 26px;\r\n text-align: center;\r\n // color: #005da9;\r\n color: #82298F;\r\n font-weight: bold;\r\n}\r\n\r\n\r\n.rounded-input {\r\n margin-top: 15px;\r\n background-color: #f4f6fc;\r\n /* Color de fondo suave */\r\n border-radius: 10px;\r\n /* Bordes redondeados */\r\n padding: 5px 5px;\r\n /* Espaciado interno */\r\n box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);\r\n /* Sombra suave */\r\n --ion-border-color: transparent;\r\n /* Quita cualquier borde por defecto */\r\n}\r\n\r\n:host ion-input {\r\n text-align: center;\r\n color: #F38301;\r\n --padding-start: 8px;\r\n}\r\n\r\n:host .custom-footer {\r\n position: fixed;\r\n bottom: 0;\r\n left: 0;\r\n width: 100%;\r\n padding: 10px;\r\n display: flex;\r\n justify-content: space-between;\r\n background-color: #ffffff;\r\n}\r\n\r\n:host .custom-footer ion-button {\r\n flex: 0 0 48%;\r\n}\r\n\r\n:host .custom-footer .left-button {\r\n max-width: 140px;\r\n color: black;\r\n --background: white;\r\n --color: #82298F;\r\n --border-radius: 20px;\r\n --border-color: white;\r\n margin-right: auto;\r\n --box-shadow: 0 2px 6px 0 rgb(0, 0, 0, 0.0);\r\n}\r\n\r\n:host .custom-footer .right-button {\r\n margin-left: auto;\r\n}\r\n\r\n.tutorial-head {\r\n padding-top: 50px;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n color: black;\r\n}\r\n\r\n.center-container {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n height: 60vh;\r\n /* Ajusta este valor si quieres m\u00E1s o menos espacio vertical */\r\n width: 100%;\r\n}\r\n\r\n.tutorial-title {\r\n text-align: center;\r\n}\r\n\r\n.rounded-input ion-input {\r\n font-size: 14px;\r\n /* Tama\u00F1o de texto */\r\n color: #333;\r\n /* Color del texto */\r\n}\r\n\r\n.rounded-input::part(native) {\r\n background: transparent;\r\n /* Fondo transparente para evitar conflictos */\r\n}\r\n\r\n.p-info {\r\n font-weight: bold;\r\n color: #714e93\r\n}\r\n\r\n.custom-button {\r\n --background: var(--purple-primary, #82298F) !important;\r\n --background-hover: var(--purple-secondary, #2b0d30) !important;\r\n --background-activated: var(--purple-secondary, #2b0d30) !important;\r\n --color: #ffffff !important;\r\n --border-radius: 20px !important;\r\n --padding-top: 10px !important;\r\n --padding-bottom: 10px !important;\r\n --box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.25) !important;\r\n text-transform: none;\r\n pointer-events: auto;\r\n\r\n}\r\n\r\n//blur effect\r\n\r\n.blur-effect {\r\n filter: blur(5px);\r\n pointer-events: none;\r\n}\r\n\r\n.blur-overlay {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 100%;\r\n background-color: rgba(255, 255, 255, 0.7);\r\n z-index: 999;\r\n filter: blur(5px);\r\n}\r\n\r\n.boton-personalizado {\r\n background-color: #4caf50;\r\n /* Verde, por ejemplo */\r\n color: white;\r\n font-size: 16px;\r\n}\r\n\r\n.version {\r\n position: fixed;\r\n bottom: 10px;\r\n right: 10px;\r\n font-size: 12px;\r\n color: #888;\r\n z-index: 1000;\r\n}\r\n\r\n.button-debug {\r\n --background: #ff4081;\r\n --color: #fff;\r\n}\r\n\r\n\r\n.wrapper-no-internet {\r\n background-color: #fff;\r\n height: 100vh;\r\n display: flex;\r\n justify-content: center; /* centra en eje vertical */\r\n align-items: center; /* centra en eje horizontal */\r\n padding: 40px;\r\n background-image: url('assets/imagesIdvision/background.png') !important;\r\n background-size: cover;\r\n background-repeat: no-repeat;\r\n background-position: center;\r\n \r\n}\r\n\r\n.content-no-internet {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n text-align: center;\r\n gap: 16px;\r\n}\r\n\r\n.title-no-internet{\r\n color: #000;\r\n font-size: 32px;\r\n font-weight: bold;\r\n}\r\n\r\n.icon-no-internet {\r\n width: 125px;\r\n display: block;\r\n margin-top: 25px;\r\n}\r\n\r\n.description-no-internet {\r\n margin-top: 25px;\r\n font-size: 22px;\r\n color: #000;\r\n line-height: 1.5;\r\n text-align: center;\r\n}\r\n.no-border{\r\n --border-width: 0 !important;\r\n}\r\n\r\n.confirmation-screen {\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: space-between;\r\n height: 100vh; \r\n padding: 25px;\r\n box-sizing: border-box;\r\n background-image: url('assets/imagesIdvision/background.png');\r\n background-size: cover;\r\n background-repeat: no-repeat;\r\n background-position: center;\r\n background-color: white;\r\n}\r\n\r\n.image-confirmation {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n flex-grow: 1;\r\n width: 100%;\r\n}\r\n\r\n.image-confirmation img {\r\n max-width: 500px;\r\n width: 80%;\r\n height: auto;\r\n}\r\n\r\n\r\n.close-button {\r\n position: absolute;\r\n top: 12px;\r\n right: 12px; \r\n z-index: 1000;\r\n font-size: 15px;\r\n --color: #888; \r\n}\r\n\r\n.p-margin {\r\n margin-top: 50px !important;\r\n}\r\n\r\n"], encapsulation: 2 }); }
1391
+ }
1392
+ (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(IdVisionComponent, [{
1393
+ type: Component,
1394
+ args: [{ selector: 'app-id-vision', standalone: true, schemas: [CUSTOM_ELEMENTS_SCHEMA], imports: [IonicModule, CommonModule, HttpClientModule], providers: [DpiService, ConfigurationService, ValidationService, NavigationService, ProcessingService], encapsulation: ViewEncapsulation.None, template: "\r\n\r\n<ion-content [style.display]=\"hasInternet ? 'block' : 'none'\">\r\n \r\n <swiper-container *ngIf=\"!simpleProcess\" init=\"false\" class=\"custom-swiper\" #swiperContainer>\r\n\r\n <!-- \uD83D\uDD39 PASO 1: Verificaci\u00F3n de Identidad (Est\u00E1tico) -->\r\n <swiper-slide *ngIf=\"!simpleProcess\">\r\n <div class=\"content\">\r\n <div class=\"head\">\r\n <h2 class=\"h-title\">Verifiquemos tu identidad</h2>\r\n <p class=\"p-justify p-margin\">Para completar tu verificaci\u00F3n, por favor ingresa tu n\u00FAmero de identificaci\u00F3n (DPI).</p>\r\n <ion-item class=\"rounded-input\">\r\n <ion-input #dpi type=\"number\" disabled=\"true\" placeholder=\"Digita tu n\u00FAmero de DPI\"></ion-input>\r\n </ion-item>\r\n </div>\r\n <ion-grid class=\"verify-container\">\r\n <ion-row>\r\n <div class=\"image-container\">\r\n <img src=\"assets/imagesIdvision/documentsImage.png\" alt=\"\" />\r\n </div>\r\n <div class=\"container-text\">\r\n <p class=\"p-justify\">Sube fotos de documentos que prueben tu identidad</p>\r\n </div>\r\n </ion-row>\r\n <ion-row>\r\n <div class=\"image-container\">\r\n <img src=\"assets/imagesIdvision/rostroImage.png\" alt=\"\" />\r\n </div>\r\n <div class=\"container-text\">\r\n <p class=\"p-justify\">Graba un video selfie, mant\u00E9n tu rostro centrado en la pantalla y evita moverte.</p>\r\n </div>\r\n </ion-row>\r\n </ion-grid>\r\n <div class=\"fixed-footer\">\r\n <ion-button class=\"custom-button\" expand=\"block\" (click)=\"handleClick()\">Empecemos</ion-button>\r\n </div>\r\n </div>\r\n </swiper-slide>\r\n\r\n <!-- \uD83D\uDD39 PASOS INTERMEDIOS: Se generan din\u00E1micamente seg\u00FAn el `order` -->\r\n <swiper-slide *ngFor=\"let step of validationConfig\">\r\n <div class=\"content\" [ngSwitch]=\"step.type\">\r\n <!--Acuerdo de video-->\r\n <div *ngSwitchCase=\"1\" [ngClass]=\"{'blur-effect': simpleProcess}\">\r\n <div class=\"head\">\r\n <h2 class=\"h-title\">Acuerdo de v\u00EDdeo</h2>\r\n <p class=\"p-justify\">Graba un breve video para completar tu proceso de identificaci\u00F3n.</p>\r\n </div>\r\n <ion-grid class=\"verify-container\">\r\n <ion-row>\r\n <div class=\"image-container\">\r\n <img src=\"assets/imagesIdvision/Foco.png\" alt=\"\" />\r\n </div>\r\n <div class=\"container-text\">\r\n <p>Si est\u00E1s en interiores, aseg\u00FArate de que la luz est\u00E9 frente a ti, no detr\u00E1s.</p>\r\n </div>\r\n </ion-row>\r\n <ion-row>\r\n <div class=\"image-container\">\r\n <img src=\"assets/imagesIdvision/rostroImage.png\" alt=\"\" />\r\n </div>\r\n <div class=\"container-text\">\r\n <p>Aseg\u00FArate de que tu rostro sea visible y de no usar anteojos ni sombreros.</p>\r\n </div>\r\n </ion-row>\r\n </ion-grid>\r\n <div class=\"fixed-footer\">\r\n <ion-button class=\"custom-button\" expand=\"block\" (click)=\"step.action()\">Abrir la c\u00E1mara</ion-button>\r\n </div>\r\n </div>\r\n <!-- \uD83D\uDD39 DPI Frontal -->\r\n <div *ngSwitchCase=\"2\">\r\n <div class=\"head\">\r\n <h2 class=\"h-title\">Coloca la parte frontal de tu DPI</h2>\r\n <p class=\"p-center p-info p-margin\">Evita sombras, reflejos y coloca tu documento dentro del recuadro.</p>\r\n </div>\r\n <div class=\"dpi-container\">\r\n <img src=\"assets/imagesIdvision/dpi-front-1.png\" alt=\"\" />\r\n </div>\r\n <div class=\"fixed-footer\">\r\n <ion-button class=\"custom-button\" expand=\"block\" (click)=\"step.action()\">Tomar una foto</ion-button>\r\n </div>\r\n </div>\r\n\r\n <!-- \uD83D\uDD39 DPI Trasero -->\r\n <div *ngSwitchCase=\"3\">\r\n <div class=\"head\">\r\n <h2 class=\"h-title\">Coloca el reverso de tu DPI</h2>\r\n <p class=\"p-center p-info p-margin\">Evita sombras, reflejos y coloca tu documento dentro del recuadro.</p>\r\n </div>\r\n <div class=\"dpi-container\">\r\n <img src=\"assets/imagesIdvision/dpi-back-1.png\" alt=\"\" />\r\n </div>\r\n <div class=\"fixed-footer\">\r\n <ion-button class=\"custom-button\" expand=\"block\" (click)=\"step.action()\">Tomar una foto</ion-button>\r\n </div>\r\n </div>\r\n\r\n <!-- \uD83D\uDD39 Video Selfie -->\r\n <div *ngSwitchCase=\"4\">\r\n <div class=\"head\">\r\n <h2 class=\"h-title\">Video Selfie</h2>\r\n <p class=\"p-justify p-margin\">Graba un breve video para completar tu proceso de identificaci\u00F3n.</p>\r\n </div>\r\n <ion-grid class=\"verify-container\">\r\n <ion-row>\r\n <ion-row>\r\n <div class=\"image-container\">\r\n <img src=\"assets/imagesIdvision/Foco.png\" alt=\"\" />\r\n </div>\r\n <div class=\"container-text\">\r\n <p class=\"p-justify\">Si est\u00E1s en interiores, aseg\u00FArate de que la luz est\u00E9 frente a ti, no detr\u00E1s.</p>\r\n </div>\r\n </ion-row>\r\n <ion-row>\r\n <div class=\"image-container\">\r\n <img src=\"assets/imagesIdvision/rostroImage.png\" alt=\"\" />\r\n </div>\r\n <div class=\"container-text\">\r\n <p class=\"p-justify\">Aseg\u00FArate de que tu rostro sea visible y de no usar anteojos ni sombreros.</p>\r\n </div>\r\n </ion-row>\r\n </ion-row>\r\n </ion-grid>\r\n <div class=\"fixed-footer\">\r\n <ion-button class=\"custom-button\" expand=\"block\" (click)=\"step.action()\">Abrir la c\u00E1mara</ion-button>\r\n </div>\r\n </div>\r\n <!-- Photo Selfie -->\r\n <!-- TODO Se debera cambiar a 5, se dejo 1 por acuerdo de video -->\r\n <div *ngSwitchCase=\"5\">\r\n <div class=\"head\">\r\n <h2 class=\"h-title\">Foto Selfie</h2>\r\n <p class=\"p-justify\">Toma una foto para completar tu proceso de identificaci\u00F3n.</p>\r\n </div>\r\n <ion-grid class=\"verify-container\">\r\n <ion-row>\r\n <ion-row>\r\n <div class=\"image-container\">\r\n <img src=\"assets/imagesIdvision/Foco.png\" alt=\"\" />\r\n </div>\r\n <div class=\"container-text\">\r\n <p>Si est\u00E1s en interiores, aseg\u00FArate de que la luz est\u00E9 frente a ti, no detr\u00E1s.</p>\r\n </div>\r\n </ion-row>\r\n <ion-row>\r\n <div class=\"image-container\">\r\n <img src=\"assets/imagesIdvision/rostroImage.png\" alt=\"\" />\r\n </div>\r\n <div class=\"container-text\">\r\n <p>Aseg\u00FArate de que tu rostro sea visible y de no usar anteojos ni sombreros.</p>\r\n </div>\r\n </ion-row>\r\n </ion-row>\r\n </ion-grid>\r\n <div class=\"fixed-footer\">\r\n <ion-button class=\"custom-button\" expand=\"block\" (click)=\"step.action()\">Abrir la c\u00E1mara</ion-button>\r\n </div>\r\n </div>\r\n <div *ngSwitchDefault>\r\n <h2>Paso desconocido</h2>\r\n </div>\r\n </div>\r\n </swiper-slide>\r\n <swiper-slide>\r\n <div class=\"confirmation-screen\">\r\n <div class=\"font-confirmation\" *ngIf=\"isValid\">\r\n <p class=\"font-confirmation\">Informaci\u00F3n procesada de manera correcta</p>\r\n </div>\r\n <div class=\"font-confirmation\" *ngIf=\"!isValid\">\r\n <p class=\"font-confirmation\">Ocurri\u00F3 un error al procesar la informaci\u00F3n</p>\r\n </div>\r\n <div class=\"image-confirmation\">\r\n <img src=\"assets/imagesIdvision/blue-check.png\" alt=\"Check morado\" />\r\n </div>\r\n <div class=\"button-container\">\r\n <ion-button class=\"custom-button\" expand=\"block\" (click)=\"handleExit()\">Salir</ion-button>\r\n </div>\r\n </div>\r\n\r\n\r\n </swiper-slide>\r\n\r\n </swiper-container>\r\n <div class=\"version\">{{versionSDK}} {{configEnv.show_label ? configEnv.env_name: ''}}</div>\r\n <ion-fab vertical=\"top\" horizontal=\"end\" slot=\"fixed\" *ngIf=\"showDebug\">\r\n <ion-fab-button class=\"button-debug\" (click)=\"copyProccess()\">\r\n <ion-icon name=\"bug-outline\"></ion-icon>\r\n </ion-fab-button>\r\n </ion-fab>\r\n\r\n</ion-content>\r\n<!-- pantalla para cuando no exista internet -->\r\n<ion-content [style.display]=\"!hasInternet ? 'block' : 'none'\">\r\n <div class=\"wrapper-no-internet\">\r\n <div class=\"content-no-internet\">\r\n <h2 class=\"title-no-internet\">Error de conexi\u00F3n</h2>\r\n <img src=\"assets/imagesIdvision/no-internet.svg\" alt=\"Error conexi\u00F3n img\" class=\"icon-no-internet\" />\r\n <p class=\"description-no-internet\">\r\n No pudimos cargar la p\u00E1gina. <br>\r\n Verifica tu internet y prueba de nuevo.\r\n </p>\r\n </div>\r\n </div>\r\n</ion-content>", styles: ["// ============================================\r\n// ESTILOS AISLADOS DEL SDK - NO AFECTAN AL PADRE\r\n// ============================================\r\n// Usamos :host para encapsular todo dentro del componente\r\n// y evitar que los estilos globales del padre nos afecten\r\n\r\n:host {\r\n display: block;\r\n position: relative;\r\n width: 100%;\r\n height: 100%;\r\n \r\n // Reset de estilos globales del padre\r\n * {\r\n box-sizing: border-box;\r\n }\r\n}\r\n\r\n.content {\r\n padding: 10px;\r\n align-items: center;\r\n justify-content: center;\r\n height: 90vh;\r\n background-color: #fff;\r\n font-size: 18px;\r\n background-image: url('assets/imagesIdvision/background.png');\r\n background-size: cover;\r\n background-repeat: no-repeat;\r\n background-position: center;\r\n}\r\n\r\n.h-title {\r\n font-size: 1.5em;\r\n font-weight: bold;\r\n color: #F38301;\r\n text-align: center;\r\n margin-top: 20px;\r\n}\r\n\r\n:host p {\r\n font-size: 1em;\r\n color: #666;\r\n text-align: center;\r\n margin: 0;\r\n}\r\n\r\n:host ion-grid {\r\n margin-top: 20px;\r\n}\r\n\r\n:host ion-row {\r\n margin: 15px 0;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n}\r\n\r\n:host ion-col {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n text-align: center;\r\n}\r\n\r\n:host ion-icon {\r\n font-size: 3em;\r\n color: #ff8c00;\r\n margin-bottom: 10px;\r\n}\r\n\r\n.container-text {\r\n text-align: justify !important;\r\n width: 180px;\r\n}\r\n\r\n:host p {\r\n text-align: start;\r\n}\r\n\r\n.p-center {\r\n text-align: center;\r\n}\r\n\r\n.p-justify {\r\n text-align: start;\r\n}\r\n\r\n.head {\r\n padding: 20px;\r\n margin-top: 20px;\r\n margin-bottom: 80px;\r\n}\r\n\r\n\r\n.verify-container {\r\n // padding: 60px;\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n justify-content: center;\r\n height: 40%; // Ocupa todo el espacio disponible en el ion-content\r\n text-align: center;\r\n //background-color: black;\r\n}\r\n\r\n.fixed-footer {\r\n position: fixed;\r\n bottom: 0;\r\n left: 0;\r\n width: 100%;\r\n padding: 0px 10px 25px 10px;\r\n // background-color: black; // Color de fondo, opcional\r\n // box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1); // Sombra suave para que resalte\r\n\r\n ion-button {\r\n width: 90%;\r\n max-width: 300px;\r\n margin: 0 auto;\r\n background-color: #ffcc00;\r\n color: #ffffff;\r\n font-weight: bold;\r\n border-radius: 20px;\r\n\r\n &:hover {\r\n background-color: #ffb300;\r\n }\r\n\r\n &:active {\r\n background-color: #e6a800;\r\n }\r\n }\r\n}\r\n\r\n.dpi-container {\r\n display: flex;\r\n //width: 100%;\r\n justify-content: center;\r\n align-items: center;\r\n height: 45vh;\r\n}\r\n\r\n.dpi-image {\r\n width: 200px;\r\n}\r\n\r\n.image-container {\r\n width: 100px;\r\n max-width: 90px;\r\n}\r\n\r\n.col-confirmation {\r\n margin-top: 100px;\r\n padding: 20px;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 20px;\r\n /* Ajusta el espacio entre los elementos */\r\n}\r\n\r\n.image-item {\r\n margin-top: 50px;\r\n padding-top: 70px;\r\n}\r\n\r\n.font-confirmation {\r\n font-size: 26px;\r\n text-align: center;\r\n // color: #005da9;\r\n color: #82298F;\r\n font-weight: bold;\r\n}\r\n\r\n\r\n.rounded-input {\r\n margin-top: 15px;\r\n background-color: #f4f6fc;\r\n /* Color de fondo suave */\r\n border-radius: 10px;\r\n /* Bordes redondeados */\r\n padding: 5px 5px;\r\n /* Espaciado interno */\r\n box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);\r\n /* Sombra suave */\r\n --ion-border-color: transparent;\r\n /* Quita cualquier borde por defecto */\r\n}\r\n\r\n:host ion-input {\r\n text-align: center;\r\n color: #F38301;\r\n --padding-start: 8px;\r\n}\r\n\r\n:host .custom-footer {\r\n position: fixed;\r\n bottom: 0;\r\n left: 0;\r\n width: 100%;\r\n padding: 10px;\r\n display: flex;\r\n justify-content: space-between;\r\n background-color: #ffffff;\r\n}\r\n\r\n:host .custom-footer ion-button {\r\n flex: 0 0 48%;\r\n}\r\n\r\n:host .custom-footer .left-button {\r\n max-width: 140px;\r\n color: black;\r\n --background: white;\r\n --color: #82298F;\r\n --border-radius: 20px;\r\n --border-color: white;\r\n margin-right: auto;\r\n --box-shadow: 0 2px 6px 0 rgb(0, 0, 0, 0.0);\r\n}\r\n\r\n:host .custom-footer .right-button {\r\n margin-left: auto;\r\n}\r\n\r\n.tutorial-head {\r\n padding-top: 50px;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n color: black;\r\n}\r\n\r\n.center-container {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n height: 60vh;\r\n /* Ajusta este valor si quieres m\u00E1s o menos espacio vertical */\r\n width: 100%;\r\n}\r\n\r\n.tutorial-title {\r\n text-align: center;\r\n}\r\n\r\n.rounded-input ion-input {\r\n font-size: 14px;\r\n /* Tama\u00F1o de texto */\r\n color: #333;\r\n /* Color del texto */\r\n}\r\n\r\n.rounded-input::part(native) {\r\n background: transparent;\r\n /* Fondo transparente para evitar conflictos */\r\n}\r\n\r\n.p-info {\r\n font-weight: bold;\r\n color: #714e93\r\n}\r\n\r\n.custom-button {\r\n --background: var(--purple-primary, #82298F) !important;\r\n --background-hover: var(--purple-secondary, #2b0d30) !important;\r\n --background-activated: var(--purple-secondary, #2b0d30) !important;\r\n --color: #ffffff !important;\r\n --border-radius: 20px !important;\r\n --padding-top: 10px !important;\r\n --padding-bottom: 10px !important;\r\n --box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.25) !important;\r\n text-transform: none;\r\n pointer-events: auto;\r\n\r\n}\r\n\r\n//blur effect\r\n\r\n.blur-effect {\r\n filter: blur(5px);\r\n pointer-events: none;\r\n}\r\n\r\n.blur-overlay {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 100%;\r\n background-color: rgba(255, 255, 255, 0.7);\r\n z-index: 999;\r\n filter: blur(5px);\r\n}\r\n\r\n.boton-personalizado {\r\n background-color: #4caf50;\r\n /* Verde, por ejemplo */\r\n color: white;\r\n font-size: 16px;\r\n}\r\n\r\n.version {\r\n position: fixed;\r\n bottom: 10px;\r\n right: 10px;\r\n font-size: 12px;\r\n color: #888;\r\n z-index: 1000;\r\n}\r\n\r\n.button-debug {\r\n --background: #ff4081;\r\n --color: #fff;\r\n}\r\n\r\n\r\n.wrapper-no-internet {\r\n background-color: #fff;\r\n height: 100vh;\r\n display: flex;\r\n justify-content: center; /* centra en eje vertical */\r\n align-items: center; /* centra en eje horizontal */\r\n padding: 40px;\r\n background-image: url('assets/imagesIdvision/background.png') !important;\r\n background-size: cover;\r\n background-repeat: no-repeat;\r\n background-position: center;\r\n \r\n}\r\n\r\n.content-no-internet {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n text-align: center;\r\n gap: 16px;\r\n}\r\n\r\n.title-no-internet{\r\n color: #000;\r\n font-size: 32px;\r\n font-weight: bold;\r\n}\r\n\r\n.icon-no-internet {\r\n width: 125px;\r\n display: block;\r\n margin-top: 25px;\r\n}\r\n\r\n.description-no-internet {\r\n margin-top: 25px;\r\n font-size: 22px;\r\n color: #000;\r\n line-height: 1.5;\r\n text-align: center;\r\n}\r\n.no-border{\r\n --border-width: 0 !important;\r\n}\r\n\r\n.confirmation-screen {\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: space-between;\r\n height: 100vh; \r\n padding: 25px;\r\n box-sizing: border-box;\r\n background-image: url('assets/imagesIdvision/background.png');\r\n background-size: cover;\r\n background-repeat: no-repeat;\r\n background-position: center;\r\n background-color: white;\r\n}\r\n\r\n.image-confirmation {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n flex-grow: 1;\r\n width: 100%;\r\n}\r\n\r\n.image-confirmation img {\r\n max-width: 500px;\r\n width: 80%;\r\n height: auto;\r\n}\r\n\r\n\r\n.close-button {\r\n position: absolute;\r\n top: 12px;\r\n right: 12px; \r\n z-index: 1000;\r\n font-size: 15px;\r\n --color: #888; \r\n}\r\n\r\n.p-margin {\r\n margin-top: 50px !important;\r\n}\r\n\r\n"] }]
1395
+ }], () => [{ type: i1.ModalController }, { type: i1.AlertController }, { type: i1.Platform }, { type: i2.ModalDpiServices }, { type: i3.SdkCommunicationService }, { type: i1.NavController }, { type: i0.ChangeDetectorRef }, { type: i1.ToastController }, { type: i1.LoadingController }, { type: i4.ConfigurationService }, { type: i5.ValidationService }, { type: i6.NavigationService }, { type: i7.ProcessingService }, { type: i8.DpiService }], { dpi: [{
1396
+ type: ViewChild,
1397
+ args: ['dpi', { static: false }]
1398
+ }], swiperContainerRef: [{
1399
+ type: ViewChild,
1400
+ args: ['swiperContainer', { static: false, read: ElementRef }]
1401
+ }], isSwipe: [{
1402
+ type: Input
1403
+ }], dpiCode: [{
1404
+ type: Input
1405
+ }], connection: [{
1406
+ type: Input
1407
+ }], apikey: [{
1408
+ type: Input
1409
+ }], env: [{
1410
+ type: Input
1411
+ }], validationConfig: [{
1412
+ type: Input
1413
+ }] }); })();
1414
+ (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(IdVisionComponent, { className: "IdVisionComponent", filePath: "src\\app\\pages\\id-vision\\id-vision.component.ts", lineNumber: 55 }); })();
1410
1415
  //# sourceMappingURL=id-vision.component.js.map