general-library-union 3.3.2 → 3.3.4

package/src/app/layout/service/app.layout.service.ts

@@ -0,0 +1,191 @@
+import { Injectable } from '@angular/core';
+import { Subject } from 'rxjs';
+
+export type MenuMode = 'static' | 'overlay' | 'horizontal' | 'slim' | 'slim-plus' | 'reveal' | 'drawer';
+
+export type ColorScheme = 'light' | 'dark';
+
+export interface AppConfig {
+    inputStyle: string;
+    colorScheme: ColorScheme;
+    componentTheme: string;
+    ripple: boolean;
+    menuMode: MenuMode;
+    scale: number;
+    menuTheme: string;
+    topbarTheme: string;
+    menuProfilePosition: string;
+}
+
+interface LayoutState {
+    staticMenuMobileActive: boolean;
+    overlayMenuActive: boolean;
+    staticMenuDesktopInactive: boolean;
+    configSidebarVisible: boolean;
+    menuHoverActive: boolean;
+    rightMenuActive: boolean;
+    topbarMenuActive: boolean;
+    menuProfileActive: boolean;
+    sidebarActive: boolean;
+    anchored: boolean;
+}
+
+@Injectable({
+    providedIn: 'root',
+})
+export class LayoutService {
+
+    config: AppConfig = {
+        ripple: true,
+        inputStyle: 'outlined',
+        menuMode: 'reveal',
+        colorScheme: 'light',
+        componentTheme: 'indigo',
+        scale: 14,
+        menuTheme: 'light',
+        topbarTheme: 'indigo',
+        menuProfilePosition: 'end'
+    };
+
+    state: LayoutState = {
+        staticMenuDesktopInactive: false,
+        overlayMenuActive: false,
+        configSidebarVisible: false,
+        staticMenuMobileActive: false,
+        menuHoverActive: false,
+        rightMenuActive: false,
+        topbarMenuActive: false,
+        menuProfileActive: false,
+        sidebarActive: false,
+        anchored: false
+    };
+
+    private configUpdate = new Subject<AppConfig>();
+
+    private overlayOpen = new Subject<any>();
+
+    private topbarMenuOpen = new Subject<any>();
+
+    private menuProfileOpen = new Subject<any>();
+
+    configUpdate$ = this.configUpdate.asObservable();
+
+    overlayOpen$ = this.overlayOpen.asObservable();
+
+    topbarMenuOpen$ = this.topbarMenuOpen.asObservable();
+
+    menuProfileOpen$ = this.menuProfileOpen.asObservable();
+
+    onMenuToggle() {
+        if (this.isOverlay()) {
+            this.state.overlayMenuActive = !this.state.overlayMenuActive;
+
+            if (this.state.overlayMenuActive) {
+                this.overlayOpen.next(null);
+            }
+        }
+
+        if (this.isDesktop()) {
+            this.state.staticMenuDesktopInactive = !this.state.staticMenuDesktopInactive;
+        }
+        else {
+            this.state.staticMenuMobileActive = !this.state.staticMenuMobileActive;
+
+            if (this.state.staticMenuMobileActive) {
+                this.overlayOpen.next(null);
+            }
+        }
+    }
+
+    onTopbarMenuToggle() {
+        this.state.topbarMenuActive = !this.state.topbarMenuActive;
+        if (this.state.topbarMenuActive) {
+            this.topbarMenuOpen.next(null);
+        }
+    }
+
+    onOverlaySubmenuOpen() {
+        this.overlayOpen.next(null);
+    }
+
+    showConfigSidebar() {
+        this.state.configSidebarVisible = true;
+    }
+
+    isOverlay() {
+        return this.config.menuMode === 'overlay';
+    }
+
+    isDesktop() {
+        return window.innerWidth > 991;
+    }
+
+    isSlim() {
+        return this.config.menuMode === 'slim';
+    }
+
+    isSlimPlus() {
+        return this.config.menuMode === 'slim-plus';
+    }
+
+    isHorizontal() {
+        return this.config.menuMode === 'horizontal';
+    }
+
+    isMobile() {
+        return !this.isDesktop();
+    }
+
+    onConfigUpdate() {
+        this.configUpdate.next(this.config);
+    }
+
+    isRightMenuActive(): boolean {
+        return this.state.rightMenuActive;
+    }
+
+    openRightSidebar(): void {
+        this.state.rightMenuActive = true;
+    }
+
+    onMenuProfileToggle() {
+        this.state.menuProfileActive = !this.state.menuProfileActive;
+        if (this.state.menuProfileActive && this.isHorizontal() && this.isDesktop()) {
+            this.menuProfileOpen.next(null);
+        }
+    }
+
+    replaceThemeLink(href: string, onComplete: Function) {
+        const id = 'theme-link';
+        const themeLink = <HTMLLinkElement>document.getElementById(id);
+        const cloneLinkElement = <HTMLLinkElement>themeLink.cloneNode(true);
+
+        cloneLinkElement.setAttribute('href', href);
+        cloneLinkElement.setAttribute('id', id + '-clone');
+
+        themeLink.parentNode!.insertBefore(cloneLinkElement, themeLink.nextSibling);
+
+        cloneLinkElement.addEventListener('load', () => {
+            themeLink.remove();
+            cloneLinkElement.setAttribute('id', id);
+            onComplete();
+        });
+    }
+
+    onColorSchemeChange(colorScheme: ColorScheme) {
+        const themeLink = <HTMLLinkElement>document.getElementById('theme-link');
+        const themeLinkHref = themeLink.getAttribute('href');
+        const currentColorScheme = 'theme-' + this.config.colorScheme;
+        const newColorScheme = 'theme-' + colorScheme;
+        const newHref = themeLinkHref!.replace(currentColorScheme, newColorScheme);
+        this.replaceThemeLink(newHref, () => {
+            this.config.colorScheme = colorScheme;
+            if (colorScheme === 'dark') {
+                this.config.menuTheme = 'dark';
+            }
+            this.onConfigUpdate();
+        });
+
+    }
+
+}

package/src/app/publico/pages/login/login.page.html

@@ -0,0 +1,53 @@
+<div id="login" class="grid p-input-filled">
+  <div [class]="estilo">
+    <div>
+      <img class="logo" src="assets/images/logous-blanco.png" />
+      <!-- <h1>{{codigoAplicacion}}</h1> -->
+      <h1><img [src]="icono" /> </h1>
+      <div class="flex navegadores text-center">
+        <div>
+          <img src="assets/images/navegador-chrome.png" />
+          <span class="font-bold text-sm">20+</span>
+        </div>
+        <div>
+          <img src="assets/images/navegador-edge.png" />
+          <span class="font-bold text-sm">10+</span>
+        </div>
+        <div>
+          <img src="assets/images/navegador-firefox.png" />
+          <span class="font-bold text-sm">20+</span>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <div class="right-side col-12 md:col-6 xl:col-6">
+    <div class="p-5">
+      <h3 class="font-semibold text-3xl">¡Bienvenido!</h3>
+      <p class="mb-5">Inicia sesión para controlar y planificar los recursos de tu organización de manera eficiente y segura.</p>
+      <form [formGroup]="loginForm" class="p-fluid">
+        <div class="p-inputgroup mb-4">
+          <span class="p-inputgroup-addon"><i class="pi pi-user"></i></span>
+          <input class="p-inputtext p-component p-element ng-tns-c71-8 p-filled" type="text" pInputText placeholder="Usuario" formControlName="login" />
+        </div>
+        <div class="p-inputgroup mb-4">
+          <span class="p-inputgroup-addon"><i class="pi pi-lock"></i></span>
+          <p-password
+            [toggleMask]="true"
+            [feedback]="false"
+            placeholder="Clave"
+            formControlName="clave"
+          ></p-password>
+        </div>
+        <!-- <div class="text-right mt-7 mb-3 font-semibold text-base">
+          <a href="#">Olvide mi clave</a>
+        </div> -->
+        <button pButton pRipple type="button" label="Ingresar" (click)="login()" class="font-semibold text-lg mt-6"></button>
+      </form>
+    </div>
+  </div>
+</div>
+<app-carga-pantalla-completa></app-carga-pantalla-completa>
+
+<app-seleccion-rol [mostrar]="mostrarRoles" (regresar)="regresarSeleccionRol()"></app-seleccion-rol>
+

package/src/app/publico/pages/login/login.page.scss

@@ -0,0 +1,210 @@
+@import "../../../../styles/sass/variables";
+@import "../../../../styles/sass/mixins";
+
+
+:host ::ng-deep #login p-password div {
+    width: 100%;
+
+    > i:last-of-type {
+        z-index: 1;
+    }
+}
+
+:host ::ng-deep .p-input-icon-right > .p-icon-wrapper,
+.p-input-icon-right > i:last-of-type {
+    right: 0.75rem;
+}
+
+
+#login {
+    @include breakpoint(large) {
+        height: 100.7vh;
+        width: 100%;
+
+    }
+
+    p{
+      font-size: 1.2rem;
+    }
+
+    .left-side-sam {
+        background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url(/assets/images/imagen-principal-sam.png) center;
+        background-size: cover;
+        box-shadow: 0px 2px 16px rgb(0 0 0 / 12%);
+        color: $white;
+        justify-content: center;
+        align-items: center;
+
+
+        > div{
+            margin: 5% 8%;
+        }
+
+        img.logo {
+            max-width: 250px;
+            margin-bottom: 3rem;
+        }
+
+        h1 {
+            font-size: 3.5em;
+            font-weight: 700;
+            margin-bottom: 0;
+            color: #fff;
+        }
+
+        h2 {
+            font-size: 2em;
+            font-weight: 500;
+            margin-top: 10px;
+            letter-spacing: 4px;
+        }
+
+        .navegadores div {
+            width: 60px;
+            padding-right: 25px;
+
+            img,
+            span {
+                width: 100%;
+                display: block;
+            }
+        }
+    }
+
+
+    .left-side-sara {
+        background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url('/assets/images/imagen-principal-sara.png') center;
+        background-size: cover;
+        box-shadow: 0px 2px 16px rgb(0 0 0 / 12%);
+        color: $white;
+        justify-content: center;
+        align-items: center;
+
+
+        > div{
+            margin: 5% 8%;
+        }
+
+        img.logo {
+            max-width: 250px;
+            margin-bottom: 3rem;
+        }
+
+        h1 {
+            font-size: 3.5em;
+            font-weight: 700;
+            margin-bottom: 0;
+            color: #fff;
+        }
+
+        h2 {
+            font-size: 2em;
+            font-weight: 500;
+            margin-top: 10px;
+            letter-spacing: 4px;
+        }
+
+        .navegadores div {
+            width: 60px;
+            padding-right: 25px;
+
+            img,
+            span {
+                width: 100%;
+                display: block;
+            }
+        }
+    }
+
+    .left-side-seguridad {
+        background: linear-gradient(to top, #0000001c, #00000099), url(/assets/images/imagen-principal-seguridad.png) center; 
+        background-size: cover;
+        box-shadow: 0px 2px 16px rgb(0 0 0 / 12%);
+        color: $white;
+        justify-content: center;
+        align-items: center;
+
+
+        > div{
+            margin: 5% 8%;
+        }
+
+        img.logo {
+            max-width: 250px;
+            margin-bottom: 3rem;
+        }
+
+        h1 {
+            font-size: 3.5em;
+            font-weight: 700;
+            margin-bottom: 0;
+            color: #fff;
+        }
+
+        h2 {
+            font-size: 2em;
+            font-weight: 500;
+            margin-top: 10px;
+            letter-spacing: 4px;
+        }
+
+        .navegadores div {
+            width: 60px;
+            padding-right: 25px;
+
+            img,
+            span {
+                width: 100%;
+                display: block;
+            }
+        }
+    }
+
+    .left-side-samanta {
+        background: linear-gradient(to top, #0000001c, #00000099), url(/assets/images/imagen-principal-samanta.png) center; 
+        background-size: cover;
+        box-shadow: 0px 2px 16px rgb(0 0 0 / 12%);
+        color: $white;
+        justify-content: center;
+        align-items: center;
+
+
+        > div{
+            margin: 5% 8%;
+        }
+
+        img.logo {
+            max-width: 250px;
+            margin-bottom: 3rem;
+        }
+
+        h1 {
+            font-size: 3.5em;
+            font-weight: 700;
+            margin-bottom: 0;
+            color: #fff;
+        }
+
+        h2 {
+            font-size: 2em;
+            font-weight: 500;
+            margin-top: 10px;
+            letter-spacing: 4px;
+        }
+
+        .navegadores div {
+            width: 60px;
+            padding-right: 25px;
+
+            img,
+            span {
+                width: 100%;
+                display: block;
+            }
+        }
+    }
+
+
+}
+
+

package/src/app/publico/pages/login/login.page.ts

@@ -0,0 +1,130 @@
+import { Component, OnInit, ViewChild } from '@angular/core';
+import {
+  FormBuilder,
+  FormControl,
+  FormGroup,
+  ReactiveFormsModule,
+  Validators,
+} from '@angular/forms';
+import { ActivatedRoute, Router } from '@angular/router';
+import { lastValueFrom } from 'rxjs';
+import { AuthenticationError } from '../../../core/errores/authentication.error';
+import { AuthService } from '../../../core/servicios/auth.service';
+import { ToastService } from '../../../core/servicios/toast.service';
+import { LoadingService } from '../../../core/servicios/loading.service';
+import { RolModel } from '../../../seguridad/modelos/RolModel';
+import { SeleccionRolComponent } from '../seleccion-rol/seleccion-rol.component';
+import { StorageService } from '../../../core/servicios/storage.service';
+import { UtilsService } from '../../../core/servicios/utils.service';
+import { GeneralPipe } from '../../../webcommon/pipes/general.pipe';
+import { CommonModule } from '@angular/common';
+import { TranslateModule } from '@ngx-translate/core';
+import { PasswordModule } from 'primeng/password';
+import { CargaPantallaCompletaComponent } from '../../../core/componentes/carga-pantalla-completa/carga-pantalla-completa.component';
+import { MessageService } from 'primeng/api';
+import { ButtonModule } from 'primeng/button';
+
+@Component({
+    imports: [ReactiveFormsModule, CommonModule, TranslateModule, PasswordModule, CargaPantallaCompletaComponent, SeleccionRolComponent, ButtonModule,],
+    standalone: true,
+    providers: [MessageService,],
+    templateUrl: './login.page.html',
+  styleUrls: ['./login.page.scss'],
+})
+export class LoginPage implements OnInit {
+  loginForm: FormGroup;
+  urlapinucleo: string;
+  codigoAplicacion: string;
+  nombreAplicacion: string;
+  admonPortal: boolean = false;
+  estilo:string;
+  icono:string;
+
+  public mostrarRoles: boolean = false;
+  public listRoles: RolModel [] = [];
+  private _rolSeleccionado: RolModel;
+
+  @ViewChild(SeleccionRolComponent) componenteSeleccionRol:SeleccionRolComponent;
+
+  constructor(
+    private formBuilder: FormBuilder,
+    private toastService: ToastService,
+    private authService: AuthService,
+    private route: Router,
+    private activatedRoute: ActivatedRoute,
+    private loadingService: LoadingService,
+    private storageService: StorageService,
+    private generalPipe: GeneralPipe,
+    private utilsService: UtilsService
+  ) {}
+
+  ngOnInit(): void {
+    this.activatedRoute.data.subscribe((v) =>{
+      this.codigoAplicacion = v['codigoAplicacion']
+      this.nombreAplicacion = v['nombreAplicacion']
+      this.urlapinucleo = v['urlapinucleo']
+      this.admonPortal = v['admonPortal']
+      this.icono = this.generalPipe.MAPALOGOSICONOS.filter(item => item.codigo == v['codigoAplicacion'])[0].nombre;
+      if(v['codigoAplicacion'] == '1'){
+        this.estilo = 'left-side-sara col-12 md:col-6 xl:col-6'
+
+      }else if(v['codigoAplicacion'] == '13' || v['codigoAplicacion'] == '77'){
+        this.estilo = 'left-side-sam col-12 md:col-6 xl:col-6'
+      }else if (v['codigoAplicacion'] == '4') {
+        this.estilo = 'left-side-samanta col-12 md:col-6 xl:col-6'
+      }else if(v['codigoAplicacion'] == '5'){
+        this.estilo = 'left-side-seguridad col-12 md:col-6 xl:col-6'
+      }else{
+        this.estilo = 'left-side-sara col-12 md:col-6 xl:col-6'
+      }
+      this.loginForm = this.formBuilder.group({
+        login: new FormControl(null, [Validators.required]),
+        clave: new FormControl(null, [Validators.required]),
+        aplicacion: v['codigoAplicacion'],
+        admonPortal: this.admonPortal
+      });
+    });
+
+  }
+
+  async login() {
+    this.loadingService.startFullScreenLoading();
+    try {
+      this.storageService.setItem('roles', '');
+      let data = await this.authService.generarTokenPublico().toPromise();
+      let token = await lastValueFrom(
+        this.authService.login(this.loginForm.value, this.urlapinucleo, data.token)
+      );
+      var roles = this.storageService.getItem('roles')
+      if (roles) {
+        this.mostrarRoles = true;
+        this.listRoles = JSON.parse(roles);
+        this.componenteSeleccionRol.cargar(this.listRoles, this.admonPortal );
+      } else {
+        if (window.location.href.toString().includes('admonPortal')) {
+          this.route.navigateByUrl(this.utilsService.obtenerBase() + '/admonPortal/inicio');
+        } else {
+          this.route.navigateByUrl(this.utilsService.obtenerBase() + '/inicio');
+        }
+      }
+
+    } catch (error) {
+      if (error instanceof AuthenticationError) {
+        this.toastService.showError(
+          'Por favor verifica los datos de acceso. Si el error persiste contacta al administrador.',
+          'Datos Inválidos'
+        );
+      } else {
+        throw error;
+      }
+    } finally {
+      this.loadingService.endFullScreenLoading();
+    }
+  }
+
+  regresarSeleccionRol(){
+    //this.storage.setEtiquetasYColores();
+    this.mostrarRoles = false;
+  }
+
+}

package/src/app/publico/pages/not-found/not-found.page.html

@@ -0,0 +1,36 @@
+<div id="not-found"
+class="flex flex-column flex-wrap justify-content-start align-content-center align-items-center">
+  <div class="card-container">
+   
+    <div>
+      <div>
+      <img class="align-items-center justify-content-center" src="assets/images/not-found.webp" />
+    </div>
+    <div>
+
+      <!--BUSCADOR ---
+       <div class="p-inputgroup mb-4 w-16rem">
+        <span class="p-inputgroup-search"><i class="pi pi-search color-700"></i></span>
+        <input class="p-inputtext p-component p-element ng-tns-c71-8 p-filled" type="text" pInputText placeholder="Buscar" formControlName="login" />
+      </div> -->
+
+
+      <h5>ERROR 404</h5>
+      <p>Lo sentimos la página que buscas no existe</p>
+      @if (mensaje) {
+        <div class="text-center">
+          <h6>{{mensaje}}</h6>
+        </div>
+      }
+      @if (mostrarBoton) {
+        <div>
+          <button (click)="accion()" pButton pRipple class="justify-content-start align-content-center align-items-center"> {{labelMensaje}}</button>
+  
+        </div>
+      }
+    </div>
+    </div>
+    
+
+</div>
+</div>

package/src/app/publico/pages/not-found/not-found.page.scss

@@ -0,0 +1,2 @@
+@import "../../../../styles/sass/variables";
+@import "../../../../styles/sass/mixins";

package/src/app/publico/pages/not-found/not-found.page.ts

@@ -0,0 +1,46 @@
+import { Component, OnInit } from '@angular/core';
+import { UtilsService } from '../../../core/servicios/utils.service';
+import { RouterModule } from '@angular/router';
+import { StorageService } from '../../../core/servicios/storage.service';
+import { ButtonModule } from 'primeng/button';
+import { RippleModule } from 'primeng/ripple';
+
+@Component({
+    imports: [RouterModule, ButtonModule, RippleModule],
+    standalone: true,
+    templateUrl: './not-found.page.html',
+  styleUrls: ['./not-found.page.scss'],
+})
+export class NotFoundPage implements OnInit {
+
+  public mensaje: string;
+  public urlRegresar: string;
+  public labelMensaje: string;
+  public mostrarBoton: boolean = true;
+
+  constructor(public utilsService: UtilsService, private storageService: StorageService) {}
+
+  ngOnInit(): void {
+    this.mostrarBoton = true;
+    this.mensaje = this.storageService.getItem('mensaje_notfound');
+    this.urlRegresar = this.storageService.getItem('url_regresar');
+    this.mostrarBoton = (this.storageService.getItem('mostrarboton_notfound') != null || this.storageService.getItem('mostrarboton_notfound') != undefined ? this.storageService.getItem('mostrarboton_notfound') =='true' : true);
+
+    if (this.urlRegresar) {
+      this.labelMensaje = 'Regresar a la página anterior';
+    } else {
+      this.labelMensaje = 'Ir a la página de Inicio';
+    }
+    this.storageService.removeItem('mensaje_notfound');
+    this.storageService.removeItem('url_regresar');
+    this.storageService.removeItem('mostrarboton_notfound');
+  }
+
+  accion() {
+    if (this.urlRegresar) {
+      window.location.href = this.urlRegresar;
+    } else {
+      window.location.href = window.location.origin + '/' + this.utilsService.obtenerBase() + '/inicio';
+    }
+  }
+}