general-library-union 2.7.4 → 2.7.7

package/src/app/layout/config/app.config.component.html

@@ -1,125 +0,0 @@
-<p-button type="button" (click)="onConfigButtonClick()" icon="pi pi-cog" styleClass="layout-config-button"></p-button>
-
-<p-sidebar [(visible)]="visible" position="right" [transitionOptions]="'.3s cubic-bezier(0, 0, 0.2, 1)'">
-    <div class="p-3">
-        <h5>Layout/Theme Scale</h5>
-        <div class="flex align-items-center">
-            <button icon="pi pi-minus" type="button" pButton (click)="decrementScale()" class="p-button-text p-button-rounded w-2rem h-2rem mr-2" [disabled]="scale === scales[0]"></button>
-            <div class="flex gap-2 align-items-center">
-                <i class="pi pi-circle-fill text-300" *ngFor="let s of scales" [ngClass]="{'text-primary-500': s === scale}"></i>
-            </div>
-            <button icon="pi pi-plus"  type="button" pButton (click)="incrementScale()" class="p-button-text p-button-rounded w-2rem h-2rem ml-2" [disabled]="scale === scales[scales.length - 1]"></button>
-        </div>
-    
-        <h5>Color Scheme</h5>
-        <div class="flex gap-4">
-            <div class="field-radiobutton flex-1">
-                <p-radioButton name="colorScheme" value="light" [(ngModel)]="colorScheme" inputId="light"></p-radioButton>
-                <label for="light">Light</label>
-            </div>
-            <div class="field-radiobutton flex-1">
-                <p-radioButton name="colorScheme" value="dark" [(ngModel)]="colorScheme" inputId="dark"></p-radioButton>
-                <label for="dark">Dark</label>
-            </div>
-        </div>
-    
-        <ng-container *ngIf="!minimal">
-            <h5>Menu Mode</h5>
-            <div class="flex flex-wrap row-gap-3">
-                <div class="flex align-items-center gap-2 w-6">
-                    <p-radioButton name="menuMode" value="static" [(ngModel)]="menuMode" inputId="mode1"></p-radioButton>
-                    <label for="mode1">Static</label>
-                </div>
-                <div class="flex align-items-center gap-2 w-6">
-                    <p-radioButton name="menuMode" value="overlay" [(ngModel)]="menuMode" inputId="mode2"></p-radioButton>
-                    <label for="mode2">Overlay</label>
-                </div>
-                <div class="flex align-items-center gap-2 w-6">
-                    <p-radioButton name="menuMode" value="slim" [(ngModel)]="menuMode" inputId="mode3"></p-radioButton>
-                    <label for="mode3">Slim</label>
-                </div>
-                <div class="flex align-items-center gap-2 w-6">
-                    <p-radioButton name="menuMode" value="slim-plus" [(ngModel)]="menuMode" inputId="mode4"></p-radioButton>
-                    <label for="mode3">Slim +</label>
-                </div>
-                <div class="flex align-items-center gap-2 w-6 ">
-                    <p-radioButton name="menuMode" value="reveal" [(ngModel)]="menuMode" inputId="mode6"></p-radioButton>
-                    <label for="mode5">Reveal</label>
-                </div>
-                <div class="flex align-items-center gap-2 w-6">
-                    <p-radioButton name="menuMode" value="drawer" [(ngModel)]="menuMode" inputId="mode7"></p-radioButton>
-                    <label for="mode6">Drawer</label>
-                </div>
-                <div class="flex align-items-center gap-2 w-6">
-                    <p-radioButton name="menuMode" value="horizontal" [(ngModel)]="menuMode" inputId="mode5"></p-radioButton>
-                    <label for="mode4">Horizontal</label>
-                </div>
-            </div>
-    
-            <h5>Menu Profile Position</h5>
-            <div class="flex gap-4">
-                <div class="field-radiobutton flex-1">
-                    <p-radioButton name="position" value="start" [(ngModel)]="menuProfilePosition" inputId="start"></p-radioButton>
-                    <label for="star">Start</label>
-                </div>
-                <div class="field-radiobutton flex-1">
-                    <p-radioButton name="position" value="end" [(ngModel)]="menuProfilePosition" inputId="end"></p-radioButton>
-                    <label for="end">End</label>
-                </div>
-            </div>
-        </ng-container>
-
-        <ng-container *ngIf="!minimal">
-            <h5>Input Style</h5>
-            <div class="flex gap-4">
-                <div class="field-radiobutton flex-1">
-                    <p-radioButton name="inputStyle" value="outlined" [(ngModel)]="inputStyle" inputId="outlined_input"></p-radioButton>
-                    <label for="outlined_input">Outlined</label>
-                </div>
-                <div class="field-radiobutton flex-1">
-                    <p-radioButton name="inputStyle" value="filled" [(ngModel)]="inputStyle" inputId="filled_input"></p-radioButton>
-                    <label for="filled_input">Filled</label>
-                </div>
-            </div>
-        </ng-container>
-
-        <h5>Ripple Effect</h5>
-        <p-inputSwitch [(ngModel)]="ripple" styleClass="mb-3"></p-inputSwitch>
-        
-        <ng-container *ngIf="!minimal">
-            <h5>Menu Themes</h5>
-            <p *ngIf="colorScheme === 'dark';else menu_theme_selector">Menu themes are only available in light mode by design as large surfaces can emit too much brightness in dark mode.</p>
-            <ng-template #menu_theme_selector>
-                <div class="flex flex-wrap row-gap-3 pb-3">
-                    <div class="w-3" *ngFor="let theme of menuThemes">
-                        <button type="button" 
-                            class="cursor-pointer p-link w-2rem h-2rem border-round shadow-2 flex-shrink-0 flex justify-content-center align-items-center border-circle" 
-                            (click)="changeMenuTheme(theme.name)" 
-                            [ngStyle]="{'background-color': theme.color}"><i *ngIf="menuTheme === theme.name" class="pi pi-check text-lg" [ngClass]="{'text-white': menuTheme !== 'light'}"></i></button>
-                    </div>
-                </div>
-            </ng-template>
-            
-            <h5>Topbar Themes</h5>
-            <div class="flex flex-wrap row-gap-3 pb-3">
-                <div class="w-3" *ngFor="let theme of topbarThemes">
-                    <button type="button" 
-                    class="cursor-pointer p-link w-2rem h-2rem border-round shadow-2 flex-shrink-0 flex justify-content-center align-items-center border-circle" 
-                    (click)="changeTopbarTheme(theme.name)" 
-                    [ngStyle]="{'background-color': theme.color}"><i *ngIf="topbarTheme === theme.name" class="pi pi-check text-lg" [ngClass]="{'text-white': topbarTheme !== 'white'}"></i></button>
-                </div>
-            </div>
-        </ng-container>
-
-    
-        <h5>Component Themes</h5>
-        <div class="flex flex-wrap row-gap-3">
-            <div class="w-3" *ngFor="let theme of componentThemes">
-                <button type="button" 
-                class="cursor-pointer p-link w-2rem h-2rem border-round shadow-2 flex-shrink-0 flex justify-content-center align-items-center border-circle" 
-                (click)="changeTheme(theme.name)"
-                [ngStyle]="{'background-color': theme.color}"><i *ngIf="componentTheme === theme.name" class="pi pi-check text-lg text-white"></i></button>
-            </div>
-        </div>
-    </div>
-</p-sidebar>

package/src/app/layout/config/app.config.component.ts

@@ -1,206 +0,0 @@
-import { Component, Input, OnInit } from '@angular/core';
-import { MenuService } from '../app.menu.service';
-import { ColorScheme, LayoutService, MenuMode } from '../service/app.layout.service';
-import { CommonModule } from '@angular/common';
-import { InputSwitchModule } from 'primeng/inputswitch';
-import { RadioButtonModule } from 'primeng/radiobutton';
-import { FormsModule } from '@angular/forms';
-import { SidebarModule } from 'primeng/sidebar';
-import { ButtonModule } from 'primeng/button';
-
-@Component({
-    selector: 'app-config',
-    imports: [CommonModule, InputSwitchModule, RadioButtonModule, FormsModule, SidebarModule, ButtonModule,],
-    standalone: true,
-    templateUrl: './app.config.component.html'
-})
-export class AppConfigComponent implements OnInit {
-
-    @Input() minimal: boolean = false;
-
-    componentThemes: any[] = [];
-
-    menuThemes: any[] = [];
-
-    topbarThemes: any[] = [];
-
-    scales: number[] = [12,13,14,15,16];
-
-    constructor(public layoutService: LayoutService, public menuService: MenuService) { }
-
-    get visible(): boolean {
-        return this.layoutService.state.configSidebarVisible;
-    }
-
-    set visible(_val: boolean) {
-        this.layoutService.state.configSidebarVisible = _val;
-    }
-
-    get scale(): number {
-        return this.layoutService.config.scale;
-    }
-
-    set scale(_val: number) {
-        this.layoutService.config.scale = _val;
-    }
-
-    get menuMode(): MenuMode {
-        return this.layoutService.config.menuMode;
-    }
-
-    set menuMode(_val: MenuMode) {
-        this.layoutService.config.menuMode = _val;
-        if (this.layoutService.isSlim() || this.layoutService.isHorizontal()) {
-            this.menuService.reset();
-        }
-    }
-
-    get menuProfilePosition(): string {
-        return this.layoutService.config.menuProfilePosition;
-    }
-
-    set menuProfilePosition(_val: string) {
-        this.layoutService.config.menuProfilePosition = _val;
-        if (this.layoutService.isSlimPlus() || this.layoutService.isSlim() || this.layoutService.isHorizontal()) {
-            this.menuService.reset();
-        }
-    }
-
-    get colorScheme(): ColorScheme {
-        return this.layoutService.config.colorScheme;
-    }
-
-    set colorScheme(_val: ColorScheme) {
-        this.changeColorScheme(_val);
-    }
-
-    get inputStyle(): string {
-        return this.layoutService.config.inputStyle;
-    }
-
-    set inputStyle(_val: string) {
-        this.layoutService.config.inputStyle = _val;
-    }
-
-    get ripple(): boolean {
-        return this.layoutService.config.ripple;
-    }
-
-    set ripple(_val: boolean) {
-        this.layoutService.config.ripple = _val;
-    }
-
-    get menuTheme(): string {
-        return this.layoutService.config.menuTheme;
-    }
-
-    get topbarTheme(): string {
-        return this.layoutService.config.topbarTheme;
-    }
-
-    get componentTheme(): string {
-        return this.layoutService.config.componentTheme;
-    }
-
-    ngOnInit() {
-        this.componentThemes = [
-            {name: 'indigo', color: '#3F51B5'},
-            {name: 'pink', color: '#E91E63'},
-            {name: 'purple', color: '#9C27B0'},
-            {name: 'deeppurple', color: '#673AB7'},
-            {name: 'blue', color: '#2196F3'},
-            {name: 'lightblue', color: '#03A9F4'},
-            {name: 'cyan', color: '#00BCD4'},
-            {name: 'teal', color: '#009688'},
-            {name: 'green', color: '#4CAF50'},
-            {name: 'lightgreen', color: '#8BC34A'},
-            {name: 'lime', color: '#CDDC39'},
-            {name: 'yellow', color: '#FFEB3B'},
-            {name: 'amber', color: '#FFC107'},
-            {name: 'orange', color: '#FF9800'},
-            {name: 'deeporange', color: '#FF5722'},
-            {name: 'brown', color: '#795548'},
-            {name: 'bluegrey', color: '#607D8B'}
-        ];
-
-        this.menuThemes = [
-            {name: 'light', color: '#FDFEFF'},
-            {name: 'dark', color: '#434B54'},
-            {name: 'indigo', color: '#1A237E'},
-            {name: 'bluegrey', color: '#37474F'},
-            {name: 'brown', color: '#4E342E'},
-            {name: 'cyan', color: '#006064'},
-            {name: 'green', color: '#2E7D32'},
-            {name: 'deeppurple', color: '#4527A0'},
-            {name: 'deeporange', color: '#BF360C'},
-            {name: 'pink', color: '#880E4F'},
-            {name: 'purple', color: '#6A1B9A'},
-            {name: 'teal', color: '#00695C'}
-        ];
-
-        this.topbarThemes = [
-            {name: 'lightblue', color: '#2E88FF'},
-            {name: 'dark', color: '#363636'},
-            {name: 'white', color: '#FDFEFF'},
-            {name: 'blue', color: '#1565C0'},
-            {name: 'deeppurple', color: '#4527A0'},
-            {name: 'purple', color: '#6A1B9A'},
-            {name: 'pink', color: '#AD1457'},
-            {name: 'cyan', color: '#0097A7'},
-            {name: 'teal', color: '#00796B'},
-            {name: 'green', color: '#43A047'},
-            {name: 'lightgreen', color: '#689F38'},
-            {name: 'lime', color: '#AFB42B'},
-            {name: 'yellow', color: '#FBC02D'},
-            {name: 'amber', color: '#FFA000'},
-            {name: 'orange', color: '#FB8C00'},
-            {name: 'deeporange', color: '#D84315'},
-            {name: 'brown', color: '#5D4037'},
-            {name: 'grey', color: '#616161'},
-            {name: 'bluegrey', color: '#546E7A'},
-            {name: 'indigo', color: '#3F51B5'}
-        ];
-    }
-
-    onConfigButtonClick() {
-        this.layoutService.showConfigSidebar();
-    }
-
-    changeColorScheme(colorScheme: ColorScheme) {
-        this.layoutService.onColorSchemeChange(colorScheme);
-    }
-
-    changeTheme(theme: string) {
-        const themeLink = <HTMLLinkElement>document.getElementById('theme-link');
-        const newHref = themeLink.getAttribute('href')!.replace(this.layoutService.config.componentTheme, theme);
-        this.layoutService.replaceThemeLink(newHref, () => {
-            this.layoutService.config.componentTheme = theme;
-            this.layoutService.onConfigUpdate();
-        });
-    }
-
-    changeTopbarTheme(theme:string) {
-        this.layoutService.config.topbarTheme = theme;
-        this.layoutService.onConfigUpdate();
-    }
-
-    changeMenuTheme(theme:string) {
-        this.layoutService.config.menuTheme = theme;
-        this.layoutService.onConfigUpdate();
-    }
-
-    decrementScale() {
-        this.scale--;
-        this.applyScale();
-    }
-
-    incrementScale() {
-        this.scale++;
-        this.applyScale();
-    }
-
-    applyScale() {
-        document.documentElement.style.fontSize = this.scale + 'px';
-    }
-    
-}

package/src/app/layout/config/app.config.module.ts

@@ -1,11 +0,0 @@
-import { NgModule } from '@angular/core';
-@NgModule({
-    imports: [
-    ],
-    declarations: [
-        
-    ],
-    exports: [
-    ]
-})
-export class AppConfigModule { }

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

@@ -1,191 +0,0 @@
-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

@@ -1,53 +0,0 @@
-<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-explorer.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"></button>
-      </form>
-    </div>
-  </div>
-</div>
-<app-carga-pantalla-completa></app-carga-pantalla-completa>
-
-<app-seleccion-rol [mostrar]="mostrarRoles" (regresar)="regresarSeleccionRol()"></app-seleccion-rol>
-