lib-common-angular 0.0.9 → 0.0.11

package/projects/lib-common-angular-demo/src/app/componentes/menu-navigation/menu-navigation.component.ts

@@ -0,0 +1,452 @@
+import { Component } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { RouterModule } from '@angular/router';
+import { MenuConfig, Terminal } from "lib-common-angular";
+import { MenuDemoVisualComponent } from './menu-demo-visual.component';
+
+@Component({
+  selector: 'app-menu-navigation',
+  standalone: true,
+  imports: [CommonModule, RouterModule, Terminal, MenuDemoVisualComponent],
+  templateUrl: './menu-navigation.component.html',
+  styleUrls: ['./menu-navigation.component.scss'],
+})
+export class MenuNavigationComponent {
+  currentRoute = window.location.pathname;
+
+
+  menuPrivateConfig: string = `
+import { MenuConfig } from 'lib-common-angular';
+ 
+                  export const defaultMenuConfig: MenuConfig = {
+                    id: 'dashboard3-menu',
+                    name: 'Dashboard 3 Menu',
+                    items: [
+                        {
+                            id: 'home',
+                            label: 'Home',
+                            icon: 'pi pi-fw pi-home',
+                            type: 'group',
+                          
+                            order: 1,
+                            items: [
+                                {
+                                    id: 'dashboard 3',
+                                    label: 'Dashboard 3',
+                                    icon: 'pi pi-fw pi-home',
+                                    routerLink: ['/'],
+                                    type: 'item',
+                                    order: 1
+                                },         
+                            ]
+                        },
+                        {
+                            id: 'ui-components',
+                            label: 'UI Components',
+                            icon: 'pi pi-fw pi-palette',
+                            type: 'group',
+                            order: 2,
+                            items: [
+                                {
+                                    id: 'card-productos',
+                                    label: 'card-productos',
+                                    icon: 'pi-shopping-cart',
+                                    routerLink: ['/componentes/card-productos'],
+                                    type: 'item',
+                                    order: 1
+                                },
+                                  {
+                                    id: 'detalle-carrito',
+                                    label: 'Detalle Carrito',
+                                    icon: 'pi-shopping-cart',
+                                    routerLink: ['/componentes/detalle-carrito'],
+                                    type: 'item',
+                                    order: 2
+                                },
+                            
+                                {
+                                    id: 'table',
+                                    label: 'Table',
+                                    icon: 'pi pi-fw pi-table',
+                                    routerLink: ['/uikit/table'],
+                                    type: 'group',
+                                    order: 5,   
+                                  items:[
+                                        {
+                                    id: 'crud',
+                                    label: 'Crud',
+                                    icon: 'pi pi-fw pi-pencil',
+                                    routerLink: ['/pages/crud'],
+                                    type: 'item',
+                                    order: 3,
+                                    permissions: ['pages.crud.read']
+                                },  
+                                  ]
+                                  },
+                                
+                                {
+                                    id: 'menu',
+                                    label: 'Menu',
+                                    icon: 'pi pi-fw pi-bars',
+                                    routerLink: ['/pages/menu-navigation'],
+                                    type: 'group',
+                                    order: 11,
+                                    items: [
+                                                      {
+                                              id: 'admin',
+                                              label: 'Admin',
+                                              icon: 'pi pi-fw pi-pencil',
+                                              routerLink: ['/admin'],
+                                              type: 'item',
+                                              order: 1,
+                                            },
+                                            {
+                                              id: 'minimal',
+                                              label: 'Minimal',
+                                              icon: 'pi pi-fw pi-pencil',
+                                              routerLink: ['/minimal'],
+                                              type: 'item',
+                                              order: 1,
+                                            },
+                                            {
+                                            id: 'user',
+                                            label: 'User',
+                                            icon: 'pi pi-fw pi-pencil',
+                                            routerLink: ['/user'],
+                                            type: 'item',
+                                            order: 1,
+                                          }
+                                    ]
+                                },
+                            ]
+                        },
+                        {
+                            id: 'pages',
+                            label: 'Pages',
+                            icon: 'pi pi-fw pi-briefcase',
+                            type: 'group',
+                            order: 3,
+                            items: [
+                                {
+                                    id: 'ecommerce1',
+                                    label: 'ecommerce1',
+                                    icon: 'pi pi-fw pi-globe',
+                                    routerLink: ['/pages/ecommerce1'],
+                                    type: 'item',
+                                    order: 1
+                                },
+                            
+                              
+                                {
+                                    id: 'not-found',
+                                    label: 'Not Found',
+                                    icon: 'pi pi-fw pi-exclamation-circle',
+                                    routerLink: ['/pages/notfound'],
+                                    type: 'item',
+                                    order: 5
+                                },
+                            ]
+                        },
+                    ],
+                    theme: 'light',
+                    orientation: 'horizontal',
+                    collapsible: true,
+                    showIcons: true,
+                    showBadges: true,
+                    maxDepth: 4
+                  };
+
+                  // Configuración de menú de administrador
+                  export const adminMenuConfig: MenuConfig = {
+                    id: 'admin-menu',
+                    name: 'Admin Menu',
+                    items: [
+                      {
+                        id: 'administration',
+                        label: 'Administración',
+                        icon: 'pi pi-fw pi-cog',
+                        type: 'group',
+                        order: 1,
+                        items: [
+                          {
+                            id: 'users',
+                            label: 'Usuarios',
+                            icon: 'pi pi-fw pi-users',
+                            routerLink: ['/admin/users'],
+                            type: 'item',
+                            order: 1,
+                            permissions: ['admin.users.read']
+                          },
+                          {
+                            id: 'roles',
+                            label: 'Roles',
+                            icon: 'pi pi-fw pi-shield',
+                            routerLink: ['/admin/roles'],
+                            type: 'item',
+                            order: 2,
+                            permissions: ['admin.roles.read']
+                          },
+                          {
+                            id: 'settings',
+                            label: 'Configuración',
+                            icon: 'pi pi-fw pi-cog',
+                            routerLink: ['/admin/settings'],
+                            type: 'item',
+                            order: 3,
+                            permissions: ['admin.settings.read']
+                          }
+                        ]
+                      },
+                      {
+                        id: 'reports',
+                        label: 'Reportes',
+                        icon: 'pi pi-fw pi-file',
+                        type: 'group',
+                        order: 2,
+                        items: [
+                          {
+                            id: 'sales-report',
+                            label: 'Reporte de Ventas',
+                            icon: 'pi pi-fw pi-chart-line',
+                            routerLink: ['/reports/sales'],
+                            type: 'item',
+                            order: 1,
+                            permissions: ['reports.sales.read']
+                          },
+                          {
+                            id: 'inventory-report',
+                            label: 'Reporte de Inventario',
+                            icon: 'pi pi-fw pi-box',
+                            routerLink: ['/reports/inventory'],
+                            type: 'item',
+                            order: 2,
+                            permissions: ['reports.inventory.read']
+                          }
+                        ]
+                      }
+                    ],
+                    theme: 'light',
+                    orientation: 'vertical',
+                    collapsible: true,
+                    showIcons: true,
+                    showBadges: true,
+                    maxDepth: 3
+                  };
+
+                  // Configuración de menú minimalista
+                  export const minimalMenuConfig: MenuConfig = {
+                    id: 'minimal-menu',
+                    name: 'Minimal Menu',
+                    items: [
+                      {
+                        id: 'dashboard',
+                        label: 'Dashboard',
+                        icon: 'pi pi-fw pi-home',
+                        routerLink: ['/'],
+                        type: 'item',
+                        order: 1
+                      },
+                      {
+                        id: 'profile',
+                        label: 'Perfil',
+                        icon: 'pi pi-fw pi-user',
+                        routerLink: ['/profile'],
+                        type: 'item',
+                        order: 2
+                      }
+                    ],
+                    theme: 'light',
+                    orientation: 'vertical',
+                    collapsible: false,
+                    showIcons: true,
+                    showBadges: false,
+                    maxDepth: 2
+                  };
+
+                  // Configuración de menú de usuario
+                  export const userMenuConfig: MenuConfig = {
+                    id: 'user-menu',
+                    name: 'User Menu',
+                    items: [
+                      {
+                        id: 'dashboard',
+                        label: 'Dashboard',
+                        icon: 'pi pi-fw pi-home',
+                        routerLink: ['/'],
+                        type: 'item',
+                        order: 1
+                      },
+                      {
+                        id: 'pages',
+                        label: 'Páginas',
+                        icon: 'pi pi-fw pi-briefcase',
+                        type: 'group',
+                        order: 2,
+                        items: [
+                          {
+                            id: 'crud',
+                            label: 'Crud',
+                            icon: 'pi pi-fw pi-pencil',
+                            routerLink: ['/pages/crud'],
+                            type: 'item',
+                            order: 1
+                          },
+                          {
+                            id: 'menu-demo',
+                            label: 'Menu Demo',
+                            icon: 'pi pi-fw pi-bars',
+                            routerLink: ['/menu-demo'],
+                            type: 'item',
+                            order: 2
+                          }
+                        ]
+                      }
+                    ],
+                    theme: 'light',
+                    orientation: 'vertical',
+                    collapsible: true,
+                    showIcons: true,
+                    showBadges: true,
+                    maxDepth: 3
+                  };
+
+                  // Configuraciones de permisos predefinidas
+                  export const permissionConfigs = {
+                    admin: ['admin.users.read', 'admin.roles.read', 'admin.settings.read', 'reports.sales.read', 'reports.inventory.read'],
+                    user: ['pages.crud.read', 'pages.menu-demo.read'],
+                    guest: ['pages.crud.read'],
+                    custom: ['admin.users.read', 'pages.crud.read', 'reports.sales.read']
+                  }; `;
+  codeExample: string = `
+import { MenuConfig } from 'lib-common-angular';
+          export const userMenuConfig: MenuConfig = {
+            id: 'user-menu',
+            name: 'User Menu',
+            items: [
+              {
+                id: 'dashboard',
+                label: 'Dashboard',
+                icon: 'pi pi-fw pi-home',
+                routerLink: ['/'],
+                type: 'item',
+                order: 1
+              },
+              {
+                id: 'pages',
+                label: 'Páginas',
+                icon: 'pi pi-fw pi-briefcase',
+                type: 'group',
+                order: 2,
+                items: [
+                  {
+                    id: 'crud',
+                    label: 'Crud',
+                    icon: 'pi pi-fw pi-pencil',
+                    routerLink: ['/pages/crud'],
+                    type: 'item',
+                    order: 1
+                  },
+                  {
+                    id: 'menu-demo',
+                    label: 'Menu Demo',
+                    icon: 'pi pi-fw pi-bars',
+                    routerLink: ['/menu-demo'],
+                    type: 'item',
+                    order: 2
+                  }
+                ]
+              }
+            ],
+            theme: 'light',
+            orientation: 'vertical',
+            collapsible: true,
+            showIcons: true,
+            showBadges: true,
+            maxDepth: 3
+          };
+`
+ permisos : string = `
+import { PermissionConfig } from 'lib-common-angular';
+
+export const permissionConfigs = {
+  admin: ['admin.users.read', 'admin.roles.read', 'admin.settings.read', 'reports.sales.read', 'reports.inventory.read'],
+  user: ['pages.crud.read', 'pages.menu-demo.read'],
+  guest: ['pages.crud.read'],
+  custom: ['admin.users.read', 'pages.crud.read', 'reports.sales.read']
+}; 
+
+`
+router : string = `export const routes: Routes = [ {
+    path: '',
+    component: tuComponente,
+    data: {
+      menuConfig: defaultMenuConfig,
+      userPermissions: permissionConfigs.user
+    },
+    children: [
+      {
+        path: 'user',
+        component: UserComponent,
+        data: {
+          menuConfig: userMenuConfig,
+          userPermissions: permissionConfigs.user
+        }
+      }
+  ]
+  `
+
+userMenuConfig: MenuConfig = {
+            id: 'user-menu',
+            name: 'User Menu',
+            items: [
+              {
+                id: 'dashboard',
+                label: 'Dashboard',
+                icon: 'pi pi-fw pi-home',
+                routerLink: ['/'],
+                type: 'item',
+                order: 1
+              },
+              {
+                id: 'pages',
+                label: 'Páginas',
+                icon: 'pi pi-fw pi-briefcase',
+                type: 'group',
+                order: 2,
+                items: [
+                  {
+                    id: 'crud',
+                    label: 'Crud',
+                    icon: 'pi pi-fw pi-pencil',
+                    routerLink: ['/pages/crud'],
+                    type: 'item',
+                    order: 1
+                  },
+                  {
+                    id: 'menu-demo',
+                    label: 'Menu Demo',
+                    icon: 'pi pi-fw pi-bars',
+                    routerLink: ['/menu-demo'],
+                    type: 'item',
+                    order: 2
+                  }
+                ]
+              }
+            ],
+            theme: 'light',
+            orientation: 'vertical',
+            collapsible: true,
+            showIcons: true,
+            showBadges: true,
+            maxDepth: 3
+          };
+
+          permissionConfigs = {
+  admin: ['admin.users.read', 'admin.roles.read', 'admin.settings.read', 'reports.sales.read', 'reports.inventory.read'],
+  user: ['pages.crud.read', 'pages.menu-demo.read'],
+  guest: ['pages.crud.read'],
+  custom: ['admin.users.read', 'pages.crud.read', 'reports.sales.read']
+}; 
+
+
+}

package/projects/lib-common-angular-demo/src/app/componentes/shared/card-carrito-demo/card-carrito-demo.html

@@ -0,0 +1,15 @@
+
+<div class="grid align-items-center justify-content-center gap-2 m-3">
+
+    @for (product of products; track $index) {
+        
+        @if (products) {
+            
+            <div class="col-12 md:col-6 lg:col-4">
+                <lib-card-productos1 [product]="product"></lib-card-productos1>
+            </div>
+        }
+        
+    }
+    
+</div>

package/projects/lib-common-angular-demo/src/app/componentes/shared/card-carrito-demo/card-carrito-demo.ts

@@ -0,0 +1,21 @@
+import { Component, OnInit } from '@angular/core';
+import { ProductoDTO } from '@juliaosistem/core-dtos';
+import { CardProductos1Component, ProductService } from "lib-common-angular";
+
+@Component({
+  selector: 'app-card-carrito-demo',
+  imports: [CardProductos1Component],
+  templateUrl: './card-carrito-demo.html',
+  styleUrl: './card-carrito-demo.scss',
+})
+export class CardCarritoDemo implements OnInit {
+  products!:ProductoDTO  [];
+
+    constructor(private productSvc: ProductService) { 
+
+    }
+  ngOnInit(): void {
+
+    this.products = this.productSvc.mockProductosInflablesDTO();
+  }
+}

package/projects/lib-common-angular-demo/src/app/componentes/shared/detalle-carrito-demo/detalle-carrito-demo.html

@@ -0,0 +1,3 @@
+@if(product){
+<lib-detalle-carrito-1 [product]="product" [isLogin]="true"></lib-detalle-carrito-1>
+}

package/projects/lib-common-angular-demo/src/app/componentes/shared/detalle-carrito-demo/detalle-carrito-demo.spec.ts

@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { DetalleCarritoDemo } from './detalle-carrito-demo';
+
+describe('DetalleCarritoDemo', () => {
+  let component: DetalleCarritoDemo;
+  let fixture: ComponentFixture<DetalleCarritoDemo>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [DetalleCarritoDemo]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(DetalleCarritoDemo);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/projects/lib-common-angular-demo/src/app/componentes/shared/detalle-carrito-demo/detalle-carrito-demo.ts

@@ -0,0 +1,22 @@
+import { ProductService } from 'lib-common-angular';
+import { Component, OnInit } from '@angular/core';
+import { DetalleCarrito1Component } from "lib-common-angular";
+import { ProductoDTO } from '@juliaosistem/core-dtos';
+
+@Component({
+  selector: 'app-detalle-carrito-demo',
+  imports: [DetalleCarrito1Component],
+  templateUrl: './detalle-carrito-demo.html',
+  styleUrl: './detalle-carrito-demo.scss'
+})
+export class DetalleCarritoDemo implements OnInit {
+
+  product!:ProductoDTO ;
+
+    constructor(private productSvc: ProductService) { 
+
+    }
+    ngOnInit(): void {
+      this.product = this.productSvc.mockProductoDTO();
+    }
+}

package/projects/lib-common-angular-demo/src/app/componentes.routes.ts

@@ -0,0 +1,14 @@
+import { DetalleCarritoDemo } from './componentes/shared/detalle-carrito-demo/detalle-carrito-demo';
+import { Routes } from '@angular/router';
+import { Notfound} from 'lib-common-angular';
+import { CrudComponent } from './componentes/crud/crud.component';
+import { CardCarritoDemo } from './componentes/shared/card-carrito-demo/card-carrito-demo';
+    
+export default [
+    
+   { path: 'notfound', component: Notfound },
+    { path: 'detalle-carrito', component: DetalleCarritoDemo },
+    { path: 'card-productos', component: CardCarritoDemo},
+    { path: 'crud', component: CrudComponent },
+    { path: '**', redirectTo: '/notfound' }
+] as Routes;

package/projects/lib-common-angular-demo/src/app/core/services/component-services.service.ts

@@ -0,0 +1,22 @@
+import { Injectable } from '@angular/core';
+import{ImagenDTO} from 'juliaositembackenexpress/dist/api/dtos/bussines/ImagenDTO';
+import { ProductoDTO } from 'juliaositembackenexpress/dist/api/dtos/bussines/productoDTO';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class ComponentServicesService {
+
+  constructor() { }
+
+  findImagenesByIdComponent(imagenDTO:ImagenDTO[],idComponente :string):ImagenDTO[] {
+     return imagenDTO.filter(img=> img.id == idComponente)
+  }
+  
+  findProductosByIdCategori(productoDTO:ProductoDTO[],idCategoria :string):ProductoDTO[]{
+    return productoDTO.filter(p=> p.idCategoria == idCategoria);
+  }
+  
+  
+
+}