login-tsi 0.0.5 → 0.0.7
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.
- package/fesm2022/login-tsi.mjs +123 -18
- package/fesm2022/login-tsi.mjs.map +1 -1
- package/lib/components/auth/auth.component.d.ts +9 -1
- package/lib/components/pwa-floating/pwa-floating.component.d.ts +15 -0
- package/lib/components/refresh-floating/refresh-floating.component.d.ts +9 -0
- package/lib/pwa-install.service.d.ts +16 -0
- package/package.json +1 -1
- package/public-api.d.ts +3 -0
package/fesm2022/login-tsi.mjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { NgClass } from '@angular/common';
|
|
2
2
|
import * as i0 from '@angular/core';
|
|
3
|
-
import {
|
|
3
|
+
import { signal, Injectable, inject, input, output, Component, computed, model, HostListener } from '@angular/core';
|
|
4
4
|
import * as i1 from '@angular/forms';
|
|
5
5
|
import { ReactiveFormsModule, FormBuilder, Validators, FormsModule } from '@angular/forms';
|
|
6
6
|
import { trigger, transition, style, animate } from '@angular/animations';
|
|
@@ -15,14 +15,119 @@ const fadeInOut = trigger('fadeInOut', [
|
|
|
15
15
|
]),
|
|
16
16
|
]);
|
|
17
17
|
|
|
18
|
+
class PwaInstallService {
|
|
19
|
+
isAndroid = /Android/i.test(navigator.userAgent);
|
|
20
|
+
isIOS = /iPad|iPhone|iPod/i.test(navigator.userAgent);
|
|
21
|
+
isSafariMac = /^((?!Chrome|Android).)*Safari/i.test(navigator.userAgent) && /Mac/i.test(navigator.platform);
|
|
22
|
+
isChrome = /Chrome|Chromium|Edg/i.test(navigator.userAgent) && !/Android/i.test(navigator.userAgent);
|
|
23
|
+
showButton = signal(!window.matchMedia('(display-mode: standalone)').matches);
|
|
24
|
+
showGuide = signal(false);
|
|
25
|
+
get deferredPrompt() { return window.__pwaPrompt ?? null; }
|
|
26
|
+
get canAutoInstall() { return !!this.deferredPrompt; }
|
|
27
|
+
async tryInstall() {
|
|
28
|
+
const prompt = this.deferredPrompt;
|
|
29
|
+
if (!prompt)
|
|
30
|
+
return;
|
|
31
|
+
prompt.prompt();
|
|
32
|
+
const { outcome } = await prompt.userChoice;
|
|
33
|
+
if (outcome === 'accepted')
|
|
34
|
+
this.showButton.set(false);
|
|
35
|
+
else
|
|
36
|
+
window.__pwaPrompt = null;
|
|
37
|
+
}
|
|
38
|
+
toggleGuide() { this.showGuide.update(v => !v); }
|
|
39
|
+
markAsAdded() {
|
|
40
|
+
this.showGuide.set(false);
|
|
41
|
+
this.showButton.set(false);
|
|
42
|
+
}
|
|
43
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PwaInstallService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
44
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PwaInstallService, providedIn: 'root' });
|
|
45
|
+
}
|
|
46
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PwaInstallService, decorators: [{
|
|
47
|
+
type: Injectable,
|
|
48
|
+
args: [{ providedIn: 'root' }]
|
|
49
|
+
}] });
|
|
50
|
+
|
|
51
|
+
class PwaFloatingComponent {
|
|
52
|
+
pwa = inject(PwaInstallService);
|
|
53
|
+
appName = input('ERP TSI');
|
|
54
|
+
logo = input('assets/images/logo-tsi-tres.png');
|
|
55
|
+
chipLabel = input('Instalar app');
|
|
56
|
+
beforeInstall = output();
|
|
57
|
+
guideClosed = output();
|
|
58
|
+
onChipClick() {
|
|
59
|
+
if (!this.pwa.showGuide()) {
|
|
60
|
+
this.beforeInstall.emit();
|
|
61
|
+
}
|
|
62
|
+
else {
|
|
63
|
+
this.guideClosed.emit();
|
|
64
|
+
}
|
|
65
|
+
this.pwa.toggleGuide();
|
|
66
|
+
}
|
|
67
|
+
onCloseGuide() {
|
|
68
|
+
this.guideClosed.emit();
|
|
69
|
+
this.pwa.toggleGuide();
|
|
70
|
+
}
|
|
71
|
+
onMarkAsAdded() {
|
|
72
|
+
this.guideClosed.emit();
|
|
73
|
+
this.pwa.markAsAdded();
|
|
74
|
+
}
|
|
75
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PwaFloatingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
76
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: PwaFloatingComponent, isStandalone: true, selector: "app-pwa-floating", inputs: { appName: { classPropertyName: "appName", publicName: "appName", isSignal: true, isRequired: false, transformFunction: null }, logo: { classPropertyName: "logo", publicName: "logo", isSignal: true, isRequired: false, transformFunction: null }, chipLabel: { classPropertyName: "chipLabel", publicName: "chipLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { beforeInstall: "beforeInstall", guideClosed: "guideClosed" }, ngImport: i0, template: "@if (pwa.showButton()) {\r\n<div class=\"pwa-wrap\">\r\n\r\n @if (pwa.showGuide()) {\r\n <div class=\"pwa-guide\">\r\n <button class=\"pwa-guide__close\" (click)=\"onCloseGuide()\">\r\n <i class=\"fas fa-xmark\"></i>\r\n </button>\r\n\r\n <div class=\"pwa-guide__header\">\r\n <img [src]=\"logo()\" alt=\"\" class=\"pwa-guide__logo\">\r\n <div>\r\n <p class=\"pwa-guide__title\">Instalar {{ appName() }}</p>\r\n <p class=\"pwa-guide__sub\">\u00DAsalo como una app desde tu dispositivo</p>\r\n </div>\r\n </div>\r\n\r\n @if (!pwa.canAutoInstall) {\r\n <ol class=\"pwa-guide__steps\">\r\n @if (pwa.isIOS) {\r\n <li>Toca el bot\u00F3n <span class=\"pwa-guide__badge\"><i class=\"fas fa-arrow-up-from-bracket\"></i></span> en la barra inferior del navegador</li>\r\n <li>Despl\u00E1zate y selecciona <strong>\"En la pantalla de inicio\"</strong></li>\r\n <li>Toca <strong>\"A\u00F1adir\"</strong> en la esquina superior derecha</li>\r\n } @else if (pwa.isAndroid) {\r\n <li>Toca el men\u00FA <span class=\"pwa-guide__badge\"><i class=\"fas fa-ellipsis-vertical\"></i></span> en la esquina superior derecha</li>\r\n <li>Selecciona <strong>\"Instalar aplicaci\u00F3n\"</strong> o <strong>\"A\u00F1adir a pantalla de inicio\"</strong></li>\r\n <li>Toca <strong>\"Instalar\"</strong> para confirmar</li>\r\n } @else if (pwa.isSafariMac) {\r\n <li>Abre el men\u00FA <strong>\"Archivo\"</strong> en la barra superior del Mac</li>\r\n <li>Selecciona <strong>\"A\u00F1adir al Dock...\"</strong></li>\r\n <li>Haz clic en <strong>\"A\u00F1adir\"</strong> para confirmar</li>\r\n } @else if (pwa.isChrome) {\r\n <li>Busca el \u00EDcono <span class=\"pwa-guide__badge\"><i class=\"fas fa-display\"></i></span> al final de la barra de direcciones</li>\r\n <li>Haz clic en \u00E9l y selecciona <strong>\"Instalar\"</strong></li>\r\n <li>Confirma en el di\u00E1logo que aparece</li>\r\n } @else {\r\n <li>Abre el men\u00FA <span class=\"pwa-guide__badge\"><i class=\"fas fa-ellipsis-vertical\"></i></span> de tu navegador</li>\r\n <li>Busca <strong>\"Instalar aplicaci\u00F3n\"</strong> o <strong>\"A\u00F1adir a pantalla de inicio\"</strong></li>\r\n <li>Confirma para instalar</li>\r\n }\r\n </ol>\r\n }\r\n\r\n @if (pwa.canAutoInstall) {\r\n <button class=\"pwa-guide__install\" (click)=\"pwa.tryInstall()\">\r\n <i class=\"fas fa-download\"></i> Instalar ahora\r\n </button>\r\n }\r\n <button class=\"pwa-guide__done\" (click)=\"onMarkAsAdded()\">\r\n <i class=\"fas fa-check\"></i> Ya lo instal\u00E9\r\n </button>\r\n </div>\r\n }\r\n\r\n <button class=\"pwa-chip\" (click)=\"onChipClick()\">\r\n <img [src]=\"logo()\" alt=\"\" class=\"pwa-chip__logo\">\r\n <span>{{ chipLabel() }}</span>\r\n </button>\r\n\r\n</div>\r\n}\r\n", styles: [".pwa-wrap{position:fixed;bottom:24px;left:24px;z-index:9000;display:flex;flex-direction:column;align-items:flex-start;gap:10px}.pwa-chip{display:flex;align-items:center;gap:8px;padding:7px 16px 7px 8px;border-radius:50px;border:1px solid rgba(255,255,255,.13);background:#040a18d9;backdrop-filter:blur(12px);color:#fff;font-size:12px;font-weight:500;cursor:pointer;box-shadow:0 4px 18px #0006;transition:transform .15s ease,box-shadow .15s ease;animation:pwaIn .3s cubic-bezier(.25,.46,.45,.94) both}.pwa-chip__logo{width:26px;height:26px;object-fit:contain;border-radius:6px;background:#398bf71f;padding:2px}.pwa-chip:hover{transform:translateY(-2px);box-shadow:0 6px 22px #00000080}.pwa-chip:active{transform:translateY(0)}.pwa-guide{position:relative;width:268px;background:#08122af5;backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:18px 18px 20px;box-shadow:0 8px 32px #00000080;animation:pwaIn .25s cubic-bezier(.25,.46,.45,.94) both}.pwa-guide__close{position:absolute;top:12px;right:12px;background:#ffffff14;border:none;border-radius:50%;width:26px;height:26px;display:flex;align-items:center;justify-content:center;color:#fff9;cursor:pointer;transition:background .15s;font-size:12px}.pwa-guide__close:hover{background:#ffffff26}.pwa-guide__header{display:flex;align-items:center;gap:12px;margin-bottom:16px}.pwa-guide__logo{width:38px;height:38px;object-fit:contain;filter:drop-shadow(0 0 8px rgba(57,139,247,.5))}.pwa-guide__title{font-size:13.5px;font-weight:600;color:#fff;margin:0}.pwa-guide__sub{font-size:11.5px;color:#ffffff73;margin:2px 0 0}.pwa-guide__steps{margin:0 0 4px;padding-left:20px;display:flex;flex-direction:column;gap:9px}.pwa-guide__steps li{font-size:12.5px;color:#ffffffbf;line-height:1.5}.pwa-guide__steps li strong{color:#fff}.pwa-guide__badge{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;background:#ffffff1a;border-radius:5px;font-size:11px;color:#fff;vertical-align:middle;margin:0 2px}.pwa-guide__install{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;margin-top:16px;padding:9px;border-radius:10px;border:none;background:#1e5fc4;color:#fff;font-size:12.5px;font-weight:600;cursor:pointer;transition:background .15s}.pwa-guide__install:hover{background:#1a54b0}.pwa-guide__done{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;margin-top:8px;padding:9px;border-radius:10px;border:1px solid rgba(74,222,128,.3);background:#4ade801a;color:#4ade80;font-size:12.5px;font-weight:500;cursor:pointer;transition:background .15s}.pwa-guide__done:hover{background:#4ade802e}@keyframes pwaIn{0%{transform:translateY(12px);opacity:0}to{transform:translateY(0);opacity:1}}\n"] });
|
|
77
|
+
}
|
|
78
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PwaFloatingComponent, decorators: [{
|
|
79
|
+
type: Component,
|
|
80
|
+
args: [{ selector: 'app-pwa-floating', template: "@if (pwa.showButton()) {\r\n<div class=\"pwa-wrap\">\r\n\r\n @if (pwa.showGuide()) {\r\n <div class=\"pwa-guide\">\r\n <button class=\"pwa-guide__close\" (click)=\"onCloseGuide()\">\r\n <i class=\"fas fa-xmark\"></i>\r\n </button>\r\n\r\n <div class=\"pwa-guide__header\">\r\n <img [src]=\"logo()\" alt=\"\" class=\"pwa-guide__logo\">\r\n <div>\r\n <p class=\"pwa-guide__title\">Instalar {{ appName() }}</p>\r\n <p class=\"pwa-guide__sub\">\u00DAsalo como una app desde tu dispositivo</p>\r\n </div>\r\n </div>\r\n\r\n @if (!pwa.canAutoInstall) {\r\n <ol class=\"pwa-guide__steps\">\r\n @if (pwa.isIOS) {\r\n <li>Toca el bot\u00F3n <span class=\"pwa-guide__badge\"><i class=\"fas fa-arrow-up-from-bracket\"></i></span> en la barra inferior del navegador</li>\r\n <li>Despl\u00E1zate y selecciona <strong>\"En la pantalla de inicio\"</strong></li>\r\n <li>Toca <strong>\"A\u00F1adir\"</strong> en la esquina superior derecha</li>\r\n } @else if (pwa.isAndroid) {\r\n <li>Toca el men\u00FA <span class=\"pwa-guide__badge\"><i class=\"fas fa-ellipsis-vertical\"></i></span> en la esquina superior derecha</li>\r\n <li>Selecciona <strong>\"Instalar aplicaci\u00F3n\"</strong> o <strong>\"A\u00F1adir a pantalla de inicio\"</strong></li>\r\n <li>Toca <strong>\"Instalar\"</strong> para confirmar</li>\r\n } @else if (pwa.isSafariMac) {\r\n <li>Abre el men\u00FA <strong>\"Archivo\"</strong> en la barra superior del Mac</li>\r\n <li>Selecciona <strong>\"A\u00F1adir al Dock...\"</strong></li>\r\n <li>Haz clic en <strong>\"A\u00F1adir\"</strong> para confirmar</li>\r\n } @else if (pwa.isChrome) {\r\n <li>Busca el \u00EDcono <span class=\"pwa-guide__badge\"><i class=\"fas fa-display\"></i></span> al final de la barra de direcciones</li>\r\n <li>Haz clic en \u00E9l y selecciona <strong>\"Instalar\"</strong></li>\r\n <li>Confirma en el di\u00E1logo que aparece</li>\r\n } @else {\r\n <li>Abre el men\u00FA <span class=\"pwa-guide__badge\"><i class=\"fas fa-ellipsis-vertical\"></i></span> de tu navegador</li>\r\n <li>Busca <strong>\"Instalar aplicaci\u00F3n\"</strong> o <strong>\"A\u00F1adir a pantalla de inicio\"</strong></li>\r\n <li>Confirma para instalar</li>\r\n }\r\n </ol>\r\n }\r\n\r\n @if (pwa.canAutoInstall) {\r\n <button class=\"pwa-guide__install\" (click)=\"pwa.tryInstall()\">\r\n <i class=\"fas fa-download\"></i> Instalar ahora\r\n </button>\r\n }\r\n <button class=\"pwa-guide__done\" (click)=\"onMarkAsAdded()\">\r\n <i class=\"fas fa-check\"></i> Ya lo instal\u00E9\r\n </button>\r\n </div>\r\n }\r\n\r\n <button class=\"pwa-chip\" (click)=\"onChipClick()\">\r\n <img [src]=\"logo()\" alt=\"\" class=\"pwa-chip__logo\">\r\n <span>{{ chipLabel() }}</span>\r\n </button>\r\n\r\n</div>\r\n}\r\n", styles: [".pwa-wrap{position:fixed;bottom:24px;left:24px;z-index:9000;display:flex;flex-direction:column;align-items:flex-start;gap:10px}.pwa-chip{display:flex;align-items:center;gap:8px;padding:7px 16px 7px 8px;border-radius:50px;border:1px solid rgba(255,255,255,.13);background:#040a18d9;backdrop-filter:blur(12px);color:#fff;font-size:12px;font-weight:500;cursor:pointer;box-shadow:0 4px 18px #0006;transition:transform .15s ease,box-shadow .15s ease;animation:pwaIn .3s cubic-bezier(.25,.46,.45,.94) both}.pwa-chip__logo{width:26px;height:26px;object-fit:contain;border-radius:6px;background:#398bf71f;padding:2px}.pwa-chip:hover{transform:translateY(-2px);box-shadow:0 6px 22px #00000080}.pwa-chip:active{transform:translateY(0)}.pwa-guide{position:relative;width:268px;background:#08122af5;backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:18px 18px 20px;box-shadow:0 8px 32px #00000080;animation:pwaIn .25s cubic-bezier(.25,.46,.45,.94) both}.pwa-guide__close{position:absolute;top:12px;right:12px;background:#ffffff14;border:none;border-radius:50%;width:26px;height:26px;display:flex;align-items:center;justify-content:center;color:#fff9;cursor:pointer;transition:background .15s;font-size:12px}.pwa-guide__close:hover{background:#ffffff26}.pwa-guide__header{display:flex;align-items:center;gap:12px;margin-bottom:16px}.pwa-guide__logo{width:38px;height:38px;object-fit:contain;filter:drop-shadow(0 0 8px rgba(57,139,247,.5))}.pwa-guide__title{font-size:13.5px;font-weight:600;color:#fff;margin:0}.pwa-guide__sub{font-size:11.5px;color:#ffffff73;margin:2px 0 0}.pwa-guide__steps{margin:0 0 4px;padding-left:20px;display:flex;flex-direction:column;gap:9px}.pwa-guide__steps li{font-size:12.5px;color:#ffffffbf;line-height:1.5}.pwa-guide__steps li strong{color:#fff}.pwa-guide__badge{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;background:#ffffff1a;border-radius:5px;font-size:11px;color:#fff;vertical-align:middle;margin:0 2px}.pwa-guide__install{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;margin-top:16px;padding:9px;border-radius:10px;border:none;background:#1e5fc4;color:#fff;font-size:12.5px;font-weight:600;cursor:pointer;transition:background .15s}.pwa-guide__install:hover{background:#1a54b0}.pwa-guide__done{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;margin-top:8px;padding:9px;border-radius:10px;border:1px solid rgba(74,222,128,.3);background:#4ade801a;color:#4ade80;font-size:12.5px;font-weight:500;cursor:pointer;transition:background .15s}.pwa-guide__done:hover{background:#4ade802e}@keyframes pwaIn{0%{transform:translateY(12px);opacity:0}to{transform:translateY(0);opacity:1}}\n"] }]
|
|
81
|
+
}] });
|
|
82
|
+
|
|
83
|
+
class RefreshFloatingComponent {
|
|
84
|
+
showGuide = signal(false);
|
|
85
|
+
toggleGuide() {
|
|
86
|
+
this.showGuide.update(v => !v);
|
|
87
|
+
}
|
|
88
|
+
actualizar() {
|
|
89
|
+
window.location.reload();
|
|
90
|
+
}
|
|
91
|
+
async actualizarTotal() {
|
|
92
|
+
if ('serviceWorker' in navigator) {
|
|
93
|
+
const registrations = await navigator.serviceWorker.getRegistrations();
|
|
94
|
+
await Promise.all(registrations.map(r => r.unregister()));
|
|
95
|
+
}
|
|
96
|
+
if ('caches' in window) {
|
|
97
|
+
const names = await caches.keys();
|
|
98
|
+
await Promise.all(names.map(name => caches.delete(name)));
|
|
99
|
+
}
|
|
100
|
+
window.location.href = window.location.pathname + '?_r=' + Date.now();
|
|
101
|
+
}
|
|
102
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: RefreshFloatingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
103
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: RefreshFloatingComponent, isStandalone: true, selector: "app-refresh-floating", ngImport: i0, template: "<div class=\"refresh-wrap\">\r\n\r\n @if (showGuide()) {\r\n <div class=\"refresh-guide\">\r\n <button class=\"refresh-guide__close\" (click)=\"toggleGuide()\">\r\n <i class=\"fas fa-xmark\"></i>\r\n </button>\r\n\r\n <p class=\"refresh-guide__title\">Actualizar aplicaci\u00F3n</p>\r\n\r\n <button class=\"refresh-guide__option\" (click)=\"actualizar()\">\r\n <i class=\"fas fa-rotate\"></i> Actualizar\r\n </button>\r\n\r\n <button class=\"refresh-guide__option refresh-guide__option--force\" (click)=\"actualizarTotal()\">\r\n <i class=\"fas fa-rotate-right\"></i> Forzar actualizaci\u00F3n\r\n </button>\r\n </div>\r\n }\r\n\r\n <button class=\"refresh-chip\" (click)=\"toggleGuide()\" title=\"Actualizar\">\r\n <i class=\"fas fa-rotate\"></i>\r\n </button>\r\n\r\n</div>\r\n", styles: [".refresh-wrap{position:fixed;bottom:24px;right:24px;z-index:9000;display:flex;flex-direction:column;align-items:flex-end;gap:10px}.refresh-chip{display:flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;border-radius:50%;border:1px solid rgba(255,255,255,.13);background:#0d6efd;backdrop-filter:blur(12px);color:#fff;font-size:15px;cursor:pointer;box-shadow:0 4px 18px #0006;transition:transform .15s ease,box-shadow .15s ease,background .15s ease;animation:refreshIn .3s cubic-bezier(.25,.46,.45,.94) both}.refresh-chip:hover{transform:translateY(-2px);background:#0b5ed7;box-shadow:0 6px 22px #0d6efd80}.refresh-chip:active{transform:translateY(0)}.refresh-guide{position:relative;width:240px;background:#08122af5;backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:18px 18px 20px;box-shadow:0 8px 32px #00000080;animation:refreshIn .25s cubic-bezier(.25,.46,.45,.94) both}.refresh-guide__close{position:absolute;top:12px;right:12px;background:#ffffff14;border:none;border-radius:50%;width:26px;height:26px;display:flex;align-items:center;justify-content:center;color:#fff9;cursor:pointer;transition:background .15s;font-size:12px}.refresh-guide__close:hover{background:#ffffff26}.refresh-guide__title{font-size:13.5px;font-weight:600;color:#fff;margin:0 24px 14px 0}.refresh-guide__option{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;margin-top:8px;padding:9px;border-radius:10px;border:none;background:#ffffff14;color:#fff;font-size:12.5px;font-weight:500;white-space:nowrap;cursor:pointer;transition:background .15s}.refresh-guide__option:hover{background:#ffffff26}.refresh-guide__option--force{background:#c50048d9}.refresh-guide__option--force:hover{background:#c50048}@keyframes refreshIn{0%{transform:translateY(12px);opacity:0}to{transform:translateY(0);opacity:1}}\n"] });
|
|
104
|
+
}
|
|
105
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: RefreshFloatingComponent, decorators: [{
|
|
106
|
+
type: Component,
|
|
107
|
+
args: [{ selector: 'app-refresh-floating', template: "<div class=\"refresh-wrap\">\r\n\r\n @if (showGuide()) {\r\n <div class=\"refresh-guide\">\r\n <button class=\"refresh-guide__close\" (click)=\"toggleGuide()\">\r\n <i class=\"fas fa-xmark\"></i>\r\n </button>\r\n\r\n <p class=\"refresh-guide__title\">Actualizar aplicaci\u00F3n</p>\r\n\r\n <button class=\"refresh-guide__option\" (click)=\"actualizar()\">\r\n <i class=\"fas fa-rotate\"></i> Actualizar\r\n </button>\r\n\r\n <button class=\"refresh-guide__option refresh-guide__option--force\" (click)=\"actualizarTotal()\">\r\n <i class=\"fas fa-rotate-right\"></i> Forzar actualizaci\u00F3n\r\n </button>\r\n </div>\r\n }\r\n\r\n <button class=\"refresh-chip\" (click)=\"toggleGuide()\" title=\"Actualizar\">\r\n <i class=\"fas fa-rotate\"></i>\r\n </button>\r\n\r\n</div>\r\n", styles: [".refresh-wrap{position:fixed;bottom:24px;right:24px;z-index:9000;display:flex;flex-direction:column;align-items:flex-end;gap:10px}.refresh-chip{display:flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;border-radius:50%;border:1px solid rgba(255,255,255,.13);background:#0d6efd;backdrop-filter:blur(12px);color:#fff;font-size:15px;cursor:pointer;box-shadow:0 4px 18px #0006;transition:transform .15s ease,box-shadow .15s ease,background .15s ease;animation:refreshIn .3s cubic-bezier(.25,.46,.45,.94) both}.refresh-chip:hover{transform:translateY(-2px);background:#0b5ed7;box-shadow:0 6px 22px #0d6efd80}.refresh-chip:active{transform:translateY(0)}.refresh-guide{position:relative;width:240px;background:#08122af5;backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:18px 18px 20px;box-shadow:0 8px 32px #00000080;animation:refreshIn .25s cubic-bezier(.25,.46,.45,.94) both}.refresh-guide__close{position:absolute;top:12px;right:12px;background:#ffffff14;border:none;border-radius:50%;width:26px;height:26px;display:flex;align-items:center;justify-content:center;color:#fff9;cursor:pointer;transition:background .15s;font-size:12px}.refresh-guide__close:hover{background:#ffffff26}.refresh-guide__title{font-size:13.5px;font-weight:600;color:#fff;margin:0 24px 14px 0}.refresh-guide__option{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;margin-top:8px;padding:9px;border-radius:10px;border:none;background:#ffffff14;color:#fff;font-size:12.5px;font-weight:500;white-space:nowrap;cursor:pointer;transition:background .15s}.refresh-guide__option:hover{background:#ffffff26}.refresh-guide__option--force{background:#c50048d9}.refresh-guide__option--force:hover{background:#c50048}@keyframes refreshIn{0%{transform:translateY(12px);opacity:0}to{transform:translateY(0);opacity:1}}\n"] }]
|
|
108
|
+
}] });
|
|
109
|
+
|
|
18
110
|
class AuthComponent {
|
|
19
111
|
production = input(true);
|
|
20
112
|
module = input('ERP'); // DEFECTO ERP
|
|
21
113
|
versionApp = input('1.0.0'); // DEFECTO 1.0.0
|
|
22
114
|
product = input(); // DEFECTO NULL - ERP
|
|
23
115
|
authForm = input.required();
|
|
116
|
+
aboutList = input([
|
|
117
|
+
'Gestión de compras y logística',
|
|
118
|
+
'Control financiero avanzado',
|
|
119
|
+
'Reportes y análisis en tiempo real',
|
|
120
|
+
'Integración con inteligencia artificial'
|
|
121
|
+
]);
|
|
122
|
+
/** Muestra el flotante de "instalar app" (app-pwa-floating). Por defecto siempre visible. */
|
|
123
|
+
showFloatingApp = input(true);
|
|
124
|
+
/** Muestra el flotante de "actualización disponible" (app-refresh-floating). Por defecto siempre visible. */
|
|
125
|
+
showFloatingUpdate = input(true);
|
|
24
126
|
loginEvent = output();
|
|
127
|
+
/** Se dispara antes de instalar la PWA — el RUC/usuario ya están en authForm(), el consumidor decide qué guardar. */
|
|
128
|
+
beforeInstall = output();
|
|
25
129
|
showPassword = signal(false);
|
|
130
|
+
onBeforeInstall = () => this.beforeInstall.emit();
|
|
26
131
|
recover = () => this.loginEvent.emit({ type: "RECOVER" });
|
|
27
132
|
forget = () => this.loginEvent.emit({ type: "FORGET" });
|
|
28
133
|
togglePassword = () => this.showPassword.set(!this.showPassword());
|
|
@@ -65,12 +170,12 @@ class AuthComponent {
|
|
|
65
170
|
this.loginEvent.emit({ type: "ERROR", message });
|
|
66
171
|
return false;
|
|
67
172
|
};
|
|
68
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
69
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: AuthComponent, isStandalone: true, selector: "lib-auth-tsi", inputs: { production: { classPropertyName: "production", publicName: "production", isSignal: true, isRequired: false, transformFunction: null }, module: { classPropertyName: "module", publicName: "module", isSignal: true, isRequired: false, transformFunction: null }, versionApp: { classPropertyName: "versionApp", publicName: "versionApp", isSignal: true, isRequired: false, transformFunction: null }, product: { classPropertyName: "product", publicName: "product", isSignal: true, isRequired: false, transformFunction: null }, authForm: { classPropertyName: "authForm", publicName: "authForm", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { loginEvent: "loginEvent" }, ngImport: i0, template: "<div class=\"auth-wrapper-login\">\r\n @let produccion = production();\r\n <div class=\"auth-panel-left\" [class.auth-panel-left--dev]=\"!produccion\">\r\n <span class=\"auth-blob auth-blob-1\"></span>\r\n <span class=\"auth-blob auth-blob-2\"></span>\r\n <span class=\"auth-blob auth-blob-3\"></span>\r\n <span class=\"auth-blob auth-blob-4\"></span>\r\n\r\n <div class=\"auth-brand-panel\">\r\n <div class=\"auth-brand-logo\">\r\n <img src=\"assets/images/logo-tsi-tres.png\" alt=\"TSI\" />\r\n </div>\r\n <h1 class=\"auth-brand-title\">{{module()}}</h1>\r\n <p class=\"auth-brand-subtitle\">Plataforma integrada de gesti\u00F3n<br>empresarial</p>\r\n\r\n <div class=\"auth-brand-divider\"></div>\r\n\r\n <div class=\"auth-brand-features\">\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Gesti\u00F3n de compras y log\u00EDstica\r\n </div>\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Control financiero avanzado\r\n </div>\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Reportes y an\u00E1lisis en tiempo real\r\n </div>\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Integraci\u00F3n con inteligencia artificial\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"auth-panel-right\" [class.auth-panel-right--dev]=\"!produccion\">\r\n <div class=\"auth-panel-bg\">\r\n <span class=\"auth-deco auth-deco-tl\"></span>\r\n <span class=\"auth-deco auth-deco-br\"></span>\r\n </div>\r\n\r\n <div class=\"auth-form-wrapper\">\r\n <div>\r\n @if (!produccion) {\r\n <div>\r\n <span class=\"auth-test-badge\">\r\n <span class=\"badge-dot\"></span> ENTORNO DE PRUEBAS\r\n </span>\r\n </div>\r\n }\r\n\r\n <div class=\"auth-card\">\r\n <h2 class=\"auth-card-title\">Bienvenido de vuelta</h2>\r\n <p class=\"auth-card-subtitle\">Ingresa tus credenciales para continuar</p>\r\n\r\n <form [formGroup]=\"authForm()\" id=\"loginform\">\r\n\r\n <div class=\"auth-field\" [class.has-error]=\"validacion('ruc')\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-building\"></i></span>\r\n <input type=\"text\" formControlName=\"ruc\" class=\"auth-input\" placeholder=\" \" maxlength=\"11\"\r\n id=\"f-ruc\" autocomplete=\"off\">\r\n <label for=\"f-ruc\" class=\"auth-label\">RUC</label>\r\n </div>\r\n @if (validacion('ruc')) {\r\n <p class=\"auth-error\" @fadeInOut>Ingresar RUC</p>\r\n }\r\n\r\n <div class=\"auth-field\" [class.has-error]=\"validacion('nomuser')\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-user\"></i></span>\r\n <input type=\"text\" formControlName=\"nomuser\" class=\"auth-input\" placeholder=\" \" id=\"f-user\"\r\n autocomplete=\"off\">\r\n <label for=\"f-user\" class=\"auth-label\">Usuario</label>\r\n </div>\r\n @if (validacion('nomuser')) {\r\n <p class=\"auth-error\" @fadeInOut>Ingresar usuario</p>\r\n }\r\n\r\n <div class=\"auth-field\" [class.has-error]=\"validacion('clave')\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-lock\"></i></span>\r\n <input [type]=\"showPassword() ? 'text' : 'password'\" formControlName=\"clave\"\r\n class=\"auth-input\" placeholder=\" \" id=\"f-clave\" autocomplete=\"new-password\">\r\n <label for=\"f-clave\" class=\"auth-label\">Contrase\u00F1a</label>\r\n <button type=\"button\" class=\"auth-toggle-pw\" (click)=\"togglePassword()\">\r\n <i [class]=\"showPassword() ? 'fas fa-eye' : 'fas fa-eye-slash'\"></i>\r\n </button>\r\n </div>\r\n @if (validacion('clave')) {\r\n <p class=\"auth-error\" @fadeInOut>Ingresar clave</p>\r\n }\r\n\r\n <button class=\"auth-btn mt-2\" [class.auth-btn--red]=\"!produccion\" (click)=\"login()\">\r\n Ingresar\r\n </button>\r\n\r\n <div class=\"auth-links\">\r\n <a [ngClass]=\"produccion ? 'blue_contrasena' : 'red_contrasena'\"\r\n (click)=\"recover()\">\u00BFOlvidaste tu contrase\u00F1a?</a>\r\n <a [ngClass]=\"produccion ? 'blue_contrasena' : 'red_contrasena'\"\r\n (click)=\"forget()\">\u00BFContrase\u00F1a vencida?</a>\r\n </div>\r\n\r\n </form>\r\n\r\n <div class=\"auth-version\">\r\n <span>v{{versionApp()}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: ["", "@charset \"UTF-8\";.red_contrasena,.blue_contrasena{position:relative;display:inline-block;font-size:13px;text-decoration:none;padding-bottom:2px;transition:color .3s ease;cursor:pointer}.red_contrasena:after,.blue_contrasena:after{content:\"\";position:absolute;bottom:0;left:50%;width:0;height:1px;background-color:currentColor;transition:all .3s ease;transform:translate(-50%)}.red_contrasena:hover:after,.blue_contrasena:hover:after{width:60%}.red_contrasena{color:#d1326f}.red_contrasena:hover{color:#a82859}.blue_contrasena{color:#398bf7}.blue_contrasena:hover{color:#1e5fc4}.auth-wrapper-login{position:fixed;inset:0;display:grid;grid-template-columns:1.15fr .85fr;overflow:hidden;background:#060d1f}.auth-panel-left{position:relative;overflow:hidden;background:linear-gradient(145deg,#040a18,#0b1a3d 55%,#040e22);display:flex;align-items:center;justify-content:center;padding:48px 40px}.auth-panel-left:before{content:\"\";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.055) 1px,transparent 1px);background-size:26px 26px;z-index:1;pointer-events:none}.auth-panel-left:after{content:\"\";position:absolute;top:0;left:-120%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(57,139,247,.04),transparent);animation:panelSweep 7s ease-in-out infinite;z-index:1;pointer-events:none}.auth-blob{position:absolute;border-radius:50%;filter:blur(72px);z-index:0;pointer-events:none}.auth-blob-1{width:340px;height:340px;background:radial-gradient(circle,rgba(57,139,247,.45) 0%,transparent 70%);top:-90px;right:-70px;animation:blobDrift 11s ease-in-out infinite}.auth-blob-2{width:240px;height:240px;background:radial-gradient(circle,rgba(124,58,237,.4) 0%,transparent 70%);bottom:60px;left:-50px;animation:blobDrift 14s ease-in-out infinite reverse}.auth-blob-3{width:180px;height:180px;background:radial-gradient(circle,rgba(14,165,233,.35) 0%,transparent 70%);bottom:-50px;right:40px;animation:blobDrift 9s ease-in-out infinite;animation-delay:-4s}.auth-blob-4{width:120px;height:120px;background:radial-gradient(circle,rgba(209,50,111,.25) 0%,transparent 70%);top:50%;left:50%;transform:translate(-50%,-50%);animation:blobDrift 16s ease-in-out infinite;animation-delay:-8s}@keyframes blobDrift{0%,to{transform:translate(0) scale(1)}33%{transform:translate(14px,-20px) scale(1.05)}66%{transform:translate(-10px,12px) scale(.96)}}@keyframes panelSweep{0%{left:-120%}50%{left:160%}to{left:160%}}.auth-brand-panel{position:relative;z-index:2;text-align:center;color:#fff;max-width:340px}.auth-brand-logo{width:100px;height:100px;border-radius:50%;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;margin:0 auto 28px;box-shadow:0 0 0 14px #398bf70f,0 0 50px #398bf733;backdrop-filter:blur(8px)}.auth-brand-logo img{width:64px;height:64px;object-fit:contain;filter:brightness(1.05) drop-shadow(0 0 8px rgba(57,139,247,.4))}.auth-brand-title{font-size:30px;font-weight:700;letter-spacing:-.5px;margin-bottom:10px;background:linear-gradient(135deg,#fff 20%,#93c5fd 80%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.auth-brand-subtitle{font-size:14px;color:#ffffff73;line-height:1.65;margin-bottom:40px;letter-spacing:.2px}.auth-brand-features{display:flex;flex-direction:column;gap:14px;text-align:left}.auth-brand-feature{display:flex;align-items:center;gap:12px;font-size:13px;color:#fff9}.auth-brand-feature .feat-dot{flex-shrink:0;width:7px;height:7px;border-radius:50%;background:#398bf7;box-shadow:0 0 10px #398bf7b3}.auth-brand-divider{width:60px;height:2px;background:linear-gradient(90deg,transparent,#398bf7,transparent);margin:28px auto 32px;border-radius:2px}.auth-panel-left--dev{background:linear-gradient(145deg,#18040b,#3d0b1d 55%,#220409)}.auth-panel-left--dev:after{background:linear-gradient(90deg,transparent,rgba(209,50,111,.05),transparent)}.auth-panel-left--dev .auth-blob-1{background:radial-gradient(circle,rgba(220,38,38,.52) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-2{background:radial-gradient(circle,rgba(219,39,119,.44) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-3{background:radial-gradient(circle,rgba(239,68,68,.38) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-4{background:radial-gradient(circle,rgba(249,115,22,.28) 0%,transparent 70%)}.auth-panel-left--dev .auth-brand-logo{box-shadow:0 0 0 14px #d1326f12,0 0 50px #d1326f38}.auth-panel-left--dev .auth-brand-logo img{filter:brightness(1.05) drop-shadow(0 0 8px rgba(209,50,111,.45))}.auth-panel-left--dev .auth-brand-title{background:linear-gradient(135deg,#fff 20%,#fca5a5 80%);-webkit-background-clip:text;background-clip:text}.auth-panel-left--dev .auth-brand-divider{background:linear-gradient(90deg,transparent,rgb(209,50,111),transparent)}.auth-panel-left--dev .feat-dot{background:#d1326f;box-shadow:0 0 10px #d1326fb8}.auth-panel-right{position:relative;overflow:hidden;background:var(--background-login)}.auth-panel-right:before{content:\"\";position:absolute;inset:0;background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(57,139,247,.045) 22px,rgba(57,139,247,.045) 23px);animation:authLinesMove 10s linear infinite;pointer-events:none;z-index:0}.auth-panel-right:after{content:\"\";position:absolute;top:0;bottom:0;left:-25%;width:25%;background:linear-gradient(90deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLine 7s ease-in-out infinite;animation-delay:3.5s;pointer-events:none;z-index:0}@keyframes authLinesMove{0%{transform:translate(0)}to{transform:translate(46px,46px)}}@keyframes authScanLine{0%{left:-25%}50%{left:120%}to{left:120%}}.auth-panel-bg{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}.auth-deco{position:absolute;border-radius:50%;pointer-events:none;filter:blur(70px)}.auth-deco-tl{width:300px;height:300px;top:0;left:-120px;transform:translateY(-40%);background:radial-gradient(circle,rgba(57,139,247,.12) 0%,transparent 70%);animation:authOrbPulse 6s ease-in-out infinite}.auth-deco-br{width:340px;height:340px;bottom:0;right:-120px;transform:translateY(40%);background:radial-gradient(circle,rgba(124,58,237,.1) 0%,transparent 70%);animation:authOrbPulse 8s ease-in-out infinite;animation-delay:-4s}@keyframes authOrbPulse{0%,to{opacity:.7}50%{opacity:1}}.auth-form-wrapper{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;align-items:center;z-index:1}.auth-form-wrapper>div{width:100%;max-width:420px;margin:auto;padding:36px 16px;box-sizing:border-box}.auth-panel-right--dev:before{background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(209,50,111,.05) 22px,rgba(209,50,111,.05) 23px)}.auth-panel-right--dev:after{background:linear-gradient(90deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}.auth-panel-right--dev .auth-deco-tl{background:radial-gradient(circle,rgba(209,50,111,.12) 0%,transparent 70%)}.auth-panel-right--dev .auth-deco-br{background:radial-gradient(circle,rgba(239,68,68,.1) 0%,transparent 70%)}.auth-test-badge{display:inline-flex;align-items:center;gap:7px;background:#d1326f14;border:1px solid rgba(209,50,111,.25);color:#d1326f;font-size:10.5px;font-weight:700;padding:5px 12px;border-radius:20px;margin-bottom:18px;letter-spacing:.8px}.auth-test-badge .badge-dot{width:6px;height:6px;border-radius:50%;background:#d1326f;animation:badgePulse 1.6s ease-in-out infinite;flex-shrink:0}@keyframes badgePulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.75)}}.auth-card{background:var(--background-card);border-radius:20px;padding:36px 32px 28px;box-shadow:0 4px 28px #00000014;border:1px solid var(--border-color-modal)}.auth-card-title{font-size:22px;font-weight:700;color:var(--text-color);margin-bottom:4px;letter-spacing:-.3px}.auth-card-subtitle{font-size:13px;color:var(--placeholder-color);margin-bottom:26px}.auth-field{position:relative;margin-bottom:1rem}.auth-field .auth-field-icon{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--placeholder-color);font-size:13px;z-index:2;pointer-events:none;transition:color .2s}.auth-field .auth-input{width:100%;padding:15px 40px 15px 37px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s,background .2s}.auth-field .auth-input::placeholder{color:transparent}.auth-field .auth-input:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721;background:var(--background-focus-input)}.auth-field .auth-input:focus~.auth-label{top:0;font-size:11px!important;color:#398bf7!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-input:focus~.auth-field-icon{color:#398bf7}.auth-field .auth-input:not(:placeholder-shown)~.auth-label{top:0;font-size:11px!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-label{position:absolute;left:35px;top:50%;transform:translateY(-50%);color:var(--placeholder-color)!important;font-size:13px!important;font-weight:400!important;pointer-events:none;transition:top .15s ease,font-size .15s ease,color .15s ease,padding .15s ease,background .15s ease;background:transparent;z-index:1;text-align:left!important}.auth-field .auth-toggle-pw{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--placeholder-color);cursor:pointer;padding:4px 6px;font-size:13px;z-index:2;line-height:1;transition:color .2s}.auth-field .auth-toggle-pw:hover{color:#398bf7}.auth-field.has-error .auth-input{border-color:#dc3545;box-shadow:none}.auth-field.has-error .auth-field-icon{color:#dc3545}.auth-select{width:100%;padding:13px 14px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s;margin-bottom:1rem;cursor:pointer}.auth-select:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721}.auth-btn{width:100%;padding:13px;border:none;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;transition:transform .15s ease,box-shadow .2s ease,opacity .2s;background:linear-gradient(135deg,#398bf7,#1e5fc4);color:#fff;letter-spacing:.3px;margin-bottom:10px;display:block}.auth-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 5px 18px #398bf761}.auth-btn:active:not(:disabled){transform:translateY(0)}.auth-btn:disabled{opacity:.55;cursor:not-allowed}.auth-btn.auth-btn--red{background:linear-gradient(135deg,#d1326f,#a82859)}.auth-btn.auth-btn--red:hover:not(:disabled){box-shadow:0 5px 18px #d1326f61}.auth-btn.auth-btn--outline{background:transparent;border:1.5px solid var(--font-border-input);color:var(--text-color)}.auth-btn.auth-btn--outline:hover:not(:disabled){background:var(--background-btn-light-hover);box-shadow:none;transform:none}.auth-links{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:16px;padding-top:16px;border-top:1px solid var(--border-color-modal)}.auth-version{text-align:right;margin-top:14px;padding-top:12px;border-top:1px solid var(--border-color-modal)}.auth-version span{font-size:11px;color:var(--placeholder-color)}.auth-error{font-size:11.5px;color:#dc3545;margin:-6px 0 10px 2px;padding:0}.auth-validation-list{margin:-4px 0 12px;padding:0;list-style:none}.auth-validation-list li{font-size:11.5px;color:#dc3545;padding:2px 0}.auth-validation-list li:before{content:\"\\2715 \";font-size:10px}.auth-desc{font-size:13px;color:var(--placeholder-color);margin-bottom:20px;line-height:1.65}.auth-section-title{font-size:15px;font-weight:600;color:var(--text-color);margin-bottom:20px}.font-12{font-size:12px}.form-control:focus{border-color:#0199ff9a!important;box-shadow:0 0 5px .2px #65befa44!important}@media (max-width: 900px){.auth-wrapper-login{grid-template-columns:1fr;grid-template-rows:auto 1fr;overflow-y:auto;overflow-x:hidden}.auth-panel-left{padding:14px 24px;justify-content:center}.auth-panel-left .auth-brand-subtitle,.auth-panel-left .auth-brand-features,.auth-panel-left .auth-brand-divider{display:none!important}.auth-panel-left .auth-brand-panel{display:flex!important;flex-direction:row!important;align-items:center;gap:0;text-align:left;max-width:none;width:100%;justify-content:center}.auth-panel-left .auth-brand-logo{width:52px;height:52px;margin:0;flex-shrink:0}.auth-panel-left .auth-brand-logo img{width:34px;height:34px}.auth-panel-left .auth-brand-title{font-size:20px;margin-bottom:0;margin-left:.5rem;flex-shrink:1}.auth-panel-right:after{inset:-25% 0 auto;width:100%;height:25%;background:linear-gradient(180deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLineV 7s ease-in-out infinite;animation-delay:3.5s}.auth-panel-right--dev:after{background:linear-gradient(180deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}}@keyframes authScanLineV{0%{top:-25%}50%{top:120%}to{top:120%}}@media (max-width: 480px){.auth-panel-left{padding:12px 16px}.auth-panel-left .auth-brand-logo{width:44px;height:44px}.auth-panel-left .auth-brand-logo img{width:28px;height:28px}.auth-panel-left .auth-brand-title{font-size:17px}.auth-form-wrapper>div{padding:20px 12px}.auth-card{padding:24px 18px 20px;border-radius:16px}.font-12{font-size:10px!important}}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], animations: [fadeInOut] });
|
|
173
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: AuthComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
174
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: AuthComponent, isStandalone: true, selector: "lib-auth-tsi", inputs: { production: { classPropertyName: "production", publicName: "production", isSignal: true, isRequired: false, transformFunction: null }, module: { classPropertyName: "module", publicName: "module", isSignal: true, isRequired: false, transformFunction: null }, versionApp: { classPropertyName: "versionApp", publicName: "versionApp", isSignal: true, isRequired: false, transformFunction: null }, product: { classPropertyName: "product", publicName: "product", isSignal: true, isRequired: false, transformFunction: null }, authForm: { classPropertyName: "authForm", publicName: "authForm", isSignal: true, isRequired: true, transformFunction: null }, aboutList: { classPropertyName: "aboutList", publicName: "aboutList", isSignal: true, isRequired: false, transformFunction: null }, showFloatingApp: { classPropertyName: "showFloatingApp", publicName: "showFloatingApp", isSignal: true, isRequired: false, transformFunction: null }, showFloatingUpdate: { classPropertyName: "showFloatingUpdate", publicName: "showFloatingUpdate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { loginEvent: "loginEvent", beforeInstall: "beforeInstall" }, ngImport: i0, template: "<div class=\"auth-wrapper-login\">\r\n @let produccion = production();\r\n <div class=\"auth-panel-left\" [class.auth-panel-left--dev]=\"!produccion\">\r\n <span class=\"auth-blob auth-blob-1\"></span>\r\n <span class=\"auth-blob auth-blob-2\"></span>\r\n <span class=\"auth-blob auth-blob-3\"></span>\r\n <span class=\"auth-blob auth-blob-4\"></span>\r\n\r\n <div class=\"auth-brand-panel\">\r\n <div class=\"auth-brand-logo\">\r\n <img src=\"assets/images/logo-tsi-tres.png\" alt=\"TSI\" />\r\n </div>\r\n <h1 class=\"auth-brand-title\">{{module()}}</h1>\r\n <p class=\"auth-brand-subtitle\">Plataforma integrada de gesti\u00F3n<br>empresarial</p>\r\n\r\n <div class=\"auth-brand-divider\"></div>\r\n\r\n <div class=\"auth-brand-features\">\r\n @for (item of aboutList(); track $index) {\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> {{item}}\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"auth-panel-right\" [class.auth-panel-right--dev]=\"!produccion\">\r\n <div class=\"auth-panel-bg\">\r\n <span class=\"auth-deco auth-deco-tl\"></span>\r\n <span class=\"auth-deco auth-deco-br\"></span>\r\n </div>\r\n\r\n <div class=\"auth-form-wrapper\">\r\n <div>\r\n @if (!produccion) {\r\n <div>\r\n <span class=\"auth-test-badge\">\r\n <span class=\"badge-dot\"></span> ENTORNO DE PRUEBAS\r\n </span>\r\n </div>\r\n }\r\n\r\n <div class=\"auth-card\">\r\n <h2 class=\"auth-card-title\">Bienvenido de vuelta</h2>\r\n <p class=\"auth-card-subtitle\">Ingresa tus credenciales para continuar</p>\r\n\r\n <form [formGroup]=\"authForm()\" id=\"loginform\">\r\n\r\n <p class=\"auth-hint\">\r\n <i class=\"fas fa-circle-info\"></i>\r\n Si piensas instalar la app, te recomendamos completar el RUC y Usuario antes, estos quedar\u00E1n guardados y siempre aparecer\u00E1n completos al abrirla.\r\n </p>\r\n\r\n <div class=\"auth-field\" [class.has-error]=\"validacion('ruc')\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-building\"></i></span>\r\n <input type=\"text\" formControlName=\"ruc\" class=\"auth-input\" placeholder=\" \" maxlength=\"11\"\r\n id=\"f-ruc\" autocomplete=\"off\">\r\n <label for=\"f-ruc\" class=\"auth-label\">RUC</label>\r\n </div>\r\n @if (validacion('ruc')) {\r\n <p class=\"auth-error\" @fadeInOut>Ingresar RUC</p>\r\n }\r\n\r\n <div class=\"auth-field\" [class.has-error]=\"validacion('nomuser')\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-user\"></i></span>\r\n <input type=\"text\" formControlName=\"nomuser\" class=\"auth-input\" placeholder=\" \" id=\"f-user\"\r\n autocomplete=\"off\">\r\n <label for=\"f-user\" class=\"auth-label\">Usuario</label>\r\n </div>\r\n @if (validacion('nomuser')) {\r\n <p class=\"auth-error\" @fadeInOut>Ingresar usuario</p>\r\n }\r\n\r\n <div class=\"auth-field\" [class.has-error]=\"validacion('clave')\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-lock\"></i></span>\r\n <input [type]=\"showPassword() ? 'text' : 'password'\" formControlName=\"clave\"\r\n class=\"auth-input\" placeholder=\" \" id=\"f-clave\" autocomplete=\"off\" autocorrect=\"off\"\r\n autocapitalize=\"off\" spellcheck=\"false\">\r\n <label for=\"f-clave\" class=\"auth-label\">Contrase\u00F1a</label>\r\n <button type=\"button\" class=\"auth-toggle-pw\" (click)=\"togglePassword()\">\r\n <i [class]=\"showPassword() ? 'fas fa-eye' : 'fas fa-eye-slash'\"></i>\r\n </button>\r\n </div>\r\n @if (validacion('clave')) {\r\n <p class=\"auth-error\" @fadeInOut>Ingresar clave</p>\r\n }\r\n\r\n <button class=\"auth-btn mt-2\" [class.auth-btn--red]=\"!produccion\" (click)=\"login()\">\r\n Ingresar\r\n </button>\r\n\r\n <div class=\"auth-links\">\r\n <a [ngClass]=\"produccion ? 'blue_contrasena' : 'red_contrasena'\"\r\n (click)=\"recover()\">\u00BFOlvidaste tu contrase\u00F1a?</a>\r\n <a [ngClass]=\"produccion ? 'blue_contrasena' : 'red_contrasena'\"\r\n (click)=\"forget()\">\u00BFContrase\u00F1a vencida?</a>\r\n </div>\r\n\r\n </form>\r\n\r\n <div class=\"auth-version\">\r\n <span>v{{versionApp()}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n@if (showFloatingApp()) {\r\n<app-pwa-floating [appName]=\"module()\" (beforeInstall)=\"onBeforeInstall()\" />\r\n}\r\n@if (showFloatingUpdate()) {\r\n<app-refresh-floating />\r\n}", styles: ["", "@charset \"UTF-8\";.red_contrasena,.blue_contrasena{position:relative;display:inline-block;font-size:13px;text-decoration:none;padding-bottom:2px;transition:color .3s ease;cursor:pointer}.red_contrasena:after,.blue_contrasena:after{content:\"\";position:absolute;bottom:0;left:50%;width:0;height:1px;background-color:currentColor;transition:all .3s ease;transform:translate(-50%)}.red_contrasena:hover:after,.blue_contrasena:hover:after{width:60%}.red_contrasena{color:#d1326f}.red_contrasena:hover{color:#a82859}.blue_contrasena{color:#398bf7}.blue_contrasena:hover{color:#1e5fc4}.auth-wrapper-login{position:fixed;inset:0;display:grid;grid-template-columns:1.15fr .85fr;overflow:hidden;background:#060d1f}.auth-panel-left{position:relative;overflow:hidden;background:linear-gradient(145deg,#040a18,#0b1a3d 55%,#040e22);display:flex;align-items:center;justify-content:center;padding:48px 40px}.auth-panel-left:before{content:\"\";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.055) 1px,transparent 1px);background-size:26px 26px;z-index:1;pointer-events:none}.auth-panel-left:after{content:\"\";position:absolute;top:0;left:-120%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(57,139,247,.04),transparent);animation:panelSweep 7s ease-in-out infinite;z-index:1;pointer-events:none}.auth-blob{position:absolute;border-radius:50%;filter:blur(72px);z-index:0;pointer-events:none}.auth-blob-1{width:340px;height:340px;background:radial-gradient(circle,rgba(57,139,247,.45) 0%,transparent 70%);top:-90px;right:-70px;animation:blobDrift 11s ease-in-out infinite}.auth-blob-2{width:240px;height:240px;background:radial-gradient(circle,rgba(124,58,237,.4) 0%,transparent 70%);bottom:60px;left:-50px;animation:blobDrift 14s ease-in-out infinite reverse}.auth-blob-3{width:180px;height:180px;background:radial-gradient(circle,rgba(14,165,233,.35) 0%,transparent 70%);bottom:-50px;right:40px;animation:blobDrift 9s ease-in-out infinite;animation-delay:-4s}.auth-blob-4{width:120px;height:120px;background:radial-gradient(circle,rgba(209,50,111,.25) 0%,transparent 70%);top:50%;left:50%;transform:translate(-50%,-50%);animation:blobDrift 16s ease-in-out infinite;animation-delay:-8s}@keyframes blobDrift{0%,to{transform:translate(0) scale(1)}33%{transform:translate(14px,-20px) scale(1.05)}66%{transform:translate(-10px,12px) scale(.96)}}@keyframes panelSweep{0%{left:-120%}50%{left:160%}to{left:160%}}.auth-brand-panel{position:relative;z-index:2;text-align:center;color:#fff;max-width:340px}.auth-brand-logo{width:100px;height:100px;border-radius:50%;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;margin:0 auto 28px;box-shadow:0 0 0 14px #398bf70f,0 0 50px #398bf733;backdrop-filter:blur(8px)}.auth-brand-logo img{width:64px;height:64px;object-fit:contain;filter:brightness(1.05) drop-shadow(0 0 8px rgba(57,139,247,.4))}.auth-brand-title{font-size:30px;font-weight:700;letter-spacing:-.5px;margin-bottom:10px;background:linear-gradient(135deg,#fff 20%,#93c5fd 80%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.auth-brand-subtitle{font-size:14px;color:#ffffff73;line-height:1.65;margin-bottom:40px;letter-spacing:.2px}.auth-brand-features{display:flex;flex-direction:column;gap:14px;text-align:left}.auth-brand-feature{display:flex;align-items:center;gap:12px;font-size:13px;color:#fff9}.auth-brand-feature .feat-dot{flex-shrink:0;width:7px;height:7px;border-radius:50%;background:#398bf7;box-shadow:0 0 10px #398bf7b3}.auth-brand-divider{width:60px;height:2px;background:linear-gradient(90deg,transparent,#398bf7,transparent);margin:28px auto 32px;border-radius:2px}.auth-panel-left--dev{background:linear-gradient(145deg,#18040b,#3d0b1d 55%,#220409)}.auth-panel-left--dev:after{background:linear-gradient(90deg,transparent,rgba(209,50,111,.05),transparent)}.auth-panel-left--dev .auth-blob-1{background:radial-gradient(circle,rgba(220,38,38,.52) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-2{background:radial-gradient(circle,rgba(219,39,119,.44) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-3{background:radial-gradient(circle,rgba(239,68,68,.38) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-4{background:radial-gradient(circle,rgba(249,115,22,.28) 0%,transparent 70%)}.auth-panel-left--dev .auth-brand-logo{box-shadow:0 0 0 14px #d1326f12,0 0 50px #d1326f38}.auth-panel-left--dev .auth-brand-logo img{filter:brightness(1.05) drop-shadow(0 0 8px rgba(209,50,111,.45))}.auth-panel-left--dev .auth-brand-title{background:linear-gradient(135deg,#fff 20%,#fca5a5 80%);-webkit-background-clip:text;background-clip:text}.auth-panel-left--dev .auth-brand-divider{background:linear-gradient(90deg,transparent,rgb(209,50,111),transparent)}.auth-panel-left--dev .feat-dot{background:#d1326f;box-shadow:0 0 10px #d1326fb8}.auth-panel-right{position:relative;overflow:hidden;background:var(--background-login)}.auth-panel-right:before{content:\"\";position:absolute;inset:0;background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(57,139,247,.045) 22px,rgba(57,139,247,.045) 23px);animation:authLinesMove 10s linear infinite;pointer-events:none;z-index:0}.auth-panel-right:after{content:\"\";position:absolute;top:0;bottom:0;left:-25%;width:25%;background:linear-gradient(90deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLine 7s ease-in-out infinite;animation-delay:3.5s;pointer-events:none;z-index:0}@keyframes authLinesMove{0%{transform:translate(0)}to{transform:translate(46px,46px)}}@keyframes authScanLine{0%{left:-25%}50%{left:120%}to{left:120%}}.auth-panel-bg{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}.auth-deco{position:absolute;border-radius:50%;pointer-events:none;filter:blur(70px)}.auth-deco-tl{width:300px;height:300px;top:0;left:-120px;transform:translateY(-40%);background:radial-gradient(circle,rgba(57,139,247,.12) 0%,transparent 70%);animation:authOrbPulse 6s ease-in-out infinite}.auth-deco-br{width:340px;height:340px;bottom:0;right:-120px;transform:translateY(40%);background:radial-gradient(circle,rgba(124,58,237,.1) 0%,transparent 70%);animation:authOrbPulse 8s ease-in-out infinite;animation-delay:-4s}@keyframes authOrbPulse{0%,to{opacity:.7}50%{opacity:1}}.auth-form-wrapper{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;align-items:center;z-index:1}.auth-form-wrapper>div{width:100%;max-width:420px;margin:auto;padding:36px 16px;box-sizing:border-box}.auth-panel-right--dev:before{background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(209,50,111,.05) 22px,rgba(209,50,111,.05) 23px)}.auth-panel-right--dev:after{background:linear-gradient(90deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}.auth-panel-right--dev .auth-deco-tl{background:radial-gradient(circle,rgba(209,50,111,.12) 0%,transparent 70%)}.auth-panel-right--dev .auth-deco-br{background:radial-gradient(circle,rgba(239,68,68,.1) 0%,transparent 70%)}.auth-test-badge{display:inline-flex;align-items:center;gap:7px;background:#d1326f14;border:1px solid rgba(209,50,111,.25);color:#d1326f;font-size:10.5px;font-weight:700;padding:5px 12px;border-radius:20px;margin-bottom:18px;letter-spacing:.8px}.auth-test-badge .badge-dot{width:6px;height:6px;border-radius:50%;background:#d1326f;animation:badgePulse 1.6s ease-in-out infinite;flex-shrink:0}@keyframes badgePulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.75)}}.auth-card{background:var(--background-card);border-radius:20px;padding:36px 32px 28px;box-shadow:0 4px 28px #00000014;border:1px solid var(--border-color-modal)}.auth-card-title{font-size:22px;font-weight:700;color:var(--text-color);margin-bottom:4px;letter-spacing:-.3px}.auth-card-subtitle{font-size:13px;color:var(--placeholder-color);margin-bottom:26px}.auth-field{position:relative;margin-bottom:1rem}.auth-field .auth-field-icon{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--placeholder-color);font-size:13px;z-index:2;pointer-events:none;transition:color .2s}.auth-field .auth-input{width:100%;padding:15px 40px 15px 37px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s,background .2s}.auth-field .auth-input::placeholder{color:transparent}.auth-field .auth-input:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721;background:var(--background-focus-input)}.auth-field .auth-input:focus~.auth-label{top:0;font-size:11px!important;color:#398bf7!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-input:focus~.auth-field-icon{color:#398bf7}.auth-field .auth-input:not(:placeholder-shown)~.auth-label{top:0;font-size:11px!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-label{position:absolute;left:35px;top:50%;transform:translateY(-50%);color:var(--placeholder-color)!important;font-size:13px!important;font-weight:400!important;pointer-events:none;transition:top .15s ease,font-size .15s ease,color .15s ease,padding .15s ease,background .15s ease;background:transparent;z-index:1;text-align:left!important}.auth-field .auth-toggle-pw{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--placeholder-color);cursor:pointer;padding:4px 6px;font-size:13px;z-index:2;line-height:1;transition:color .2s}.auth-field .auth-toggle-pw:hover{color:#398bf7}.auth-field.has-error .auth-input{border-color:#dc3545;box-shadow:none}.auth-field.has-error .auth-field-icon{color:#dc3545}.auth-select{width:100%;padding:13px 14px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s;margin-bottom:1rem;cursor:pointer}.auth-select:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721}.auth-btn{width:100%;padding:13px;border:none;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;transition:transform .15s ease,box-shadow .2s ease,opacity .2s;background:linear-gradient(135deg,#398bf7,#1e5fc4);color:#fff;letter-spacing:.3px;margin-bottom:10px;display:block}.auth-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 5px 18px #398bf761}.auth-btn:active:not(:disabled){transform:translateY(0)}.auth-btn:disabled{opacity:.55;cursor:not-allowed}.auth-btn.auth-btn--red{background:linear-gradient(135deg,#d1326f,#a82859)}.auth-btn.auth-btn--red:hover:not(:disabled){box-shadow:0 5px 18px #d1326f61}.auth-btn.auth-btn--outline{background:transparent;border:1.5px solid var(--font-border-input);color:var(--text-color)}.auth-btn.auth-btn--outline:hover:not(:disabled){background:var(--background-btn-light-hover);box-shadow:none;transform:none}.auth-links{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:16px;padding-top:16px;border-top:1px solid var(--border-color-modal)}.auth-version{text-align:right;margin-top:14px;padding-top:12px;border-top:1px solid var(--border-color-modal)}.auth-version span{font-size:11px;color:var(--placeholder-color)}.auth-error{font-size:11.5px;color:#dc3545;margin:-6px 0 10px 2px;padding:0}.auth-hint{display:flex;align-items:flex-start;gap:6px;font-size:11.5px;color:var(--placeholder-color);margin:-6px 0 14px 2px;padding:0;line-height:1.35}.auth-hint i{margin-top:2px;flex-shrink:0}.auth-validation-list{margin:-4px 0 12px;padding:0;list-style:none}.auth-validation-list li{font-size:11.5px;color:#dc3545;padding:2px 0}.auth-validation-list li:before{content:\"\\2715 \";font-size:10px}.auth-desc{font-size:13px;color:var(--placeholder-color);margin-bottom:20px;line-height:1.65}.auth-section-title{font-size:15px;font-weight:600;color:var(--text-color);margin-bottom:20px}.font-12{font-size:12px}.form-control:focus{border-color:#0199ff9a!important;box-shadow:0 0 5px .2px #65befa44!important}@media(max-width:900px){.auth-wrapper-login{grid-template-columns:1fr;grid-template-rows:auto 1fr;overflow-y:auto;overflow-x:hidden}.auth-panel-left{padding:14px 24px;justify-content:center}.auth-panel-left .auth-brand-subtitle,.auth-panel-left .auth-brand-features,.auth-panel-left .auth-brand-divider{display:none!important}.auth-panel-left .auth-brand-panel{display:flex!important;flex-direction:row!important;align-items:center;gap:0;text-align:left;max-width:none;width:100%;justify-content:center}.auth-panel-left .auth-brand-logo{width:52px;height:52px;margin:0;flex-shrink:0}.auth-panel-left .auth-brand-logo img{width:34px;height:34px}.auth-panel-left .auth-brand-title{font-size:20px;margin-bottom:0;margin-left:.5rem;flex-shrink:1}.auth-panel-right:after{inset:-25% 0 auto;width:100%;height:25%;background:linear-gradient(180deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLineV 7s ease-in-out infinite;animation-delay:3.5s}.auth-panel-right--dev:after{background:linear-gradient(180deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}}@keyframes authScanLineV{0%{top:-25%}50%{top:120%}to{top:120%}}@media(max-width:480px){.auth-panel-left{padding:12px 16px}.auth-panel-left .auth-brand-logo{width:44px;height:44px}.auth-panel-left .auth-brand-logo img{width:28px;height:28px}.auth-panel-left .auth-brand-title{font-size:17px}.auth-form-wrapper>div{padding:20px 12px}.auth-card{padding:24px 18px 20px;border-radius:16px}.font-12{font-size:10px!important}}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: PwaFloatingComponent, selector: "app-pwa-floating", inputs: ["appName", "logo", "chipLabel"], outputs: ["beforeInstall", "guideClosed"] }, { kind: "component", type: RefreshFloatingComponent, selector: "app-refresh-floating" }], animations: [fadeInOut] });
|
|
70
175
|
}
|
|
71
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
176
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: AuthComponent, decorators: [{
|
|
72
177
|
type: Component,
|
|
73
|
-
args: [{ selector: 'lib-auth-tsi', imports: [NgClass, ReactiveFormsModule], animations: [fadeInOut], template: "<div class=\"auth-wrapper-login\">\r\n @let produccion = production();\r\n <div class=\"auth-panel-left\" [class.auth-panel-left--dev]=\"!produccion\">\r\n <span class=\"auth-blob auth-blob-1\"></span>\r\n <span class=\"auth-blob auth-blob-2\"></span>\r\n <span class=\"auth-blob auth-blob-3\"></span>\r\n <span class=\"auth-blob auth-blob-4\"></span>\r\n\r\n <div class=\"auth-brand-panel\">\r\n <div class=\"auth-brand-logo\">\r\n <img src=\"assets/images/logo-tsi-tres.png\" alt=\"TSI\" />\r\n </div>\r\n <h1 class=\"auth-brand-title\">{{module()}}</h1>\r\n <p class=\"auth-brand-subtitle\">Plataforma integrada de gesti\u00F3n<br>empresarial</p>\r\n\r\n <div class=\"auth-brand-divider\"></div>\r\n\r\n <div class=\"auth-brand-features\">\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Gesti\u00F3n de compras y log\u00EDstica\r\n </div>\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Control financiero avanzado\r\n </div>\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Reportes y an\u00E1lisis en tiempo real\r\n </div>\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Integraci\u00F3n con inteligencia artificial\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"auth-panel-right\" [class.auth-panel-right--dev]=\"!produccion\">\r\n <div class=\"auth-panel-bg\">\r\n <span class=\"auth-deco auth-deco-tl\"></span>\r\n <span class=\"auth-deco auth-deco-br\"></span>\r\n </div>\r\n\r\n <div class=\"auth-form-wrapper\">\r\n <div>\r\n @if (!produccion) {\r\n <div>\r\n <span class=\"auth-test-badge\">\r\n <span class=\"badge-dot\"></span> ENTORNO DE PRUEBAS\r\n </span>\r\n </div>\r\n }\r\n\r\n <div class=\"auth-card\">\r\n <h2 class=\"auth-card-title\">Bienvenido de vuelta</h2>\r\n <p class=\"auth-card-subtitle\">Ingresa tus credenciales para continuar</p>\r\n\r\n <form [formGroup]=\"authForm()\" id=\"loginform\">\r\n\r\n <div class=\"auth-field\" [class.has-error]=\"validacion('ruc')\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-building\"></i></span>\r\n <input type=\"text\" formControlName=\"ruc\" class=\"auth-input\" placeholder=\" \" maxlength=\"11\"\r\n id=\"f-ruc\" autocomplete=\"off\">\r\n <label for=\"f-ruc\" class=\"auth-label\">RUC</label>\r\n </div>\r\n @if (validacion('ruc')) {\r\n <p class=\"auth-error\" @fadeInOut>Ingresar RUC</p>\r\n }\r\n\r\n <div class=\"auth-field\" [class.has-error]=\"validacion('nomuser')\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-user\"></i></span>\r\n <input type=\"text\" formControlName=\"nomuser\" class=\"auth-input\" placeholder=\" \" id=\"f-user\"\r\n autocomplete=\"off\">\r\n <label for=\"f-user\" class=\"auth-label\">Usuario</label>\r\n </div>\r\n @if (validacion('nomuser')) {\r\n <p class=\"auth-error\" @fadeInOut>Ingresar usuario</p>\r\n }\r\n\r\n <div class=\"auth-field\" [class.has-error]=\"validacion('clave')\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-lock\"></i></span>\r\n <input [type]=\"showPassword() ? 'text' : 'password'\" formControlName=\"clave\"\r\n class=\"auth-input\" placeholder=\" \" id=\"f-clave\" autocomplete=\"new-password\">\r\n <label for=\"f-clave\" class=\"auth-label\">Contrase\u00F1a</label>\r\n <button type=\"button\" class=\"auth-toggle-pw\" (click)=\"togglePassword()\">\r\n <i [class]=\"showPassword() ? 'fas fa-eye' : 'fas fa-eye-slash'\"></i>\r\n </button>\r\n </div>\r\n @if (validacion('clave')) {\r\n <p class=\"auth-error\" @fadeInOut>Ingresar clave</p>\r\n }\r\n\r\n <button class=\"auth-btn mt-2\" [class.auth-btn--red]=\"!produccion\" (click)=\"login()\">\r\n Ingresar\r\n </button>\r\n\r\n <div class=\"auth-links\">\r\n <a [ngClass]=\"produccion ? 'blue_contrasena' : 'red_contrasena'\"\r\n (click)=\"recover()\">\u00BFOlvidaste tu contrase\u00F1a?</a>\r\n <a [ngClass]=\"produccion ? 'blue_contrasena' : 'red_contrasena'\"\r\n (click)=\"forget()\">\u00BFContrase\u00F1a vencida?</a>\r\n </div>\r\n\r\n </form>\r\n\r\n <div class=\"auth-version\">\r\n <span>v{{versionApp()}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";.red_contrasena,.blue_contrasena{position:relative;display:inline-block;font-size:13px;text-decoration:none;padding-bottom:2px;transition:color .3s ease;cursor:pointer}.red_contrasena:after,.blue_contrasena:after{content:\"\";position:absolute;bottom:0;left:50%;width:0;height:1px;background-color:currentColor;transition:all .3s ease;transform:translate(-50%)}.red_contrasena:hover:after,.blue_contrasena:hover:after{width:60%}.red_contrasena{color:#d1326f}.red_contrasena:hover{color:#a82859}.blue_contrasena{color:#398bf7}.blue_contrasena:hover{color:#1e5fc4}.auth-wrapper-login{position:fixed;inset:0;display:grid;grid-template-columns:1.15fr .85fr;overflow:hidden;background:#060d1f}.auth-panel-left{position:relative;overflow:hidden;background:linear-gradient(145deg,#040a18,#0b1a3d 55%,#040e22);display:flex;align-items:center;justify-content:center;padding:48px 40px}.auth-panel-left:before{content:\"\";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.055) 1px,transparent 1px);background-size:26px 26px;z-index:1;pointer-events:none}.auth-panel-left:after{content:\"\";position:absolute;top:0;left:-120%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(57,139,247,.04),transparent);animation:panelSweep 7s ease-in-out infinite;z-index:1;pointer-events:none}.auth-blob{position:absolute;border-radius:50%;filter:blur(72px);z-index:0;pointer-events:none}.auth-blob-1{width:340px;height:340px;background:radial-gradient(circle,rgba(57,139,247,.45) 0%,transparent 70%);top:-90px;right:-70px;animation:blobDrift 11s ease-in-out infinite}.auth-blob-2{width:240px;height:240px;background:radial-gradient(circle,rgba(124,58,237,.4) 0%,transparent 70%);bottom:60px;left:-50px;animation:blobDrift 14s ease-in-out infinite reverse}.auth-blob-3{width:180px;height:180px;background:radial-gradient(circle,rgba(14,165,233,.35) 0%,transparent 70%);bottom:-50px;right:40px;animation:blobDrift 9s ease-in-out infinite;animation-delay:-4s}.auth-blob-4{width:120px;height:120px;background:radial-gradient(circle,rgba(209,50,111,.25) 0%,transparent 70%);top:50%;left:50%;transform:translate(-50%,-50%);animation:blobDrift 16s ease-in-out infinite;animation-delay:-8s}@keyframes blobDrift{0%,to{transform:translate(0) scale(1)}33%{transform:translate(14px,-20px) scale(1.05)}66%{transform:translate(-10px,12px) scale(.96)}}@keyframes panelSweep{0%{left:-120%}50%{left:160%}to{left:160%}}.auth-brand-panel{position:relative;z-index:2;text-align:center;color:#fff;max-width:340px}.auth-brand-logo{width:100px;height:100px;border-radius:50%;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;margin:0 auto 28px;box-shadow:0 0 0 14px #398bf70f,0 0 50px #398bf733;backdrop-filter:blur(8px)}.auth-brand-logo img{width:64px;height:64px;object-fit:contain;filter:brightness(1.05) drop-shadow(0 0 8px rgba(57,139,247,.4))}.auth-brand-title{font-size:30px;font-weight:700;letter-spacing:-.5px;margin-bottom:10px;background:linear-gradient(135deg,#fff 20%,#93c5fd 80%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.auth-brand-subtitle{font-size:14px;color:#ffffff73;line-height:1.65;margin-bottom:40px;letter-spacing:.2px}.auth-brand-features{display:flex;flex-direction:column;gap:14px;text-align:left}.auth-brand-feature{display:flex;align-items:center;gap:12px;font-size:13px;color:#fff9}.auth-brand-feature .feat-dot{flex-shrink:0;width:7px;height:7px;border-radius:50%;background:#398bf7;box-shadow:0 0 10px #398bf7b3}.auth-brand-divider{width:60px;height:2px;background:linear-gradient(90deg,transparent,#398bf7,transparent);margin:28px auto 32px;border-radius:2px}.auth-panel-left--dev{background:linear-gradient(145deg,#18040b,#3d0b1d 55%,#220409)}.auth-panel-left--dev:after{background:linear-gradient(90deg,transparent,rgba(209,50,111,.05),transparent)}.auth-panel-left--dev .auth-blob-1{background:radial-gradient(circle,rgba(220,38,38,.52) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-2{background:radial-gradient(circle,rgba(219,39,119,.44) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-3{background:radial-gradient(circle,rgba(239,68,68,.38) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-4{background:radial-gradient(circle,rgba(249,115,22,.28) 0%,transparent 70%)}.auth-panel-left--dev .auth-brand-logo{box-shadow:0 0 0 14px #d1326f12,0 0 50px #d1326f38}.auth-panel-left--dev .auth-brand-logo img{filter:brightness(1.05) drop-shadow(0 0 8px rgba(209,50,111,.45))}.auth-panel-left--dev .auth-brand-title{background:linear-gradient(135deg,#fff 20%,#fca5a5 80%);-webkit-background-clip:text;background-clip:text}.auth-panel-left--dev .auth-brand-divider{background:linear-gradient(90deg,transparent,rgb(209,50,111),transparent)}.auth-panel-left--dev .feat-dot{background:#d1326f;box-shadow:0 0 10px #d1326fb8}.auth-panel-right{position:relative;overflow:hidden;background:var(--background-login)}.auth-panel-right:before{content:\"\";position:absolute;inset:0;background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(57,139,247,.045) 22px,rgba(57,139,247,.045) 23px);animation:authLinesMove 10s linear infinite;pointer-events:none;z-index:0}.auth-panel-right:after{content:\"\";position:absolute;top:0;bottom:0;left:-25%;width:25%;background:linear-gradient(90deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLine 7s ease-in-out infinite;animation-delay:3.5s;pointer-events:none;z-index:0}@keyframes authLinesMove{0%{transform:translate(0)}to{transform:translate(46px,46px)}}@keyframes authScanLine{0%{left:-25%}50%{left:120%}to{left:120%}}.auth-panel-bg{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}.auth-deco{position:absolute;border-radius:50%;pointer-events:none;filter:blur(70px)}.auth-deco-tl{width:300px;height:300px;top:0;left:-120px;transform:translateY(-40%);background:radial-gradient(circle,rgba(57,139,247,.12) 0%,transparent 70%);animation:authOrbPulse 6s ease-in-out infinite}.auth-deco-br{width:340px;height:340px;bottom:0;right:-120px;transform:translateY(40%);background:radial-gradient(circle,rgba(124,58,237,.1) 0%,transparent 70%);animation:authOrbPulse 8s ease-in-out infinite;animation-delay:-4s}@keyframes authOrbPulse{0%,to{opacity:.7}50%{opacity:1}}.auth-form-wrapper{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;align-items:center;z-index:1}.auth-form-wrapper>div{width:100%;max-width:420px;margin:auto;padding:36px 16px;box-sizing:border-box}.auth-panel-right--dev:before{background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(209,50,111,.05) 22px,rgba(209,50,111,.05) 23px)}.auth-panel-right--dev:after{background:linear-gradient(90deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}.auth-panel-right--dev .auth-deco-tl{background:radial-gradient(circle,rgba(209,50,111,.12) 0%,transparent 70%)}.auth-panel-right--dev .auth-deco-br{background:radial-gradient(circle,rgba(239,68,68,.1) 0%,transparent 70%)}.auth-test-badge{display:inline-flex;align-items:center;gap:7px;background:#d1326f14;border:1px solid rgba(209,50,111,.25);color:#d1326f;font-size:10.5px;font-weight:700;padding:5px 12px;border-radius:20px;margin-bottom:18px;letter-spacing:.8px}.auth-test-badge .badge-dot{width:6px;height:6px;border-radius:50%;background:#d1326f;animation:badgePulse 1.6s ease-in-out infinite;flex-shrink:0}@keyframes badgePulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.75)}}.auth-card{background:var(--background-card);border-radius:20px;padding:36px 32px 28px;box-shadow:0 4px 28px #00000014;border:1px solid var(--border-color-modal)}.auth-card-title{font-size:22px;font-weight:700;color:var(--text-color);margin-bottom:4px;letter-spacing:-.3px}.auth-card-subtitle{font-size:13px;color:var(--placeholder-color);margin-bottom:26px}.auth-field{position:relative;margin-bottom:1rem}.auth-field .auth-field-icon{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--placeholder-color);font-size:13px;z-index:2;pointer-events:none;transition:color .2s}.auth-field .auth-input{width:100%;padding:15px 40px 15px 37px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s,background .2s}.auth-field .auth-input::placeholder{color:transparent}.auth-field .auth-input:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721;background:var(--background-focus-input)}.auth-field .auth-input:focus~.auth-label{top:0;font-size:11px!important;color:#398bf7!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-input:focus~.auth-field-icon{color:#398bf7}.auth-field .auth-input:not(:placeholder-shown)~.auth-label{top:0;font-size:11px!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-label{position:absolute;left:35px;top:50%;transform:translateY(-50%);color:var(--placeholder-color)!important;font-size:13px!important;font-weight:400!important;pointer-events:none;transition:top .15s ease,font-size .15s ease,color .15s ease,padding .15s ease,background .15s ease;background:transparent;z-index:1;text-align:left!important}.auth-field .auth-toggle-pw{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--placeholder-color);cursor:pointer;padding:4px 6px;font-size:13px;z-index:2;line-height:1;transition:color .2s}.auth-field .auth-toggle-pw:hover{color:#398bf7}.auth-field.has-error .auth-input{border-color:#dc3545;box-shadow:none}.auth-field.has-error .auth-field-icon{color:#dc3545}.auth-select{width:100%;padding:13px 14px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s;margin-bottom:1rem;cursor:pointer}.auth-select:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721}.auth-btn{width:100%;padding:13px;border:none;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;transition:transform .15s ease,box-shadow .2s ease,opacity .2s;background:linear-gradient(135deg,#398bf7,#1e5fc4);color:#fff;letter-spacing:.3px;margin-bottom:10px;display:block}.auth-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 5px 18px #398bf761}.auth-btn:active:not(:disabled){transform:translateY(0)}.auth-btn:disabled{opacity:.55;cursor:not-allowed}.auth-btn.auth-btn--red{background:linear-gradient(135deg,#d1326f,#a82859)}.auth-btn.auth-btn--red:hover:not(:disabled){box-shadow:0 5px 18px #d1326f61}.auth-btn.auth-btn--outline{background:transparent;border:1.5px solid var(--font-border-input);color:var(--text-color)}.auth-btn.auth-btn--outline:hover:not(:disabled){background:var(--background-btn-light-hover);box-shadow:none;transform:none}.auth-links{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:16px;padding-top:16px;border-top:1px solid var(--border-color-modal)}.auth-version{text-align:right;margin-top:14px;padding-top:12px;border-top:1px solid var(--border-color-modal)}.auth-version span{font-size:11px;color:var(--placeholder-color)}.auth-error{font-size:11.5px;color:#dc3545;margin:-6px 0 10px 2px;padding:0}.auth-validation-list{margin:-4px 0 12px;padding:0;list-style:none}.auth-validation-list li{font-size:11.5px;color:#dc3545;padding:2px 0}.auth-validation-list li:before{content:\"\\2715 \";font-size:10px}.auth-desc{font-size:13px;color:var(--placeholder-color);margin-bottom:20px;line-height:1.65}.auth-section-title{font-size:15px;font-weight:600;color:var(--text-color);margin-bottom:20px}.font-12{font-size:12px}.form-control:focus{border-color:#0199ff9a!important;box-shadow:0 0 5px .2px #65befa44!important}@media (max-width: 900px){.auth-wrapper-login{grid-template-columns:1fr;grid-template-rows:auto 1fr;overflow-y:auto;overflow-x:hidden}.auth-panel-left{padding:14px 24px;justify-content:center}.auth-panel-left .auth-brand-subtitle,.auth-panel-left .auth-brand-features,.auth-panel-left .auth-brand-divider{display:none!important}.auth-panel-left .auth-brand-panel{display:flex!important;flex-direction:row!important;align-items:center;gap:0;text-align:left;max-width:none;width:100%;justify-content:center}.auth-panel-left .auth-brand-logo{width:52px;height:52px;margin:0;flex-shrink:0}.auth-panel-left .auth-brand-logo img{width:34px;height:34px}.auth-panel-left .auth-brand-title{font-size:20px;margin-bottom:0;margin-left:.5rem;flex-shrink:1}.auth-panel-right:after{inset:-25% 0 auto;width:100%;height:25%;background:linear-gradient(180deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLineV 7s ease-in-out infinite;animation-delay:3.5s}.auth-panel-right--dev:after{background:linear-gradient(180deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}}@keyframes authScanLineV{0%{top:-25%}50%{top:120%}to{top:120%}}@media (max-width: 480px){.auth-panel-left{padding:12px 16px}.auth-panel-left .auth-brand-logo{width:44px;height:44px}.auth-panel-left .auth-brand-logo img{width:28px;height:28px}.auth-panel-left .auth-brand-title{font-size:17px}.auth-form-wrapper>div{padding:20px 12px}.auth-card{padding:24px 18px 20px;border-radius:16px}.font-12{font-size:10px!important}}\n"] }]
|
|
178
|
+
args: [{ selector: 'lib-auth-tsi', imports: [NgClass, ReactiveFormsModule, PwaFloatingComponent, RefreshFloatingComponent], animations: [fadeInOut], template: "<div class=\"auth-wrapper-login\">\r\n @let produccion = production();\r\n <div class=\"auth-panel-left\" [class.auth-panel-left--dev]=\"!produccion\">\r\n <span class=\"auth-blob auth-blob-1\"></span>\r\n <span class=\"auth-blob auth-blob-2\"></span>\r\n <span class=\"auth-blob auth-blob-3\"></span>\r\n <span class=\"auth-blob auth-blob-4\"></span>\r\n\r\n <div class=\"auth-brand-panel\">\r\n <div class=\"auth-brand-logo\">\r\n <img src=\"assets/images/logo-tsi-tres.png\" alt=\"TSI\" />\r\n </div>\r\n <h1 class=\"auth-brand-title\">{{module()}}</h1>\r\n <p class=\"auth-brand-subtitle\">Plataforma integrada de gesti\u00F3n<br>empresarial</p>\r\n\r\n <div class=\"auth-brand-divider\"></div>\r\n\r\n <div class=\"auth-brand-features\">\r\n @for (item of aboutList(); track $index) {\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> {{item}}\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"auth-panel-right\" [class.auth-panel-right--dev]=\"!produccion\">\r\n <div class=\"auth-panel-bg\">\r\n <span class=\"auth-deco auth-deco-tl\"></span>\r\n <span class=\"auth-deco auth-deco-br\"></span>\r\n </div>\r\n\r\n <div class=\"auth-form-wrapper\">\r\n <div>\r\n @if (!produccion) {\r\n <div>\r\n <span class=\"auth-test-badge\">\r\n <span class=\"badge-dot\"></span> ENTORNO DE PRUEBAS\r\n </span>\r\n </div>\r\n }\r\n\r\n <div class=\"auth-card\">\r\n <h2 class=\"auth-card-title\">Bienvenido de vuelta</h2>\r\n <p class=\"auth-card-subtitle\">Ingresa tus credenciales para continuar</p>\r\n\r\n <form [formGroup]=\"authForm()\" id=\"loginform\">\r\n\r\n <p class=\"auth-hint\">\r\n <i class=\"fas fa-circle-info\"></i>\r\n Si piensas instalar la app, te recomendamos completar el RUC y Usuario antes, estos quedar\u00E1n guardados y siempre aparecer\u00E1n completos al abrirla.\r\n </p>\r\n\r\n <div class=\"auth-field\" [class.has-error]=\"validacion('ruc')\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-building\"></i></span>\r\n <input type=\"text\" formControlName=\"ruc\" class=\"auth-input\" placeholder=\" \" maxlength=\"11\"\r\n id=\"f-ruc\" autocomplete=\"off\">\r\n <label for=\"f-ruc\" class=\"auth-label\">RUC</label>\r\n </div>\r\n @if (validacion('ruc')) {\r\n <p class=\"auth-error\" @fadeInOut>Ingresar RUC</p>\r\n }\r\n\r\n <div class=\"auth-field\" [class.has-error]=\"validacion('nomuser')\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-user\"></i></span>\r\n <input type=\"text\" formControlName=\"nomuser\" class=\"auth-input\" placeholder=\" \" id=\"f-user\"\r\n autocomplete=\"off\">\r\n <label for=\"f-user\" class=\"auth-label\">Usuario</label>\r\n </div>\r\n @if (validacion('nomuser')) {\r\n <p class=\"auth-error\" @fadeInOut>Ingresar usuario</p>\r\n }\r\n\r\n <div class=\"auth-field\" [class.has-error]=\"validacion('clave')\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-lock\"></i></span>\r\n <input [type]=\"showPassword() ? 'text' : 'password'\" formControlName=\"clave\"\r\n class=\"auth-input\" placeholder=\" \" id=\"f-clave\" autocomplete=\"off\" autocorrect=\"off\"\r\n autocapitalize=\"off\" spellcheck=\"false\">\r\n <label for=\"f-clave\" class=\"auth-label\">Contrase\u00F1a</label>\r\n <button type=\"button\" class=\"auth-toggle-pw\" (click)=\"togglePassword()\">\r\n <i [class]=\"showPassword() ? 'fas fa-eye' : 'fas fa-eye-slash'\"></i>\r\n </button>\r\n </div>\r\n @if (validacion('clave')) {\r\n <p class=\"auth-error\" @fadeInOut>Ingresar clave</p>\r\n }\r\n\r\n <button class=\"auth-btn mt-2\" [class.auth-btn--red]=\"!produccion\" (click)=\"login()\">\r\n Ingresar\r\n </button>\r\n\r\n <div class=\"auth-links\">\r\n <a [ngClass]=\"produccion ? 'blue_contrasena' : 'red_contrasena'\"\r\n (click)=\"recover()\">\u00BFOlvidaste tu contrase\u00F1a?</a>\r\n <a [ngClass]=\"produccion ? 'blue_contrasena' : 'red_contrasena'\"\r\n (click)=\"forget()\">\u00BFContrase\u00F1a vencida?</a>\r\n </div>\r\n\r\n </form>\r\n\r\n <div class=\"auth-version\">\r\n <span>v{{versionApp()}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n@if (showFloatingApp()) {\r\n<app-pwa-floating [appName]=\"module()\" (beforeInstall)=\"onBeforeInstall()\" />\r\n}\r\n@if (showFloatingUpdate()) {\r\n<app-refresh-floating />\r\n}", styles: ["@charset \"UTF-8\";.red_contrasena,.blue_contrasena{position:relative;display:inline-block;font-size:13px;text-decoration:none;padding-bottom:2px;transition:color .3s ease;cursor:pointer}.red_contrasena:after,.blue_contrasena:after{content:\"\";position:absolute;bottom:0;left:50%;width:0;height:1px;background-color:currentColor;transition:all .3s ease;transform:translate(-50%)}.red_contrasena:hover:after,.blue_contrasena:hover:after{width:60%}.red_contrasena{color:#d1326f}.red_contrasena:hover{color:#a82859}.blue_contrasena{color:#398bf7}.blue_contrasena:hover{color:#1e5fc4}.auth-wrapper-login{position:fixed;inset:0;display:grid;grid-template-columns:1.15fr .85fr;overflow:hidden;background:#060d1f}.auth-panel-left{position:relative;overflow:hidden;background:linear-gradient(145deg,#040a18,#0b1a3d 55%,#040e22);display:flex;align-items:center;justify-content:center;padding:48px 40px}.auth-panel-left:before{content:\"\";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.055) 1px,transparent 1px);background-size:26px 26px;z-index:1;pointer-events:none}.auth-panel-left:after{content:\"\";position:absolute;top:0;left:-120%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(57,139,247,.04),transparent);animation:panelSweep 7s ease-in-out infinite;z-index:1;pointer-events:none}.auth-blob{position:absolute;border-radius:50%;filter:blur(72px);z-index:0;pointer-events:none}.auth-blob-1{width:340px;height:340px;background:radial-gradient(circle,rgba(57,139,247,.45) 0%,transparent 70%);top:-90px;right:-70px;animation:blobDrift 11s ease-in-out infinite}.auth-blob-2{width:240px;height:240px;background:radial-gradient(circle,rgba(124,58,237,.4) 0%,transparent 70%);bottom:60px;left:-50px;animation:blobDrift 14s ease-in-out infinite reverse}.auth-blob-3{width:180px;height:180px;background:radial-gradient(circle,rgba(14,165,233,.35) 0%,transparent 70%);bottom:-50px;right:40px;animation:blobDrift 9s ease-in-out infinite;animation-delay:-4s}.auth-blob-4{width:120px;height:120px;background:radial-gradient(circle,rgba(209,50,111,.25) 0%,transparent 70%);top:50%;left:50%;transform:translate(-50%,-50%);animation:blobDrift 16s ease-in-out infinite;animation-delay:-8s}@keyframes blobDrift{0%,to{transform:translate(0) scale(1)}33%{transform:translate(14px,-20px) scale(1.05)}66%{transform:translate(-10px,12px) scale(.96)}}@keyframes panelSweep{0%{left:-120%}50%{left:160%}to{left:160%}}.auth-brand-panel{position:relative;z-index:2;text-align:center;color:#fff;max-width:340px}.auth-brand-logo{width:100px;height:100px;border-radius:50%;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;margin:0 auto 28px;box-shadow:0 0 0 14px #398bf70f,0 0 50px #398bf733;backdrop-filter:blur(8px)}.auth-brand-logo img{width:64px;height:64px;object-fit:contain;filter:brightness(1.05) drop-shadow(0 0 8px rgba(57,139,247,.4))}.auth-brand-title{font-size:30px;font-weight:700;letter-spacing:-.5px;margin-bottom:10px;background:linear-gradient(135deg,#fff 20%,#93c5fd 80%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.auth-brand-subtitle{font-size:14px;color:#ffffff73;line-height:1.65;margin-bottom:40px;letter-spacing:.2px}.auth-brand-features{display:flex;flex-direction:column;gap:14px;text-align:left}.auth-brand-feature{display:flex;align-items:center;gap:12px;font-size:13px;color:#fff9}.auth-brand-feature .feat-dot{flex-shrink:0;width:7px;height:7px;border-radius:50%;background:#398bf7;box-shadow:0 0 10px #398bf7b3}.auth-brand-divider{width:60px;height:2px;background:linear-gradient(90deg,transparent,#398bf7,transparent);margin:28px auto 32px;border-radius:2px}.auth-panel-left--dev{background:linear-gradient(145deg,#18040b,#3d0b1d 55%,#220409)}.auth-panel-left--dev:after{background:linear-gradient(90deg,transparent,rgba(209,50,111,.05),transparent)}.auth-panel-left--dev .auth-blob-1{background:radial-gradient(circle,rgba(220,38,38,.52) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-2{background:radial-gradient(circle,rgba(219,39,119,.44) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-3{background:radial-gradient(circle,rgba(239,68,68,.38) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-4{background:radial-gradient(circle,rgba(249,115,22,.28) 0%,transparent 70%)}.auth-panel-left--dev .auth-brand-logo{box-shadow:0 0 0 14px #d1326f12,0 0 50px #d1326f38}.auth-panel-left--dev .auth-brand-logo img{filter:brightness(1.05) drop-shadow(0 0 8px rgba(209,50,111,.45))}.auth-panel-left--dev .auth-brand-title{background:linear-gradient(135deg,#fff 20%,#fca5a5 80%);-webkit-background-clip:text;background-clip:text}.auth-panel-left--dev .auth-brand-divider{background:linear-gradient(90deg,transparent,rgb(209,50,111),transparent)}.auth-panel-left--dev .feat-dot{background:#d1326f;box-shadow:0 0 10px #d1326fb8}.auth-panel-right{position:relative;overflow:hidden;background:var(--background-login)}.auth-panel-right:before{content:\"\";position:absolute;inset:0;background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(57,139,247,.045) 22px,rgba(57,139,247,.045) 23px);animation:authLinesMove 10s linear infinite;pointer-events:none;z-index:0}.auth-panel-right:after{content:\"\";position:absolute;top:0;bottom:0;left:-25%;width:25%;background:linear-gradient(90deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLine 7s ease-in-out infinite;animation-delay:3.5s;pointer-events:none;z-index:0}@keyframes authLinesMove{0%{transform:translate(0)}to{transform:translate(46px,46px)}}@keyframes authScanLine{0%{left:-25%}50%{left:120%}to{left:120%}}.auth-panel-bg{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}.auth-deco{position:absolute;border-radius:50%;pointer-events:none;filter:blur(70px)}.auth-deco-tl{width:300px;height:300px;top:0;left:-120px;transform:translateY(-40%);background:radial-gradient(circle,rgba(57,139,247,.12) 0%,transparent 70%);animation:authOrbPulse 6s ease-in-out infinite}.auth-deco-br{width:340px;height:340px;bottom:0;right:-120px;transform:translateY(40%);background:radial-gradient(circle,rgba(124,58,237,.1) 0%,transparent 70%);animation:authOrbPulse 8s ease-in-out infinite;animation-delay:-4s}@keyframes authOrbPulse{0%,to{opacity:.7}50%{opacity:1}}.auth-form-wrapper{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;align-items:center;z-index:1}.auth-form-wrapper>div{width:100%;max-width:420px;margin:auto;padding:36px 16px;box-sizing:border-box}.auth-panel-right--dev:before{background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(209,50,111,.05) 22px,rgba(209,50,111,.05) 23px)}.auth-panel-right--dev:after{background:linear-gradient(90deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}.auth-panel-right--dev .auth-deco-tl{background:radial-gradient(circle,rgba(209,50,111,.12) 0%,transparent 70%)}.auth-panel-right--dev .auth-deco-br{background:radial-gradient(circle,rgba(239,68,68,.1) 0%,transparent 70%)}.auth-test-badge{display:inline-flex;align-items:center;gap:7px;background:#d1326f14;border:1px solid rgba(209,50,111,.25);color:#d1326f;font-size:10.5px;font-weight:700;padding:5px 12px;border-radius:20px;margin-bottom:18px;letter-spacing:.8px}.auth-test-badge .badge-dot{width:6px;height:6px;border-radius:50%;background:#d1326f;animation:badgePulse 1.6s ease-in-out infinite;flex-shrink:0}@keyframes badgePulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.75)}}.auth-card{background:var(--background-card);border-radius:20px;padding:36px 32px 28px;box-shadow:0 4px 28px #00000014;border:1px solid var(--border-color-modal)}.auth-card-title{font-size:22px;font-weight:700;color:var(--text-color);margin-bottom:4px;letter-spacing:-.3px}.auth-card-subtitle{font-size:13px;color:var(--placeholder-color);margin-bottom:26px}.auth-field{position:relative;margin-bottom:1rem}.auth-field .auth-field-icon{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--placeholder-color);font-size:13px;z-index:2;pointer-events:none;transition:color .2s}.auth-field .auth-input{width:100%;padding:15px 40px 15px 37px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s,background .2s}.auth-field .auth-input::placeholder{color:transparent}.auth-field .auth-input:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721;background:var(--background-focus-input)}.auth-field .auth-input:focus~.auth-label{top:0;font-size:11px!important;color:#398bf7!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-input:focus~.auth-field-icon{color:#398bf7}.auth-field .auth-input:not(:placeholder-shown)~.auth-label{top:0;font-size:11px!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-label{position:absolute;left:35px;top:50%;transform:translateY(-50%);color:var(--placeholder-color)!important;font-size:13px!important;font-weight:400!important;pointer-events:none;transition:top .15s ease,font-size .15s ease,color .15s ease,padding .15s ease,background .15s ease;background:transparent;z-index:1;text-align:left!important}.auth-field .auth-toggle-pw{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--placeholder-color);cursor:pointer;padding:4px 6px;font-size:13px;z-index:2;line-height:1;transition:color .2s}.auth-field .auth-toggle-pw:hover{color:#398bf7}.auth-field.has-error .auth-input{border-color:#dc3545;box-shadow:none}.auth-field.has-error .auth-field-icon{color:#dc3545}.auth-select{width:100%;padding:13px 14px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s;margin-bottom:1rem;cursor:pointer}.auth-select:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721}.auth-btn{width:100%;padding:13px;border:none;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;transition:transform .15s ease,box-shadow .2s ease,opacity .2s;background:linear-gradient(135deg,#398bf7,#1e5fc4);color:#fff;letter-spacing:.3px;margin-bottom:10px;display:block}.auth-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 5px 18px #398bf761}.auth-btn:active:not(:disabled){transform:translateY(0)}.auth-btn:disabled{opacity:.55;cursor:not-allowed}.auth-btn.auth-btn--red{background:linear-gradient(135deg,#d1326f,#a82859)}.auth-btn.auth-btn--red:hover:not(:disabled){box-shadow:0 5px 18px #d1326f61}.auth-btn.auth-btn--outline{background:transparent;border:1.5px solid var(--font-border-input);color:var(--text-color)}.auth-btn.auth-btn--outline:hover:not(:disabled){background:var(--background-btn-light-hover);box-shadow:none;transform:none}.auth-links{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:16px;padding-top:16px;border-top:1px solid var(--border-color-modal)}.auth-version{text-align:right;margin-top:14px;padding-top:12px;border-top:1px solid var(--border-color-modal)}.auth-version span{font-size:11px;color:var(--placeholder-color)}.auth-error{font-size:11.5px;color:#dc3545;margin:-6px 0 10px 2px;padding:0}.auth-hint{display:flex;align-items:flex-start;gap:6px;font-size:11.5px;color:var(--placeholder-color);margin:-6px 0 14px 2px;padding:0;line-height:1.35}.auth-hint i{margin-top:2px;flex-shrink:0}.auth-validation-list{margin:-4px 0 12px;padding:0;list-style:none}.auth-validation-list li{font-size:11.5px;color:#dc3545;padding:2px 0}.auth-validation-list li:before{content:\"\\2715 \";font-size:10px}.auth-desc{font-size:13px;color:var(--placeholder-color);margin-bottom:20px;line-height:1.65}.auth-section-title{font-size:15px;font-weight:600;color:var(--text-color);margin-bottom:20px}.font-12{font-size:12px}.form-control:focus{border-color:#0199ff9a!important;box-shadow:0 0 5px .2px #65befa44!important}@media(max-width:900px){.auth-wrapper-login{grid-template-columns:1fr;grid-template-rows:auto 1fr;overflow-y:auto;overflow-x:hidden}.auth-panel-left{padding:14px 24px;justify-content:center}.auth-panel-left .auth-brand-subtitle,.auth-panel-left .auth-brand-features,.auth-panel-left .auth-brand-divider{display:none!important}.auth-panel-left .auth-brand-panel{display:flex!important;flex-direction:row!important;align-items:center;gap:0;text-align:left;max-width:none;width:100%;justify-content:center}.auth-panel-left .auth-brand-logo{width:52px;height:52px;margin:0;flex-shrink:0}.auth-panel-left .auth-brand-logo img{width:34px;height:34px}.auth-panel-left .auth-brand-title{font-size:20px;margin-bottom:0;margin-left:.5rem;flex-shrink:1}.auth-panel-right:after{inset:-25% 0 auto;width:100%;height:25%;background:linear-gradient(180deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLineV 7s ease-in-out infinite;animation-delay:3.5s}.auth-panel-right--dev:after{background:linear-gradient(180deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}}@keyframes authScanLineV{0%{top:-25%}50%{top:120%}to{top:120%}}@media(max-width:480px){.auth-panel-left{padding:12px 16px}.auth-panel-left .auth-brand-logo{width:44px;height:44px}.auth-panel-left .auth-brand-logo img{width:28px;height:28px}.auth-panel-left .auth-brand-title{font-size:17px}.auth-form-wrapper>div{padding:20px 12px}.auth-card{padding:24px 18px 20px;border-radius:16px}.font-12{font-size:10px!important}}\n"] }]
|
|
74
179
|
}] });
|
|
75
180
|
|
|
76
181
|
class ExpiredPasswordComponent {
|
|
@@ -138,12 +243,12 @@ class ExpiredPasswordComponent {
|
|
|
138
243
|
this.expiredForm.reset();
|
|
139
244
|
this.loginEvent.emit({ type: "BACK" });
|
|
140
245
|
};
|
|
141
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
142
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: ExpiredPasswordComponent, isStandalone: true, selector: "lib-expired-password", inputs: { production: { classPropertyName: "production", publicName: "production", isSignal: true, isRequired: false, transformFunction: null }, module: { classPropertyName: "module", publicName: "module", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { loginEvent: "loginEvent" }, ngImport: i0, template: "<div class=\"auth-wrapper-login\">\r\n @let produccion = production();\r\n <div class=\"auth-panel-left\" [class.auth-panel-left--dev]=\"!produccion\">\r\n <span class=\"auth-blob auth-blob-1\"></span>\r\n <span class=\"auth-blob auth-blob-2\"></span>\r\n <span class=\"auth-blob auth-blob-3\"></span>\r\n <span class=\"auth-blob auth-blob-4\"></span>\r\n\r\n <div class=\"auth-brand-panel\">\r\n <div class=\"auth-brand-logo\">\r\n <img src=\"assets/images/logo-tsi-tres.png\" alt=\"TSI\" />\r\n </div>\r\n <h1 class=\"auth-brand-title\">{{module()}}</h1>\r\n <p class=\"auth-brand-subtitle\">Renueva tu contrase\u00F1a y mant\u00E9n tu cuenta segura</p>\r\n\r\n <div class=\"auth-brand-divider\"></div>\r\n\r\n <div class=\"auth-brand-features\">\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> M\u00EDnimo 8 caracteres\r\n </div>\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Letras may\u00FAsculas y min\u00FAsculas\r\n </div>\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Al menos un n\u00FAmero y s\u00EDmbolo\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"auth-panel-right\" [class.auth-panel-right--dev]=\"!produccion\">\r\n <div class=\"auth-panel-bg\">\r\n <span class=\"auth-deco auth-deco-tl\"></span>\r\n <span class=\"auth-deco auth-deco-br\"></span>\r\n </div>\r\n\r\n <div class=\"auth-form-wrapper\">\r\n <div>\r\n @if (!produccion) {\r\n <div>\r\n <span class=\"auth-test-badge\">\r\n <span class=\"badge-dot\"></span> ENTORNO DE PRUEBAS\r\n </span>\r\n </div>\r\n }\r\n\r\n <div class=\"auth-card\">\r\n <h2 class=\"auth-card-title\">Renovar contrase\u00F1a</h2>\r\n <p class=\"auth-card-subtitle\">Proporciona tus datos y elige una nueva clave</p>\r\n\r\n <form [formGroup]=\"expiredForm\">\r\n\r\n <div class=\"auth-field\"\r\n [class.has-error]=\"expiredForm.get('ruc')?.invalid && expiredForm.get('ruc')?.touched\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-building\"></i></span>\r\n <input type=\"text\" class=\"auth-input\" placeholder=\" \" maxlength=\"11\"\r\n formControlName=\"ruc\" id=\"exp-ruc\" onlyNumber autocomplete=\"off\">\r\n <label for=\"exp-ruc\" class=\"auth-label\">RUC</label>\r\n </div>\r\n @if (expiredForm.get('ruc')?.invalid && expiredForm.get('ruc')?.touched) {\r\n <p class=\"auth-error\" @fadeInOut>RUC debe tener 11 d\u00EDgitos</p>\r\n }\r\n\r\n <div class=\"auth-field\"\r\n [class.has-error]=\"expiredForm.get('coduser')?.invalid && expiredForm.get('coduser')?.touched\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-user\"></i></span>\r\n <input type=\"text\" class=\"auth-input\" placeholder=\" \"\r\n formControlName=\"coduser\" id=\"exp-user\" autocomplete=\"off\">\r\n <label for=\"exp-user\" class=\"auth-label\">Usuario</label>\r\n </div>\r\n @if (expiredForm.get('coduser')?.invalid && expiredForm.get('coduser')?.touched) {\r\n <p class=\"auth-error\" @fadeInOut>El usuario es obligatorio</p>\r\n }\r\n\r\n <div class=\"auth-field\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-lock-open\"></i></span>\r\n <input [type]=\"passwordVisibility().claveAntigua ? 'text' : 'password'\"\r\n class=\"auth-input\" placeholder=\" \" maxlength=\"20\"\r\n formControlName=\"claveAntigua\" id=\"exp-old-pw\" autocomplete=\"new-password\">\r\n <label for=\"exp-old-pw\" class=\"auth-label\">Contrase\u00F1a antigua</label>\r\n <button type=\"button\" class=\"auth-toggle-pw\" (click)=\"togglePassword('claveAntigua')\">\r\n <i [class]=\"passwordVisibility().claveAntigua ? 'fas fa-eye' : 'fas fa-eye-slash'\"></i>\r\n </button>\r\n </div>\r\n\r\n <div class=\"auth-field\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-lock\"></i></span>\r\n <input [type]=\"passwordVisibility().claveNueva ? 'text' : 'password'\"\r\n class=\"auth-input\" placeholder=\" \" maxlength=\"20\"\r\n formControlName=\"claveNueva\" id=\"exp-new-pw\" autocomplete=\"new-password\">\r\n <label for=\"exp-new-pw\" class=\"auth-label\">Contrase\u00F1a nueva</label>\r\n <button type=\"button\" class=\"auth-toggle-pw\" (click)=\"togglePassword('claveNueva')\">\r\n <i [class]=\"passwordVisibility().claveNueva ? 'fas fa-eye' : 'fas fa-eye-slash'\"></i>\r\n </button>\r\n </div>\r\n\r\n @if (expiredForm.get('claveNueva')?.value?.length > 0) {\r\n <ul class=\"auth-validation-list\" @fadeInOut>\r\n @if (expiredForm.get('claveNueva')?.errors?.['minlength']) {\r\n <li>Al menos 8 caracteres</li>\r\n }\r\n @if (expiredForm.get('claveNueva')?.errors?.['minuscula']) {\r\n <li>Al menos 1 letra min\u00FAscula</li>\r\n }\r\n @if (expiredForm.get('claveNueva')?.errors?.['mayuscula']) {\r\n <li>Al menos 1 letra may\u00FAscula</li>\r\n }\r\n @if (expiredForm.get('claveNueva')?.errors?.['numero']) {\r\n <li>Al menos 1 n\u00FAmero</li>\r\n }\r\n @if (expiredForm.get('claveNueva')?.errors?.['especial']) {\r\n <li>Al menos 1 car\u00E1cter especial</li>\r\n }\r\n </ul>\r\n }\r\n\r\n <div class=\"auth-field\"\r\n [class.has-error]=\"expiredForm.get('claveNuevaConfirmar')?.errors?.['coinciden'] && expiredForm.get('claveNuevaConfirmar')?.touched\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-check-circle\"></i></span>\r\n <input [type]=\"passwordVisibility().claveNuevaConfirmar ? 'text' : 'password'\"\r\n class=\"auth-input\" placeholder=\" \" maxlength=\"20\"\r\n formControlName=\"claveNuevaConfirmar\" id=\"exp-confirm-pw\" autocomplete=\"new-password\">\r\n <label for=\"exp-confirm-pw\" class=\"auth-label\">Confirmar contrase\u00F1a</label>\r\n <button type=\"button\" class=\"auth-toggle-pw\" (click)=\"togglePassword('claveNuevaConfirmar')\">\r\n <i [class]=\"passwordVisibility().claveNuevaConfirmar ? 'fas fa-eye' : 'fas fa-eye-slash'\"></i>\r\n </button>\r\n </div>\r\n @if (expiredForm.get('claveNuevaConfirmar')?.errors?.['coinciden'] && expiredForm.get('claveNuevaConfirmar')?.touched) {\r\n <p class=\"auth-error\" @fadeInOut>Las contrase\u00F1as deben coincidir</p>\r\n }\r\n\r\n <button type=\"button\" class=\"auth-btn\" [class.auth-btn--red]=\"!produccion\"\r\n [disabled]=\"expiredForm.invalid\" (click)=\"recover()\">\r\n Renovar contrase\u00F1a\r\n </button>\r\n\r\n <button type=\"button\" class=\"auth-btn auth-btn--outline\" (click)=\"back()\">\r\n Volver al inicio de sesi\u00F3n\r\n </button>\r\n\r\n </form>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: ["", "@charset \"UTF-8\";.red_contrasena,.blue_contrasena{position:relative;display:inline-block;font-size:13px;text-decoration:none;padding-bottom:2px;transition:color .3s ease;cursor:pointer}.red_contrasena:after,.blue_contrasena:after{content:\"\";position:absolute;bottom:0;left:50%;width:0;height:1px;background-color:currentColor;transition:all .3s ease;transform:translate(-50%)}.red_contrasena:hover:after,.blue_contrasena:hover:after{width:60%}.red_contrasena{color:#d1326f}.red_contrasena:hover{color:#a82859}.blue_contrasena{color:#398bf7}.blue_contrasena:hover{color:#1e5fc4}.auth-wrapper-login{position:fixed;inset:0;display:grid;grid-template-columns:1.15fr .85fr;overflow:hidden;background:#060d1f}.auth-panel-left{position:relative;overflow:hidden;background:linear-gradient(145deg,#040a18,#0b1a3d 55%,#040e22);display:flex;align-items:center;justify-content:center;padding:48px 40px}.auth-panel-left:before{content:\"\";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.055) 1px,transparent 1px);background-size:26px 26px;z-index:1;pointer-events:none}.auth-panel-left:after{content:\"\";position:absolute;top:0;left:-120%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(57,139,247,.04),transparent);animation:panelSweep 7s ease-in-out infinite;z-index:1;pointer-events:none}.auth-blob{position:absolute;border-radius:50%;filter:blur(72px);z-index:0;pointer-events:none}.auth-blob-1{width:340px;height:340px;background:radial-gradient(circle,rgba(57,139,247,.45) 0%,transparent 70%);top:-90px;right:-70px;animation:blobDrift 11s ease-in-out infinite}.auth-blob-2{width:240px;height:240px;background:radial-gradient(circle,rgba(124,58,237,.4) 0%,transparent 70%);bottom:60px;left:-50px;animation:blobDrift 14s ease-in-out infinite reverse}.auth-blob-3{width:180px;height:180px;background:radial-gradient(circle,rgba(14,165,233,.35) 0%,transparent 70%);bottom:-50px;right:40px;animation:blobDrift 9s ease-in-out infinite;animation-delay:-4s}.auth-blob-4{width:120px;height:120px;background:radial-gradient(circle,rgba(209,50,111,.25) 0%,transparent 70%);top:50%;left:50%;transform:translate(-50%,-50%);animation:blobDrift 16s ease-in-out infinite;animation-delay:-8s}@keyframes blobDrift{0%,to{transform:translate(0) scale(1)}33%{transform:translate(14px,-20px) scale(1.05)}66%{transform:translate(-10px,12px) scale(.96)}}@keyframes panelSweep{0%{left:-120%}50%{left:160%}to{left:160%}}.auth-brand-panel{position:relative;z-index:2;text-align:center;color:#fff;max-width:340px}.auth-brand-logo{width:100px;height:100px;border-radius:50%;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;margin:0 auto 28px;box-shadow:0 0 0 14px #398bf70f,0 0 50px #398bf733;backdrop-filter:blur(8px)}.auth-brand-logo img{width:64px;height:64px;object-fit:contain;filter:brightness(1.05) drop-shadow(0 0 8px rgba(57,139,247,.4))}.auth-brand-title{font-size:30px;font-weight:700;letter-spacing:-.5px;margin-bottom:10px;background:linear-gradient(135deg,#fff 20%,#93c5fd 80%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.auth-brand-subtitle{font-size:14px;color:#ffffff73;line-height:1.65;margin-bottom:40px;letter-spacing:.2px}.auth-brand-features{display:flex;flex-direction:column;gap:14px;text-align:left}.auth-brand-feature{display:flex;align-items:center;gap:12px;font-size:13px;color:#fff9}.auth-brand-feature .feat-dot{flex-shrink:0;width:7px;height:7px;border-radius:50%;background:#398bf7;box-shadow:0 0 10px #398bf7b3}.auth-brand-divider{width:60px;height:2px;background:linear-gradient(90deg,transparent,#398bf7,transparent);margin:28px auto 32px;border-radius:2px}.auth-panel-left--dev{background:linear-gradient(145deg,#18040b,#3d0b1d 55%,#220409)}.auth-panel-left--dev:after{background:linear-gradient(90deg,transparent,rgba(209,50,111,.05),transparent)}.auth-panel-left--dev .auth-blob-1{background:radial-gradient(circle,rgba(220,38,38,.52) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-2{background:radial-gradient(circle,rgba(219,39,119,.44) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-3{background:radial-gradient(circle,rgba(239,68,68,.38) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-4{background:radial-gradient(circle,rgba(249,115,22,.28) 0%,transparent 70%)}.auth-panel-left--dev .auth-brand-logo{box-shadow:0 0 0 14px #d1326f12,0 0 50px #d1326f38}.auth-panel-left--dev .auth-brand-logo img{filter:brightness(1.05) drop-shadow(0 0 8px rgba(209,50,111,.45))}.auth-panel-left--dev .auth-brand-title{background:linear-gradient(135deg,#fff 20%,#fca5a5 80%);-webkit-background-clip:text;background-clip:text}.auth-panel-left--dev .auth-brand-divider{background:linear-gradient(90deg,transparent,rgb(209,50,111),transparent)}.auth-panel-left--dev .feat-dot{background:#d1326f;box-shadow:0 0 10px #d1326fb8}.auth-panel-right{position:relative;overflow:hidden;background:var(--background-login)}.auth-panel-right:before{content:\"\";position:absolute;inset:0;background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(57,139,247,.045) 22px,rgba(57,139,247,.045) 23px);animation:authLinesMove 10s linear infinite;pointer-events:none;z-index:0}.auth-panel-right:after{content:\"\";position:absolute;top:0;bottom:0;left:-25%;width:25%;background:linear-gradient(90deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLine 7s ease-in-out infinite;animation-delay:3.5s;pointer-events:none;z-index:0}@keyframes authLinesMove{0%{transform:translate(0)}to{transform:translate(46px,46px)}}@keyframes authScanLine{0%{left:-25%}50%{left:120%}to{left:120%}}.auth-panel-bg{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}.auth-deco{position:absolute;border-radius:50%;pointer-events:none;filter:blur(70px)}.auth-deco-tl{width:300px;height:300px;top:0;left:-120px;transform:translateY(-40%);background:radial-gradient(circle,rgba(57,139,247,.12) 0%,transparent 70%);animation:authOrbPulse 6s ease-in-out infinite}.auth-deco-br{width:340px;height:340px;bottom:0;right:-120px;transform:translateY(40%);background:radial-gradient(circle,rgba(124,58,237,.1) 0%,transparent 70%);animation:authOrbPulse 8s ease-in-out infinite;animation-delay:-4s}@keyframes authOrbPulse{0%,to{opacity:.7}50%{opacity:1}}.auth-form-wrapper{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;align-items:center;z-index:1}.auth-form-wrapper>div{width:100%;max-width:420px;margin:auto;padding:36px 16px;box-sizing:border-box}.auth-panel-right--dev:before{background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(209,50,111,.05) 22px,rgba(209,50,111,.05) 23px)}.auth-panel-right--dev:after{background:linear-gradient(90deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}.auth-panel-right--dev .auth-deco-tl{background:radial-gradient(circle,rgba(209,50,111,.12) 0%,transparent 70%)}.auth-panel-right--dev .auth-deco-br{background:radial-gradient(circle,rgba(239,68,68,.1) 0%,transparent 70%)}.auth-test-badge{display:inline-flex;align-items:center;gap:7px;background:#d1326f14;border:1px solid rgba(209,50,111,.25);color:#d1326f;font-size:10.5px;font-weight:700;padding:5px 12px;border-radius:20px;margin-bottom:18px;letter-spacing:.8px}.auth-test-badge .badge-dot{width:6px;height:6px;border-radius:50%;background:#d1326f;animation:badgePulse 1.6s ease-in-out infinite;flex-shrink:0}@keyframes badgePulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.75)}}.auth-card{background:var(--background-card);border-radius:20px;padding:36px 32px 28px;box-shadow:0 4px 28px #00000014;border:1px solid var(--border-color-modal)}.auth-card-title{font-size:22px;font-weight:700;color:var(--text-color);margin-bottom:4px;letter-spacing:-.3px}.auth-card-subtitle{font-size:13px;color:var(--placeholder-color);margin-bottom:26px}.auth-field{position:relative;margin-bottom:1rem}.auth-field .auth-field-icon{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--placeholder-color);font-size:13px;z-index:2;pointer-events:none;transition:color .2s}.auth-field .auth-input{width:100%;padding:15px 40px 15px 37px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s,background .2s}.auth-field .auth-input::placeholder{color:transparent}.auth-field .auth-input:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721;background:var(--background-focus-input)}.auth-field .auth-input:focus~.auth-label{top:0;font-size:11px!important;color:#398bf7!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-input:focus~.auth-field-icon{color:#398bf7}.auth-field .auth-input:not(:placeholder-shown)~.auth-label{top:0;font-size:11px!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-label{position:absolute;left:35px;top:50%;transform:translateY(-50%);color:var(--placeholder-color)!important;font-size:13px!important;font-weight:400!important;pointer-events:none;transition:top .15s ease,font-size .15s ease,color .15s ease,padding .15s ease,background .15s ease;background:transparent;z-index:1;text-align:left!important}.auth-field .auth-toggle-pw{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--placeholder-color);cursor:pointer;padding:4px 6px;font-size:13px;z-index:2;line-height:1;transition:color .2s}.auth-field .auth-toggle-pw:hover{color:#398bf7}.auth-field.has-error .auth-input{border-color:#dc3545;box-shadow:none}.auth-field.has-error .auth-field-icon{color:#dc3545}.auth-select{width:100%;padding:13px 14px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s;margin-bottom:1rem;cursor:pointer}.auth-select:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721}.auth-btn{width:100%;padding:13px;border:none;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;transition:transform .15s ease,box-shadow .2s ease,opacity .2s;background:linear-gradient(135deg,#398bf7,#1e5fc4);color:#fff;letter-spacing:.3px;margin-bottom:10px;display:block}.auth-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 5px 18px #398bf761}.auth-btn:active:not(:disabled){transform:translateY(0)}.auth-btn:disabled{opacity:.55;cursor:not-allowed}.auth-btn.auth-btn--red{background:linear-gradient(135deg,#d1326f,#a82859)}.auth-btn.auth-btn--red:hover:not(:disabled){box-shadow:0 5px 18px #d1326f61}.auth-btn.auth-btn--outline{background:transparent;border:1.5px solid var(--font-border-input);color:var(--text-color)}.auth-btn.auth-btn--outline:hover:not(:disabled){background:var(--background-btn-light-hover);box-shadow:none;transform:none}.auth-links{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:16px;padding-top:16px;border-top:1px solid var(--border-color-modal)}.auth-version{text-align:right;margin-top:14px;padding-top:12px;border-top:1px solid var(--border-color-modal)}.auth-version span{font-size:11px;color:var(--placeholder-color)}.auth-error{font-size:11.5px;color:#dc3545;margin:-6px 0 10px 2px;padding:0}.auth-validation-list{margin:-4px 0 12px;padding:0;list-style:none}.auth-validation-list li{font-size:11.5px;color:#dc3545;padding:2px 0}.auth-validation-list li:before{content:\"\\2715 \";font-size:10px}.auth-desc{font-size:13px;color:var(--placeholder-color);margin-bottom:20px;line-height:1.65}.auth-section-title{font-size:15px;font-weight:600;color:var(--text-color);margin-bottom:20px}.font-12{font-size:12px}.form-control:focus{border-color:#0199ff9a!important;box-shadow:0 0 5px .2px #65befa44!important}@media (max-width: 900px){.auth-wrapper-login{grid-template-columns:1fr;grid-template-rows:auto 1fr;overflow-y:auto;overflow-x:hidden}.auth-panel-left{padding:14px 24px;justify-content:center}.auth-panel-left .auth-brand-subtitle,.auth-panel-left .auth-brand-features,.auth-panel-left .auth-brand-divider{display:none!important}.auth-panel-left .auth-brand-panel{display:flex!important;flex-direction:row!important;align-items:center;gap:0;text-align:left;max-width:none;width:100%;justify-content:center}.auth-panel-left .auth-brand-logo{width:52px;height:52px;margin:0;flex-shrink:0}.auth-panel-left .auth-brand-logo img{width:34px;height:34px}.auth-panel-left .auth-brand-title{font-size:20px;margin-bottom:0;margin-left:.5rem;flex-shrink:1}.auth-panel-right:after{inset:-25% 0 auto;width:100%;height:25%;background:linear-gradient(180deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLineV 7s ease-in-out infinite;animation-delay:3.5s}.auth-panel-right--dev:after{background:linear-gradient(180deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}}@keyframes authScanLineV{0%{top:-25%}50%{top:120%}to{top:120%}}@media (max-width: 480px){.auth-panel-left{padding:12px 16px}.auth-panel-left .auth-brand-logo{width:44px;height:44px}.auth-panel-left .auth-brand-logo img{width:28px;height:28px}.auth-panel-left .auth-brand-title{font-size:17px}.auth-form-wrapper>div{padding:20px 12px}.auth-card{padding:24px 18px 20px;border-radius:16px}.font-12{font-size:10px!important}}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], animations: [fadeInOut] });
|
|
246
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: ExpiredPasswordComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
247
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: ExpiredPasswordComponent, isStandalone: true, selector: "lib-expired-password", inputs: { production: { classPropertyName: "production", publicName: "production", isSignal: true, isRequired: false, transformFunction: null }, module: { classPropertyName: "module", publicName: "module", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { loginEvent: "loginEvent" }, ngImport: i0, template: "<div class=\"auth-wrapper-login\">\r\n @let produccion = production();\r\n <div class=\"auth-panel-left\" [class.auth-panel-left--dev]=\"!produccion\">\r\n <span class=\"auth-blob auth-blob-1\"></span>\r\n <span class=\"auth-blob auth-blob-2\"></span>\r\n <span class=\"auth-blob auth-blob-3\"></span>\r\n <span class=\"auth-blob auth-blob-4\"></span>\r\n\r\n <div class=\"auth-brand-panel\">\r\n <div class=\"auth-brand-logo\">\r\n <img src=\"assets/images/logo-tsi-tres.png\" alt=\"TSI\" />\r\n </div>\r\n <h1 class=\"auth-brand-title\">{{module()}}</h1>\r\n <p class=\"auth-brand-subtitle\">Renueva tu contrase\u00F1a y mant\u00E9n tu cuenta segura</p>\r\n\r\n <div class=\"auth-brand-divider\"></div>\r\n\r\n <div class=\"auth-brand-features\">\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> M\u00EDnimo 8 caracteres\r\n </div>\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Letras may\u00FAsculas y min\u00FAsculas\r\n </div>\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Al menos un n\u00FAmero y s\u00EDmbolo\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"auth-panel-right\" [class.auth-panel-right--dev]=\"!produccion\">\r\n <div class=\"auth-panel-bg\">\r\n <span class=\"auth-deco auth-deco-tl\"></span>\r\n <span class=\"auth-deco auth-deco-br\"></span>\r\n </div>\r\n\r\n <div class=\"auth-form-wrapper\">\r\n <div>\r\n @if (!produccion) {\r\n <div>\r\n <span class=\"auth-test-badge\">\r\n <span class=\"badge-dot\"></span> ENTORNO DE PRUEBAS\r\n </span>\r\n </div>\r\n }\r\n\r\n <div class=\"auth-card\">\r\n <h2 class=\"auth-card-title\">Renovar contrase\u00F1a</h2>\r\n <p class=\"auth-card-subtitle\">Proporciona tus datos y elige una nueva clave</p>\r\n\r\n <form [formGroup]=\"expiredForm\">\r\n\r\n <div class=\"auth-field\"\r\n [class.has-error]=\"expiredForm.get('ruc')?.invalid && expiredForm.get('ruc')?.touched\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-building\"></i></span>\r\n <input type=\"text\" class=\"auth-input\" placeholder=\" \" maxlength=\"11\"\r\n formControlName=\"ruc\" id=\"exp-ruc\" onlyNumber autocomplete=\"off\">\r\n <label for=\"exp-ruc\" class=\"auth-label\">RUC</label>\r\n </div>\r\n @if (expiredForm.get('ruc')?.invalid && expiredForm.get('ruc')?.touched) {\r\n <p class=\"auth-error\" @fadeInOut>RUC debe tener 11 d\u00EDgitos</p>\r\n }\r\n\r\n <div class=\"auth-field\"\r\n [class.has-error]=\"expiredForm.get('coduser')?.invalid && expiredForm.get('coduser')?.touched\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-user\"></i></span>\r\n <input type=\"text\" class=\"auth-input\" placeholder=\" \"\r\n formControlName=\"coduser\" id=\"exp-user\" autocomplete=\"off\">\r\n <label for=\"exp-user\" class=\"auth-label\">Usuario</label>\r\n </div>\r\n @if (expiredForm.get('coduser')?.invalid && expiredForm.get('coduser')?.touched) {\r\n <p class=\"auth-error\" @fadeInOut>El usuario es obligatorio</p>\r\n }\r\n\r\n <div class=\"auth-field\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-lock-open\"></i></span>\r\n <input [type]=\"passwordVisibility().claveAntigua ? 'text' : 'password'\"\r\n class=\"auth-input\" placeholder=\" \" maxlength=\"20\"\r\n formControlName=\"claveAntigua\" id=\"exp-old-pw\" autocomplete=\"new-password\">\r\n <label for=\"exp-old-pw\" class=\"auth-label\">Contrase\u00F1a antigua</label>\r\n <button type=\"button\" class=\"auth-toggle-pw\" (click)=\"togglePassword('claveAntigua')\">\r\n <i [class]=\"passwordVisibility().claveAntigua ? 'fas fa-eye' : 'fas fa-eye-slash'\"></i>\r\n </button>\r\n </div>\r\n\r\n <div class=\"auth-field\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-lock\"></i></span>\r\n <input [type]=\"passwordVisibility().claveNueva ? 'text' : 'password'\"\r\n class=\"auth-input\" placeholder=\" \" maxlength=\"20\"\r\n formControlName=\"claveNueva\" id=\"exp-new-pw\" autocomplete=\"new-password\">\r\n <label for=\"exp-new-pw\" class=\"auth-label\">Contrase\u00F1a nueva</label>\r\n <button type=\"button\" class=\"auth-toggle-pw\" (click)=\"togglePassword('claveNueva')\">\r\n <i [class]=\"passwordVisibility().claveNueva ? 'fas fa-eye' : 'fas fa-eye-slash'\"></i>\r\n </button>\r\n </div>\r\n\r\n @if (expiredForm.get('claveNueva')?.value?.length > 0) {\r\n <ul class=\"auth-validation-list\" @fadeInOut>\r\n @if (expiredForm.get('claveNueva')?.errors?.['minlength']) {\r\n <li>Al menos 8 caracteres</li>\r\n }\r\n @if (expiredForm.get('claveNueva')?.errors?.['minuscula']) {\r\n <li>Al menos 1 letra min\u00FAscula</li>\r\n }\r\n @if (expiredForm.get('claveNueva')?.errors?.['mayuscula']) {\r\n <li>Al menos 1 letra may\u00FAscula</li>\r\n }\r\n @if (expiredForm.get('claveNueva')?.errors?.['numero']) {\r\n <li>Al menos 1 n\u00FAmero</li>\r\n }\r\n @if (expiredForm.get('claveNueva')?.errors?.['especial']) {\r\n <li>Al menos 1 car\u00E1cter especial</li>\r\n }\r\n </ul>\r\n }\r\n\r\n <div class=\"auth-field\"\r\n [class.has-error]=\"expiredForm.get('claveNuevaConfirmar')?.errors?.['coinciden'] && expiredForm.get('claveNuevaConfirmar')?.touched\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-check-circle\"></i></span>\r\n <input [type]=\"passwordVisibility().claveNuevaConfirmar ? 'text' : 'password'\"\r\n class=\"auth-input\" placeholder=\" \" maxlength=\"20\"\r\n formControlName=\"claveNuevaConfirmar\" id=\"exp-confirm-pw\" autocomplete=\"new-password\">\r\n <label for=\"exp-confirm-pw\" class=\"auth-label\">Confirmar contrase\u00F1a</label>\r\n <button type=\"button\" class=\"auth-toggle-pw\" (click)=\"togglePassword('claveNuevaConfirmar')\">\r\n <i [class]=\"passwordVisibility().claveNuevaConfirmar ? 'fas fa-eye' : 'fas fa-eye-slash'\"></i>\r\n </button>\r\n </div>\r\n @if (expiredForm.get('claveNuevaConfirmar')?.errors?.['coinciden'] && expiredForm.get('claveNuevaConfirmar')?.touched) {\r\n <p class=\"auth-error\" @fadeInOut>Las contrase\u00F1as deben coincidir</p>\r\n }\r\n\r\n <button type=\"button\" class=\"auth-btn\" [class.auth-btn--red]=\"!produccion\"\r\n [disabled]=\"expiredForm.invalid\" (click)=\"recover()\">\r\n Renovar contrase\u00F1a\r\n </button>\r\n\r\n <button type=\"button\" class=\"auth-btn auth-btn--outline\" (click)=\"back()\">\r\n Volver al inicio de sesi\u00F3n\r\n </button>\r\n\r\n </form>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: ["", "@charset \"UTF-8\";.red_contrasena,.blue_contrasena{position:relative;display:inline-block;font-size:13px;text-decoration:none;padding-bottom:2px;transition:color .3s ease;cursor:pointer}.red_contrasena:after,.blue_contrasena:after{content:\"\";position:absolute;bottom:0;left:50%;width:0;height:1px;background-color:currentColor;transition:all .3s ease;transform:translate(-50%)}.red_contrasena:hover:after,.blue_contrasena:hover:after{width:60%}.red_contrasena{color:#d1326f}.red_contrasena:hover{color:#a82859}.blue_contrasena{color:#398bf7}.blue_contrasena:hover{color:#1e5fc4}.auth-wrapper-login{position:fixed;inset:0;display:grid;grid-template-columns:1.15fr .85fr;overflow:hidden;background:#060d1f}.auth-panel-left{position:relative;overflow:hidden;background:linear-gradient(145deg,#040a18,#0b1a3d 55%,#040e22);display:flex;align-items:center;justify-content:center;padding:48px 40px}.auth-panel-left:before{content:\"\";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.055) 1px,transparent 1px);background-size:26px 26px;z-index:1;pointer-events:none}.auth-panel-left:after{content:\"\";position:absolute;top:0;left:-120%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(57,139,247,.04),transparent);animation:panelSweep 7s ease-in-out infinite;z-index:1;pointer-events:none}.auth-blob{position:absolute;border-radius:50%;filter:blur(72px);z-index:0;pointer-events:none}.auth-blob-1{width:340px;height:340px;background:radial-gradient(circle,rgba(57,139,247,.45) 0%,transparent 70%);top:-90px;right:-70px;animation:blobDrift 11s ease-in-out infinite}.auth-blob-2{width:240px;height:240px;background:radial-gradient(circle,rgba(124,58,237,.4) 0%,transparent 70%);bottom:60px;left:-50px;animation:blobDrift 14s ease-in-out infinite reverse}.auth-blob-3{width:180px;height:180px;background:radial-gradient(circle,rgba(14,165,233,.35) 0%,transparent 70%);bottom:-50px;right:40px;animation:blobDrift 9s ease-in-out infinite;animation-delay:-4s}.auth-blob-4{width:120px;height:120px;background:radial-gradient(circle,rgba(209,50,111,.25) 0%,transparent 70%);top:50%;left:50%;transform:translate(-50%,-50%);animation:blobDrift 16s ease-in-out infinite;animation-delay:-8s}@keyframes blobDrift{0%,to{transform:translate(0) scale(1)}33%{transform:translate(14px,-20px) scale(1.05)}66%{transform:translate(-10px,12px) scale(.96)}}@keyframes panelSweep{0%{left:-120%}50%{left:160%}to{left:160%}}.auth-brand-panel{position:relative;z-index:2;text-align:center;color:#fff;max-width:340px}.auth-brand-logo{width:100px;height:100px;border-radius:50%;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;margin:0 auto 28px;box-shadow:0 0 0 14px #398bf70f,0 0 50px #398bf733;backdrop-filter:blur(8px)}.auth-brand-logo img{width:64px;height:64px;object-fit:contain;filter:brightness(1.05) drop-shadow(0 0 8px rgba(57,139,247,.4))}.auth-brand-title{font-size:30px;font-weight:700;letter-spacing:-.5px;margin-bottom:10px;background:linear-gradient(135deg,#fff 20%,#93c5fd 80%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.auth-brand-subtitle{font-size:14px;color:#ffffff73;line-height:1.65;margin-bottom:40px;letter-spacing:.2px}.auth-brand-features{display:flex;flex-direction:column;gap:14px;text-align:left}.auth-brand-feature{display:flex;align-items:center;gap:12px;font-size:13px;color:#fff9}.auth-brand-feature .feat-dot{flex-shrink:0;width:7px;height:7px;border-radius:50%;background:#398bf7;box-shadow:0 0 10px #398bf7b3}.auth-brand-divider{width:60px;height:2px;background:linear-gradient(90deg,transparent,#398bf7,transparent);margin:28px auto 32px;border-radius:2px}.auth-panel-left--dev{background:linear-gradient(145deg,#18040b,#3d0b1d 55%,#220409)}.auth-panel-left--dev:after{background:linear-gradient(90deg,transparent,rgba(209,50,111,.05),transparent)}.auth-panel-left--dev .auth-blob-1{background:radial-gradient(circle,rgba(220,38,38,.52) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-2{background:radial-gradient(circle,rgba(219,39,119,.44) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-3{background:radial-gradient(circle,rgba(239,68,68,.38) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-4{background:radial-gradient(circle,rgba(249,115,22,.28) 0%,transparent 70%)}.auth-panel-left--dev .auth-brand-logo{box-shadow:0 0 0 14px #d1326f12,0 0 50px #d1326f38}.auth-panel-left--dev .auth-brand-logo img{filter:brightness(1.05) drop-shadow(0 0 8px rgba(209,50,111,.45))}.auth-panel-left--dev .auth-brand-title{background:linear-gradient(135deg,#fff 20%,#fca5a5 80%);-webkit-background-clip:text;background-clip:text}.auth-panel-left--dev .auth-brand-divider{background:linear-gradient(90deg,transparent,rgb(209,50,111),transparent)}.auth-panel-left--dev .feat-dot{background:#d1326f;box-shadow:0 0 10px #d1326fb8}.auth-panel-right{position:relative;overflow:hidden;background:var(--background-login)}.auth-panel-right:before{content:\"\";position:absolute;inset:0;background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(57,139,247,.045) 22px,rgba(57,139,247,.045) 23px);animation:authLinesMove 10s linear infinite;pointer-events:none;z-index:0}.auth-panel-right:after{content:\"\";position:absolute;top:0;bottom:0;left:-25%;width:25%;background:linear-gradient(90deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLine 7s ease-in-out infinite;animation-delay:3.5s;pointer-events:none;z-index:0}@keyframes authLinesMove{0%{transform:translate(0)}to{transform:translate(46px,46px)}}@keyframes authScanLine{0%{left:-25%}50%{left:120%}to{left:120%}}.auth-panel-bg{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}.auth-deco{position:absolute;border-radius:50%;pointer-events:none;filter:blur(70px)}.auth-deco-tl{width:300px;height:300px;top:0;left:-120px;transform:translateY(-40%);background:radial-gradient(circle,rgba(57,139,247,.12) 0%,transparent 70%);animation:authOrbPulse 6s ease-in-out infinite}.auth-deco-br{width:340px;height:340px;bottom:0;right:-120px;transform:translateY(40%);background:radial-gradient(circle,rgba(124,58,237,.1) 0%,transparent 70%);animation:authOrbPulse 8s ease-in-out infinite;animation-delay:-4s}@keyframes authOrbPulse{0%,to{opacity:.7}50%{opacity:1}}.auth-form-wrapper{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;align-items:center;z-index:1}.auth-form-wrapper>div{width:100%;max-width:420px;margin:auto;padding:36px 16px;box-sizing:border-box}.auth-panel-right--dev:before{background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(209,50,111,.05) 22px,rgba(209,50,111,.05) 23px)}.auth-panel-right--dev:after{background:linear-gradient(90deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}.auth-panel-right--dev .auth-deco-tl{background:radial-gradient(circle,rgba(209,50,111,.12) 0%,transparent 70%)}.auth-panel-right--dev .auth-deco-br{background:radial-gradient(circle,rgba(239,68,68,.1) 0%,transparent 70%)}.auth-test-badge{display:inline-flex;align-items:center;gap:7px;background:#d1326f14;border:1px solid rgba(209,50,111,.25);color:#d1326f;font-size:10.5px;font-weight:700;padding:5px 12px;border-radius:20px;margin-bottom:18px;letter-spacing:.8px}.auth-test-badge .badge-dot{width:6px;height:6px;border-radius:50%;background:#d1326f;animation:badgePulse 1.6s ease-in-out infinite;flex-shrink:0}@keyframes badgePulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.75)}}.auth-card{background:var(--background-card);border-radius:20px;padding:36px 32px 28px;box-shadow:0 4px 28px #00000014;border:1px solid var(--border-color-modal)}.auth-card-title{font-size:22px;font-weight:700;color:var(--text-color);margin-bottom:4px;letter-spacing:-.3px}.auth-card-subtitle{font-size:13px;color:var(--placeholder-color);margin-bottom:26px}.auth-field{position:relative;margin-bottom:1rem}.auth-field .auth-field-icon{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--placeholder-color);font-size:13px;z-index:2;pointer-events:none;transition:color .2s}.auth-field .auth-input{width:100%;padding:15px 40px 15px 37px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s,background .2s}.auth-field .auth-input::placeholder{color:transparent}.auth-field .auth-input:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721;background:var(--background-focus-input)}.auth-field .auth-input:focus~.auth-label{top:0;font-size:11px!important;color:#398bf7!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-input:focus~.auth-field-icon{color:#398bf7}.auth-field .auth-input:not(:placeholder-shown)~.auth-label{top:0;font-size:11px!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-label{position:absolute;left:35px;top:50%;transform:translateY(-50%);color:var(--placeholder-color)!important;font-size:13px!important;font-weight:400!important;pointer-events:none;transition:top .15s ease,font-size .15s ease,color .15s ease,padding .15s ease,background .15s ease;background:transparent;z-index:1;text-align:left!important}.auth-field .auth-toggle-pw{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--placeholder-color);cursor:pointer;padding:4px 6px;font-size:13px;z-index:2;line-height:1;transition:color .2s}.auth-field .auth-toggle-pw:hover{color:#398bf7}.auth-field.has-error .auth-input{border-color:#dc3545;box-shadow:none}.auth-field.has-error .auth-field-icon{color:#dc3545}.auth-select{width:100%;padding:13px 14px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s;margin-bottom:1rem;cursor:pointer}.auth-select:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721}.auth-btn{width:100%;padding:13px;border:none;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;transition:transform .15s ease,box-shadow .2s ease,opacity .2s;background:linear-gradient(135deg,#398bf7,#1e5fc4);color:#fff;letter-spacing:.3px;margin-bottom:10px;display:block}.auth-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 5px 18px #398bf761}.auth-btn:active:not(:disabled){transform:translateY(0)}.auth-btn:disabled{opacity:.55;cursor:not-allowed}.auth-btn.auth-btn--red{background:linear-gradient(135deg,#d1326f,#a82859)}.auth-btn.auth-btn--red:hover:not(:disabled){box-shadow:0 5px 18px #d1326f61}.auth-btn.auth-btn--outline{background:transparent;border:1.5px solid var(--font-border-input);color:var(--text-color)}.auth-btn.auth-btn--outline:hover:not(:disabled){background:var(--background-btn-light-hover);box-shadow:none;transform:none}.auth-links{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:16px;padding-top:16px;border-top:1px solid var(--border-color-modal)}.auth-version{text-align:right;margin-top:14px;padding-top:12px;border-top:1px solid var(--border-color-modal)}.auth-version span{font-size:11px;color:var(--placeholder-color)}.auth-error{font-size:11.5px;color:#dc3545;margin:-6px 0 10px 2px;padding:0}.auth-hint{display:flex;align-items:flex-start;gap:6px;font-size:11.5px;color:var(--placeholder-color);margin:-6px 0 14px 2px;padding:0;line-height:1.35}.auth-hint i{margin-top:2px;flex-shrink:0}.auth-validation-list{margin:-4px 0 12px;padding:0;list-style:none}.auth-validation-list li{font-size:11.5px;color:#dc3545;padding:2px 0}.auth-validation-list li:before{content:\"\\2715 \";font-size:10px}.auth-desc{font-size:13px;color:var(--placeholder-color);margin-bottom:20px;line-height:1.65}.auth-section-title{font-size:15px;font-weight:600;color:var(--text-color);margin-bottom:20px}.font-12{font-size:12px}.form-control:focus{border-color:#0199ff9a!important;box-shadow:0 0 5px .2px #65befa44!important}@media(max-width:900px){.auth-wrapper-login{grid-template-columns:1fr;grid-template-rows:auto 1fr;overflow-y:auto;overflow-x:hidden}.auth-panel-left{padding:14px 24px;justify-content:center}.auth-panel-left .auth-brand-subtitle,.auth-panel-left .auth-brand-features,.auth-panel-left .auth-brand-divider{display:none!important}.auth-panel-left .auth-brand-panel{display:flex!important;flex-direction:row!important;align-items:center;gap:0;text-align:left;max-width:none;width:100%;justify-content:center}.auth-panel-left .auth-brand-logo{width:52px;height:52px;margin:0;flex-shrink:0}.auth-panel-left .auth-brand-logo img{width:34px;height:34px}.auth-panel-left .auth-brand-title{font-size:20px;margin-bottom:0;margin-left:.5rem;flex-shrink:1}.auth-panel-right:after{inset:-25% 0 auto;width:100%;height:25%;background:linear-gradient(180deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLineV 7s ease-in-out infinite;animation-delay:3.5s}.auth-panel-right--dev:after{background:linear-gradient(180deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}}@keyframes authScanLineV{0%{top:-25%}50%{top:120%}to{top:120%}}@media(max-width:480px){.auth-panel-left{padding:12px 16px}.auth-panel-left .auth-brand-logo{width:44px;height:44px}.auth-panel-left .auth-brand-logo img{width:28px;height:28px}.auth-panel-left .auth-brand-title{font-size:17px}.auth-form-wrapper>div{padding:20px 12px}.auth-card{padding:24px 18px 20px;border-radius:16px}.font-12{font-size:10px!important}}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], animations: [fadeInOut] });
|
|
143
248
|
}
|
|
144
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
249
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: ExpiredPasswordComponent, decorators: [{
|
|
145
250
|
type: Component,
|
|
146
|
-
args: [{ selector: 'lib-expired-password', imports: [ReactiveFormsModule], animations: [fadeInOut], template: "<div class=\"auth-wrapper-login\">\r\n @let produccion = production();\r\n <div class=\"auth-panel-left\" [class.auth-panel-left--dev]=\"!produccion\">\r\n <span class=\"auth-blob auth-blob-1\"></span>\r\n <span class=\"auth-blob auth-blob-2\"></span>\r\n <span class=\"auth-blob auth-blob-3\"></span>\r\n <span class=\"auth-blob auth-blob-4\"></span>\r\n\r\n <div class=\"auth-brand-panel\">\r\n <div class=\"auth-brand-logo\">\r\n <img src=\"assets/images/logo-tsi-tres.png\" alt=\"TSI\" />\r\n </div>\r\n <h1 class=\"auth-brand-title\">{{module()}}</h1>\r\n <p class=\"auth-brand-subtitle\">Renueva tu contrase\u00F1a y mant\u00E9n tu cuenta segura</p>\r\n\r\n <div class=\"auth-brand-divider\"></div>\r\n\r\n <div class=\"auth-brand-features\">\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> M\u00EDnimo 8 caracteres\r\n </div>\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Letras may\u00FAsculas y min\u00FAsculas\r\n </div>\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Al menos un n\u00FAmero y s\u00EDmbolo\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"auth-panel-right\" [class.auth-panel-right--dev]=\"!produccion\">\r\n <div class=\"auth-panel-bg\">\r\n <span class=\"auth-deco auth-deco-tl\"></span>\r\n <span class=\"auth-deco auth-deco-br\"></span>\r\n </div>\r\n\r\n <div class=\"auth-form-wrapper\">\r\n <div>\r\n @if (!produccion) {\r\n <div>\r\n <span class=\"auth-test-badge\">\r\n <span class=\"badge-dot\"></span> ENTORNO DE PRUEBAS\r\n </span>\r\n </div>\r\n }\r\n\r\n <div class=\"auth-card\">\r\n <h2 class=\"auth-card-title\">Renovar contrase\u00F1a</h2>\r\n <p class=\"auth-card-subtitle\">Proporciona tus datos y elige una nueva clave</p>\r\n\r\n <form [formGroup]=\"expiredForm\">\r\n\r\n <div class=\"auth-field\"\r\n [class.has-error]=\"expiredForm.get('ruc')?.invalid && expiredForm.get('ruc')?.touched\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-building\"></i></span>\r\n <input type=\"text\" class=\"auth-input\" placeholder=\" \" maxlength=\"11\"\r\n formControlName=\"ruc\" id=\"exp-ruc\" onlyNumber autocomplete=\"off\">\r\n <label for=\"exp-ruc\" class=\"auth-label\">RUC</label>\r\n </div>\r\n @if (expiredForm.get('ruc')?.invalid && expiredForm.get('ruc')?.touched) {\r\n <p class=\"auth-error\" @fadeInOut>RUC debe tener 11 d\u00EDgitos</p>\r\n }\r\n\r\n <div class=\"auth-field\"\r\n [class.has-error]=\"expiredForm.get('coduser')?.invalid && expiredForm.get('coduser')?.touched\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-user\"></i></span>\r\n <input type=\"text\" class=\"auth-input\" placeholder=\" \"\r\n formControlName=\"coduser\" id=\"exp-user\" autocomplete=\"off\">\r\n <label for=\"exp-user\" class=\"auth-label\">Usuario</label>\r\n </div>\r\n @if (expiredForm.get('coduser')?.invalid && expiredForm.get('coduser')?.touched) {\r\n <p class=\"auth-error\" @fadeInOut>El usuario es obligatorio</p>\r\n }\r\n\r\n <div class=\"auth-field\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-lock-open\"></i></span>\r\n <input [type]=\"passwordVisibility().claveAntigua ? 'text' : 'password'\"\r\n class=\"auth-input\" placeholder=\" \" maxlength=\"20\"\r\n formControlName=\"claveAntigua\" id=\"exp-old-pw\" autocomplete=\"new-password\">\r\n <label for=\"exp-old-pw\" class=\"auth-label\">Contrase\u00F1a antigua</label>\r\n <button type=\"button\" class=\"auth-toggle-pw\" (click)=\"togglePassword('claveAntigua')\">\r\n <i [class]=\"passwordVisibility().claveAntigua ? 'fas fa-eye' : 'fas fa-eye-slash'\"></i>\r\n </button>\r\n </div>\r\n\r\n <div class=\"auth-field\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-lock\"></i></span>\r\n <input [type]=\"passwordVisibility().claveNueva ? 'text' : 'password'\"\r\n class=\"auth-input\" placeholder=\" \" maxlength=\"20\"\r\n formControlName=\"claveNueva\" id=\"exp-new-pw\" autocomplete=\"new-password\">\r\n <label for=\"exp-new-pw\" class=\"auth-label\">Contrase\u00F1a nueva</label>\r\n <button type=\"button\" class=\"auth-toggle-pw\" (click)=\"togglePassword('claveNueva')\">\r\n <i [class]=\"passwordVisibility().claveNueva ? 'fas fa-eye' : 'fas fa-eye-slash'\"></i>\r\n </button>\r\n </div>\r\n\r\n @if (expiredForm.get('claveNueva')?.value?.length > 0) {\r\n <ul class=\"auth-validation-list\" @fadeInOut>\r\n @if (expiredForm.get('claveNueva')?.errors?.['minlength']) {\r\n <li>Al menos 8 caracteres</li>\r\n }\r\n @if (expiredForm.get('claveNueva')?.errors?.['minuscula']) {\r\n <li>Al menos 1 letra min\u00FAscula</li>\r\n }\r\n @if (expiredForm.get('claveNueva')?.errors?.['mayuscula']) {\r\n <li>Al menos 1 letra may\u00FAscula</li>\r\n }\r\n @if (expiredForm.get('claveNueva')?.errors?.['numero']) {\r\n <li>Al menos 1 n\u00FAmero</li>\r\n }\r\n @if (expiredForm.get('claveNueva')?.errors?.['especial']) {\r\n <li>Al menos 1 car\u00E1cter especial</li>\r\n }\r\n </ul>\r\n }\r\n\r\n <div class=\"auth-field\"\r\n [class.has-error]=\"expiredForm.get('claveNuevaConfirmar')?.errors?.['coinciden'] && expiredForm.get('claveNuevaConfirmar')?.touched\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-check-circle\"></i></span>\r\n <input [type]=\"passwordVisibility().claveNuevaConfirmar ? 'text' : 'password'\"\r\n class=\"auth-input\" placeholder=\" \" maxlength=\"20\"\r\n formControlName=\"claveNuevaConfirmar\" id=\"exp-confirm-pw\" autocomplete=\"new-password\">\r\n <label for=\"exp-confirm-pw\" class=\"auth-label\">Confirmar contrase\u00F1a</label>\r\n <button type=\"button\" class=\"auth-toggle-pw\" (click)=\"togglePassword('claveNuevaConfirmar')\">\r\n <i [class]=\"passwordVisibility().claveNuevaConfirmar ? 'fas fa-eye' : 'fas fa-eye-slash'\"></i>\r\n </button>\r\n </div>\r\n @if (expiredForm.get('claveNuevaConfirmar')?.errors?.['coinciden'] && expiredForm.get('claveNuevaConfirmar')?.touched) {\r\n <p class=\"auth-error\" @fadeInOut>Las contrase\u00F1as deben coincidir</p>\r\n }\r\n\r\n <button type=\"button\" class=\"auth-btn\" [class.auth-btn--red]=\"!produccion\"\r\n [disabled]=\"expiredForm.invalid\" (click)=\"recover()\">\r\n Renovar contrase\u00F1a\r\n </button>\r\n\r\n <button type=\"button\" class=\"auth-btn auth-btn--outline\" (click)=\"back()\">\r\n Volver al inicio de sesi\u00F3n\r\n </button>\r\n\r\n </form>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";.red_contrasena,.blue_contrasena{position:relative;display:inline-block;font-size:13px;text-decoration:none;padding-bottom:2px;transition:color .3s ease;cursor:pointer}.red_contrasena:after,.blue_contrasena:after{content:\"\";position:absolute;bottom:0;left:50%;width:0;height:1px;background-color:currentColor;transition:all .3s ease;transform:translate(-50%)}.red_contrasena:hover:after,.blue_contrasena:hover:after{width:60%}.red_contrasena{color:#d1326f}.red_contrasena:hover{color:#a82859}.blue_contrasena{color:#398bf7}.blue_contrasena:hover{color:#1e5fc4}.auth-wrapper-login{position:fixed;inset:0;display:grid;grid-template-columns:1.15fr .85fr;overflow:hidden;background:#060d1f}.auth-panel-left{position:relative;overflow:hidden;background:linear-gradient(145deg,#040a18,#0b1a3d 55%,#040e22);display:flex;align-items:center;justify-content:center;padding:48px 40px}.auth-panel-left:before{content:\"\";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.055) 1px,transparent 1px);background-size:26px 26px;z-index:1;pointer-events:none}.auth-panel-left:after{content:\"\";position:absolute;top:0;left:-120%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(57,139,247,.04),transparent);animation:panelSweep 7s ease-in-out infinite;z-index:1;pointer-events:none}.auth-blob{position:absolute;border-radius:50%;filter:blur(72px);z-index:0;pointer-events:none}.auth-blob-1{width:340px;height:340px;background:radial-gradient(circle,rgba(57,139,247,.45) 0%,transparent 70%);top:-90px;right:-70px;animation:blobDrift 11s ease-in-out infinite}.auth-blob-2{width:240px;height:240px;background:radial-gradient(circle,rgba(124,58,237,.4) 0%,transparent 70%);bottom:60px;left:-50px;animation:blobDrift 14s ease-in-out infinite reverse}.auth-blob-3{width:180px;height:180px;background:radial-gradient(circle,rgba(14,165,233,.35) 0%,transparent 70%);bottom:-50px;right:40px;animation:blobDrift 9s ease-in-out infinite;animation-delay:-4s}.auth-blob-4{width:120px;height:120px;background:radial-gradient(circle,rgba(209,50,111,.25) 0%,transparent 70%);top:50%;left:50%;transform:translate(-50%,-50%);animation:blobDrift 16s ease-in-out infinite;animation-delay:-8s}@keyframes blobDrift{0%,to{transform:translate(0) scale(1)}33%{transform:translate(14px,-20px) scale(1.05)}66%{transform:translate(-10px,12px) scale(.96)}}@keyframes panelSweep{0%{left:-120%}50%{left:160%}to{left:160%}}.auth-brand-panel{position:relative;z-index:2;text-align:center;color:#fff;max-width:340px}.auth-brand-logo{width:100px;height:100px;border-radius:50%;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;margin:0 auto 28px;box-shadow:0 0 0 14px #398bf70f,0 0 50px #398bf733;backdrop-filter:blur(8px)}.auth-brand-logo img{width:64px;height:64px;object-fit:contain;filter:brightness(1.05) drop-shadow(0 0 8px rgba(57,139,247,.4))}.auth-brand-title{font-size:30px;font-weight:700;letter-spacing:-.5px;margin-bottom:10px;background:linear-gradient(135deg,#fff 20%,#93c5fd 80%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.auth-brand-subtitle{font-size:14px;color:#ffffff73;line-height:1.65;margin-bottom:40px;letter-spacing:.2px}.auth-brand-features{display:flex;flex-direction:column;gap:14px;text-align:left}.auth-brand-feature{display:flex;align-items:center;gap:12px;font-size:13px;color:#fff9}.auth-brand-feature .feat-dot{flex-shrink:0;width:7px;height:7px;border-radius:50%;background:#398bf7;box-shadow:0 0 10px #398bf7b3}.auth-brand-divider{width:60px;height:2px;background:linear-gradient(90deg,transparent,#398bf7,transparent);margin:28px auto 32px;border-radius:2px}.auth-panel-left--dev{background:linear-gradient(145deg,#18040b,#3d0b1d 55%,#220409)}.auth-panel-left--dev:after{background:linear-gradient(90deg,transparent,rgba(209,50,111,.05),transparent)}.auth-panel-left--dev .auth-blob-1{background:radial-gradient(circle,rgba(220,38,38,.52) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-2{background:radial-gradient(circle,rgba(219,39,119,.44) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-3{background:radial-gradient(circle,rgba(239,68,68,.38) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-4{background:radial-gradient(circle,rgba(249,115,22,.28) 0%,transparent 70%)}.auth-panel-left--dev .auth-brand-logo{box-shadow:0 0 0 14px #d1326f12,0 0 50px #d1326f38}.auth-panel-left--dev .auth-brand-logo img{filter:brightness(1.05) drop-shadow(0 0 8px rgba(209,50,111,.45))}.auth-panel-left--dev .auth-brand-title{background:linear-gradient(135deg,#fff 20%,#fca5a5 80%);-webkit-background-clip:text;background-clip:text}.auth-panel-left--dev .auth-brand-divider{background:linear-gradient(90deg,transparent,rgb(209,50,111),transparent)}.auth-panel-left--dev .feat-dot{background:#d1326f;box-shadow:0 0 10px #d1326fb8}.auth-panel-right{position:relative;overflow:hidden;background:var(--background-login)}.auth-panel-right:before{content:\"\";position:absolute;inset:0;background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(57,139,247,.045) 22px,rgba(57,139,247,.045) 23px);animation:authLinesMove 10s linear infinite;pointer-events:none;z-index:0}.auth-panel-right:after{content:\"\";position:absolute;top:0;bottom:0;left:-25%;width:25%;background:linear-gradient(90deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLine 7s ease-in-out infinite;animation-delay:3.5s;pointer-events:none;z-index:0}@keyframes authLinesMove{0%{transform:translate(0)}to{transform:translate(46px,46px)}}@keyframes authScanLine{0%{left:-25%}50%{left:120%}to{left:120%}}.auth-panel-bg{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}.auth-deco{position:absolute;border-radius:50%;pointer-events:none;filter:blur(70px)}.auth-deco-tl{width:300px;height:300px;top:0;left:-120px;transform:translateY(-40%);background:radial-gradient(circle,rgba(57,139,247,.12) 0%,transparent 70%);animation:authOrbPulse 6s ease-in-out infinite}.auth-deco-br{width:340px;height:340px;bottom:0;right:-120px;transform:translateY(40%);background:radial-gradient(circle,rgba(124,58,237,.1) 0%,transparent 70%);animation:authOrbPulse 8s ease-in-out infinite;animation-delay:-4s}@keyframes authOrbPulse{0%,to{opacity:.7}50%{opacity:1}}.auth-form-wrapper{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;align-items:center;z-index:1}.auth-form-wrapper>div{width:100%;max-width:420px;margin:auto;padding:36px 16px;box-sizing:border-box}.auth-panel-right--dev:before{background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(209,50,111,.05) 22px,rgba(209,50,111,.05) 23px)}.auth-panel-right--dev:after{background:linear-gradient(90deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}.auth-panel-right--dev .auth-deco-tl{background:radial-gradient(circle,rgba(209,50,111,.12) 0%,transparent 70%)}.auth-panel-right--dev .auth-deco-br{background:radial-gradient(circle,rgba(239,68,68,.1) 0%,transparent 70%)}.auth-test-badge{display:inline-flex;align-items:center;gap:7px;background:#d1326f14;border:1px solid rgba(209,50,111,.25);color:#d1326f;font-size:10.5px;font-weight:700;padding:5px 12px;border-radius:20px;margin-bottom:18px;letter-spacing:.8px}.auth-test-badge .badge-dot{width:6px;height:6px;border-radius:50%;background:#d1326f;animation:badgePulse 1.6s ease-in-out infinite;flex-shrink:0}@keyframes badgePulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.75)}}.auth-card{background:var(--background-card);border-radius:20px;padding:36px 32px 28px;box-shadow:0 4px 28px #00000014;border:1px solid var(--border-color-modal)}.auth-card-title{font-size:22px;font-weight:700;color:var(--text-color);margin-bottom:4px;letter-spacing:-.3px}.auth-card-subtitle{font-size:13px;color:var(--placeholder-color);margin-bottom:26px}.auth-field{position:relative;margin-bottom:1rem}.auth-field .auth-field-icon{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--placeholder-color);font-size:13px;z-index:2;pointer-events:none;transition:color .2s}.auth-field .auth-input{width:100%;padding:15px 40px 15px 37px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s,background .2s}.auth-field .auth-input::placeholder{color:transparent}.auth-field .auth-input:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721;background:var(--background-focus-input)}.auth-field .auth-input:focus~.auth-label{top:0;font-size:11px!important;color:#398bf7!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-input:focus~.auth-field-icon{color:#398bf7}.auth-field .auth-input:not(:placeholder-shown)~.auth-label{top:0;font-size:11px!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-label{position:absolute;left:35px;top:50%;transform:translateY(-50%);color:var(--placeholder-color)!important;font-size:13px!important;font-weight:400!important;pointer-events:none;transition:top .15s ease,font-size .15s ease,color .15s ease,padding .15s ease,background .15s ease;background:transparent;z-index:1;text-align:left!important}.auth-field .auth-toggle-pw{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--placeholder-color);cursor:pointer;padding:4px 6px;font-size:13px;z-index:2;line-height:1;transition:color .2s}.auth-field .auth-toggle-pw:hover{color:#398bf7}.auth-field.has-error .auth-input{border-color:#dc3545;box-shadow:none}.auth-field.has-error .auth-field-icon{color:#dc3545}.auth-select{width:100%;padding:13px 14px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s;margin-bottom:1rem;cursor:pointer}.auth-select:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721}.auth-btn{width:100%;padding:13px;border:none;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;transition:transform .15s ease,box-shadow .2s ease,opacity .2s;background:linear-gradient(135deg,#398bf7,#1e5fc4);color:#fff;letter-spacing:.3px;margin-bottom:10px;display:block}.auth-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 5px 18px #398bf761}.auth-btn:active:not(:disabled){transform:translateY(0)}.auth-btn:disabled{opacity:.55;cursor:not-allowed}.auth-btn.auth-btn--red{background:linear-gradient(135deg,#d1326f,#a82859)}.auth-btn.auth-btn--red:hover:not(:disabled){box-shadow:0 5px 18px #d1326f61}.auth-btn.auth-btn--outline{background:transparent;border:1.5px solid var(--font-border-input);color:var(--text-color)}.auth-btn.auth-btn--outline:hover:not(:disabled){background:var(--background-btn-light-hover);box-shadow:none;transform:none}.auth-links{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:16px;padding-top:16px;border-top:1px solid var(--border-color-modal)}.auth-version{text-align:right;margin-top:14px;padding-top:12px;border-top:1px solid var(--border-color-modal)}.auth-version span{font-size:11px;color:var(--placeholder-color)}.auth-error{font-size:11.5px;color:#dc3545;margin:-6px 0 10px 2px;padding:0}.auth-validation-list{margin:-4px 0 12px;padding:0;list-style:none}.auth-validation-list li{font-size:11.5px;color:#dc3545;padding:2px 0}.auth-validation-list li:before{content:\"\\2715 \";font-size:10px}.auth-desc{font-size:13px;color:var(--placeholder-color);margin-bottom:20px;line-height:1.65}.auth-section-title{font-size:15px;font-weight:600;color:var(--text-color);margin-bottom:20px}.font-12{font-size:12px}.form-control:focus{border-color:#0199ff9a!important;box-shadow:0 0 5px .2px #65befa44!important}@media (max-width: 900px){.auth-wrapper-login{grid-template-columns:1fr;grid-template-rows:auto 1fr;overflow-y:auto;overflow-x:hidden}.auth-panel-left{padding:14px 24px;justify-content:center}.auth-panel-left .auth-brand-subtitle,.auth-panel-left .auth-brand-features,.auth-panel-left .auth-brand-divider{display:none!important}.auth-panel-left .auth-brand-panel{display:flex!important;flex-direction:row!important;align-items:center;gap:0;text-align:left;max-width:none;width:100%;justify-content:center}.auth-panel-left .auth-brand-logo{width:52px;height:52px;margin:0;flex-shrink:0}.auth-panel-left .auth-brand-logo img{width:34px;height:34px}.auth-panel-left .auth-brand-title{font-size:20px;margin-bottom:0;margin-left:.5rem;flex-shrink:1}.auth-panel-right:after{inset:-25% 0 auto;width:100%;height:25%;background:linear-gradient(180deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLineV 7s ease-in-out infinite;animation-delay:3.5s}.auth-panel-right--dev:after{background:linear-gradient(180deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}}@keyframes authScanLineV{0%{top:-25%}50%{top:120%}to{top:120%}}@media (max-width: 480px){.auth-panel-left{padding:12px 16px}.auth-panel-left .auth-brand-logo{width:44px;height:44px}.auth-panel-left .auth-brand-logo img{width:28px;height:28px}.auth-panel-left .auth-brand-title{font-size:17px}.auth-form-wrapper>div{padding:20px 12px}.auth-card{padding:24px 18px 20px;border-radius:16px}.font-12{font-size:10px!important}}\n"] }]
|
|
251
|
+
args: [{ selector: 'lib-expired-password', imports: [ReactiveFormsModule], animations: [fadeInOut], template: "<div class=\"auth-wrapper-login\">\r\n @let produccion = production();\r\n <div class=\"auth-panel-left\" [class.auth-panel-left--dev]=\"!produccion\">\r\n <span class=\"auth-blob auth-blob-1\"></span>\r\n <span class=\"auth-blob auth-blob-2\"></span>\r\n <span class=\"auth-blob auth-blob-3\"></span>\r\n <span class=\"auth-blob auth-blob-4\"></span>\r\n\r\n <div class=\"auth-brand-panel\">\r\n <div class=\"auth-brand-logo\">\r\n <img src=\"assets/images/logo-tsi-tres.png\" alt=\"TSI\" />\r\n </div>\r\n <h1 class=\"auth-brand-title\">{{module()}}</h1>\r\n <p class=\"auth-brand-subtitle\">Renueva tu contrase\u00F1a y mant\u00E9n tu cuenta segura</p>\r\n\r\n <div class=\"auth-brand-divider\"></div>\r\n\r\n <div class=\"auth-brand-features\">\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> M\u00EDnimo 8 caracteres\r\n </div>\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Letras may\u00FAsculas y min\u00FAsculas\r\n </div>\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Al menos un n\u00FAmero y s\u00EDmbolo\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"auth-panel-right\" [class.auth-panel-right--dev]=\"!produccion\">\r\n <div class=\"auth-panel-bg\">\r\n <span class=\"auth-deco auth-deco-tl\"></span>\r\n <span class=\"auth-deco auth-deco-br\"></span>\r\n </div>\r\n\r\n <div class=\"auth-form-wrapper\">\r\n <div>\r\n @if (!produccion) {\r\n <div>\r\n <span class=\"auth-test-badge\">\r\n <span class=\"badge-dot\"></span> ENTORNO DE PRUEBAS\r\n </span>\r\n </div>\r\n }\r\n\r\n <div class=\"auth-card\">\r\n <h2 class=\"auth-card-title\">Renovar contrase\u00F1a</h2>\r\n <p class=\"auth-card-subtitle\">Proporciona tus datos y elige una nueva clave</p>\r\n\r\n <form [formGroup]=\"expiredForm\">\r\n\r\n <div class=\"auth-field\"\r\n [class.has-error]=\"expiredForm.get('ruc')?.invalid && expiredForm.get('ruc')?.touched\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-building\"></i></span>\r\n <input type=\"text\" class=\"auth-input\" placeholder=\" \" maxlength=\"11\"\r\n formControlName=\"ruc\" id=\"exp-ruc\" onlyNumber autocomplete=\"off\">\r\n <label for=\"exp-ruc\" class=\"auth-label\">RUC</label>\r\n </div>\r\n @if (expiredForm.get('ruc')?.invalid && expiredForm.get('ruc')?.touched) {\r\n <p class=\"auth-error\" @fadeInOut>RUC debe tener 11 d\u00EDgitos</p>\r\n }\r\n\r\n <div class=\"auth-field\"\r\n [class.has-error]=\"expiredForm.get('coduser')?.invalid && expiredForm.get('coduser')?.touched\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-user\"></i></span>\r\n <input type=\"text\" class=\"auth-input\" placeholder=\" \"\r\n formControlName=\"coduser\" id=\"exp-user\" autocomplete=\"off\">\r\n <label for=\"exp-user\" class=\"auth-label\">Usuario</label>\r\n </div>\r\n @if (expiredForm.get('coduser')?.invalid && expiredForm.get('coduser')?.touched) {\r\n <p class=\"auth-error\" @fadeInOut>El usuario es obligatorio</p>\r\n }\r\n\r\n <div class=\"auth-field\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-lock-open\"></i></span>\r\n <input [type]=\"passwordVisibility().claveAntigua ? 'text' : 'password'\"\r\n class=\"auth-input\" placeholder=\" \" maxlength=\"20\"\r\n formControlName=\"claveAntigua\" id=\"exp-old-pw\" autocomplete=\"new-password\">\r\n <label for=\"exp-old-pw\" class=\"auth-label\">Contrase\u00F1a antigua</label>\r\n <button type=\"button\" class=\"auth-toggle-pw\" (click)=\"togglePassword('claveAntigua')\">\r\n <i [class]=\"passwordVisibility().claveAntigua ? 'fas fa-eye' : 'fas fa-eye-slash'\"></i>\r\n </button>\r\n </div>\r\n\r\n <div class=\"auth-field\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-lock\"></i></span>\r\n <input [type]=\"passwordVisibility().claveNueva ? 'text' : 'password'\"\r\n class=\"auth-input\" placeholder=\" \" maxlength=\"20\"\r\n formControlName=\"claveNueva\" id=\"exp-new-pw\" autocomplete=\"new-password\">\r\n <label for=\"exp-new-pw\" class=\"auth-label\">Contrase\u00F1a nueva</label>\r\n <button type=\"button\" class=\"auth-toggle-pw\" (click)=\"togglePassword('claveNueva')\">\r\n <i [class]=\"passwordVisibility().claveNueva ? 'fas fa-eye' : 'fas fa-eye-slash'\"></i>\r\n </button>\r\n </div>\r\n\r\n @if (expiredForm.get('claveNueva')?.value?.length > 0) {\r\n <ul class=\"auth-validation-list\" @fadeInOut>\r\n @if (expiredForm.get('claveNueva')?.errors?.['minlength']) {\r\n <li>Al menos 8 caracteres</li>\r\n }\r\n @if (expiredForm.get('claveNueva')?.errors?.['minuscula']) {\r\n <li>Al menos 1 letra min\u00FAscula</li>\r\n }\r\n @if (expiredForm.get('claveNueva')?.errors?.['mayuscula']) {\r\n <li>Al menos 1 letra may\u00FAscula</li>\r\n }\r\n @if (expiredForm.get('claveNueva')?.errors?.['numero']) {\r\n <li>Al menos 1 n\u00FAmero</li>\r\n }\r\n @if (expiredForm.get('claveNueva')?.errors?.['especial']) {\r\n <li>Al menos 1 car\u00E1cter especial</li>\r\n }\r\n </ul>\r\n }\r\n\r\n <div class=\"auth-field\"\r\n [class.has-error]=\"expiredForm.get('claveNuevaConfirmar')?.errors?.['coinciden'] && expiredForm.get('claveNuevaConfirmar')?.touched\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-check-circle\"></i></span>\r\n <input [type]=\"passwordVisibility().claveNuevaConfirmar ? 'text' : 'password'\"\r\n class=\"auth-input\" placeholder=\" \" maxlength=\"20\"\r\n formControlName=\"claveNuevaConfirmar\" id=\"exp-confirm-pw\" autocomplete=\"new-password\">\r\n <label for=\"exp-confirm-pw\" class=\"auth-label\">Confirmar contrase\u00F1a</label>\r\n <button type=\"button\" class=\"auth-toggle-pw\" (click)=\"togglePassword('claveNuevaConfirmar')\">\r\n <i [class]=\"passwordVisibility().claveNuevaConfirmar ? 'fas fa-eye' : 'fas fa-eye-slash'\"></i>\r\n </button>\r\n </div>\r\n @if (expiredForm.get('claveNuevaConfirmar')?.errors?.['coinciden'] && expiredForm.get('claveNuevaConfirmar')?.touched) {\r\n <p class=\"auth-error\" @fadeInOut>Las contrase\u00F1as deben coincidir</p>\r\n }\r\n\r\n <button type=\"button\" class=\"auth-btn\" [class.auth-btn--red]=\"!produccion\"\r\n [disabled]=\"expiredForm.invalid\" (click)=\"recover()\">\r\n Renovar contrase\u00F1a\r\n </button>\r\n\r\n <button type=\"button\" class=\"auth-btn auth-btn--outline\" (click)=\"back()\">\r\n Volver al inicio de sesi\u00F3n\r\n </button>\r\n\r\n </form>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";.red_contrasena,.blue_contrasena{position:relative;display:inline-block;font-size:13px;text-decoration:none;padding-bottom:2px;transition:color .3s ease;cursor:pointer}.red_contrasena:after,.blue_contrasena:after{content:\"\";position:absolute;bottom:0;left:50%;width:0;height:1px;background-color:currentColor;transition:all .3s ease;transform:translate(-50%)}.red_contrasena:hover:after,.blue_contrasena:hover:after{width:60%}.red_contrasena{color:#d1326f}.red_contrasena:hover{color:#a82859}.blue_contrasena{color:#398bf7}.blue_contrasena:hover{color:#1e5fc4}.auth-wrapper-login{position:fixed;inset:0;display:grid;grid-template-columns:1.15fr .85fr;overflow:hidden;background:#060d1f}.auth-panel-left{position:relative;overflow:hidden;background:linear-gradient(145deg,#040a18,#0b1a3d 55%,#040e22);display:flex;align-items:center;justify-content:center;padding:48px 40px}.auth-panel-left:before{content:\"\";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.055) 1px,transparent 1px);background-size:26px 26px;z-index:1;pointer-events:none}.auth-panel-left:after{content:\"\";position:absolute;top:0;left:-120%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(57,139,247,.04),transparent);animation:panelSweep 7s ease-in-out infinite;z-index:1;pointer-events:none}.auth-blob{position:absolute;border-radius:50%;filter:blur(72px);z-index:0;pointer-events:none}.auth-blob-1{width:340px;height:340px;background:radial-gradient(circle,rgba(57,139,247,.45) 0%,transparent 70%);top:-90px;right:-70px;animation:blobDrift 11s ease-in-out infinite}.auth-blob-2{width:240px;height:240px;background:radial-gradient(circle,rgba(124,58,237,.4) 0%,transparent 70%);bottom:60px;left:-50px;animation:blobDrift 14s ease-in-out infinite reverse}.auth-blob-3{width:180px;height:180px;background:radial-gradient(circle,rgba(14,165,233,.35) 0%,transparent 70%);bottom:-50px;right:40px;animation:blobDrift 9s ease-in-out infinite;animation-delay:-4s}.auth-blob-4{width:120px;height:120px;background:radial-gradient(circle,rgba(209,50,111,.25) 0%,transparent 70%);top:50%;left:50%;transform:translate(-50%,-50%);animation:blobDrift 16s ease-in-out infinite;animation-delay:-8s}@keyframes blobDrift{0%,to{transform:translate(0) scale(1)}33%{transform:translate(14px,-20px) scale(1.05)}66%{transform:translate(-10px,12px) scale(.96)}}@keyframes panelSweep{0%{left:-120%}50%{left:160%}to{left:160%}}.auth-brand-panel{position:relative;z-index:2;text-align:center;color:#fff;max-width:340px}.auth-brand-logo{width:100px;height:100px;border-radius:50%;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;margin:0 auto 28px;box-shadow:0 0 0 14px #398bf70f,0 0 50px #398bf733;backdrop-filter:blur(8px)}.auth-brand-logo img{width:64px;height:64px;object-fit:contain;filter:brightness(1.05) drop-shadow(0 0 8px rgba(57,139,247,.4))}.auth-brand-title{font-size:30px;font-weight:700;letter-spacing:-.5px;margin-bottom:10px;background:linear-gradient(135deg,#fff 20%,#93c5fd 80%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.auth-brand-subtitle{font-size:14px;color:#ffffff73;line-height:1.65;margin-bottom:40px;letter-spacing:.2px}.auth-brand-features{display:flex;flex-direction:column;gap:14px;text-align:left}.auth-brand-feature{display:flex;align-items:center;gap:12px;font-size:13px;color:#fff9}.auth-brand-feature .feat-dot{flex-shrink:0;width:7px;height:7px;border-radius:50%;background:#398bf7;box-shadow:0 0 10px #398bf7b3}.auth-brand-divider{width:60px;height:2px;background:linear-gradient(90deg,transparent,#398bf7,transparent);margin:28px auto 32px;border-radius:2px}.auth-panel-left--dev{background:linear-gradient(145deg,#18040b,#3d0b1d 55%,#220409)}.auth-panel-left--dev:after{background:linear-gradient(90deg,transparent,rgba(209,50,111,.05),transparent)}.auth-panel-left--dev .auth-blob-1{background:radial-gradient(circle,rgba(220,38,38,.52) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-2{background:radial-gradient(circle,rgba(219,39,119,.44) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-3{background:radial-gradient(circle,rgba(239,68,68,.38) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-4{background:radial-gradient(circle,rgba(249,115,22,.28) 0%,transparent 70%)}.auth-panel-left--dev .auth-brand-logo{box-shadow:0 0 0 14px #d1326f12,0 0 50px #d1326f38}.auth-panel-left--dev .auth-brand-logo img{filter:brightness(1.05) drop-shadow(0 0 8px rgba(209,50,111,.45))}.auth-panel-left--dev .auth-brand-title{background:linear-gradient(135deg,#fff 20%,#fca5a5 80%);-webkit-background-clip:text;background-clip:text}.auth-panel-left--dev .auth-brand-divider{background:linear-gradient(90deg,transparent,rgb(209,50,111),transparent)}.auth-panel-left--dev .feat-dot{background:#d1326f;box-shadow:0 0 10px #d1326fb8}.auth-panel-right{position:relative;overflow:hidden;background:var(--background-login)}.auth-panel-right:before{content:\"\";position:absolute;inset:0;background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(57,139,247,.045) 22px,rgba(57,139,247,.045) 23px);animation:authLinesMove 10s linear infinite;pointer-events:none;z-index:0}.auth-panel-right:after{content:\"\";position:absolute;top:0;bottom:0;left:-25%;width:25%;background:linear-gradient(90deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLine 7s ease-in-out infinite;animation-delay:3.5s;pointer-events:none;z-index:0}@keyframes authLinesMove{0%{transform:translate(0)}to{transform:translate(46px,46px)}}@keyframes authScanLine{0%{left:-25%}50%{left:120%}to{left:120%}}.auth-panel-bg{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}.auth-deco{position:absolute;border-radius:50%;pointer-events:none;filter:blur(70px)}.auth-deco-tl{width:300px;height:300px;top:0;left:-120px;transform:translateY(-40%);background:radial-gradient(circle,rgba(57,139,247,.12) 0%,transparent 70%);animation:authOrbPulse 6s ease-in-out infinite}.auth-deco-br{width:340px;height:340px;bottom:0;right:-120px;transform:translateY(40%);background:radial-gradient(circle,rgba(124,58,237,.1) 0%,transparent 70%);animation:authOrbPulse 8s ease-in-out infinite;animation-delay:-4s}@keyframes authOrbPulse{0%,to{opacity:.7}50%{opacity:1}}.auth-form-wrapper{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;align-items:center;z-index:1}.auth-form-wrapper>div{width:100%;max-width:420px;margin:auto;padding:36px 16px;box-sizing:border-box}.auth-panel-right--dev:before{background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(209,50,111,.05) 22px,rgba(209,50,111,.05) 23px)}.auth-panel-right--dev:after{background:linear-gradient(90deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}.auth-panel-right--dev .auth-deco-tl{background:radial-gradient(circle,rgba(209,50,111,.12) 0%,transparent 70%)}.auth-panel-right--dev .auth-deco-br{background:radial-gradient(circle,rgba(239,68,68,.1) 0%,transparent 70%)}.auth-test-badge{display:inline-flex;align-items:center;gap:7px;background:#d1326f14;border:1px solid rgba(209,50,111,.25);color:#d1326f;font-size:10.5px;font-weight:700;padding:5px 12px;border-radius:20px;margin-bottom:18px;letter-spacing:.8px}.auth-test-badge .badge-dot{width:6px;height:6px;border-radius:50%;background:#d1326f;animation:badgePulse 1.6s ease-in-out infinite;flex-shrink:0}@keyframes badgePulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.75)}}.auth-card{background:var(--background-card);border-radius:20px;padding:36px 32px 28px;box-shadow:0 4px 28px #00000014;border:1px solid var(--border-color-modal)}.auth-card-title{font-size:22px;font-weight:700;color:var(--text-color);margin-bottom:4px;letter-spacing:-.3px}.auth-card-subtitle{font-size:13px;color:var(--placeholder-color);margin-bottom:26px}.auth-field{position:relative;margin-bottom:1rem}.auth-field .auth-field-icon{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--placeholder-color);font-size:13px;z-index:2;pointer-events:none;transition:color .2s}.auth-field .auth-input{width:100%;padding:15px 40px 15px 37px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s,background .2s}.auth-field .auth-input::placeholder{color:transparent}.auth-field .auth-input:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721;background:var(--background-focus-input)}.auth-field .auth-input:focus~.auth-label{top:0;font-size:11px!important;color:#398bf7!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-input:focus~.auth-field-icon{color:#398bf7}.auth-field .auth-input:not(:placeholder-shown)~.auth-label{top:0;font-size:11px!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-label{position:absolute;left:35px;top:50%;transform:translateY(-50%);color:var(--placeholder-color)!important;font-size:13px!important;font-weight:400!important;pointer-events:none;transition:top .15s ease,font-size .15s ease,color .15s ease,padding .15s ease,background .15s ease;background:transparent;z-index:1;text-align:left!important}.auth-field .auth-toggle-pw{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--placeholder-color);cursor:pointer;padding:4px 6px;font-size:13px;z-index:2;line-height:1;transition:color .2s}.auth-field .auth-toggle-pw:hover{color:#398bf7}.auth-field.has-error .auth-input{border-color:#dc3545;box-shadow:none}.auth-field.has-error .auth-field-icon{color:#dc3545}.auth-select{width:100%;padding:13px 14px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s;margin-bottom:1rem;cursor:pointer}.auth-select:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721}.auth-btn{width:100%;padding:13px;border:none;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;transition:transform .15s ease,box-shadow .2s ease,opacity .2s;background:linear-gradient(135deg,#398bf7,#1e5fc4);color:#fff;letter-spacing:.3px;margin-bottom:10px;display:block}.auth-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 5px 18px #398bf761}.auth-btn:active:not(:disabled){transform:translateY(0)}.auth-btn:disabled{opacity:.55;cursor:not-allowed}.auth-btn.auth-btn--red{background:linear-gradient(135deg,#d1326f,#a82859)}.auth-btn.auth-btn--red:hover:not(:disabled){box-shadow:0 5px 18px #d1326f61}.auth-btn.auth-btn--outline{background:transparent;border:1.5px solid var(--font-border-input);color:var(--text-color)}.auth-btn.auth-btn--outline:hover:not(:disabled){background:var(--background-btn-light-hover);box-shadow:none;transform:none}.auth-links{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:16px;padding-top:16px;border-top:1px solid var(--border-color-modal)}.auth-version{text-align:right;margin-top:14px;padding-top:12px;border-top:1px solid var(--border-color-modal)}.auth-version span{font-size:11px;color:var(--placeholder-color)}.auth-error{font-size:11.5px;color:#dc3545;margin:-6px 0 10px 2px;padding:0}.auth-hint{display:flex;align-items:flex-start;gap:6px;font-size:11.5px;color:var(--placeholder-color);margin:-6px 0 14px 2px;padding:0;line-height:1.35}.auth-hint i{margin-top:2px;flex-shrink:0}.auth-validation-list{margin:-4px 0 12px;padding:0;list-style:none}.auth-validation-list li{font-size:11.5px;color:#dc3545;padding:2px 0}.auth-validation-list li:before{content:\"\\2715 \";font-size:10px}.auth-desc{font-size:13px;color:var(--placeholder-color);margin-bottom:20px;line-height:1.65}.auth-section-title{font-size:15px;font-weight:600;color:var(--text-color);margin-bottom:20px}.font-12{font-size:12px}.form-control:focus{border-color:#0199ff9a!important;box-shadow:0 0 5px .2px #65befa44!important}@media(max-width:900px){.auth-wrapper-login{grid-template-columns:1fr;grid-template-rows:auto 1fr;overflow-y:auto;overflow-x:hidden}.auth-panel-left{padding:14px 24px;justify-content:center}.auth-panel-left .auth-brand-subtitle,.auth-panel-left .auth-brand-features,.auth-panel-left .auth-brand-divider{display:none!important}.auth-panel-left .auth-brand-panel{display:flex!important;flex-direction:row!important;align-items:center;gap:0;text-align:left;max-width:none;width:100%;justify-content:center}.auth-panel-left .auth-brand-logo{width:52px;height:52px;margin:0;flex-shrink:0}.auth-panel-left .auth-brand-logo img{width:34px;height:34px}.auth-panel-left .auth-brand-title{font-size:20px;margin-bottom:0;margin-left:.5rem;flex-shrink:1}.auth-panel-right:after{inset:-25% 0 auto;width:100%;height:25%;background:linear-gradient(180deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLineV 7s ease-in-out infinite;animation-delay:3.5s}.auth-panel-right--dev:after{background:linear-gradient(180deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}}@keyframes authScanLineV{0%{top:-25%}50%{top:120%}to{top:120%}}@media(max-width:480px){.auth-panel-left{padding:12px 16px}.auth-panel-left .auth-brand-logo{width:44px;height:44px}.auth-panel-left .auth-brand-logo img{width:28px;height:28px}.auth-panel-left .auth-brand-title{font-size:17px}.auth-form-wrapper>div{padding:20px 12px}.auth-card{padding:24px 18px 20px;border-radius:16px}.font-12{font-size:10px!important}}\n"] }]
|
|
147
252
|
}] });
|
|
148
253
|
|
|
149
254
|
class RecoverPasswordComponent {
|
|
@@ -168,12 +273,12 @@ class RecoverPasswordComponent {
|
|
|
168
273
|
this.loginEvent.emit({ type: "RECOVER", data: sender });
|
|
169
274
|
};
|
|
170
275
|
back = () => this.loginEvent.emit({ type: "BACK" });
|
|
171
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
172
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: RecoverPasswordComponent, isStandalone: true, selector: "lib-recover-password", inputs: { production: { classPropertyName: "production", publicName: "production", isSignal: true, isRequired: false, transformFunction: null }, module: { classPropertyName: "module", publicName: "module", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { loginEvent: "loginEvent" }, ngImport: i0, template: "<div class=\"auth-wrapper-login\">\r\n @let produccion = production();\r\n <div class=\"auth-panel-left\" [class.auth-panel-left--dev]=\"!produccion\">\r\n <span class=\"auth-blob auth-blob-1\"></span>\r\n <span class=\"auth-blob auth-blob-2\"></span>\r\n <span class=\"auth-blob auth-blob-3\"></span>\r\n <span class=\"auth-blob auth-blob-4\"></span>\r\n\r\n <div class=\"auth-brand-panel\">\r\n <div class=\"auth-brand-logo\">\r\n <img src=\"assets/images/logo-tsi-tres.png\" alt=\"TSI\" />\r\n </div>\r\n <h1 class=\"auth-brand-title\">{{module()}}</h1>\r\n <p class=\"auth-brand-subtitle\">Recupera el acceso a tu cuenta de forma r\u00E1pida y segura</p>\r\n\r\n <div class=\"auth-brand-divider\"></div>\r\n\r\n <div class=\"auth-brand-features\">\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Verificaci\u00F3n por correo electr\u00F3nico\r\n </div>\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Proceso seguro y encriptado\r\n </div>\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Nueva clave en minutos\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"auth-panel-right\" [class.auth-panel-right--dev]=\"!produccion\">\r\n <div class=\"auth-panel-bg\">\r\n <span class=\"auth-deco auth-deco-tl\"></span>\r\n <span class=\"auth-deco auth-deco-br\"></span>\r\n </div>\r\n\r\n <div class=\"auth-form-wrapper\">\r\n <div>\r\n @if (!produccion) {\r\n <div>\r\n <span class=\"auth-test-badge\">\r\n <span class=\"badge-dot\"></span> ENTORNO DE PRUEBAS\r\n </span>\r\n </div>\r\n }\r\n\r\n <div class=\"auth-card\">\r\n <h2 class=\"auth-card-title\">Recuperar contrase\u00F1a</h2>\r\n <p class=\"auth-card-subtitle\">\r\n Conf\u00EDrmanos tu RUC y usuario. Enviaremos a tu correo registrado la nueva contrase\u00F1a.\r\n </p>\r\n\r\n <form [formGroup]=\"recoverForm\">\r\n\r\n <div class=\"auth-field\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-building\"></i></span>\r\n <input type=\"text\" class=\"auth-input\" placeholder=\" \" maxlength=\"11\" formControlName=\"ruc\"\r\n id=\"rec-ruc\" onlyNumber autocomplete=\"off\">\r\n <label for=\"rec-ruc\" class=\"auth-label\">RUC</label>\r\n </div>\r\n\r\n <div class=\"auth-field\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-user\"></i></span>\r\n <input type=\"text\" class=\"auth-input\" placeholder=\" \" formControlName=\"usuario\"\r\n id=\"rec-user\" autocomplete=\"off\">\r\n <label for=\"rec-user\" class=\"auth-label\">Usuario</label>\r\n </div>\r\n\r\n <button type=\"button\" class=\"auth-btn\" [class.auth-btn--red]=\"!produccion\"\r\n [disabled]=\"recoverForm.invalid\" (click)=\"enviar()\">\r\n Enviar instrucciones\r\n </button>\r\n\r\n <button type=\"button\" class=\"auth-btn auth-btn--outline\" (click)=\"back()\">\r\n Volver al inicio de sesi\u00F3n\r\n </button>\r\n\r\n </form>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["", "@charset \"UTF-8\";.red_contrasena,.blue_contrasena{position:relative;display:inline-block;font-size:13px;text-decoration:none;padding-bottom:2px;transition:color .3s ease;cursor:pointer}.red_contrasena:after,.blue_contrasena:after{content:\"\";position:absolute;bottom:0;left:50%;width:0;height:1px;background-color:currentColor;transition:all .3s ease;transform:translate(-50%)}.red_contrasena:hover:after,.blue_contrasena:hover:after{width:60%}.red_contrasena{color:#d1326f}.red_contrasena:hover{color:#a82859}.blue_contrasena{color:#398bf7}.blue_contrasena:hover{color:#1e5fc4}.auth-wrapper-login{position:fixed;inset:0;display:grid;grid-template-columns:1.15fr .85fr;overflow:hidden;background:#060d1f}.auth-panel-left{position:relative;overflow:hidden;background:linear-gradient(145deg,#040a18,#0b1a3d 55%,#040e22);display:flex;align-items:center;justify-content:center;padding:48px 40px}.auth-panel-left:before{content:\"\";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.055) 1px,transparent 1px);background-size:26px 26px;z-index:1;pointer-events:none}.auth-panel-left:after{content:\"\";position:absolute;top:0;left:-120%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(57,139,247,.04),transparent);animation:panelSweep 7s ease-in-out infinite;z-index:1;pointer-events:none}.auth-blob{position:absolute;border-radius:50%;filter:blur(72px);z-index:0;pointer-events:none}.auth-blob-1{width:340px;height:340px;background:radial-gradient(circle,rgba(57,139,247,.45) 0%,transparent 70%);top:-90px;right:-70px;animation:blobDrift 11s ease-in-out infinite}.auth-blob-2{width:240px;height:240px;background:radial-gradient(circle,rgba(124,58,237,.4) 0%,transparent 70%);bottom:60px;left:-50px;animation:blobDrift 14s ease-in-out infinite reverse}.auth-blob-3{width:180px;height:180px;background:radial-gradient(circle,rgba(14,165,233,.35) 0%,transparent 70%);bottom:-50px;right:40px;animation:blobDrift 9s ease-in-out infinite;animation-delay:-4s}.auth-blob-4{width:120px;height:120px;background:radial-gradient(circle,rgba(209,50,111,.25) 0%,transparent 70%);top:50%;left:50%;transform:translate(-50%,-50%);animation:blobDrift 16s ease-in-out infinite;animation-delay:-8s}@keyframes blobDrift{0%,to{transform:translate(0) scale(1)}33%{transform:translate(14px,-20px) scale(1.05)}66%{transform:translate(-10px,12px) scale(.96)}}@keyframes panelSweep{0%{left:-120%}50%{left:160%}to{left:160%}}.auth-brand-panel{position:relative;z-index:2;text-align:center;color:#fff;max-width:340px}.auth-brand-logo{width:100px;height:100px;border-radius:50%;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;margin:0 auto 28px;box-shadow:0 0 0 14px #398bf70f,0 0 50px #398bf733;backdrop-filter:blur(8px)}.auth-brand-logo img{width:64px;height:64px;object-fit:contain;filter:brightness(1.05) drop-shadow(0 0 8px rgba(57,139,247,.4))}.auth-brand-title{font-size:30px;font-weight:700;letter-spacing:-.5px;margin-bottom:10px;background:linear-gradient(135deg,#fff 20%,#93c5fd 80%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.auth-brand-subtitle{font-size:14px;color:#ffffff73;line-height:1.65;margin-bottom:40px;letter-spacing:.2px}.auth-brand-features{display:flex;flex-direction:column;gap:14px;text-align:left}.auth-brand-feature{display:flex;align-items:center;gap:12px;font-size:13px;color:#fff9}.auth-brand-feature .feat-dot{flex-shrink:0;width:7px;height:7px;border-radius:50%;background:#398bf7;box-shadow:0 0 10px #398bf7b3}.auth-brand-divider{width:60px;height:2px;background:linear-gradient(90deg,transparent,#398bf7,transparent);margin:28px auto 32px;border-radius:2px}.auth-panel-left--dev{background:linear-gradient(145deg,#18040b,#3d0b1d 55%,#220409)}.auth-panel-left--dev:after{background:linear-gradient(90deg,transparent,rgba(209,50,111,.05),transparent)}.auth-panel-left--dev .auth-blob-1{background:radial-gradient(circle,rgba(220,38,38,.52) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-2{background:radial-gradient(circle,rgba(219,39,119,.44) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-3{background:radial-gradient(circle,rgba(239,68,68,.38) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-4{background:radial-gradient(circle,rgba(249,115,22,.28) 0%,transparent 70%)}.auth-panel-left--dev .auth-brand-logo{box-shadow:0 0 0 14px #d1326f12,0 0 50px #d1326f38}.auth-panel-left--dev .auth-brand-logo img{filter:brightness(1.05) drop-shadow(0 0 8px rgba(209,50,111,.45))}.auth-panel-left--dev .auth-brand-title{background:linear-gradient(135deg,#fff 20%,#fca5a5 80%);-webkit-background-clip:text;background-clip:text}.auth-panel-left--dev .auth-brand-divider{background:linear-gradient(90deg,transparent,rgb(209,50,111),transparent)}.auth-panel-left--dev .feat-dot{background:#d1326f;box-shadow:0 0 10px #d1326fb8}.auth-panel-right{position:relative;overflow:hidden;background:var(--background-login)}.auth-panel-right:before{content:\"\";position:absolute;inset:0;background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(57,139,247,.045) 22px,rgba(57,139,247,.045) 23px);animation:authLinesMove 10s linear infinite;pointer-events:none;z-index:0}.auth-panel-right:after{content:\"\";position:absolute;top:0;bottom:0;left:-25%;width:25%;background:linear-gradient(90deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLine 7s ease-in-out infinite;animation-delay:3.5s;pointer-events:none;z-index:0}@keyframes authLinesMove{0%{transform:translate(0)}to{transform:translate(46px,46px)}}@keyframes authScanLine{0%{left:-25%}50%{left:120%}to{left:120%}}.auth-panel-bg{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}.auth-deco{position:absolute;border-radius:50%;pointer-events:none;filter:blur(70px)}.auth-deco-tl{width:300px;height:300px;top:0;left:-120px;transform:translateY(-40%);background:radial-gradient(circle,rgba(57,139,247,.12) 0%,transparent 70%);animation:authOrbPulse 6s ease-in-out infinite}.auth-deco-br{width:340px;height:340px;bottom:0;right:-120px;transform:translateY(40%);background:radial-gradient(circle,rgba(124,58,237,.1) 0%,transparent 70%);animation:authOrbPulse 8s ease-in-out infinite;animation-delay:-4s}@keyframes authOrbPulse{0%,to{opacity:.7}50%{opacity:1}}.auth-form-wrapper{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;align-items:center;z-index:1}.auth-form-wrapper>div{width:100%;max-width:420px;margin:auto;padding:36px 16px;box-sizing:border-box}.auth-panel-right--dev:before{background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(209,50,111,.05) 22px,rgba(209,50,111,.05) 23px)}.auth-panel-right--dev:after{background:linear-gradient(90deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}.auth-panel-right--dev .auth-deco-tl{background:radial-gradient(circle,rgba(209,50,111,.12) 0%,transparent 70%)}.auth-panel-right--dev .auth-deco-br{background:radial-gradient(circle,rgba(239,68,68,.1) 0%,transparent 70%)}.auth-test-badge{display:inline-flex;align-items:center;gap:7px;background:#d1326f14;border:1px solid rgba(209,50,111,.25);color:#d1326f;font-size:10.5px;font-weight:700;padding:5px 12px;border-radius:20px;margin-bottom:18px;letter-spacing:.8px}.auth-test-badge .badge-dot{width:6px;height:6px;border-radius:50%;background:#d1326f;animation:badgePulse 1.6s ease-in-out infinite;flex-shrink:0}@keyframes badgePulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.75)}}.auth-card{background:var(--background-card);border-radius:20px;padding:36px 32px 28px;box-shadow:0 4px 28px #00000014;border:1px solid var(--border-color-modal)}.auth-card-title{font-size:22px;font-weight:700;color:var(--text-color);margin-bottom:4px;letter-spacing:-.3px}.auth-card-subtitle{font-size:13px;color:var(--placeholder-color);margin-bottom:26px}.auth-field{position:relative;margin-bottom:1rem}.auth-field .auth-field-icon{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--placeholder-color);font-size:13px;z-index:2;pointer-events:none;transition:color .2s}.auth-field .auth-input{width:100%;padding:15px 40px 15px 37px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s,background .2s}.auth-field .auth-input::placeholder{color:transparent}.auth-field .auth-input:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721;background:var(--background-focus-input)}.auth-field .auth-input:focus~.auth-label{top:0;font-size:11px!important;color:#398bf7!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-input:focus~.auth-field-icon{color:#398bf7}.auth-field .auth-input:not(:placeholder-shown)~.auth-label{top:0;font-size:11px!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-label{position:absolute;left:35px;top:50%;transform:translateY(-50%);color:var(--placeholder-color)!important;font-size:13px!important;font-weight:400!important;pointer-events:none;transition:top .15s ease,font-size .15s ease,color .15s ease,padding .15s ease,background .15s ease;background:transparent;z-index:1;text-align:left!important}.auth-field .auth-toggle-pw{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--placeholder-color);cursor:pointer;padding:4px 6px;font-size:13px;z-index:2;line-height:1;transition:color .2s}.auth-field .auth-toggle-pw:hover{color:#398bf7}.auth-field.has-error .auth-input{border-color:#dc3545;box-shadow:none}.auth-field.has-error .auth-field-icon{color:#dc3545}.auth-select{width:100%;padding:13px 14px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s;margin-bottom:1rem;cursor:pointer}.auth-select:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721}.auth-btn{width:100%;padding:13px;border:none;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;transition:transform .15s ease,box-shadow .2s ease,opacity .2s;background:linear-gradient(135deg,#398bf7,#1e5fc4);color:#fff;letter-spacing:.3px;margin-bottom:10px;display:block}.auth-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 5px 18px #398bf761}.auth-btn:active:not(:disabled){transform:translateY(0)}.auth-btn:disabled{opacity:.55;cursor:not-allowed}.auth-btn.auth-btn--red{background:linear-gradient(135deg,#d1326f,#a82859)}.auth-btn.auth-btn--red:hover:not(:disabled){box-shadow:0 5px 18px #d1326f61}.auth-btn.auth-btn--outline{background:transparent;border:1.5px solid var(--font-border-input);color:var(--text-color)}.auth-btn.auth-btn--outline:hover:not(:disabled){background:var(--background-btn-light-hover);box-shadow:none;transform:none}.auth-links{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:16px;padding-top:16px;border-top:1px solid var(--border-color-modal)}.auth-version{text-align:right;margin-top:14px;padding-top:12px;border-top:1px solid var(--border-color-modal)}.auth-version span{font-size:11px;color:var(--placeholder-color)}.auth-error{font-size:11.5px;color:#dc3545;margin:-6px 0 10px 2px;padding:0}.auth-validation-list{margin:-4px 0 12px;padding:0;list-style:none}.auth-validation-list li{font-size:11.5px;color:#dc3545;padding:2px 0}.auth-validation-list li:before{content:\"\\2715 \";font-size:10px}.auth-desc{font-size:13px;color:var(--placeholder-color);margin-bottom:20px;line-height:1.65}.auth-section-title{font-size:15px;font-weight:600;color:var(--text-color);margin-bottom:20px}.font-12{font-size:12px}.form-control:focus{border-color:#0199ff9a!important;box-shadow:0 0 5px .2px #65befa44!important}@media (max-width: 900px){.auth-wrapper-login{grid-template-columns:1fr;grid-template-rows:auto 1fr;overflow-y:auto;overflow-x:hidden}.auth-panel-left{padding:14px 24px;justify-content:center}.auth-panel-left .auth-brand-subtitle,.auth-panel-left .auth-brand-features,.auth-panel-left .auth-brand-divider{display:none!important}.auth-panel-left .auth-brand-panel{display:flex!important;flex-direction:row!important;align-items:center;gap:0;text-align:left;max-width:none;width:100%;justify-content:center}.auth-panel-left .auth-brand-logo{width:52px;height:52px;margin:0;flex-shrink:0}.auth-panel-left .auth-brand-logo img{width:34px;height:34px}.auth-panel-left .auth-brand-title{font-size:20px;margin-bottom:0;margin-left:.5rem;flex-shrink:1}.auth-panel-right:after{inset:-25% 0 auto;width:100%;height:25%;background:linear-gradient(180deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLineV 7s ease-in-out infinite;animation-delay:3.5s}.auth-panel-right--dev:after{background:linear-gradient(180deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}}@keyframes authScanLineV{0%{top:-25%}50%{top:120%}to{top:120%}}@media (max-width: 480px){.auth-panel-left{padding:12px 16px}.auth-panel-left .auth-brand-logo{width:44px;height:44px}.auth-panel-left .auth-brand-logo img{width:28px;height:28px}.auth-panel-left .auth-brand-title{font-size:17px}.auth-form-wrapper>div{padding:20px 12px}.auth-card{padding:24px 18px 20px;border-radius:16px}.font-12{font-size:10px!important}}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], animations: [fadeInOut] });
|
|
276
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: RecoverPasswordComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
277
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: RecoverPasswordComponent, isStandalone: true, selector: "lib-recover-password", inputs: { production: { classPropertyName: "production", publicName: "production", isSignal: true, isRequired: false, transformFunction: null }, module: { classPropertyName: "module", publicName: "module", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { loginEvent: "loginEvent" }, ngImport: i0, template: "<div class=\"auth-wrapper-login\">\r\n @let produccion = production();\r\n <div class=\"auth-panel-left\" [class.auth-panel-left--dev]=\"!produccion\">\r\n <span class=\"auth-blob auth-blob-1\"></span>\r\n <span class=\"auth-blob auth-blob-2\"></span>\r\n <span class=\"auth-blob auth-blob-3\"></span>\r\n <span class=\"auth-blob auth-blob-4\"></span>\r\n\r\n <div class=\"auth-brand-panel\">\r\n <div class=\"auth-brand-logo\">\r\n <img src=\"assets/images/logo-tsi-tres.png\" alt=\"TSI\" />\r\n </div>\r\n <h1 class=\"auth-brand-title\">{{module()}}</h1>\r\n <p class=\"auth-brand-subtitle\">Recupera el acceso a tu cuenta de forma r\u00E1pida y segura</p>\r\n\r\n <div class=\"auth-brand-divider\"></div>\r\n\r\n <div class=\"auth-brand-features\">\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Verificaci\u00F3n por correo electr\u00F3nico\r\n </div>\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Proceso seguro y encriptado\r\n </div>\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Nueva clave en minutos\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"auth-panel-right\" [class.auth-panel-right--dev]=\"!produccion\">\r\n <div class=\"auth-panel-bg\">\r\n <span class=\"auth-deco auth-deco-tl\"></span>\r\n <span class=\"auth-deco auth-deco-br\"></span>\r\n </div>\r\n\r\n <div class=\"auth-form-wrapper\">\r\n <div>\r\n @if (!produccion) {\r\n <div>\r\n <span class=\"auth-test-badge\">\r\n <span class=\"badge-dot\"></span> ENTORNO DE PRUEBAS\r\n </span>\r\n </div>\r\n }\r\n\r\n <div class=\"auth-card\">\r\n <h2 class=\"auth-card-title\">Recuperar contrase\u00F1a</h2>\r\n <p class=\"auth-card-subtitle\">\r\n Conf\u00EDrmanos tu RUC y usuario. Enviaremos a tu correo registrado la nueva contrase\u00F1a.\r\n </p>\r\n\r\n <form [formGroup]=\"recoverForm\">\r\n\r\n <div class=\"auth-field\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-building\"></i></span>\r\n <input type=\"text\" class=\"auth-input\" placeholder=\" \" maxlength=\"11\" formControlName=\"ruc\"\r\n id=\"rec-ruc\" onlyNumber autocomplete=\"off\">\r\n <label for=\"rec-ruc\" class=\"auth-label\">RUC</label>\r\n </div>\r\n\r\n <div class=\"auth-field\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-user\"></i></span>\r\n <input type=\"text\" class=\"auth-input\" placeholder=\" \" formControlName=\"usuario\"\r\n id=\"rec-user\" autocomplete=\"off\">\r\n <label for=\"rec-user\" class=\"auth-label\">Usuario</label>\r\n </div>\r\n\r\n <button type=\"button\" class=\"auth-btn\" [class.auth-btn--red]=\"!produccion\"\r\n [disabled]=\"recoverForm.invalid\" (click)=\"enviar()\">\r\n Enviar instrucciones\r\n </button>\r\n\r\n <button type=\"button\" class=\"auth-btn auth-btn--outline\" (click)=\"back()\">\r\n Volver al inicio de sesi\u00F3n\r\n </button>\r\n\r\n </form>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["", "@charset \"UTF-8\";.red_contrasena,.blue_contrasena{position:relative;display:inline-block;font-size:13px;text-decoration:none;padding-bottom:2px;transition:color .3s ease;cursor:pointer}.red_contrasena:after,.blue_contrasena:after{content:\"\";position:absolute;bottom:0;left:50%;width:0;height:1px;background-color:currentColor;transition:all .3s ease;transform:translate(-50%)}.red_contrasena:hover:after,.blue_contrasena:hover:after{width:60%}.red_contrasena{color:#d1326f}.red_contrasena:hover{color:#a82859}.blue_contrasena{color:#398bf7}.blue_contrasena:hover{color:#1e5fc4}.auth-wrapper-login{position:fixed;inset:0;display:grid;grid-template-columns:1.15fr .85fr;overflow:hidden;background:#060d1f}.auth-panel-left{position:relative;overflow:hidden;background:linear-gradient(145deg,#040a18,#0b1a3d 55%,#040e22);display:flex;align-items:center;justify-content:center;padding:48px 40px}.auth-panel-left:before{content:\"\";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.055) 1px,transparent 1px);background-size:26px 26px;z-index:1;pointer-events:none}.auth-panel-left:after{content:\"\";position:absolute;top:0;left:-120%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(57,139,247,.04),transparent);animation:panelSweep 7s ease-in-out infinite;z-index:1;pointer-events:none}.auth-blob{position:absolute;border-radius:50%;filter:blur(72px);z-index:0;pointer-events:none}.auth-blob-1{width:340px;height:340px;background:radial-gradient(circle,rgba(57,139,247,.45) 0%,transparent 70%);top:-90px;right:-70px;animation:blobDrift 11s ease-in-out infinite}.auth-blob-2{width:240px;height:240px;background:radial-gradient(circle,rgba(124,58,237,.4) 0%,transparent 70%);bottom:60px;left:-50px;animation:blobDrift 14s ease-in-out infinite reverse}.auth-blob-3{width:180px;height:180px;background:radial-gradient(circle,rgba(14,165,233,.35) 0%,transparent 70%);bottom:-50px;right:40px;animation:blobDrift 9s ease-in-out infinite;animation-delay:-4s}.auth-blob-4{width:120px;height:120px;background:radial-gradient(circle,rgba(209,50,111,.25) 0%,transparent 70%);top:50%;left:50%;transform:translate(-50%,-50%);animation:blobDrift 16s ease-in-out infinite;animation-delay:-8s}@keyframes blobDrift{0%,to{transform:translate(0) scale(1)}33%{transform:translate(14px,-20px) scale(1.05)}66%{transform:translate(-10px,12px) scale(.96)}}@keyframes panelSweep{0%{left:-120%}50%{left:160%}to{left:160%}}.auth-brand-panel{position:relative;z-index:2;text-align:center;color:#fff;max-width:340px}.auth-brand-logo{width:100px;height:100px;border-radius:50%;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;margin:0 auto 28px;box-shadow:0 0 0 14px #398bf70f,0 0 50px #398bf733;backdrop-filter:blur(8px)}.auth-brand-logo img{width:64px;height:64px;object-fit:contain;filter:brightness(1.05) drop-shadow(0 0 8px rgba(57,139,247,.4))}.auth-brand-title{font-size:30px;font-weight:700;letter-spacing:-.5px;margin-bottom:10px;background:linear-gradient(135deg,#fff 20%,#93c5fd 80%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.auth-brand-subtitle{font-size:14px;color:#ffffff73;line-height:1.65;margin-bottom:40px;letter-spacing:.2px}.auth-brand-features{display:flex;flex-direction:column;gap:14px;text-align:left}.auth-brand-feature{display:flex;align-items:center;gap:12px;font-size:13px;color:#fff9}.auth-brand-feature .feat-dot{flex-shrink:0;width:7px;height:7px;border-radius:50%;background:#398bf7;box-shadow:0 0 10px #398bf7b3}.auth-brand-divider{width:60px;height:2px;background:linear-gradient(90deg,transparent,#398bf7,transparent);margin:28px auto 32px;border-radius:2px}.auth-panel-left--dev{background:linear-gradient(145deg,#18040b,#3d0b1d 55%,#220409)}.auth-panel-left--dev:after{background:linear-gradient(90deg,transparent,rgba(209,50,111,.05),transparent)}.auth-panel-left--dev .auth-blob-1{background:radial-gradient(circle,rgba(220,38,38,.52) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-2{background:radial-gradient(circle,rgba(219,39,119,.44) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-3{background:radial-gradient(circle,rgba(239,68,68,.38) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-4{background:radial-gradient(circle,rgba(249,115,22,.28) 0%,transparent 70%)}.auth-panel-left--dev .auth-brand-logo{box-shadow:0 0 0 14px #d1326f12,0 0 50px #d1326f38}.auth-panel-left--dev .auth-brand-logo img{filter:brightness(1.05) drop-shadow(0 0 8px rgba(209,50,111,.45))}.auth-panel-left--dev .auth-brand-title{background:linear-gradient(135deg,#fff 20%,#fca5a5 80%);-webkit-background-clip:text;background-clip:text}.auth-panel-left--dev .auth-brand-divider{background:linear-gradient(90deg,transparent,rgb(209,50,111),transparent)}.auth-panel-left--dev .feat-dot{background:#d1326f;box-shadow:0 0 10px #d1326fb8}.auth-panel-right{position:relative;overflow:hidden;background:var(--background-login)}.auth-panel-right:before{content:\"\";position:absolute;inset:0;background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(57,139,247,.045) 22px,rgba(57,139,247,.045) 23px);animation:authLinesMove 10s linear infinite;pointer-events:none;z-index:0}.auth-panel-right:after{content:\"\";position:absolute;top:0;bottom:0;left:-25%;width:25%;background:linear-gradient(90deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLine 7s ease-in-out infinite;animation-delay:3.5s;pointer-events:none;z-index:0}@keyframes authLinesMove{0%{transform:translate(0)}to{transform:translate(46px,46px)}}@keyframes authScanLine{0%{left:-25%}50%{left:120%}to{left:120%}}.auth-panel-bg{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}.auth-deco{position:absolute;border-radius:50%;pointer-events:none;filter:blur(70px)}.auth-deco-tl{width:300px;height:300px;top:0;left:-120px;transform:translateY(-40%);background:radial-gradient(circle,rgba(57,139,247,.12) 0%,transparent 70%);animation:authOrbPulse 6s ease-in-out infinite}.auth-deco-br{width:340px;height:340px;bottom:0;right:-120px;transform:translateY(40%);background:radial-gradient(circle,rgba(124,58,237,.1) 0%,transparent 70%);animation:authOrbPulse 8s ease-in-out infinite;animation-delay:-4s}@keyframes authOrbPulse{0%,to{opacity:.7}50%{opacity:1}}.auth-form-wrapper{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;align-items:center;z-index:1}.auth-form-wrapper>div{width:100%;max-width:420px;margin:auto;padding:36px 16px;box-sizing:border-box}.auth-panel-right--dev:before{background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(209,50,111,.05) 22px,rgba(209,50,111,.05) 23px)}.auth-panel-right--dev:after{background:linear-gradient(90deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}.auth-panel-right--dev .auth-deco-tl{background:radial-gradient(circle,rgba(209,50,111,.12) 0%,transparent 70%)}.auth-panel-right--dev .auth-deco-br{background:radial-gradient(circle,rgba(239,68,68,.1) 0%,transparent 70%)}.auth-test-badge{display:inline-flex;align-items:center;gap:7px;background:#d1326f14;border:1px solid rgba(209,50,111,.25);color:#d1326f;font-size:10.5px;font-weight:700;padding:5px 12px;border-radius:20px;margin-bottom:18px;letter-spacing:.8px}.auth-test-badge .badge-dot{width:6px;height:6px;border-radius:50%;background:#d1326f;animation:badgePulse 1.6s ease-in-out infinite;flex-shrink:0}@keyframes badgePulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.75)}}.auth-card{background:var(--background-card);border-radius:20px;padding:36px 32px 28px;box-shadow:0 4px 28px #00000014;border:1px solid var(--border-color-modal)}.auth-card-title{font-size:22px;font-weight:700;color:var(--text-color);margin-bottom:4px;letter-spacing:-.3px}.auth-card-subtitle{font-size:13px;color:var(--placeholder-color);margin-bottom:26px}.auth-field{position:relative;margin-bottom:1rem}.auth-field .auth-field-icon{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--placeholder-color);font-size:13px;z-index:2;pointer-events:none;transition:color .2s}.auth-field .auth-input{width:100%;padding:15px 40px 15px 37px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s,background .2s}.auth-field .auth-input::placeholder{color:transparent}.auth-field .auth-input:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721;background:var(--background-focus-input)}.auth-field .auth-input:focus~.auth-label{top:0;font-size:11px!important;color:#398bf7!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-input:focus~.auth-field-icon{color:#398bf7}.auth-field .auth-input:not(:placeholder-shown)~.auth-label{top:0;font-size:11px!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-label{position:absolute;left:35px;top:50%;transform:translateY(-50%);color:var(--placeholder-color)!important;font-size:13px!important;font-weight:400!important;pointer-events:none;transition:top .15s ease,font-size .15s ease,color .15s ease,padding .15s ease,background .15s ease;background:transparent;z-index:1;text-align:left!important}.auth-field .auth-toggle-pw{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--placeholder-color);cursor:pointer;padding:4px 6px;font-size:13px;z-index:2;line-height:1;transition:color .2s}.auth-field .auth-toggle-pw:hover{color:#398bf7}.auth-field.has-error .auth-input{border-color:#dc3545;box-shadow:none}.auth-field.has-error .auth-field-icon{color:#dc3545}.auth-select{width:100%;padding:13px 14px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s;margin-bottom:1rem;cursor:pointer}.auth-select:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721}.auth-btn{width:100%;padding:13px;border:none;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;transition:transform .15s ease,box-shadow .2s ease,opacity .2s;background:linear-gradient(135deg,#398bf7,#1e5fc4);color:#fff;letter-spacing:.3px;margin-bottom:10px;display:block}.auth-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 5px 18px #398bf761}.auth-btn:active:not(:disabled){transform:translateY(0)}.auth-btn:disabled{opacity:.55;cursor:not-allowed}.auth-btn.auth-btn--red{background:linear-gradient(135deg,#d1326f,#a82859)}.auth-btn.auth-btn--red:hover:not(:disabled){box-shadow:0 5px 18px #d1326f61}.auth-btn.auth-btn--outline{background:transparent;border:1.5px solid var(--font-border-input);color:var(--text-color)}.auth-btn.auth-btn--outline:hover:not(:disabled){background:var(--background-btn-light-hover);box-shadow:none;transform:none}.auth-links{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:16px;padding-top:16px;border-top:1px solid var(--border-color-modal)}.auth-version{text-align:right;margin-top:14px;padding-top:12px;border-top:1px solid var(--border-color-modal)}.auth-version span{font-size:11px;color:var(--placeholder-color)}.auth-error{font-size:11.5px;color:#dc3545;margin:-6px 0 10px 2px;padding:0}.auth-hint{display:flex;align-items:flex-start;gap:6px;font-size:11.5px;color:var(--placeholder-color);margin:-6px 0 14px 2px;padding:0;line-height:1.35}.auth-hint i{margin-top:2px;flex-shrink:0}.auth-validation-list{margin:-4px 0 12px;padding:0;list-style:none}.auth-validation-list li{font-size:11.5px;color:#dc3545;padding:2px 0}.auth-validation-list li:before{content:\"\\2715 \";font-size:10px}.auth-desc{font-size:13px;color:var(--placeholder-color);margin-bottom:20px;line-height:1.65}.auth-section-title{font-size:15px;font-weight:600;color:var(--text-color);margin-bottom:20px}.font-12{font-size:12px}.form-control:focus{border-color:#0199ff9a!important;box-shadow:0 0 5px .2px #65befa44!important}@media(max-width:900px){.auth-wrapper-login{grid-template-columns:1fr;grid-template-rows:auto 1fr;overflow-y:auto;overflow-x:hidden}.auth-panel-left{padding:14px 24px;justify-content:center}.auth-panel-left .auth-brand-subtitle,.auth-panel-left .auth-brand-features,.auth-panel-left .auth-brand-divider{display:none!important}.auth-panel-left .auth-brand-panel{display:flex!important;flex-direction:row!important;align-items:center;gap:0;text-align:left;max-width:none;width:100%;justify-content:center}.auth-panel-left .auth-brand-logo{width:52px;height:52px;margin:0;flex-shrink:0}.auth-panel-left .auth-brand-logo img{width:34px;height:34px}.auth-panel-left .auth-brand-title{font-size:20px;margin-bottom:0;margin-left:.5rem;flex-shrink:1}.auth-panel-right:after{inset:-25% 0 auto;width:100%;height:25%;background:linear-gradient(180deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLineV 7s ease-in-out infinite;animation-delay:3.5s}.auth-panel-right--dev:after{background:linear-gradient(180deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}}@keyframes authScanLineV{0%{top:-25%}50%{top:120%}to{top:120%}}@media(max-width:480px){.auth-panel-left{padding:12px 16px}.auth-panel-left .auth-brand-logo{width:44px;height:44px}.auth-panel-left .auth-brand-logo img{width:28px;height:28px}.auth-panel-left .auth-brand-title{font-size:17px}.auth-form-wrapper>div{padding:20px 12px}.auth-card{padding:24px 18px 20px;border-radius:16px}.font-12{font-size:10px!important}}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], animations: [fadeInOut] });
|
|
173
278
|
}
|
|
174
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
279
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: RecoverPasswordComponent, decorators: [{
|
|
175
280
|
type: Component,
|
|
176
|
-
args: [{ selector: 'lib-recover-password', imports: [ReactiveFormsModule], animations: [fadeInOut], template: "<div class=\"auth-wrapper-login\">\r\n @let produccion = production();\r\n <div class=\"auth-panel-left\" [class.auth-panel-left--dev]=\"!produccion\">\r\n <span class=\"auth-blob auth-blob-1\"></span>\r\n <span class=\"auth-blob auth-blob-2\"></span>\r\n <span class=\"auth-blob auth-blob-3\"></span>\r\n <span class=\"auth-blob auth-blob-4\"></span>\r\n\r\n <div class=\"auth-brand-panel\">\r\n <div class=\"auth-brand-logo\">\r\n <img src=\"assets/images/logo-tsi-tres.png\" alt=\"TSI\" />\r\n </div>\r\n <h1 class=\"auth-brand-title\">{{module()}}</h1>\r\n <p class=\"auth-brand-subtitle\">Recupera el acceso a tu cuenta de forma r\u00E1pida y segura</p>\r\n\r\n <div class=\"auth-brand-divider\"></div>\r\n\r\n <div class=\"auth-brand-features\">\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Verificaci\u00F3n por correo electr\u00F3nico\r\n </div>\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Proceso seguro y encriptado\r\n </div>\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Nueva clave en minutos\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"auth-panel-right\" [class.auth-panel-right--dev]=\"!produccion\">\r\n <div class=\"auth-panel-bg\">\r\n <span class=\"auth-deco auth-deco-tl\"></span>\r\n <span class=\"auth-deco auth-deco-br\"></span>\r\n </div>\r\n\r\n <div class=\"auth-form-wrapper\">\r\n <div>\r\n @if (!produccion) {\r\n <div>\r\n <span class=\"auth-test-badge\">\r\n <span class=\"badge-dot\"></span> ENTORNO DE PRUEBAS\r\n </span>\r\n </div>\r\n }\r\n\r\n <div class=\"auth-card\">\r\n <h2 class=\"auth-card-title\">Recuperar contrase\u00F1a</h2>\r\n <p class=\"auth-card-subtitle\">\r\n Conf\u00EDrmanos tu RUC y usuario. Enviaremos a tu correo registrado la nueva contrase\u00F1a.\r\n </p>\r\n\r\n <form [formGroup]=\"recoverForm\">\r\n\r\n <div class=\"auth-field\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-building\"></i></span>\r\n <input type=\"text\" class=\"auth-input\" placeholder=\" \" maxlength=\"11\" formControlName=\"ruc\"\r\n id=\"rec-ruc\" onlyNumber autocomplete=\"off\">\r\n <label for=\"rec-ruc\" class=\"auth-label\">RUC</label>\r\n </div>\r\n\r\n <div class=\"auth-field\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-user\"></i></span>\r\n <input type=\"text\" class=\"auth-input\" placeholder=\" \" formControlName=\"usuario\"\r\n id=\"rec-user\" autocomplete=\"off\">\r\n <label for=\"rec-user\" class=\"auth-label\">Usuario</label>\r\n </div>\r\n\r\n <button type=\"button\" class=\"auth-btn\" [class.auth-btn--red]=\"!produccion\"\r\n [disabled]=\"recoverForm.invalid\" (click)=\"enviar()\">\r\n Enviar instrucciones\r\n </button>\r\n\r\n <button type=\"button\" class=\"auth-btn auth-btn--outline\" (click)=\"back()\">\r\n Volver al inicio de sesi\u00F3n\r\n </button>\r\n\r\n </form>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["@charset \"UTF-8\";.red_contrasena,.blue_contrasena{position:relative;display:inline-block;font-size:13px;text-decoration:none;padding-bottom:2px;transition:color .3s ease;cursor:pointer}.red_contrasena:after,.blue_contrasena:after{content:\"\";position:absolute;bottom:0;left:50%;width:0;height:1px;background-color:currentColor;transition:all .3s ease;transform:translate(-50%)}.red_contrasena:hover:after,.blue_contrasena:hover:after{width:60%}.red_contrasena{color:#d1326f}.red_contrasena:hover{color:#a82859}.blue_contrasena{color:#398bf7}.blue_contrasena:hover{color:#1e5fc4}.auth-wrapper-login{position:fixed;inset:0;display:grid;grid-template-columns:1.15fr .85fr;overflow:hidden;background:#060d1f}.auth-panel-left{position:relative;overflow:hidden;background:linear-gradient(145deg,#040a18,#0b1a3d 55%,#040e22);display:flex;align-items:center;justify-content:center;padding:48px 40px}.auth-panel-left:before{content:\"\";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.055) 1px,transparent 1px);background-size:26px 26px;z-index:1;pointer-events:none}.auth-panel-left:after{content:\"\";position:absolute;top:0;left:-120%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(57,139,247,.04),transparent);animation:panelSweep 7s ease-in-out infinite;z-index:1;pointer-events:none}.auth-blob{position:absolute;border-radius:50%;filter:blur(72px);z-index:0;pointer-events:none}.auth-blob-1{width:340px;height:340px;background:radial-gradient(circle,rgba(57,139,247,.45) 0%,transparent 70%);top:-90px;right:-70px;animation:blobDrift 11s ease-in-out infinite}.auth-blob-2{width:240px;height:240px;background:radial-gradient(circle,rgba(124,58,237,.4) 0%,transparent 70%);bottom:60px;left:-50px;animation:blobDrift 14s ease-in-out infinite reverse}.auth-blob-3{width:180px;height:180px;background:radial-gradient(circle,rgba(14,165,233,.35) 0%,transparent 70%);bottom:-50px;right:40px;animation:blobDrift 9s ease-in-out infinite;animation-delay:-4s}.auth-blob-4{width:120px;height:120px;background:radial-gradient(circle,rgba(209,50,111,.25) 0%,transparent 70%);top:50%;left:50%;transform:translate(-50%,-50%);animation:blobDrift 16s ease-in-out infinite;animation-delay:-8s}@keyframes blobDrift{0%,to{transform:translate(0) scale(1)}33%{transform:translate(14px,-20px) scale(1.05)}66%{transform:translate(-10px,12px) scale(.96)}}@keyframes panelSweep{0%{left:-120%}50%{left:160%}to{left:160%}}.auth-brand-panel{position:relative;z-index:2;text-align:center;color:#fff;max-width:340px}.auth-brand-logo{width:100px;height:100px;border-radius:50%;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;margin:0 auto 28px;box-shadow:0 0 0 14px #398bf70f,0 0 50px #398bf733;backdrop-filter:blur(8px)}.auth-brand-logo img{width:64px;height:64px;object-fit:contain;filter:brightness(1.05) drop-shadow(0 0 8px rgba(57,139,247,.4))}.auth-brand-title{font-size:30px;font-weight:700;letter-spacing:-.5px;margin-bottom:10px;background:linear-gradient(135deg,#fff 20%,#93c5fd 80%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.auth-brand-subtitle{font-size:14px;color:#ffffff73;line-height:1.65;margin-bottom:40px;letter-spacing:.2px}.auth-brand-features{display:flex;flex-direction:column;gap:14px;text-align:left}.auth-brand-feature{display:flex;align-items:center;gap:12px;font-size:13px;color:#fff9}.auth-brand-feature .feat-dot{flex-shrink:0;width:7px;height:7px;border-radius:50%;background:#398bf7;box-shadow:0 0 10px #398bf7b3}.auth-brand-divider{width:60px;height:2px;background:linear-gradient(90deg,transparent,#398bf7,transparent);margin:28px auto 32px;border-radius:2px}.auth-panel-left--dev{background:linear-gradient(145deg,#18040b,#3d0b1d 55%,#220409)}.auth-panel-left--dev:after{background:linear-gradient(90deg,transparent,rgba(209,50,111,.05),transparent)}.auth-panel-left--dev .auth-blob-1{background:radial-gradient(circle,rgba(220,38,38,.52) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-2{background:radial-gradient(circle,rgba(219,39,119,.44) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-3{background:radial-gradient(circle,rgba(239,68,68,.38) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-4{background:radial-gradient(circle,rgba(249,115,22,.28) 0%,transparent 70%)}.auth-panel-left--dev .auth-brand-logo{box-shadow:0 0 0 14px #d1326f12,0 0 50px #d1326f38}.auth-panel-left--dev .auth-brand-logo img{filter:brightness(1.05) drop-shadow(0 0 8px rgba(209,50,111,.45))}.auth-panel-left--dev .auth-brand-title{background:linear-gradient(135deg,#fff 20%,#fca5a5 80%);-webkit-background-clip:text;background-clip:text}.auth-panel-left--dev .auth-brand-divider{background:linear-gradient(90deg,transparent,rgb(209,50,111),transparent)}.auth-panel-left--dev .feat-dot{background:#d1326f;box-shadow:0 0 10px #d1326fb8}.auth-panel-right{position:relative;overflow:hidden;background:var(--background-login)}.auth-panel-right:before{content:\"\";position:absolute;inset:0;background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(57,139,247,.045) 22px,rgba(57,139,247,.045) 23px);animation:authLinesMove 10s linear infinite;pointer-events:none;z-index:0}.auth-panel-right:after{content:\"\";position:absolute;top:0;bottom:0;left:-25%;width:25%;background:linear-gradient(90deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLine 7s ease-in-out infinite;animation-delay:3.5s;pointer-events:none;z-index:0}@keyframes authLinesMove{0%{transform:translate(0)}to{transform:translate(46px,46px)}}@keyframes authScanLine{0%{left:-25%}50%{left:120%}to{left:120%}}.auth-panel-bg{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}.auth-deco{position:absolute;border-radius:50%;pointer-events:none;filter:blur(70px)}.auth-deco-tl{width:300px;height:300px;top:0;left:-120px;transform:translateY(-40%);background:radial-gradient(circle,rgba(57,139,247,.12) 0%,transparent 70%);animation:authOrbPulse 6s ease-in-out infinite}.auth-deco-br{width:340px;height:340px;bottom:0;right:-120px;transform:translateY(40%);background:radial-gradient(circle,rgba(124,58,237,.1) 0%,transparent 70%);animation:authOrbPulse 8s ease-in-out infinite;animation-delay:-4s}@keyframes authOrbPulse{0%,to{opacity:.7}50%{opacity:1}}.auth-form-wrapper{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;align-items:center;z-index:1}.auth-form-wrapper>div{width:100%;max-width:420px;margin:auto;padding:36px 16px;box-sizing:border-box}.auth-panel-right--dev:before{background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(209,50,111,.05) 22px,rgba(209,50,111,.05) 23px)}.auth-panel-right--dev:after{background:linear-gradient(90deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}.auth-panel-right--dev .auth-deco-tl{background:radial-gradient(circle,rgba(209,50,111,.12) 0%,transparent 70%)}.auth-panel-right--dev .auth-deco-br{background:radial-gradient(circle,rgba(239,68,68,.1) 0%,transparent 70%)}.auth-test-badge{display:inline-flex;align-items:center;gap:7px;background:#d1326f14;border:1px solid rgba(209,50,111,.25);color:#d1326f;font-size:10.5px;font-weight:700;padding:5px 12px;border-radius:20px;margin-bottom:18px;letter-spacing:.8px}.auth-test-badge .badge-dot{width:6px;height:6px;border-radius:50%;background:#d1326f;animation:badgePulse 1.6s ease-in-out infinite;flex-shrink:0}@keyframes badgePulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.75)}}.auth-card{background:var(--background-card);border-radius:20px;padding:36px 32px 28px;box-shadow:0 4px 28px #00000014;border:1px solid var(--border-color-modal)}.auth-card-title{font-size:22px;font-weight:700;color:var(--text-color);margin-bottom:4px;letter-spacing:-.3px}.auth-card-subtitle{font-size:13px;color:var(--placeholder-color);margin-bottom:26px}.auth-field{position:relative;margin-bottom:1rem}.auth-field .auth-field-icon{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--placeholder-color);font-size:13px;z-index:2;pointer-events:none;transition:color .2s}.auth-field .auth-input{width:100%;padding:15px 40px 15px 37px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s,background .2s}.auth-field .auth-input::placeholder{color:transparent}.auth-field .auth-input:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721;background:var(--background-focus-input)}.auth-field .auth-input:focus~.auth-label{top:0;font-size:11px!important;color:#398bf7!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-input:focus~.auth-field-icon{color:#398bf7}.auth-field .auth-input:not(:placeholder-shown)~.auth-label{top:0;font-size:11px!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-label{position:absolute;left:35px;top:50%;transform:translateY(-50%);color:var(--placeholder-color)!important;font-size:13px!important;font-weight:400!important;pointer-events:none;transition:top .15s ease,font-size .15s ease,color .15s ease,padding .15s ease,background .15s ease;background:transparent;z-index:1;text-align:left!important}.auth-field .auth-toggle-pw{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--placeholder-color);cursor:pointer;padding:4px 6px;font-size:13px;z-index:2;line-height:1;transition:color .2s}.auth-field .auth-toggle-pw:hover{color:#398bf7}.auth-field.has-error .auth-input{border-color:#dc3545;box-shadow:none}.auth-field.has-error .auth-field-icon{color:#dc3545}.auth-select{width:100%;padding:13px 14px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s;margin-bottom:1rem;cursor:pointer}.auth-select:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721}.auth-btn{width:100%;padding:13px;border:none;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;transition:transform .15s ease,box-shadow .2s ease,opacity .2s;background:linear-gradient(135deg,#398bf7,#1e5fc4);color:#fff;letter-spacing:.3px;margin-bottom:10px;display:block}.auth-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 5px 18px #398bf761}.auth-btn:active:not(:disabled){transform:translateY(0)}.auth-btn:disabled{opacity:.55;cursor:not-allowed}.auth-btn.auth-btn--red{background:linear-gradient(135deg,#d1326f,#a82859)}.auth-btn.auth-btn--red:hover:not(:disabled){box-shadow:0 5px 18px #d1326f61}.auth-btn.auth-btn--outline{background:transparent;border:1.5px solid var(--font-border-input);color:var(--text-color)}.auth-btn.auth-btn--outline:hover:not(:disabled){background:var(--background-btn-light-hover);box-shadow:none;transform:none}.auth-links{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:16px;padding-top:16px;border-top:1px solid var(--border-color-modal)}.auth-version{text-align:right;margin-top:14px;padding-top:12px;border-top:1px solid var(--border-color-modal)}.auth-version span{font-size:11px;color:var(--placeholder-color)}.auth-error{font-size:11.5px;color:#dc3545;margin:-6px 0 10px 2px;padding:0}.auth-validation-list{margin:-4px 0 12px;padding:0;list-style:none}.auth-validation-list li{font-size:11.5px;color:#dc3545;padding:2px 0}.auth-validation-list li:before{content:\"\\2715 \";font-size:10px}.auth-desc{font-size:13px;color:var(--placeholder-color);margin-bottom:20px;line-height:1.65}.auth-section-title{font-size:15px;font-weight:600;color:var(--text-color);margin-bottom:20px}.font-12{font-size:12px}.form-control:focus{border-color:#0199ff9a!important;box-shadow:0 0 5px .2px #65befa44!important}@media (max-width: 900px){.auth-wrapper-login{grid-template-columns:1fr;grid-template-rows:auto 1fr;overflow-y:auto;overflow-x:hidden}.auth-panel-left{padding:14px 24px;justify-content:center}.auth-panel-left .auth-brand-subtitle,.auth-panel-left .auth-brand-features,.auth-panel-left .auth-brand-divider{display:none!important}.auth-panel-left .auth-brand-panel{display:flex!important;flex-direction:row!important;align-items:center;gap:0;text-align:left;max-width:none;width:100%;justify-content:center}.auth-panel-left .auth-brand-logo{width:52px;height:52px;margin:0;flex-shrink:0}.auth-panel-left .auth-brand-logo img{width:34px;height:34px}.auth-panel-left .auth-brand-title{font-size:20px;margin-bottom:0;margin-left:.5rem;flex-shrink:1}.auth-panel-right:after{inset:-25% 0 auto;width:100%;height:25%;background:linear-gradient(180deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLineV 7s ease-in-out infinite;animation-delay:3.5s}.auth-panel-right--dev:after{background:linear-gradient(180deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}}@keyframes authScanLineV{0%{top:-25%}50%{top:120%}to{top:120%}}@media (max-width: 480px){.auth-panel-left{padding:12px 16px}.auth-panel-left .auth-brand-logo{width:44px;height:44px}.auth-panel-left .auth-brand-logo img{width:28px;height:28px}.auth-panel-left .auth-brand-title{font-size:17px}.auth-form-wrapper>div{padding:20px 12px}.auth-card{padding:24px 18px 20px;border-radius:16px}.font-12{font-size:10px!important}}\n"] }]
|
|
281
|
+
args: [{ selector: 'lib-recover-password', imports: [ReactiveFormsModule], animations: [fadeInOut], template: "<div class=\"auth-wrapper-login\">\r\n @let produccion = production();\r\n <div class=\"auth-panel-left\" [class.auth-panel-left--dev]=\"!produccion\">\r\n <span class=\"auth-blob auth-blob-1\"></span>\r\n <span class=\"auth-blob auth-blob-2\"></span>\r\n <span class=\"auth-blob auth-blob-3\"></span>\r\n <span class=\"auth-blob auth-blob-4\"></span>\r\n\r\n <div class=\"auth-brand-panel\">\r\n <div class=\"auth-brand-logo\">\r\n <img src=\"assets/images/logo-tsi-tres.png\" alt=\"TSI\" />\r\n </div>\r\n <h1 class=\"auth-brand-title\">{{module()}}</h1>\r\n <p class=\"auth-brand-subtitle\">Recupera el acceso a tu cuenta de forma r\u00E1pida y segura</p>\r\n\r\n <div class=\"auth-brand-divider\"></div>\r\n\r\n <div class=\"auth-brand-features\">\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Verificaci\u00F3n por correo electr\u00F3nico\r\n </div>\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Proceso seguro y encriptado\r\n </div>\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Nueva clave en minutos\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"auth-panel-right\" [class.auth-panel-right--dev]=\"!produccion\">\r\n <div class=\"auth-panel-bg\">\r\n <span class=\"auth-deco auth-deco-tl\"></span>\r\n <span class=\"auth-deco auth-deco-br\"></span>\r\n </div>\r\n\r\n <div class=\"auth-form-wrapper\">\r\n <div>\r\n @if (!produccion) {\r\n <div>\r\n <span class=\"auth-test-badge\">\r\n <span class=\"badge-dot\"></span> ENTORNO DE PRUEBAS\r\n </span>\r\n </div>\r\n }\r\n\r\n <div class=\"auth-card\">\r\n <h2 class=\"auth-card-title\">Recuperar contrase\u00F1a</h2>\r\n <p class=\"auth-card-subtitle\">\r\n Conf\u00EDrmanos tu RUC y usuario. Enviaremos a tu correo registrado la nueva contrase\u00F1a.\r\n </p>\r\n\r\n <form [formGroup]=\"recoverForm\">\r\n\r\n <div class=\"auth-field\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-building\"></i></span>\r\n <input type=\"text\" class=\"auth-input\" placeholder=\" \" maxlength=\"11\" formControlName=\"ruc\"\r\n id=\"rec-ruc\" onlyNumber autocomplete=\"off\">\r\n <label for=\"rec-ruc\" class=\"auth-label\">RUC</label>\r\n </div>\r\n\r\n <div class=\"auth-field\">\r\n <span class=\"auth-field-icon\"><i class=\"fas fa-user\"></i></span>\r\n <input type=\"text\" class=\"auth-input\" placeholder=\" \" formControlName=\"usuario\"\r\n id=\"rec-user\" autocomplete=\"off\">\r\n <label for=\"rec-user\" class=\"auth-label\">Usuario</label>\r\n </div>\r\n\r\n <button type=\"button\" class=\"auth-btn\" [class.auth-btn--red]=\"!produccion\"\r\n [disabled]=\"recoverForm.invalid\" (click)=\"enviar()\">\r\n Enviar instrucciones\r\n </button>\r\n\r\n <button type=\"button\" class=\"auth-btn auth-btn--outline\" (click)=\"back()\">\r\n Volver al inicio de sesi\u00F3n\r\n </button>\r\n\r\n </form>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["@charset \"UTF-8\";.red_contrasena,.blue_contrasena{position:relative;display:inline-block;font-size:13px;text-decoration:none;padding-bottom:2px;transition:color .3s ease;cursor:pointer}.red_contrasena:after,.blue_contrasena:after{content:\"\";position:absolute;bottom:0;left:50%;width:0;height:1px;background-color:currentColor;transition:all .3s ease;transform:translate(-50%)}.red_contrasena:hover:after,.blue_contrasena:hover:after{width:60%}.red_contrasena{color:#d1326f}.red_contrasena:hover{color:#a82859}.blue_contrasena{color:#398bf7}.blue_contrasena:hover{color:#1e5fc4}.auth-wrapper-login{position:fixed;inset:0;display:grid;grid-template-columns:1.15fr .85fr;overflow:hidden;background:#060d1f}.auth-panel-left{position:relative;overflow:hidden;background:linear-gradient(145deg,#040a18,#0b1a3d 55%,#040e22);display:flex;align-items:center;justify-content:center;padding:48px 40px}.auth-panel-left:before{content:\"\";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.055) 1px,transparent 1px);background-size:26px 26px;z-index:1;pointer-events:none}.auth-panel-left:after{content:\"\";position:absolute;top:0;left:-120%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(57,139,247,.04),transparent);animation:panelSweep 7s ease-in-out infinite;z-index:1;pointer-events:none}.auth-blob{position:absolute;border-radius:50%;filter:blur(72px);z-index:0;pointer-events:none}.auth-blob-1{width:340px;height:340px;background:radial-gradient(circle,rgba(57,139,247,.45) 0%,transparent 70%);top:-90px;right:-70px;animation:blobDrift 11s ease-in-out infinite}.auth-blob-2{width:240px;height:240px;background:radial-gradient(circle,rgba(124,58,237,.4) 0%,transparent 70%);bottom:60px;left:-50px;animation:blobDrift 14s ease-in-out infinite reverse}.auth-blob-3{width:180px;height:180px;background:radial-gradient(circle,rgba(14,165,233,.35) 0%,transparent 70%);bottom:-50px;right:40px;animation:blobDrift 9s ease-in-out infinite;animation-delay:-4s}.auth-blob-4{width:120px;height:120px;background:radial-gradient(circle,rgba(209,50,111,.25) 0%,transparent 70%);top:50%;left:50%;transform:translate(-50%,-50%);animation:blobDrift 16s ease-in-out infinite;animation-delay:-8s}@keyframes blobDrift{0%,to{transform:translate(0) scale(1)}33%{transform:translate(14px,-20px) scale(1.05)}66%{transform:translate(-10px,12px) scale(.96)}}@keyframes panelSweep{0%{left:-120%}50%{left:160%}to{left:160%}}.auth-brand-panel{position:relative;z-index:2;text-align:center;color:#fff;max-width:340px}.auth-brand-logo{width:100px;height:100px;border-radius:50%;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;margin:0 auto 28px;box-shadow:0 0 0 14px #398bf70f,0 0 50px #398bf733;backdrop-filter:blur(8px)}.auth-brand-logo img{width:64px;height:64px;object-fit:contain;filter:brightness(1.05) drop-shadow(0 0 8px rgba(57,139,247,.4))}.auth-brand-title{font-size:30px;font-weight:700;letter-spacing:-.5px;margin-bottom:10px;background:linear-gradient(135deg,#fff 20%,#93c5fd 80%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.auth-brand-subtitle{font-size:14px;color:#ffffff73;line-height:1.65;margin-bottom:40px;letter-spacing:.2px}.auth-brand-features{display:flex;flex-direction:column;gap:14px;text-align:left}.auth-brand-feature{display:flex;align-items:center;gap:12px;font-size:13px;color:#fff9}.auth-brand-feature .feat-dot{flex-shrink:0;width:7px;height:7px;border-radius:50%;background:#398bf7;box-shadow:0 0 10px #398bf7b3}.auth-brand-divider{width:60px;height:2px;background:linear-gradient(90deg,transparent,#398bf7,transparent);margin:28px auto 32px;border-radius:2px}.auth-panel-left--dev{background:linear-gradient(145deg,#18040b,#3d0b1d 55%,#220409)}.auth-panel-left--dev:after{background:linear-gradient(90deg,transparent,rgba(209,50,111,.05),transparent)}.auth-panel-left--dev .auth-blob-1{background:radial-gradient(circle,rgba(220,38,38,.52) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-2{background:radial-gradient(circle,rgba(219,39,119,.44) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-3{background:radial-gradient(circle,rgba(239,68,68,.38) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-4{background:radial-gradient(circle,rgba(249,115,22,.28) 0%,transparent 70%)}.auth-panel-left--dev .auth-brand-logo{box-shadow:0 0 0 14px #d1326f12,0 0 50px #d1326f38}.auth-panel-left--dev .auth-brand-logo img{filter:brightness(1.05) drop-shadow(0 0 8px rgba(209,50,111,.45))}.auth-panel-left--dev .auth-brand-title{background:linear-gradient(135deg,#fff 20%,#fca5a5 80%);-webkit-background-clip:text;background-clip:text}.auth-panel-left--dev .auth-brand-divider{background:linear-gradient(90deg,transparent,rgb(209,50,111),transparent)}.auth-panel-left--dev .feat-dot{background:#d1326f;box-shadow:0 0 10px #d1326fb8}.auth-panel-right{position:relative;overflow:hidden;background:var(--background-login)}.auth-panel-right:before{content:\"\";position:absolute;inset:0;background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(57,139,247,.045) 22px,rgba(57,139,247,.045) 23px);animation:authLinesMove 10s linear infinite;pointer-events:none;z-index:0}.auth-panel-right:after{content:\"\";position:absolute;top:0;bottom:0;left:-25%;width:25%;background:linear-gradient(90deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLine 7s ease-in-out infinite;animation-delay:3.5s;pointer-events:none;z-index:0}@keyframes authLinesMove{0%{transform:translate(0)}to{transform:translate(46px,46px)}}@keyframes authScanLine{0%{left:-25%}50%{left:120%}to{left:120%}}.auth-panel-bg{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}.auth-deco{position:absolute;border-radius:50%;pointer-events:none;filter:blur(70px)}.auth-deco-tl{width:300px;height:300px;top:0;left:-120px;transform:translateY(-40%);background:radial-gradient(circle,rgba(57,139,247,.12) 0%,transparent 70%);animation:authOrbPulse 6s ease-in-out infinite}.auth-deco-br{width:340px;height:340px;bottom:0;right:-120px;transform:translateY(40%);background:radial-gradient(circle,rgba(124,58,237,.1) 0%,transparent 70%);animation:authOrbPulse 8s ease-in-out infinite;animation-delay:-4s}@keyframes authOrbPulse{0%,to{opacity:.7}50%{opacity:1}}.auth-form-wrapper{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;align-items:center;z-index:1}.auth-form-wrapper>div{width:100%;max-width:420px;margin:auto;padding:36px 16px;box-sizing:border-box}.auth-panel-right--dev:before{background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(209,50,111,.05) 22px,rgba(209,50,111,.05) 23px)}.auth-panel-right--dev:after{background:linear-gradient(90deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}.auth-panel-right--dev .auth-deco-tl{background:radial-gradient(circle,rgba(209,50,111,.12) 0%,transparent 70%)}.auth-panel-right--dev .auth-deco-br{background:radial-gradient(circle,rgba(239,68,68,.1) 0%,transparent 70%)}.auth-test-badge{display:inline-flex;align-items:center;gap:7px;background:#d1326f14;border:1px solid rgba(209,50,111,.25);color:#d1326f;font-size:10.5px;font-weight:700;padding:5px 12px;border-radius:20px;margin-bottom:18px;letter-spacing:.8px}.auth-test-badge .badge-dot{width:6px;height:6px;border-radius:50%;background:#d1326f;animation:badgePulse 1.6s ease-in-out infinite;flex-shrink:0}@keyframes badgePulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.75)}}.auth-card{background:var(--background-card);border-radius:20px;padding:36px 32px 28px;box-shadow:0 4px 28px #00000014;border:1px solid var(--border-color-modal)}.auth-card-title{font-size:22px;font-weight:700;color:var(--text-color);margin-bottom:4px;letter-spacing:-.3px}.auth-card-subtitle{font-size:13px;color:var(--placeholder-color);margin-bottom:26px}.auth-field{position:relative;margin-bottom:1rem}.auth-field .auth-field-icon{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--placeholder-color);font-size:13px;z-index:2;pointer-events:none;transition:color .2s}.auth-field .auth-input{width:100%;padding:15px 40px 15px 37px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s,background .2s}.auth-field .auth-input::placeholder{color:transparent}.auth-field .auth-input:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721;background:var(--background-focus-input)}.auth-field .auth-input:focus~.auth-label{top:0;font-size:11px!important;color:#398bf7!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-input:focus~.auth-field-icon{color:#398bf7}.auth-field .auth-input:not(:placeholder-shown)~.auth-label{top:0;font-size:11px!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-label{position:absolute;left:35px;top:50%;transform:translateY(-50%);color:var(--placeholder-color)!important;font-size:13px!important;font-weight:400!important;pointer-events:none;transition:top .15s ease,font-size .15s ease,color .15s ease,padding .15s ease,background .15s ease;background:transparent;z-index:1;text-align:left!important}.auth-field .auth-toggle-pw{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--placeholder-color);cursor:pointer;padding:4px 6px;font-size:13px;z-index:2;line-height:1;transition:color .2s}.auth-field .auth-toggle-pw:hover{color:#398bf7}.auth-field.has-error .auth-input{border-color:#dc3545;box-shadow:none}.auth-field.has-error .auth-field-icon{color:#dc3545}.auth-select{width:100%;padding:13px 14px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s;margin-bottom:1rem;cursor:pointer}.auth-select:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721}.auth-btn{width:100%;padding:13px;border:none;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;transition:transform .15s ease,box-shadow .2s ease,opacity .2s;background:linear-gradient(135deg,#398bf7,#1e5fc4);color:#fff;letter-spacing:.3px;margin-bottom:10px;display:block}.auth-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 5px 18px #398bf761}.auth-btn:active:not(:disabled){transform:translateY(0)}.auth-btn:disabled{opacity:.55;cursor:not-allowed}.auth-btn.auth-btn--red{background:linear-gradient(135deg,#d1326f,#a82859)}.auth-btn.auth-btn--red:hover:not(:disabled){box-shadow:0 5px 18px #d1326f61}.auth-btn.auth-btn--outline{background:transparent;border:1.5px solid var(--font-border-input);color:var(--text-color)}.auth-btn.auth-btn--outline:hover:not(:disabled){background:var(--background-btn-light-hover);box-shadow:none;transform:none}.auth-links{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:16px;padding-top:16px;border-top:1px solid var(--border-color-modal)}.auth-version{text-align:right;margin-top:14px;padding-top:12px;border-top:1px solid var(--border-color-modal)}.auth-version span{font-size:11px;color:var(--placeholder-color)}.auth-error{font-size:11.5px;color:#dc3545;margin:-6px 0 10px 2px;padding:0}.auth-hint{display:flex;align-items:flex-start;gap:6px;font-size:11.5px;color:var(--placeholder-color);margin:-6px 0 14px 2px;padding:0;line-height:1.35}.auth-hint i{margin-top:2px;flex-shrink:0}.auth-validation-list{margin:-4px 0 12px;padding:0;list-style:none}.auth-validation-list li{font-size:11.5px;color:#dc3545;padding:2px 0}.auth-validation-list li:before{content:\"\\2715 \";font-size:10px}.auth-desc{font-size:13px;color:var(--placeholder-color);margin-bottom:20px;line-height:1.65}.auth-section-title{font-size:15px;font-weight:600;color:var(--text-color);margin-bottom:20px}.font-12{font-size:12px}.form-control:focus{border-color:#0199ff9a!important;box-shadow:0 0 5px .2px #65befa44!important}@media(max-width:900px){.auth-wrapper-login{grid-template-columns:1fr;grid-template-rows:auto 1fr;overflow-y:auto;overflow-x:hidden}.auth-panel-left{padding:14px 24px;justify-content:center}.auth-panel-left .auth-brand-subtitle,.auth-panel-left .auth-brand-features,.auth-panel-left .auth-brand-divider{display:none!important}.auth-panel-left .auth-brand-panel{display:flex!important;flex-direction:row!important;align-items:center;gap:0;text-align:left;max-width:none;width:100%;justify-content:center}.auth-panel-left .auth-brand-logo{width:52px;height:52px;margin:0;flex-shrink:0}.auth-panel-left .auth-brand-logo img{width:34px;height:34px}.auth-panel-left .auth-brand-title{font-size:20px;margin-bottom:0;margin-left:.5rem;flex-shrink:1}.auth-panel-right:after{inset:-25% 0 auto;width:100%;height:25%;background:linear-gradient(180deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLineV 7s ease-in-out infinite;animation-delay:3.5s}.auth-panel-right--dev:after{background:linear-gradient(180deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}}@keyframes authScanLineV{0%{top:-25%}50%{top:120%}to{top:120%}}@media(max-width:480px){.auth-panel-left{padding:12px 16px}.auth-panel-left .auth-brand-logo{width:44px;height:44px}.auth-panel-left .auth-brand-logo img{width:28px;height:28px}.auth-panel-left .auth-brand-title{font-size:17px}.auth-form-wrapper>div{padding:20px 12px}.auth-card{padding:24px 18px 20px;border-radius:16px}.font-12{font-size:10px!important}}\n"] }]
|
|
177
282
|
}] });
|
|
178
283
|
|
|
179
284
|
class SelectBranchComponent {
|
|
@@ -194,12 +299,12 @@ class SelectBranchComponent {
|
|
|
194
299
|
goMain = () => {
|
|
195
300
|
this.loginEvent.emit({ type: "BRANCH", data: { codsuc: this.codsuc() } });
|
|
196
301
|
};
|
|
197
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
198
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: SelectBranchComponent, isStandalone: true, selector: "lib-select-branch", inputs: { production: { classPropertyName: "production", publicName: "production", isSignal: true, isRequired: false, transformFunction: null }, module: { classPropertyName: "module", publicName: "module", isSignal: true, isRequired: false, transformFunction: null }, codsuc: { classPropertyName: "codsuc", publicName: "codsuc", isSignal: true, isRequired: false, transformFunction: null }, sucursalesList: { classPropertyName: "sucursalesList", publicName: "sucursalesList", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { codsuc: "codsucChange", loginEvent: "loginEvent" }, host: { listeners: { "document:keydown": "handleEnter($event)" } }, ngImport: i0, template: "<div class=\"auth-wrapper-login\">\r\n @let produccion = production();\r\n <div class=\"auth-panel-left\" [class.auth-panel-left--dev]=\"!produccion\">\r\n <span class=\"auth-blob auth-blob-1\"></span>\r\n <span class=\"auth-blob auth-blob-2\"></span>\r\n <span class=\"auth-blob auth-blob-3\"></span>\r\n <span class=\"auth-blob auth-blob-4\"></span>\r\n\r\n <div class=\"auth-brand-panel\">\r\n <div class=\"auth-brand-logo\">\r\n <img src=\"assets/images/logo-tsi-tres.png\" alt=\"TSI\" />\r\n </div>\r\n <h1 class=\"auth-brand-title\">{{module()}}</h1>\r\n <p class=\"auth-brand-subtitle\">Selecciona la sucursal desde donde vas a operar hoy</p>\r\n\r\n <div class=\"auth-brand-divider\"></div>\r\n\r\n <div class=\"auth-brand-features\">\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Acceso segmentado por sucursal\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"auth-panel-right\" [class.auth-panel-right--dev]=\"!produccion\">\r\n <div class=\"auth-panel-bg\">\r\n <span class=\"auth-deco auth-deco-tl\"></span>\r\n <span class=\"auth-deco auth-deco-br\"></span>\r\n </div>\r\n\r\n <div class=\"auth-form-wrapper\">\r\n <div>\r\n @if (!produccion) {\r\n <div>\r\n <span class=\"auth-test-badge\">\r\n <span class=\"badge-dot\"></span> ENTORNO DE PRUEBAS\r\n </span>\r\n </div>\r\n }\r\n\r\n <div class=\"auth-card\">\r\n <h2 class=\"auth-card-title\">Seleccionar sucursal</h2>\r\n <p class=\"auth-card-subtitle\">{{title()}}</p>\r\n\r\n <select class=\"auth-select\" [(ngModel)]=\"codsuc\">\r\n @for (suc of sucursalesList(); track $index) {\r\n <option [value]=\"suc.codsuc\">{{suc.sucursal}}</option>\r\n }\r\n </select>\r\n\r\n <button class=\"auth-btn\" [class.auth-btn--red]=\"!produccion\" (click)=\"goMain()\">\r\n Continuar\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["", "@charset \"UTF-8\";.red_contrasena,.blue_contrasena{position:relative;display:inline-block;font-size:13px;text-decoration:none;padding-bottom:2px;transition:color .3s ease;cursor:pointer}.red_contrasena:after,.blue_contrasena:after{content:\"\";position:absolute;bottom:0;left:50%;width:0;height:1px;background-color:currentColor;transition:all .3s ease;transform:translate(-50%)}.red_contrasena:hover:after,.blue_contrasena:hover:after{width:60%}.red_contrasena{color:#d1326f}.red_contrasena:hover{color:#a82859}.blue_contrasena{color:#398bf7}.blue_contrasena:hover{color:#1e5fc4}.auth-wrapper-login{position:fixed;inset:0;display:grid;grid-template-columns:1.15fr .85fr;overflow:hidden;background:#060d1f}.auth-panel-left{position:relative;overflow:hidden;background:linear-gradient(145deg,#040a18,#0b1a3d 55%,#040e22);display:flex;align-items:center;justify-content:center;padding:48px 40px}.auth-panel-left:before{content:\"\";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.055) 1px,transparent 1px);background-size:26px 26px;z-index:1;pointer-events:none}.auth-panel-left:after{content:\"\";position:absolute;top:0;left:-120%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(57,139,247,.04),transparent);animation:panelSweep 7s ease-in-out infinite;z-index:1;pointer-events:none}.auth-blob{position:absolute;border-radius:50%;filter:blur(72px);z-index:0;pointer-events:none}.auth-blob-1{width:340px;height:340px;background:radial-gradient(circle,rgba(57,139,247,.45) 0%,transparent 70%);top:-90px;right:-70px;animation:blobDrift 11s ease-in-out infinite}.auth-blob-2{width:240px;height:240px;background:radial-gradient(circle,rgba(124,58,237,.4) 0%,transparent 70%);bottom:60px;left:-50px;animation:blobDrift 14s ease-in-out infinite reverse}.auth-blob-3{width:180px;height:180px;background:radial-gradient(circle,rgba(14,165,233,.35) 0%,transparent 70%);bottom:-50px;right:40px;animation:blobDrift 9s ease-in-out infinite;animation-delay:-4s}.auth-blob-4{width:120px;height:120px;background:radial-gradient(circle,rgba(209,50,111,.25) 0%,transparent 70%);top:50%;left:50%;transform:translate(-50%,-50%);animation:blobDrift 16s ease-in-out infinite;animation-delay:-8s}@keyframes blobDrift{0%,to{transform:translate(0) scale(1)}33%{transform:translate(14px,-20px) scale(1.05)}66%{transform:translate(-10px,12px) scale(.96)}}@keyframes panelSweep{0%{left:-120%}50%{left:160%}to{left:160%}}.auth-brand-panel{position:relative;z-index:2;text-align:center;color:#fff;max-width:340px}.auth-brand-logo{width:100px;height:100px;border-radius:50%;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;margin:0 auto 28px;box-shadow:0 0 0 14px #398bf70f,0 0 50px #398bf733;backdrop-filter:blur(8px)}.auth-brand-logo img{width:64px;height:64px;object-fit:contain;filter:brightness(1.05) drop-shadow(0 0 8px rgba(57,139,247,.4))}.auth-brand-title{font-size:30px;font-weight:700;letter-spacing:-.5px;margin-bottom:10px;background:linear-gradient(135deg,#fff 20%,#93c5fd 80%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.auth-brand-subtitle{font-size:14px;color:#ffffff73;line-height:1.65;margin-bottom:40px;letter-spacing:.2px}.auth-brand-features{display:flex;flex-direction:column;gap:14px;text-align:left}.auth-brand-feature{display:flex;align-items:center;gap:12px;font-size:13px;color:#fff9}.auth-brand-feature .feat-dot{flex-shrink:0;width:7px;height:7px;border-radius:50%;background:#398bf7;box-shadow:0 0 10px #398bf7b3}.auth-brand-divider{width:60px;height:2px;background:linear-gradient(90deg,transparent,#398bf7,transparent);margin:28px auto 32px;border-radius:2px}.auth-panel-left--dev{background:linear-gradient(145deg,#18040b,#3d0b1d 55%,#220409)}.auth-panel-left--dev:after{background:linear-gradient(90deg,transparent,rgba(209,50,111,.05),transparent)}.auth-panel-left--dev .auth-blob-1{background:radial-gradient(circle,rgba(220,38,38,.52) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-2{background:radial-gradient(circle,rgba(219,39,119,.44) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-3{background:radial-gradient(circle,rgba(239,68,68,.38) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-4{background:radial-gradient(circle,rgba(249,115,22,.28) 0%,transparent 70%)}.auth-panel-left--dev .auth-brand-logo{box-shadow:0 0 0 14px #d1326f12,0 0 50px #d1326f38}.auth-panel-left--dev .auth-brand-logo img{filter:brightness(1.05) drop-shadow(0 0 8px rgba(209,50,111,.45))}.auth-panel-left--dev .auth-brand-title{background:linear-gradient(135deg,#fff 20%,#fca5a5 80%);-webkit-background-clip:text;background-clip:text}.auth-panel-left--dev .auth-brand-divider{background:linear-gradient(90deg,transparent,rgb(209,50,111),transparent)}.auth-panel-left--dev .feat-dot{background:#d1326f;box-shadow:0 0 10px #d1326fb8}.auth-panel-right{position:relative;overflow:hidden;background:var(--background-login)}.auth-panel-right:before{content:\"\";position:absolute;inset:0;background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(57,139,247,.045) 22px,rgba(57,139,247,.045) 23px);animation:authLinesMove 10s linear infinite;pointer-events:none;z-index:0}.auth-panel-right:after{content:\"\";position:absolute;top:0;bottom:0;left:-25%;width:25%;background:linear-gradient(90deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLine 7s ease-in-out infinite;animation-delay:3.5s;pointer-events:none;z-index:0}@keyframes authLinesMove{0%{transform:translate(0)}to{transform:translate(46px,46px)}}@keyframes authScanLine{0%{left:-25%}50%{left:120%}to{left:120%}}.auth-panel-bg{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}.auth-deco{position:absolute;border-radius:50%;pointer-events:none;filter:blur(70px)}.auth-deco-tl{width:300px;height:300px;top:0;left:-120px;transform:translateY(-40%);background:radial-gradient(circle,rgba(57,139,247,.12) 0%,transparent 70%);animation:authOrbPulse 6s ease-in-out infinite}.auth-deco-br{width:340px;height:340px;bottom:0;right:-120px;transform:translateY(40%);background:radial-gradient(circle,rgba(124,58,237,.1) 0%,transparent 70%);animation:authOrbPulse 8s ease-in-out infinite;animation-delay:-4s}@keyframes authOrbPulse{0%,to{opacity:.7}50%{opacity:1}}.auth-form-wrapper{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;align-items:center;z-index:1}.auth-form-wrapper>div{width:100%;max-width:420px;margin:auto;padding:36px 16px;box-sizing:border-box}.auth-panel-right--dev:before{background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(209,50,111,.05) 22px,rgba(209,50,111,.05) 23px)}.auth-panel-right--dev:after{background:linear-gradient(90deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}.auth-panel-right--dev .auth-deco-tl{background:radial-gradient(circle,rgba(209,50,111,.12) 0%,transparent 70%)}.auth-panel-right--dev .auth-deco-br{background:radial-gradient(circle,rgba(239,68,68,.1) 0%,transparent 70%)}.auth-test-badge{display:inline-flex;align-items:center;gap:7px;background:#d1326f14;border:1px solid rgba(209,50,111,.25);color:#d1326f;font-size:10.5px;font-weight:700;padding:5px 12px;border-radius:20px;margin-bottom:18px;letter-spacing:.8px}.auth-test-badge .badge-dot{width:6px;height:6px;border-radius:50%;background:#d1326f;animation:badgePulse 1.6s ease-in-out infinite;flex-shrink:0}@keyframes badgePulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.75)}}.auth-card{background:var(--background-card);border-radius:20px;padding:36px 32px 28px;box-shadow:0 4px 28px #00000014;border:1px solid var(--border-color-modal)}.auth-card-title{font-size:22px;font-weight:700;color:var(--text-color);margin-bottom:4px;letter-spacing:-.3px}.auth-card-subtitle{font-size:13px;color:var(--placeholder-color);margin-bottom:26px}.auth-field{position:relative;margin-bottom:1rem}.auth-field .auth-field-icon{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--placeholder-color);font-size:13px;z-index:2;pointer-events:none;transition:color .2s}.auth-field .auth-input{width:100%;padding:15px 40px 15px 37px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s,background .2s}.auth-field .auth-input::placeholder{color:transparent}.auth-field .auth-input:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721;background:var(--background-focus-input)}.auth-field .auth-input:focus~.auth-label{top:0;font-size:11px!important;color:#398bf7!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-input:focus~.auth-field-icon{color:#398bf7}.auth-field .auth-input:not(:placeholder-shown)~.auth-label{top:0;font-size:11px!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-label{position:absolute;left:35px;top:50%;transform:translateY(-50%);color:var(--placeholder-color)!important;font-size:13px!important;font-weight:400!important;pointer-events:none;transition:top .15s ease,font-size .15s ease,color .15s ease,padding .15s ease,background .15s ease;background:transparent;z-index:1;text-align:left!important}.auth-field .auth-toggle-pw{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--placeholder-color);cursor:pointer;padding:4px 6px;font-size:13px;z-index:2;line-height:1;transition:color .2s}.auth-field .auth-toggle-pw:hover{color:#398bf7}.auth-field.has-error .auth-input{border-color:#dc3545;box-shadow:none}.auth-field.has-error .auth-field-icon{color:#dc3545}.auth-select{width:100%;padding:13px 14px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s;margin-bottom:1rem;cursor:pointer}.auth-select:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721}.auth-btn{width:100%;padding:13px;border:none;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;transition:transform .15s ease,box-shadow .2s ease,opacity .2s;background:linear-gradient(135deg,#398bf7,#1e5fc4);color:#fff;letter-spacing:.3px;margin-bottom:10px;display:block}.auth-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 5px 18px #398bf761}.auth-btn:active:not(:disabled){transform:translateY(0)}.auth-btn:disabled{opacity:.55;cursor:not-allowed}.auth-btn.auth-btn--red{background:linear-gradient(135deg,#d1326f,#a82859)}.auth-btn.auth-btn--red:hover:not(:disabled){box-shadow:0 5px 18px #d1326f61}.auth-btn.auth-btn--outline{background:transparent;border:1.5px solid var(--font-border-input);color:var(--text-color)}.auth-btn.auth-btn--outline:hover:not(:disabled){background:var(--background-btn-light-hover);box-shadow:none;transform:none}.auth-links{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:16px;padding-top:16px;border-top:1px solid var(--border-color-modal)}.auth-version{text-align:right;margin-top:14px;padding-top:12px;border-top:1px solid var(--border-color-modal)}.auth-version span{font-size:11px;color:var(--placeholder-color)}.auth-error{font-size:11.5px;color:#dc3545;margin:-6px 0 10px 2px;padding:0}.auth-validation-list{margin:-4px 0 12px;padding:0;list-style:none}.auth-validation-list li{font-size:11.5px;color:#dc3545;padding:2px 0}.auth-validation-list li:before{content:\"\\2715 \";font-size:10px}.auth-desc{font-size:13px;color:var(--placeholder-color);margin-bottom:20px;line-height:1.65}.auth-section-title{font-size:15px;font-weight:600;color:var(--text-color);margin-bottom:20px}.font-12{font-size:12px}.form-control:focus{border-color:#0199ff9a!important;box-shadow:0 0 5px .2px #65befa44!important}@media (max-width: 900px){.auth-wrapper-login{grid-template-columns:1fr;grid-template-rows:auto 1fr;overflow-y:auto;overflow-x:hidden}.auth-panel-left{padding:14px 24px;justify-content:center}.auth-panel-left .auth-brand-subtitle,.auth-panel-left .auth-brand-features,.auth-panel-left .auth-brand-divider{display:none!important}.auth-panel-left .auth-brand-panel{display:flex!important;flex-direction:row!important;align-items:center;gap:0;text-align:left;max-width:none;width:100%;justify-content:center}.auth-panel-left .auth-brand-logo{width:52px;height:52px;margin:0;flex-shrink:0}.auth-panel-left .auth-brand-logo img{width:34px;height:34px}.auth-panel-left .auth-brand-title{font-size:20px;margin-bottom:0;margin-left:.5rem;flex-shrink:1}.auth-panel-right:after{inset:-25% 0 auto;width:100%;height:25%;background:linear-gradient(180deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLineV 7s ease-in-out infinite;animation-delay:3.5s}.auth-panel-right--dev:after{background:linear-gradient(180deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}}@keyframes authScanLineV{0%{top:-25%}50%{top:120%}to{top:120%}}@media (max-width: 480px){.auth-panel-left{padding:12px 16px}.auth-panel-left .auth-brand-logo{width:44px;height:44px}.auth-panel-left .auth-brand-logo img{width:28px;height:28px}.auth-panel-left .auth-brand-title{font-size:17px}.auth-form-wrapper>div{padding:20px 12px}.auth-card{padding:24px 18px 20px;border-radius:16px}.font-12{font-size:10px!important}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
|
|
302
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: SelectBranchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
303
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: SelectBranchComponent, isStandalone: true, selector: "lib-select-branch", inputs: { production: { classPropertyName: "production", publicName: "production", isSignal: true, isRequired: false, transformFunction: null }, module: { classPropertyName: "module", publicName: "module", isSignal: true, isRequired: false, transformFunction: null }, codsuc: { classPropertyName: "codsuc", publicName: "codsuc", isSignal: true, isRequired: false, transformFunction: null }, sucursalesList: { classPropertyName: "sucursalesList", publicName: "sucursalesList", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { codsuc: "codsucChange", loginEvent: "loginEvent" }, host: { listeners: { "document:keydown": "handleEnter($event)" } }, ngImport: i0, template: "<div class=\"auth-wrapper-login\">\r\n @let produccion = production();\r\n <div class=\"auth-panel-left\" [class.auth-panel-left--dev]=\"!produccion\">\r\n <span class=\"auth-blob auth-blob-1\"></span>\r\n <span class=\"auth-blob auth-blob-2\"></span>\r\n <span class=\"auth-blob auth-blob-3\"></span>\r\n <span class=\"auth-blob auth-blob-4\"></span>\r\n\r\n <div class=\"auth-brand-panel\">\r\n <div class=\"auth-brand-logo\">\r\n <img src=\"assets/images/logo-tsi-tres.png\" alt=\"TSI\" />\r\n </div>\r\n <h1 class=\"auth-brand-title\">{{module()}}</h1>\r\n <p class=\"auth-brand-subtitle\">Selecciona la sucursal desde donde vas a operar hoy</p>\r\n\r\n <div class=\"auth-brand-divider\"></div>\r\n\r\n <div class=\"auth-brand-features\">\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Acceso segmentado por sucursal\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"auth-panel-right\" [class.auth-panel-right--dev]=\"!produccion\">\r\n <div class=\"auth-panel-bg\">\r\n <span class=\"auth-deco auth-deco-tl\"></span>\r\n <span class=\"auth-deco auth-deco-br\"></span>\r\n </div>\r\n\r\n <div class=\"auth-form-wrapper\">\r\n <div>\r\n @if (!produccion) {\r\n <div>\r\n <span class=\"auth-test-badge\">\r\n <span class=\"badge-dot\"></span> ENTORNO DE PRUEBAS\r\n </span>\r\n </div>\r\n }\r\n\r\n <div class=\"auth-card\">\r\n <h2 class=\"auth-card-title\">Seleccionar sucursal</h2>\r\n <p class=\"auth-card-subtitle\">{{title()}}</p>\r\n\r\n <select class=\"auth-select\" [(ngModel)]=\"codsuc\">\r\n @for (suc of sucursalesList(); track $index) {\r\n <option [value]=\"suc.codsuc\">{{suc.sucursal}}</option>\r\n }\r\n </select>\r\n\r\n <button class=\"auth-btn\" [class.auth-btn--red]=\"!produccion\" (click)=\"goMain()\">\r\n Continuar\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["", "@charset \"UTF-8\";.red_contrasena,.blue_contrasena{position:relative;display:inline-block;font-size:13px;text-decoration:none;padding-bottom:2px;transition:color .3s ease;cursor:pointer}.red_contrasena:after,.blue_contrasena:after{content:\"\";position:absolute;bottom:0;left:50%;width:0;height:1px;background-color:currentColor;transition:all .3s ease;transform:translate(-50%)}.red_contrasena:hover:after,.blue_contrasena:hover:after{width:60%}.red_contrasena{color:#d1326f}.red_contrasena:hover{color:#a82859}.blue_contrasena{color:#398bf7}.blue_contrasena:hover{color:#1e5fc4}.auth-wrapper-login{position:fixed;inset:0;display:grid;grid-template-columns:1.15fr .85fr;overflow:hidden;background:#060d1f}.auth-panel-left{position:relative;overflow:hidden;background:linear-gradient(145deg,#040a18,#0b1a3d 55%,#040e22);display:flex;align-items:center;justify-content:center;padding:48px 40px}.auth-panel-left:before{content:\"\";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.055) 1px,transparent 1px);background-size:26px 26px;z-index:1;pointer-events:none}.auth-panel-left:after{content:\"\";position:absolute;top:0;left:-120%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(57,139,247,.04),transparent);animation:panelSweep 7s ease-in-out infinite;z-index:1;pointer-events:none}.auth-blob{position:absolute;border-radius:50%;filter:blur(72px);z-index:0;pointer-events:none}.auth-blob-1{width:340px;height:340px;background:radial-gradient(circle,rgba(57,139,247,.45) 0%,transparent 70%);top:-90px;right:-70px;animation:blobDrift 11s ease-in-out infinite}.auth-blob-2{width:240px;height:240px;background:radial-gradient(circle,rgba(124,58,237,.4) 0%,transparent 70%);bottom:60px;left:-50px;animation:blobDrift 14s ease-in-out infinite reverse}.auth-blob-3{width:180px;height:180px;background:radial-gradient(circle,rgba(14,165,233,.35) 0%,transparent 70%);bottom:-50px;right:40px;animation:blobDrift 9s ease-in-out infinite;animation-delay:-4s}.auth-blob-4{width:120px;height:120px;background:radial-gradient(circle,rgba(209,50,111,.25) 0%,transparent 70%);top:50%;left:50%;transform:translate(-50%,-50%);animation:blobDrift 16s ease-in-out infinite;animation-delay:-8s}@keyframes blobDrift{0%,to{transform:translate(0) scale(1)}33%{transform:translate(14px,-20px) scale(1.05)}66%{transform:translate(-10px,12px) scale(.96)}}@keyframes panelSweep{0%{left:-120%}50%{left:160%}to{left:160%}}.auth-brand-panel{position:relative;z-index:2;text-align:center;color:#fff;max-width:340px}.auth-brand-logo{width:100px;height:100px;border-radius:50%;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;margin:0 auto 28px;box-shadow:0 0 0 14px #398bf70f,0 0 50px #398bf733;backdrop-filter:blur(8px)}.auth-brand-logo img{width:64px;height:64px;object-fit:contain;filter:brightness(1.05) drop-shadow(0 0 8px rgba(57,139,247,.4))}.auth-brand-title{font-size:30px;font-weight:700;letter-spacing:-.5px;margin-bottom:10px;background:linear-gradient(135deg,#fff 20%,#93c5fd 80%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.auth-brand-subtitle{font-size:14px;color:#ffffff73;line-height:1.65;margin-bottom:40px;letter-spacing:.2px}.auth-brand-features{display:flex;flex-direction:column;gap:14px;text-align:left}.auth-brand-feature{display:flex;align-items:center;gap:12px;font-size:13px;color:#fff9}.auth-brand-feature .feat-dot{flex-shrink:0;width:7px;height:7px;border-radius:50%;background:#398bf7;box-shadow:0 0 10px #398bf7b3}.auth-brand-divider{width:60px;height:2px;background:linear-gradient(90deg,transparent,#398bf7,transparent);margin:28px auto 32px;border-radius:2px}.auth-panel-left--dev{background:linear-gradient(145deg,#18040b,#3d0b1d 55%,#220409)}.auth-panel-left--dev:after{background:linear-gradient(90deg,transparent,rgba(209,50,111,.05),transparent)}.auth-panel-left--dev .auth-blob-1{background:radial-gradient(circle,rgba(220,38,38,.52) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-2{background:radial-gradient(circle,rgba(219,39,119,.44) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-3{background:radial-gradient(circle,rgba(239,68,68,.38) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-4{background:radial-gradient(circle,rgba(249,115,22,.28) 0%,transparent 70%)}.auth-panel-left--dev .auth-brand-logo{box-shadow:0 0 0 14px #d1326f12,0 0 50px #d1326f38}.auth-panel-left--dev .auth-brand-logo img{filter:brightness(1.05) drop-shadow(0 0 8px rgba(209,50,111,.45))}.auth-panel-left--dev .auth-brand-title{background:linear-gradient(135deg,#fff 20%,#fca5a5 80%);-webkit-background-clip:text;background-clip:text}.auth-panel-left--dev .auth-brand-divider{background:linear-gradient(90deg,transparent,rgb(209,50,111),transparent)}.auth-panel-left--dev .feat-dot{background:#d1326f;box-shadow:0 0 10px #d1326fb8}.auth-panel-right{position:relative;overflow:hidden;background:var(--background-login)}.auth-panel-right:before{content:\"\";position:absolute;inset:0;background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(57,139,247,.045) 22px,rgba(57,139,247,.045) 23px);animation:authLinesMove 10s linear infinite;pointer-events:none;z-index:0}.auth-panel-right:after{content:\"\";position:absolute;top:0;bottom:0;left:-25%;width:25%;background:linear-gradient(90deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLine 7s ease-in-out infinite;animation-delay:3.5s;pointer-events:none;z-index:0}@keyframes authLinesMove{0%{transform:translate(0)}to{transform:translate(46px,46px)}}@keyframes authScanLine{0%{left:-25%}50%{left:120%}to{left:120%}}.auth-panel-bg{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}.auth-deco{position:absolute;border-radius:50%;pointer-events:none;filter:blur(70px)}.auth-deco-tl{width:300px;height:300px;top:0;left:-120px;transform:translateY(-40%);background:radial-gradient(circle,rgba(57,139,247,.12) 0%,transparent 70%);animation:authOrbPulse 6s ease-in-out infinite}.auth-deco-br{width:340px;height:340px;bottom:0;right:-120px;transform:translateY(40%);background:radial-gradient(circle,rgba(124,58,237,.1) 0%,transparent 70%);animation:authOrbPulse 8s ease-in-out infinite;animation-delay:-4s}@keyframes authOrbPulse{0%,to{opacity:.7}50%{opacity:1}}.auth-form-wrapper{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;align-items:center;z-index:1}.auth-form-wrapper>div{width:100%;max-width:420px;margin:auto;padding:36px 16px;box-sizing:border-box}.auth-panel-right--dev:before{background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(209,50,111,.05) 22px,rgba(209,50,111,.05) 23px)}.auth-panel-right--dev:after{background:linear-gradient(90deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}.auth-panel-right--dev .auth-deco-tl{background:radial-gradient(circle,rgba(209,50,111,.12) 0%,transparent 70%)}.auth-panel-right--dev .auth-deco-br{background:radial-gradient(circle,rgba(239,68,68,.1) 0%,transparent 70%)}.auth-test-badge{display:inline-flex;align-items:center;gap:7px;background:#d1326f14;border:1px solid rgba(209,50,111,.25);color:#d1326f;font-size:10.5px;font-weight:700;padding:5px 12px;border-radius:20px;margin-bottom:18px;letter-spacing:.8px}.auth-test-badge .badge-dot{width:6px;height:6px;border-radius:50%;background:#d1326f;animation:badgePulse 1.6s ease-in-out infinite;flex-shrink:0}@keyframes badgePulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.75)}}.auth-card{background:var(--background-card);border-radius:20px;padding:36px 32px 28px;box-shadow:0 4px 28px #00000014;border:1px solid var(--border-color-modal)}.auth-card-title{font-size:22px;font-weight:700;color:var(--text-color);margin-bottom:4px;letter-spacing:-.3px}.auth-card-subtitle{font-size:13px;color:var(--placeholder-color);margin-bottom:26px}.auth-field{position:relative;margin-bottom:1rem}.auth-field .auth-field-icon{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--placeholder-color);font-size:13px;z-index:2;pointer-events:none;transition:color .2s}.auth-field .auth-input{width:100%;padding:15px 40px 15px 37px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s,background .2s}.auth-field .auth-input::placeholder{color:transparent}.auth-field .auth-input:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721;background:var(--background-focus-input)}.auth-field .auth-input:focus~.auth-label{top:0;font-size:11px!important;color:#398bf7!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-input:focus~.auth-field-icon{color:#398bf7}.auth-field .auth-input:not(:placeholder-shown)~.auth-label{top:0;font-size:11px!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-label{position:absolute;left:35px;top:50%;transform:translateY(-50%);color:var(--placeholder-color)!important;font-size:13px!important;font-weight:400!important;pointer-events:none;transition:top .15s ease,font-size .15s ease,color .15s ease,padding .15s ease,background .15s ease;background:transparent;z-index:1;text-align:left!important}.auth-field .auth-toggle-pw{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--placeholder-color);cursor:pointer;padding:4px 6px;font-size:13px;z-index:2;line-height:1;transition:color .2s}.auth-field .auth-toggle-pw:hover{color:#398bf7}.auth-field.has-error .auth-input{border-color:#dc3545;box-shadow:none}.auth-field.has-error .auth-field-icon{color:#dc3545}.auth-select{width:100%;padding:13px 14px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s;margin-bottom:1rem;cursor:pointer}.auth-select:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721}.auth-btn{width:100%;padding:13px;border:none;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;transition:transform .15s ease,box-shadow .2s ease,opacity .2s;background:linear-gradient(135deg,#398bf7,#1e5fc4);color:#fff;letter-spacing:.3px;margin-bottom:10px;display:block}.auth-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 5px 18px #398bf761}.auth-btn:active:not(:disabled){transform:translateY(0)}.auth-btn:disabled{opacity:.55;cursor:not-allowed}.auth-btn.auth-btn--red{background:linear-gradient(135deg,#d1326f,#a82859)}.auth-btn.auth-btn--red:hover:not(:disabled){box-shadow:0 5px 18px #d1326f61}.auth-btn.auth-btn--outline{background:transparent;border:1.5px solid var(--font-border-input);color:var(--text-color)}.auth-btn.auth-btn--outline:hover:not(:disabled){background:var(--background-btn-light-hover);box-shadow:none;transform:none}.auth-links{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:16px;padding-top:16px;border-top:1px solid var(--border-color-modal)}.auth-version{text-align:right;margin-top:14px;padding-top:12px;border-top:1px solid var(--border-color-modal)}.auth-version span{font-size:11px;color:var(--placeholder-color)}.auth-error{font-size:11.5px;color:#dc3545;margin:-6px 0 10px 2px;padding:0}.auth-hint{display:flex;align-items:flex-start;gap:6px;font-size:11.5px;color:var(--placeholder-color);margin:-6px 0 14px 2px;padding:0;line-height:1.35}.auth-hint i{margin-top:2px;flex-shrink:0}.auth-validation-list{margin:-4px 0 12px;padding:0;list-style:none}.auth-validation-list li{font-size:11.5px;color:#dc3545;padding:2px 0}.auth-validation-list li:before{content:\"\\2715 \";font-size:10px}.auth-desc{font-size:13px;color:var(--placeholder-color);margin-bottom:20px;line-height:1.65}.auth-section-title{font-size:15px;font-weight:600;color:var(--text-color);margin-bottom:20px}.font-12{font-size:12px}.form-control:focus{border-color:#0199ff9a!important;box-shadow:0 0 5px .2px #65befa44!important}@media(max-width:900px){.auth-wrapper-login{grid-template-columns:1fr;grid-template-rows:auto 1fr;overflow-y:auto;overflow-x:hidden}.auth-panel-left{padding:14px 24px;justify-content:center}.auth-panel-left .auth-brand-subtitle,.auth-panel-left .auth-brand-features,.auth-panel-left .auth-brand-divider{display:none!important}.auth-panel-left .auth-brand-panel{display:flex!important;flex-direction:row!important;align-items:center;gap:0;text-align:left;max-width:none;width:100%;justify-content:center}.auth-panel-left .auth-brand-logo{width:52px;height:52px;margin:0;flex-shrink:0}.auth-panel-left .auth-brand-logo img{width:34px;height:34px}.auth-panel-left .auth-brand-title{font-size:20px;margin-bottom:0;margin-left:.5rem;flex-shrink:1}.auth-panel-right:after{inset:-25% 0 auto;width:100%;height:25%;background:linear-gradient(180deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLineV 7s ease-in-out infinite;animation-delay:3.5s}.auth-panel-right--dev:after{background:linear-gradient(180deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}}@keyframes authScanLineV{0%{top:-25%}50%{top:120%}to{top:120%}}@media(max-width:480px){.auth-panel-left{padding:12px 16px}.auth-panel-left .auth-brand-logo{width:44px;height:44px}.auth-panel-left .auth-brand-logo img{width:28px;height:28px}.auth-panel-left .auth-brand-title{font-size:17px}.auth-form-wrapper>div{padding:20px 12px}.auth-card{padding:24px 18px 20px;border-radius:16px}.font-12{font-size:10px!important}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
|
|
199
304
|
}
|
|
200
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
305
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: SelectBranchComponent, decorators: [{
|
|
201
306
|
type: Component,
|
|
202
|
-
args: [{ selector: 'lib-select-branch', imports: [FormsModule], template: "<div class=\"auth-wrapper-login\">\r\n @let produccion = production();\r\n <div class=\"auth-panel-left\" [class.auth-panel-left--dev]=\"!produccion\">\r\n <span class=\"auth-blob auth-blob-1\"></span>\r\n <span class=\"auth-blob auth-blob-2\"></span>\r\n <span class=\"auth-blob auth-blob-3\"></span>\r\n <span class=\"auth-blob auth-blob-4\"></span>\r\n\r\n <div class=\"auth-brand-panel\">\r\n <div class=\"auth-brand-logo\">\r\n <img src=\"assets/images/logo-tsi-tres.png\" alt=\"TSI\" />\r\n </div>\r\n <h1 class=\"auth-brand-title\">{{module()}}</h1>\r\n <p class=\"auth-brand-subtitle\">Selecciona la sucursal desde donde vas a operar hoy</p>\r\n\r\n <div class=\"auth-brand-divider\"></div>\r\n\r\n <div class=\"auth-brand-features\">\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Acceso segmentado por sucursal\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"auth-panel-right\" [class.auth-panel-right--dev]=\"!produccion\">\r\n <div class=\"auth-panel-bg\">\r\n <span class=\"auth-deco auth-deco-tl\"></span>\r\n <span class=\"auth-deco auth-deco-br\"></span>\r\n </div>\r\n\r\n <div class=\"auth-form-wrapper\">\r\n <div>\r\n @if (!produccion) {\r\n <div>\r\n <span class=\"auth-test-badge\">\r\n <span class=\"badge-dot\"></span> ENTORNO DE PRUEBAS\r\n </span>\r\n </div>\r\n }\r\n\r\n <div class=\"auth-card\">\r\n <h2 class=\"auth-card-title\">Seleccionar sucursal</h2>\r\n <p class=\"auth-card-subtitle\">{{title()}}</p>\r\n\r\n <select class=\"auth-select\" [(ngModel)]=\"codsuc\">\r\n @for (suc of sucursalesList(); track $index) {\r\n <option [value]=\"suc.codsuc\">{{suc.sucursal}}</option>\r\n }\r\n </select>\r\n\r\n <button class=\"auth-btn\" [class.auth-btn--red]=\"!produccion\" (click)=\"goMain()\">\r\n Continuar\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["@charset \"UTF-8\";.red_contrasena,.blue_contrasena{position:relative;display:inline-block;font-size:13px;text-decoration:none;padding-bottom:2px;transition:color .3s ease;cursor:pointer}.red_contrasena:after,.blue_contrasena:after{content:\"\";position:absolute;bottom:0;left:50%;width:0;height:1px;background-color:currentColor;transition:all .3s ease;transform:translate(-50%)}.red_contrasena:hover:after,.blue_contrasena:hover:after{width:60%}.red_contrasena{color:#d1326f}.red_contrasena:hover{color:#a82859}.blue_contrasena{color:#398bf7}.blue_contrasena:hover{color:#1e5fc4}.auth-wrapper-login{position:fixed;inset:0;display:grid;grid-template-columns:1.15fr .85fr;overflow:hidden;background:#060d1f}.auth-panel-left{position:relative;overflow:hidden;background:linear-gradient(145deg,#040a18,#0b1a3d 55%,#040e22);display:flex;align-items:center;justify-content:center;padding:48px 40px}.auth-panel-left:before{content:\"\";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.055) 1px,transparent 1px);background-size:26px 26px;z-index:1;pointer-events:none}.auth-panel-left:after{content:\"\";position:absolute;top:0;left:-120%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(57,139,247,.04),transparent);animation:panelSweep 7s ease-in-out infinite;z-index:1;pointer-events:none}.auth-blob{position:absolute;border-radius:50%;filter:blur(72px);z-index:0;pointer-events:none}.auth-blob-1{width:340px;height:340px;background:radial-gradient(circle,rgba(57,139,247,.45) 0%,transparent 70%);top:-90px;right:-70px;animation:blobDrift 11s ease-in-out infinite}.auth-blob-2{width:240px;height:240px;background:radial-gradient(circle,rgba(124,58,237,.4) 0%,transparent 70%);bottom:60px;left:-50px;animation:blobDrift 14s ease-in-out infinite reverse}.auth-blob-3{width:180px;height:180px;background:radial-gradient(circle,rgba(14,165,233,.35) 0%,transparent 70%);bottom:-50px;right:40px;animation:blobDrift 9s ease-in-out infinite;animation-delay:-4s}.auth-blob-4{width:120px;height:120px;background:radial-gradient(circle,rgba(209,50,111,.25) 0%,transparent 70%);top:50%;left:50%;transform:translate(-50%,-50%);animation:blobDrift 16s ease-in-out infinite;animation-delay:-8s}@keyframes blobDrift{0%,to{transform:translate(0) scale(1)}33%{transform:translate(14px,-20px) scale(1.05)}66%{transform:translate(-10px,12px) scale(.96)}}@keyframes panelSweep{0%{left:-120%}50%{left:160%}to{left:160%}}.auth-brand-panel{position:relative;z-index:2;text-align:center;color:#fff;max-width:340px}.auth-brand-logo{width:100px;height:100px;border-radius:50%;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;margin:0 auto 28px;box-shadow:0 0 0 14px #398bf70f,0 0 50px #398bf733;backdrop-filter:blur(8px)}.auth-brand-logo img{width:64px;height:64px;object-fit:contain;filter:brightness(1.05) drop-shadow(0 0 8px rgba(57,139,247,.4))}.auth-brand-title{font-size:30px;font-weight:700;letter-spacing:-.5px;margin-bottom:10px;background:linear-gradient(135deg,#fff 20%,#93c5fd 80%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.auth-brand-subtitle{font-size:14px;color:#ffffff73;line-height:1.65;margin-bottom:40px;letter-spacing:.2px}.auth-brand-features{display:flex;flex-direction:column;gap:14px;text-align:left}.auth-brand-feature{display:flex;align-items:center;gap:12px;font-size:13px;color:#fff9}.auth-brand-feature .feat-dot{flex-shrink:0;width:7px;height:7px;border-radius:50%;background:#398bf7;box-shadow:0 0 10px #398bf7b3}.auth-brand-divider{width:60px;height:2px;background:linear-gradient(90deg,transparent,#398bf7,transparent);margin:28px auto 32px;border-radius:2px}.auth-panel-left--dev{background:linear-gradient(145deg,#18040b,#3d0b1d 55%,#220409)}.auth-panel-left--dev:after{background:linear-gradient(90deg,transparent,rgba(209,50,111,.05),transparent)}.auth-panel-left--dev .auth-blob-1{background:radial-gradient(circle,rgba(220,38,38,.52) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-2{background:radial-gradient(circle,rgba(219,39,119,.44) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-3{background:radial-gradient(circle,rgba(239,68,68,.38) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-4{background:radial-gradient(circle,rgba(249,115,22,.28) 0%,transparent 70%)}.auth-panel-left--dev .auth-brand-logo{box-shadow:0 0 0 14px #d1326f12,0 0 50px #d1326f38}.auth-panel-left--dev .auth-brand-logo img{filter:brightness(1.05) drop-shadow(0 0 8px rgba(209,50,111,.45))}.auth-panel-left--dev .auth-brand-title{background:linear-gradient(135deg,#fff 20%,#fca5a5 80%);-webkit-background-clip:text;background-clip:text}.auth-panel-left--dev .auth-brand-divider{background:linear-gradient(90deg,transparent,rgb(209,50,111),transparent)}.auth-panel-left--dev .feat-dot{background:#d1326f;box-shadow:0 0 10px #d1326fb8}.auth-panel-right{position:relative;overflow:hidden;background:var(--background-login)}.auth-panel-right:before{content:\"\";position:absolute;inset:0;background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(57,139,247,.045) 22px,rgba(57,139,247,.045) 23px);animation:authLinesMove 10s linear infinite;pointer-events:none;z-index:0}.auth-panel-right:after{content:\"\";position:absolute;top:0;bottom:0;left:-25%;width:25%;background:linear-gradient(90deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLine 7s ease-in-out infinite;animation-delay:3.5s;pointer-events:none;z-index:0}@keyframes authLinesMove{0%{transform:translate(0)}to{transform:translate(46px,46px)}}@keyframes authScanLine{0%{left:-25%}50%{left:120%}to{left:120%}}.auth-panel-bg{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}.auth-deco{position:absolute;border-radius:50%;pointer-events:none;filter:blur(70px)}.auth-deco-tl{width:300px;height:300px;top:0;left:-120px;transform:translateY(-40%);background:radial-gradient(circle,rgba(57,139,247,.12) 0%,transparent 70%);animation:authOrbPulse 6s ease-in-out infinite}.auth-deco-br{width:340px;height:340px;bottom:0;right:-120px;transform:translateY(40%);background:radial-gradient(circle,rgba(124,58,237,.1) 0%,transparent 70%);animation:authOrbPulse 8s ease-in-out infinite;animation-delay:-4s}@keyframes authOrbPulse{0%,to{opacity:.7}50%{opacity:1}}.auth-form-wrapper{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;align-items:center;z-index:1}.auth-form-wrapper>div{width:100%;max-width:420px;margin:auto;padding:36px 16px;box-sizing:border-box}.auth-panel-right--dev:before{background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(209,50,111,.05) 22px,rgba(209,50,111,.05) 23px)}.auth-panel-right--dev:after{background:linear-gradient(90deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}.auth-panel-right--dev .auth-deco-tl{background:radial-gradient(circle,rgba(209,50,111,.12) 0%,transparent 70%)}.auth-panel-right--dev .auth-deco-br{background:radial-gradient(circle,rgba(239,68,68,.1) 0%,transparent 70%)}.auth-test-badge{display:inline-flex;align-items:center;gap:7px;background:#d1326f14;border:1px solid rgba(209,50,111,.25);color:#d1326f;font-size:10.5px;font-weight:700;padding:5px 12px;border-radius:20px;margin-bottom:18px;letter-spacing:.8px}.auth-test-badge .badge-dot{width:6px;height:6px;border-radius:50%;background:#d1326f;animation:badgePulse 1.6s ease-in-out infinite;flex-shrink:0}@keyframes badgePulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.75)}}.auth-card{background:var(--background-card);border-radius:20px;padding:36px 32px 28px;box-shadow:0 4px 28px #00000014;border:1px solid var(--border-color-modal)}.auth-card-title{font-size:22px;font-weight:700;color:var(--text-color);margin-bottom:4px;letter-spacing:-.3px}.auth-card-subtitle{font-size:13px;color:var(--placeholder-color);margin-bottom:26px}.auth-field{position:relative;margin-bottom:1rem}.auth-field .auth-field-icon{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--placeholder-color);font-size:13px;z-index:2;pointer-events:none;transition:color .2s}.auth-field .auth-input{width:100%;padding:15px 40px 15px 37px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s,background .2s}.auth-field .auth-input::placeholder{color:transparent}.auth-field .auth-input:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721;background:var(--background-focus-input)}.auth-field .auth-input:focus~.auth-label{top:0;font-size:11px!important;color:#398bf7!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-input:focus~.auth-field-icon{color:#398bf7}.auth-field .auth-input:not(:placeholder-shown)~.auth-label{top:0;font-size:11px!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-label{position:absolute;left:35px;top:50%;transform:translateY(-50%);color:var(--placeholder-color)!important;font-size:13px!important;font-weight:400!important;pointer-events:none;transition:top .15s ease,font-size .15s ease,color .15s ease,padding .15s ease,background .15s ease;background:transparent;z-index:1;text-align:left!important}.auth-field .auth-toggle-pw{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--placeholder-color);cursor:pointer;padding:4px 6px;font-size:13px;z-index:2;line-height:1;transition:color .2s}.auth-field .auth-toggle-pw:hover{color:#398bf7}.auth-field.has-error .auth-input{border-color:#dc3545;box-shadow:none}.auth-field.has-error .auth-field-icon{color:#dc3545}.auth-select{width:100%;padding:13px 14px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s;margin-bottom:1rem;cursor:pointer}.auth-select:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721}.auth-btn{width:100%;padding:13px;border:none;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;transition:transform .15s ease,box-shadow .2s ease,opacity .2s;background:linear-gradient(135deg,#398bf7,#1e5fc4);color:#fff;letter-spacing:.3px;margin-bottom:10px;display:block}.auth-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 5px 18px #398bf761}.auth-btn:active:not(:disabled){transform:translateY(0)}.auth-btn:disabled{opacity:.55;cursor:not-allowed}.auth-btn.auth-btn--red{background:linear-gradient(135deg,#d1326f,#a82859)}.auth-btn.auth-btn--red:hover:not(:disabled){box-shadow:0 5px 18px #d1326f61}.auth-btn.auth-btn--outline{background:transparent;border:1.5px solid var(--font-border-input);color:var(--text-color)}.auth-btn.auth-btn--outline:hover:not(:disabled){background:var(--background-btn-light-hover);box-shadow:none;transform:none}.auth-links{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:16px;padding-top:16px;border-top:1px solid var(--border-color-modal)}.auth-version{text-align:right;margin-top:14px;padding-top:12px;border-top:1px solid var(--border-color-modal)}.auth-version span{font-size:11px;color:var(--placeholder-color)}.auth-error{font-size:11.5px;color:#dc3545;margin:-6px 0 10px 2px;padding:0}.auth-validation-list{margin:-4px 0 12px;padding:0;list-style:none}.auth-validation-list li{font-size:11.5px;color:#dc3545;padding:2px 0}.auth-validation-list li:before{content:\"\\2715 \";font-size:10px}.auth-desc{font-size:13px;color:var(--placeholder-color);margin-bottom:20px;line-height:1.65}.auth-section-title{font-size:15px;font-weight:600;color:var(--text-color);margin-bottom:20px}.font-12{font-size:12px}.form-control:focus{border-color:#0199ff9a!important;box-shadow:0 0 5px .2px #65befa44!important}@media (max-width: 900px){.auth-wrapper-login{grid-template-columns:1fr;grid-template-rows:auto 1fr;overflow-y:auto;overflow-x:hidden}.auth-panel-left{padding:14px 24px;justify-content:center}.auth-panel-left .auth-brand-subtitle,.auth-panel-left .auth-brand-features,.auth-panel-left .auth-brand-divider{display:none!important}.auth-panel-left .auth-brand-panel{display:flex!important;flex-direction:row!important;align-items:center;gap:0;text-align:left;max-width:none;width:100%;justify-content:center}.auth-panel-left .auth-brand-logo{width:52px;height:52px;margin:0;flex-shrink:0}.auth-panel-left .auth-brand-logo img{width:34px;height:34px}.auth-panel-left .auth-brand-title{font-size:20px;margin-bottom:0;margin-left:.5rem;flex-shrink:1}.auth-panel-right:after{inset:-25% 0 auto;width:100%;height:25%;background:linear-gradient(180deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLineV 7s ease-in-out infinite;animation-delay:3.5s}.auth-panel-right--dev:after{background:linear-gradient(180deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}}@keyframes authScanLineV{0%{top:-25%}50%{top:120%}to{top:120%}}@media (max-width: 480px){.auth-panel-left{padding:12px 16px}.auth-panel-left .auth-brand-logo{width:44px;height:44px}.auth-panel-left .auth-brand-logo img{width:28px;height:28px}.auth-panel-left .auth-brand-title{font-size:17px}.auth-form-wrapper>div{padding:20px 12px}.auth-card{padding:24px 18px 20px;border-radius:16px}.font-12{font-size:10px!important}}\n"] }]
|
|
307
|
+
args: [{ selector: 'lib-select-branch', imports: [FormsModule], template: "<div class=\"auth-wrapper-login\">\r\n @let produccion = production();\r\n <div class=\"auth-panel-left\" [class.auth-panel-left--dev]=\"!produccion\">\r\n <span class=\"auth-blob auth-blob-1\"></span>\r\n <span class=\"auth-blob auth-blob-2\"></span>\r\n <span class=\"auth-blob auth-blob-3\"></span>\r\n <span class=\"auth-blob auth-blob-4\"></span>\r\n\r\n <div class=\"auth-brand-panel\">\r\n <div class=\"auth-brand-logo\">\r\n <img src=\"assets/images/logo-tsi-tres.png\" alt=\"TSI\" />\r\n </div>\r\n <h1 class=\"auth-brand-title\">{{module()}}</h1>\r\n <p class=\"auth-brand-subtitle\">Selecciona la sucursal desde donde vas a operar hoy</p>\r\n\r\n <div class=\"auth-brand-divider\"></div>\r\n\r\n <div class=\"auth-brand-features\">\r\n <div class=\"auth-brand-feature\">\r\n <span class=\"feat-dot\"></span> Acceso segmentado por sucursal\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"auth-panel-right\" [class.auth-panel-right--dev]=\"!produccion\">\r\n <div class=\"auth-panel-bg\">\r\n <span class=\"auth-deco auth-deco-tl\"></span>\r\n <span class=\"auth-deco auth-deco-br\"></span>\r\n </div>\r\n\r\n <div class=\"auth-form-wrapper\">\r\n <div>\r\n @if (!produccion) {\r\n <div>\r\n <span class=\"auth-test-badge\">\r\n <span class=\"badge-dot\"></span> ENTORNO DE PRUEBAS\r\n </span>\r\n </div>\r\n }\r\n\r\n <div class=\"auth-card\">\r\n <h2 class=\"auth-card-title\">Seleccionar sucursal</h2>\r\n <p class=\"auth-card-subtitle\">{{title()}}</p>\r\n\r\n <select class=\"auth-select\" [(ngModel)]=\"codsuc\">\r\n @for (suc of sucursalesList(); track $index) {\r\n <option [value]=\"suc.codsuc\">{{suc.sucursal}}</option>\r\n }\r\n </select>\r\n\r\n <button class=\"auth-btn\" [class.auth-btn--red]=\"!produccion\" (click)=\"goMain()\">\r\n Continuar\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["@charset \"UTF-8\";.red_contrasena,.blue_contrasena{position:relative;display:inline-block;font-size:13px;text-decoration:none;padding-bottom:2px;transition:color .3s ease;cursor:pointer}.red_contrasena:after,.blue_contrasena:after{content:\"\";position:absolute;bottom:0;left:50%;width:0;height:1px;background-color:currentColor;transition:all .3s ease;transform:translate(-50%)}.red_contrasena:hover:after,.blue_contrasena:hover:after{width:60%}.red_contrasena{color:#d1326f}.red_contrasena:hover{color:#a82859}.blue_contrasena{color:#398bf7}.blue_contrasena:hover{color:#1e5fc4}.auth-wrapper-login{position:fixed;inset:0;display:grid;grid-template-columns:1.15fr .85fr;overflow:hidden;background:#060d1f}.auth-panel-left{position:relative;overflow:hidden;background:linear-gradient(145deg,#040a18,#0b1a3d 55%,#040e22);display:flex;align-items:center;justify-content:center;padding:48px 40px}.auth-panel-left:before{content:\"\";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.055) 1px,transparent 1px);background-size:26px 26px;z-index:1;pointer-events:none}.auth-panel-left:after{content:\"\";position:absolute;top:0;left:-120%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(57,139,247,.04),transparent);animation:panelSweep 7s ease-in-out infinite;z-index:1;pointer-events:none}.auth-blob{position:absolute;border-radius:50%;filter:blur(72px);z-index:0;pointer-events:none}.auth-blob-1{width:340px;height:340px;background:radial-gradient(circle,rgba(57,139,247,.45) 0%,transparent 70%);top:-90px;right:-70px;animation:blobDrift 11s ease-in-out infinite}.auth-blob-2{width:240px;height:240px;background:radial-gradient(circle,rgba(124,58,237,.4) 0%,transparent 70%);bottom:60px;left:-50px;animation:blobDrift 14s ease-in-out infinite reverse}.auth-blob-3{width:180px;height:180px;background:radial-gradient(circle,rgba(14,165,233,.35) 0%,transparent 70%);bottom:-50px;right:40px;animation:blobDrift 9s ease-in-out infinite;animation-delay:-4s}.auth-blob-4{width:120px;height:120px;background:radial-gradient(circle,rgba(209,50,111,.25) 0%,transparent 70%);top:50%;left:50%;transform:translate(-50%,-50%);animation:blobDrift 16s ease-in-out infinite;animation-delay:-8s}@keyframes blobDrift{0%,to{transform:translate(0) scale(1)}33%{transform:translate(14px,-20px) scale(1.05)}66%{transform:translate(-10px,12px) scale(.96)}}@keyframes panelSweep{0%{left:-120%}50%{left:160%}to{left:160%}}.auth-brand-panel{position:relative;z-index:2;text-align:center;color:#fff;max-width:340px}.auth-brand-logo{width:100px;height:100px;border-radius:50%;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;margin:0 auto 28px;box-shadow:0 0 0 14px #398bf70f,0 0 50px #398bf733;backdrop-filter:blur(8px)}.auth-brand-logo img{width:64px;height:64px;object-fit:contain;filter:brightness(1.05) drop-shadow(0 0 8px rgba(57,139,247,.4))}.auth-brand-title{font-size:30px;font-weight:700;letter-spacing:-.5px;margin-bottom:10px;background:linear-gradient(135deg,#fff 20%,#93c5fd 80%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.auth-brand-subtitle{font-size:14px;color:#ffffff73;line-height:1.65;margin-bottom:40px;letter-spacing:.2px}.auth-brand-features{display:flex;flex-direction:column;gap:14px;text-align:left}.auth-brand-feature{display:flex;align-items:center;gap:12px;font-size:13px;color:#fff9}.auth-brand-feature .feat-dot{flex-shrink:0;width:7px;height:7px;border-radius:50%;background:#398bf7;box-shadow:0 0 10px #398bf7b3}.auth-brand-divider{width:60px;height:2px;background:linear-gradient(90deg,transparent,#398bf7,transparent);margin:28px auto 32px;border-radius:2px}.auth-panel-left--dev{background:linear-gradient(145deg,#18040b,#3d0b1d 55%,#220409)}.auth-panel-left--dev:after{background:linear-gradient(90deg,transparent,rgba(209,50,111,.05),transparent)}.auth-panel-left--dev .auth-blob-1{background:radial-gradient(circle,rgba(220,38,38,.52) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-2{background:radial-gradient(circle,rgba(219,39,119,.44) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-3{background:radial-gradient(circle,rgba(239,68,68,.38) 0%,transparent 70%)}.auth-panel-left--dev .auth-blob-4{background:radial-gradient(circle,rgba(249,115,22,.28) 0%,transparent 70%)}.auth-panel-left--dev .auth-brand-logo{box-shadow:0 0 0 14px #d1326f12,0 0 50px #d1326f38}.auth-panel-left--dev .auth-brand-logo img{filter:brightness(1.05) drop-shadow(0 0 8px rgba(209,50,111,.45))}.auth-panel-left--dev .auth-brand-title{background:linear-gradient(135deg,#fff 20%,#fca5a5 80%);-webkit-background-clip:text;background-clip:text}.auth-panel-left--dev .auth-brand-divider{background:linear-gradient(90deg,transparent,rgb(209,50,111),transparent)}.auth-panel-left--dev .feat-dot{background:#d1326f;box-shadow:0 0 10px #d1326fb8}.auth-panel-right{position:relative;overflow:hidden;background:var(--background-login)}.auth-panel-right:before{content:\"\";position:absolute;inset:0;background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(57,139,247,.045) 22px,rgba(57,139,247,.045) 23px);animation:authLinesMove 10s linear infinite;pointer-events:none;z-index:0}.auth-panel-right:after{content:\"\";position:absolute;top:0;bottom:0;left:-25%;width:25%;background:linear-gradient(90deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLine 7s ease-in-out infinite;animation-delay:3.5s;pointer-events:none;z-index:0}@keyframes authLinesMove{0%{transform:translate(0)}to{transform:translate(46px,46px)}}@keyframes authScanLine{0%{left:-25%}50%{left:120%}to{left:120%}}.auth-panel-bg{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}.auth-deco{position:absolute;border-radius:50%;pointer-events:none;filter:blur(70px)}.auth-deco-tl{width:300px;height:300px;top:0;left:-120px;transform:translateY(-40%);background:radial-gradient(circle,rgba(57,139,247,.12) 0%,transparent 70%);animation:authOrbPulse 6s ease-in-out infinite}.auth-deco-br{width:340px;height:340px;bottom:0;right:-120px;transform:translateY(40%);background:radial-gradient(circle,rgba(124,58,237,.1) 0%,transparent 70%);animation:authOrbPulse 8s ease-in-out infinite;animation-delay:-4s}@keyframes authOrbPulse{0%,to{opacity:.7}50%{opacity:1}}.auth-form-wrapper{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;align-items:center;z-index:1}.auth-form-wrapper>div{width:100%;max-width:420px;margin:auto;padding:36px 16px;box-sizing:border-box}.auth-panel-right--dev:before{background-image:repeating-linear-gradient(-55deg,transparent 0px,transparent 22px,rgba(209,50,111,.05) 22px,rgba(209,50,111,.05) 23px)}.auth-panel-right--dev:after{background:linear-gradient(90deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}.auth-panel-right--dev .auth-deco-tl{background:radial-gradient(circle,rgba(209,50,111,.12) 0%,transparent 70%)}.auth-panel-right--dev .auth-deco-br{background:radial-gradient(circle,rgba(239,68,68,.1) 0%,transparent 70%)}.auth-test-badge{display:inline-flex;align-items:center;gap:7px;background:#d1326f14;border:1px solid rgba(209,50,111,.25);color:#d1326f;font-size:10.5px;font-weight:700;padding:5px 12px;border-radius:20px;margin-bottom:18px;letter-spacing:.8px}.auth-test-badge .badge-dot{width:6px;height:6px;border-radius:50%;background:#d1326f;animation:badgePulse 1.6s ease-in-out infinite;flex-shrink:0}@keyframes badgePulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.75)}}.auth-card{background:var(--background-card);border-radius:20px;padding:36px 32px 28px;box-shadow:0 4px 28px #00000014;border:1px solid var(--border-color-modal)}.auth-card-title{font-size:22px;font-weight:700;color:var(--text-color);margin-bottom:4px;letter-spacing:-.3px}.auth-card-subtitle{font-size:13px;color:var(--placeholder-color);margin-bottom:26px}.auth-field{position:relative;margin-bottom:1rem}.auth-field .auth-field-icon{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--placeholder-color);font-size:13px;z-index:2;pointer-events:none;transition:color .2s}.auth-field .auth-input{width:100%;padding:15px 40px 15px 37px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s,background .2s}.auth-field .auth-input::placeholder{color:transparent}.auth-field .auth-input:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721;background:var(--background-focus-input)}.auth-field .auth-input:focus~.auth-label{top:0;font-size:11px!important;color:#398bf7!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-input:focus~.auth-field-icon{color:#398bf7}.auth-field .auth-input:not(:placeholder-shown)~.auth-label{top:0;font-size:11px!important;background:var(--background-card);padding:0 4px;transform:translateY(-50%)}.auth-field .auth-label{position:absolute;left:35px;top:50%;transform:translateY(-50%);color:var(--placeholder-color)!important;font-size:13px!important;font-weight:400!important;pointer-events:none;transition:top .15s ease,font-size .15s ease,color .15s ease,padding .15s ease,background .15s ease;background:transparent;z-index:1;text-align:left!important}.auth-field .auth-toggle-pw{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--placeholder-color);cursor:pointer;padding:4px 6px;font-size:13px;z-index:2;line-height:1;transition:color .2s}.auth-field .auth-toggle-pw:hover{color:#398bf7}.auth-field.has-error .auth-input{border-color:#dc3545;box-shadow:none}.auth-field.has-error .auth-field-icon{color:#dc3545}.auth-select{width:100%;padding:13px 14px;background:var(--background-input);border:1.5px solid var(--font-border-input);border-radius:10px;font-size:14px;color:var(--color-input);outline:none;transition:border-color .2s,box-shadow .2s;margin-bottom:1rem;cursor:pointer}.auth-select:focus{border-color:#398bf7;box-shadow:0 0 0 3.5px #398bf721}.auth-btn{width:100%;padding:13px;border:none;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;transition:transform .15s ease,box-shadow .2s ease,opacity .2s;background:linear-gradient(135deg,#398bf7,#1e5fc4);color:#fff;letter-spacing:.3px;margin-bottom:10px;display:block}.auth-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 5px 18px #398bf761}.auth-btn:active:not(:disabled){transform:translateY(0)}.auth-btn:disabled{opacity:.55;cursor:not-allowed}.auth-btn.auth-btn--red{background:linear-gradient(135deg,#d1326f,#a82859)}.auth-btn.auth-btn--red:hover:not(:disabled){box-shadow:0 5px 18px #d1326f61}.auth-btn.auth-btn--outline{background:transparent;border:1.5px solid var(--font-border-input);color:var(--text-color)}.auth-btn.auth-btn--outline:hover:not(:disabled){background:var(--background-btn-light-hover);box-shadow:none;transform:none}.auth-links{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:16px;padding-top:16px;border-top:1px solid var(--border-color-modal)}.auth-version{text-align:right;margin-top:14px;padding-top:12px;border-top:1px solid var(--border-color-modal)}.auth-version span{font-size:11px;color:var(--placeholder-color)}.auth-error{font-size:11.5px;color:#dc3545;margin:-6px 0 10px 2px;padding:0}.auth-hint{display:flex;align-items:flex-start;gap:6px;font-size:11.5px;color:var(--placeholder-color);margin:-6px 0 14px 2px;padding:0;line-height:1.35}.auth-hint i{margin-top:2px;flex-shrink:0}.auth-validation-list{margin:-4px 0 12px;padding:0;list-style:none}.auth-validation-list li{font-size:11.5px;color:#dc3545;padding:2px 0}.auth-validation-list li:before{content:\"\\2715 \";font-size:10px}.auth-desc{font-size:13px;color:var(--placeholder-color);margin-bottom:20px;line-height:1.65}.auth-section-title{font-size:15px;font-weight:600;color:var(--text-color);margin-bottom:20px}.font-12{font-size:12px}.form-control:focus{border-color:#0199ff9a!important;box-shadow:0 0 5px .2px #65befa44!important}@media(max-width:900px){.auth-wrapper-login{grid-template-columns:1fr;grid-template-rows:auto 1fr;overflow-y:auto;overflow-x:hidden}.auth-panel-left{padding:14px 24px;justify-content:center}.auth-panel-left .auth-brand-subtitle,.auth-panel-left .auth-brand-features,.auth-panel-left .auth-brand-divider{display:none!important}.auth-panel-left .auth-brand-panel{display:flex!important;flex-direction:row!important;align-items:center;gap:0;text-align:left;max-width:none;width:100%;justify-content:center}.auth-panel-left .auth-brand-logo{width:52px;height:52px;margin:0;flex-shrink:0}.auth-panel-left .auth-brand-logo img{width:34px;height:34px}.auth-panel-left .auth-brand-title{font-size:20px;margin-bottom:0;margin-left:.5rem;flex-shrink:1}.auth-panel-right:after{inset:-25% 0 auto;width:100%;height:25%;background:linear-gradient(180deg,transparent 0%,rgba(57,139,247,.02) 30%,rgba(57,139,247,.045) 50%,rgba(57,139,247,.02) 70%,transparent 100%);animation:authScanLineV 7s ease-in-out infinite;animation-delay:3.5s}.auth-panel-right--dev:after{background:linear-gradient(180deg,transparent 0%,rgba(209,50,111,.02) 30%,rgba(209,50,111,.045) 50%,rgba(209,50,111,.02) 70%,transparent 100%)}}@keyframes authScanLineV{0%{top:-25%}50%{top:120%}to{top:120%}}@media(max-width:480px){.auth-panel-left{padding:12px 16px}.auth-panel-left .auth-brand-logo{width:44px;height:44px}.auth-panel-left .auth-brand-logo img{width:28px;height:28px}.auth-panel-left .auth-brand-title{font-size:17px}.auth-form-wrapper>div{padding:20px 12px}.auth-card{padding:24px 18px 20px;border-radius:16px}.font-12{font-size:10px!important}}\n"] }]
|
|
203
308
|
}], propDecorators: { handleEnter: [{
|
|
204
309
|
type: HostListener,
|
|
205
310
|
args: ['document:keydown', ['$event']]
|
|
@@ -222,5 +327,5 @@ class AuthSender {
|
|
|
222
327
|
* Generated bundle index. Do not edit.
|
|
223
328
|
*/
|
|
224
329
|
|
|
225
|
-
export { AuthComponent, AuthSender, ExpiredPasswordComponent, RecoverPasswordComponent, SelectBranchComponent };
|
|
330
|
+
export { AuthComponent, AuthSender, ExpiredPasswordComponent, PwaFloatingComponent, PwaInstallService, RecoverPasswordComponent, RefreshFloatingComponent, SelectBranchComponent };
|
|
226
331
|
//# sourceMappingURL=login-tsi.mjs.map
|