Files
cbsnexora/src/app/groups/groups-view/group-actions/manage-group-members/manage-group-members.component.ts
T
Ralph HopmanandAdam Saghy cac1d11ad7 build: Use prettier for typescript
Stop ignoring .ts files in prettier and fix existing issues.
2025-01-15 11:59:30 +00:00

108 lines
3.3 KiB
TypeScript

/** Angular Imports */
import { Component, OnInit, AfterViewInit } from '@angular/core';
import { FormGroup, FormBuilder, UntypedFormControl, Validators } from '@angular/forms';
import { Router, ActivatedRoute } from '@angular/router';
/** Custom Dialogs */
import { DeleteDialogComponent } from 'app/shared/delete-dialog/delete-dialog.component';
/** Custom Services */
import { GroupsService } from 'app/groups/groups.service';
import { ClientsService } from 'app/clients/clients.service';
import { MatDialog } from '@angular/material/dialog';
/**
* Manage Group Members Component
*/
@Component({
selector: 'mifosx-manage-group-members',
templateUrl: './manage-group-members.component.html',
styleUrls: ['./manage-group-members.component.scss']
})
export class ManageGroupMembersComponent implements AfterViewInit {
/** Group Data */
groupData: any;
/** Client data. */
clientsData: any = [];
/** Client Members. */
clientMembers: any[] = [];
/** Client Choice. */
clientChoice = new UntypedFormControl('');
/**
* Fetches group action data from `resolve`
* @param {ActivatedRoute} route Activated Route
* @param {GroupsService} groupsService Groups Service
* @param {ClientsService} clientsService Clients Service
* @param {MatDialog} dialog Mat Dialog
*/
constructor(
private route: ActivatedRoute,
private groupsService: GroupsService,
private clientsService: ClientsService,
public dialog: MatDialog
) {
this.route.data.subscribe((data: { groupActionData: any }) => {
this.groupData = data.groupActionData;
this.clientMembers = data.groupActionData.clientMembers || [];
});
}
/**
* Subscribes to Clients search filter:
*/
ngAfterViewInit() {
this.clientChoice.valueChanges.subscribe((value: string) => {
if (value.length >= 2) {
this.clientsService
.getFilteredClients('displayName', 'ASC', true, value, this.groupData.officeId)
.subscribe((data: any) => {
this.clientsData = data.pageItems;
});
}
});
}
/**
* Add client.
*/
addClient() {
if (!this.clientMembers.includes(this.clientChoice.value)) {
this.groupsService
.executeGroupCommand(this.groupData.id, 'associateClients', { clientMembers: [this.clientChoice.value.id] })
.subscribe(() => {
this.clientMembers.push(this.clientChoice.value);
});
}
}
/**
* Remove client.
* @param {number} index Client's array index.
* @param {any} client Client
*/
removeClient(index: number, client: any) {
const removeMemberDialogRef = this.dialog.open(DeleteDialogComponent, {
data: { deleteContext: `client member: ${client.displayName}` }
});
removeMemberDialogRef.afterClosed().subscribe((response: any) => {
if (response.delete) {
this.groupsService
.executeGroupCommand(this.groupData.id, 'disassociateClients', { clientMembers: [client.id] })
.subscribe(() => {
this.clientMembers.splice(index, 1);
});
}
});
}
/**
* Displays Client name in form control input.
* @param {any} client Client data.
* @returns {string} Client name if valid otherwise undefined.
*/
displayClient(client: any): string | undefined {
return client ? client.displayName : undefined;
}
}