/** Angular Imports */ import { Component , AfterViewInit } from '@angular/core' ; import { FormControl } from '@angular/forms' ; import { ActivatedRoute } from '@angular/router' ; /** Custom Dialogs */ import { DeleteDialogComponent } from 'app/shared/delete-dialog/delete-dialog.component' ; /** Custom Services */ import { CentersService } from 'app/centers/centers.service' ; import { GroupsService } from 'app/groups/groups.service' ; import { MatDialog } from '@angular/material/dialog' ; @ Component ( { selector : 'mifosx-manage-groups' , templateUrl : './manage-groups.component.html' , styleUrls : [ './manage-groups.component.scss' ] } ) export class ManageGroupsComponent implements AfterViewInit { /** Center Data */ centerData : any ; /** Group data. */ groupsData : any = [ ] ; /** Group Members. */ groupMembers : any [ ] = [ ] ; /** GroupChoice. */ groupChoice = new FormControl ( '' ) ; param { ActivatedRoute } route param { CentersService } centersService param { GroupsService } groupsService param { MatDialog } dialog constructor ( private route , private centersService , private groupsService , public dialog ) { this . route . data . subscribe ( ( data ) => { this . centerData = data . centersActionData ; this . groupMembers = data . centersActionData . groupMembers ; } ) ; } /**
     * Subscribes to Groups search filter:
     */ ngAfterViewInit ( ) { this . groupChoice . valueChanges . subscribe ( ( value ) => { if ( value . length >= 2 ) { this . groupsService . getFilteredGroups ( 'name' , 'ASC' , value , this . centerData . officeId , 'true' ) . subscribe ( ( data ) => { this . groupsData = data ; } ) ; } } ) ; } /**
     * Add group.
     */ addGroup ( ) { if ( this . groupMembers !== null && this . groupMembers !== undefined ) { if ( ! this . groupMembers . includes ( this . groupChoice . value ) ) { this . centersService . executeCenterActionCommand ( this . centerData . id , 'associateGroups' , { groupMembers : [ this . groupChoice . value . id ] } ) . subscribe ( ( ) => { this . groupMembers . push ( this . groupChoice . value ) ; } ) ; } } else { this . centersService . executeCenterActionCommand ( this . centerData . id , 'associateGroups' , { groupMembers : [ this . groupChoice . value . id ] } ) . subscribe ( ( ) => { this . groupMembers . push ( this . groupChoice . value ) ; } ) ; } } param index removeGroup ( index , group ) { const removeMemberDialogRef = this . dialog . open ( DeleteDialogComponent , { data : { deleteContext : `group member: ${ group . name }` } } ) ; removeMemberDialogRef . afterClosed ( ) . subscribe ( ( response ) => { if ( response . delete ) { this . centersService . executeCenterActionCommand ( this . centerData . id , 'disassociateGroups' , { groupMembers : [ group . id ] } ) . subscribe ( ( ) => { this . groupMembers . splice ( index , 1 ) ; } ) ; } } ) ; } param { any } group returns { string } displayGroup ( group ) { return group ? group . name : undefined ; } }