@clavisco/rptmng-menu v0.0.3

Acerca de @clavisco/rptmng-menu

Componente para los reportes de report manager integrados en una opcion del menu,

¿Qué resuelve?

Integracion de reportes sobre opciones en menus dinámicos para sistemas que implementan el uso de Report Manager v2.

Resumen de versión

Características (Features)

• Se cambian botones por iconos y se le modifican algunos estilos a los titulos de las modales

Dependencias

• @clavisco/core
• @clavisco/overlay
• @clavisco/linker
• @clavisco/alerts

RptmngMenuService

Este servicio dispone de una serie de métodos para incluir los reportes a las opciones de un menu

• NestOptions<F, T extends F, K extends keyof F>(_appKey: number, _options: IOptionsToNest<F, T, K>), anida los reportes a la opcion del menu que se le haya enviado como parametro
  • _appKey (Number): Identificador De La Aplicacion En Report Manager
  • _options (IOptionsToNest): Opciones para la correcta implementacion de los reportes al menu
    • ShouldResolve es opcional e indica si se muestra un bloqueo de pantalla al consultar los reportes.
    • OptionChildrensProp indica el nombre de la propiedad de la opcion del menu que contiene los hijo de cada opcion.
    • OptionPropToCompare indica el nombre de la propiedad identificadora de la opcion del menu (Debe ser una propiedad con valor unico para cada opcion del menu).
    • MapFuction funcion para mapear los parametros devueltos de tipo IRptmngMenuOption a el tipo de la opcion del menu.
    • MenuOptions todas las opciones del menu.
    • OptionToAddChilds la opcion a la cual se le agregaran los reportes obtenidos.
• ViewReportParameters(_rptId: number, _rptName: string, _shouldResolveParams?: boolean, _shouldResolveSendEmail?: boolean), levanta un modal que contiene todos los parametros del reporte que se le envie por parametro
  • _rptId (number): Id del reporte que se consultaran los parametros
  • _rptName (string): Nombre del reporte que se mostrara como titulo en la modal(Puede ser cualquier otro texto)
  • _shouldResolveParams (boolean): Indica si la modal de parametros muestra el bloqueo de pantalla (Opcional)
  • _shouldResolveSendEmail (boolean): Indica si la modal de envio de reporte por correo mostrara el bloqueo de pantalla (Opcional)

¿Cómo lo uso?

1. Primero debemos cumplir las depencias mencionadas al inicio de este documento
2. Ejecutar el comando npm i @clavisco/rptmng-menu en el directorio root del proyecto
3. Incluir los providers para los modulos de Linker, RptmngMenuModule, Overlay y Modales como se indica en el siguiente código:

  ...
  providers: [
    ...
    {
      provide: 'LinkerService',
      useClass: LinkerService
    },
    {
      provide: 'OverlayService',
      useClass: OverlayService
    },
    {
      provide: 'ModalService',
      useClass: ModalService
    },
    {
      provide: 'RptmngMenuService',
      useClass: RptmngMenuModule
    }
  ]

4. Inyectar el servicio en el controlador donde queremos aplicar las opciones del menu constructor(private alertService: AlertsService)

constructor(
    @Inject('RptmngMenuService') private reportService: RptmngMenuService
  ) { }

5. Luego puede incluir en la opcion de clic, evento o funcion que carga los reportes el siguiente código para aplicar las opciones:

  OnClickMenuOption(_option: IMenuOptionExpandable): void
  {
    _option.Opened = !_option.Opened;

    // Para saber que la opcion que se selecciono es la de reportes 
    // y proceder a consultar los reportes solo si se esta abriedo la opcion
    if(_option.OptionName === 'Reportes' && _option.Opened)
    {
      this.rptMngMenuService.NestOptions(
        this.appKey,
        {
          ShouldResolve: true,
          OptionChildrensProp: 'Children',
          OptionPropToCompare: 'OptionName',
          MapFunction: (rpt) => ({
              OptionName: rpt.Name, 
              OptionId: rpt.Id, 
              IsReport: true
            } as IMenuOption),
          MenuOptions: MenuOptions,
          OptionToAddChilds: {..._option}
        })
        .subscribe({
        next: (callback) => {
          // Se le agregan nuevamente al dataSource del MatTree para que 
          // identifique cambios y los muestre en pantalla
          this.dataSourceRpt.data = callback;
          // Abrir opcion de reportes para visualizar todos los reportes
          this.treeControl.expand(
            this.treeControl.dataNodes
              .find(o => o.OptionName === _option.OptionName)!);
        }
      });
    }
    else if(_option.OptionName !== 'Reportes')
    {
      if(_option.IsReport)
      {
        this.rptMngMenuService.ViewReportParameters(
          _option.OptionId, _option.OptionName, true, true)
        .subscribe({
            next: (result) => CLPrint(result, CL_DISPLAY.INFORMATION)
        });
      }
    }
  }

6. Ya con esto tenemos una implementación básica del componente rptmng-menu
7. Video explicativo sobre el uso de @clavisco/rptmng-menu

Recomendaciones

En el modelo de la opcion del menu tener una propiedad para identificar que la opcion sea un reporte, en el caso anterior se agrego la propiedad IsReport para conocer si la opcion del menu a la que se dio click es un reporte y asi mostrar la modal de los parametros.

Visitar @clavisco/core para conocer la amplia gama de funcionalidades que se nos ofrecen para facilitarnos el proceso de desarrollo

Clavis Consultores ©