@iconsolutions/common
Componentes, módulos y servicios auxiliares que deben utilizarse al construir módulos de Icon y probar la aplicación.
CommonModule
El CommonModule es un módulo que contiene todos los componentes, tuberías y servicios comunes que se requieren para que la aplicación funcione.
Componentes
NavbarComponent
Un componente para mostrar el encabezado que incluye el ícono de la aplicación, la navegación del módulo y el selector de entidad de procesamiento.
El componente muestra el icono de la aplicación pero no lo contiene.
Simplemente hace referencia a una ruta dentro de la aplicación principal.
Añadiendo la imagen a /src/assets/images/icon.png actualizará la imagen.
La navegación se toma actualmente de la tienda. Consulte el servicio de navegación para más detalles.
Las entidades de procesamiento se presentan utilizando el ProcessingEntitySelector componente, consulte el Módulo de Gestión de Acceso para más detalles.
SidenavComponent
Un componente que muestra una navegación lateral secundaria para la aplicación. Muestra un encabezado con un ícono y un título, y una lista de elementos que pueden ser clicados para navegar a diferentes páginas en un módulo.
Se expande por defecto, pero puede colapsarse haciendo clic en el ícono de flecha en la parte inferior de la navegación lateral. También se colapsa automáticamente cuando la ventana tiene menos de 900px de ancho.
| Nombre | Descripción |
|---|---|
@Input() links: Array<SideNavigationLink> |
Un conjunto de enlaces de navegación lateral que se recuperan de la tienda y se pasan como entrada. |
@Input() etiqueta: cadena |
La etiqueta se utiliza para el encabezado de navegación lateral. |
PanelSearchResultsComponent
Un componente que muestra los resultados de búsqueda y genera un evento cuando se selecciona un resultado de búsqueda. También puede navegar entre los elementos de búsqueda con las teclas de flecha arriba y abajo.
El PanelSearchResultsComponent contiene un <router-outlet>, por lo que cualquier hijo de la ruta en la que se utilice el componente se mostrará en el área correcta.
| Nombre | Descripción |
|---|---|
@Input()selectedIndex: número |
Índice del elemento que desea seleccionar cuando el componente se inicializa. |
@Input()searchResultList: Array<PanelSearchResult> |
Un conjunto de resultados de búsqueda. |
@Output()searchResultClick: EventEmitter<PanelSearchResultClickEvent> |
Un evento al que suscribirse, para que usted sepa qué elemento del resultado de búsqueda ha seleccionado el usuario. |
Ejemplo:
Para añadir el panel de búsqueda a su componente, simplemente agréguelo en el html.list.component.html
<ipf-panel-search-results
*ngIf="searchResultList.length > 0"
[selectedIndex]="2"
[searchResultList]="searchResultList"
(searchResultClick)="searchResultClick($event)"
></ipf-panel-search-results>Para asegurarse de que el resultado de la búsqueda se muestre correctamente, debe agregar una ruta a app-routing.module.ts
const routes: Routes = [{
path: 'list',
component: ListComponent,
children: [
{
path: ':id',
component: ViewComponent,
}
]
}]Módulos
Existen 2 tipos de módulos dentro de la Biblioteca Común.
-
Módulos Requeridos: Un módulo que es necesario para ejecutar la aplicación completa, por ejemplo, Gestión de Acceso, Idioma. Esto se importará en el CommonModule.
-
Módulos no requeridos: Un módulo que NO es necesario para ejecutar la aplicación completa, pero que puede ser requerido para un componente, tubería o servicio específico, por ejemplo,DynamicForm
Los módulos requeridos no necesitan ser importados dentro de la aplicación principal, ya que se importan en el CommonModule que se importa automáticamente al generar un proyecto con el esquema.
Los módulos no requeridos deberán ser importados cuando sea necesario en los módulos relevantes.