@evomatik/evk-procesos
v1.0.34
Published
Libería angular para la creación de bandejas generales.
Downloads
6
Readme
Evomatik Procesos Library
Libería angular para la creación de bandejas generales.
How to install
Instalar el paquete por comandos:
npm install @evomatik/evk-procesos
How to use
evk-procesos
Para poder usuar la libreria de evk-procesos es necesario en primer lugar importar el modulo EvkProcesosModule
.
@NgModule({
imports: [
EvkProcesosModule,
]
})
Opciones de Configuración
Los atributos de configuración de la directiva son:
@Input()
- usuarioReceptor - Usado para el filtrado de tareas. Nombre del usuario a quien está asignada la tarea.
- usuarioEmisor - Usado para el filtrado de tareas. Nombre del usuario quien creo la tarea.
- unidad - Usado para el filtrado de tareas. Nombre de la organización a la que está asignada la tarea.
- tipoTarea - Usado para el filtrado de tareas. Él tipo de tarea.
- camposDetalles - Arreglo listando los campos pertenecientes al detalle de la tarea que se desean mostrar en la columna de detalles y sus respectivos labels. El formato para especificar pares de campo y label es un arreglo conteniendo el label en primera posición y la ruta al campo en segunda. Para campos anidados se pone la ruta separada por puntos. Ejemplo:
['['Fecha creación', fecha'], ['Cosa', 'algo'],['NUC' 'expediente.folioNuc']]
- recargaPaginaOn Usado cuando se desea recargar los datos de la pagina. Recibe un observable, cada que este emita se volveran a cargar los datos de la pagina
- menuOpciones - Arreglo de objetos donde se definen las acciones disponibles en el menú de acciones. Recibe un arreglo de objetos de tipo Accion. Accion:
export interface Accion {
/**
* Determina el label del botón asociado a la acción que aparecera en el menu
*/
label: string;
/**
* Función que se ejecuta al seleccionar la acción en el menu
*/
accion: (tarea?) => any;
/**
* Función para determinar cuando se debe mostrar la acción
*/
show?: (tarea?) => boolean;
}
Ejemplo: [
{label: 'Guardar', accion: (tarea) => this.servicio.save(tarea)},
{label: 'Emite', accion: (tarea) => this.subject$.next(tarea)},
{label: 'Alertar', accion: (tarea) => alert(tarea.tipoTarea), show: (tarea) => tarea.tipoTarea === 'Derivación' }
]
- filtroEstado - Usado para agregar un select que filtre por estado tarea. Recibe un objeto de tipo FiltroConfig FiltroConfig
- filtroTipo - Usado para agregar un select que filtre por tipo de tarea. Recibe un objeto de tipo FiltroConfig FiltroConfig
export interface FiltroConfig{
/**
* Determina el label del select usado para filtrar tareas
*/
label: string;
/**
* Determina las opciones del select
*/
options: Observable<EvkOption[]> | Subject<EvkOption[]>;
/**
* Función que define una tranformación que se aplicara sobre la opción selecionada
*/
mapToFilter?: (event) => string;
}
Ejemplo: [{label: 'Estado diligencia', options: of(arregloDeEvkOptions), mapToFilter: (tarea) => tarea.estadoTarea === 'Finalizada'}]
colorEstatus - Objeto usado para definir el color correspondiente a cada estatus del chip de estatus. Ejemplo: {CREADA: '#BDF3FF', FINALIZADA: '#66F764'}
@Output()
- dataLoaded: Evento emitido cuando se cargar los datos del paginador.
Ejemplo
export class BandejaPageComponent {
public unidad = 27;
public tipoTarea = 'derivacion';
public detalles = [
['NIC', 'nic'],
['Unidad emisora', 'organizacionAnterior.label']
];
public acciones = [
{
label: 'Accion 1', accion: (tarea) => console.log(tarea)
},
{
label: 'Accion 2', accion: (tarea) => this.accionCompleja(tarea),
}
];
<evk-procesos-bandeja
[unidad]="unidad"
[tipoTarea]="tipoTarea"
[camposDetalle]="detalles"
[menuOpciones]="acciones">
</evk-procesos-bandeja>
EvkProcesos
Librery version 1.0.6
Code scaffolding
Run ng generate component component-name --project evk-content
to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module --project evk-content
.
Note: Don't forget to add
--project evk-content
or else it will be added to the default project in yourangular.json
file.
Build
Run ng build evk-content
to build the project. The build artifacts will be stored in the dist/
directory.
Publishing
After building your library with ng build evk-procesos
, go to the dist folder cd dist/evk-evk-procesos
and run npm publish
.
Running unit tests
Run ng test evk-procesos
to execute the unit tests via Karma.
Further help
To get more help on the Angular CLI use ng help
or go check out the Angular CLI README.