mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-24 17:32:15 +00:00
[AAE-1539] People/Group - Add a formControl for the chip field (#5445)
* Add a formControl for the chip component * on search reset the error and trim later on
This commit is contained in:
@@ -84,6 +84,10 @@ export class GroupCloudComponent implements OnInit, OnChanges, OnDestroy {
|
||||
@Input()
|
||||
readOnly: boolean = false;
|
||||
|
||||
/** FormControl to list of group */
|
||||
@Input()
|
||||
groupChipsCtrl: FormControl = new FormControl({ value: '', disabled: false });
|
||||
|
||||
/** FormControl to search the group */
|
||||
@Input()
|
||||
searchGroupsControl: FormControl = new FormControl({ value: '', disabled: false });
|
||||
@@ -173,15 +177,19 @@ export class GroupCloudComponent implements OnInit, OnChanges, OnDestroy {
|
||||
|
||||
initSearch(): void {
|
||||
this.searchGroupsControl.valueChanges.pipe(
|
||||
debounceTime(500),
|
||||
distinctUntilChanged(),
|
||||
filter((value) => {
|
||||
return typeof value === 'string';
|
||||
}),
|
||||
tap((value: string) => {
|
||||
if (value) {
|
||||
this.setTypingError();
|
||||
}
|
||||
}),
|
||||
debounceTime(500),
|
||||
distinctUntilChanged(),
|
||||
tap((value) => {
|
||||
if (value.trim()) {
|
||||
this.searchedValue = value;
|
||||
this.setTypingError();
|
||||
} else {
|
||||
this.searchGroupsControl.markAsPristine();
|
||||
this.searchGroupsControl.markAsUntouched();
|
||||
@@ -298,7 +306,7 @@ export class GroupCloudComponent implements OnInit, OnChanges, OnDestroy {
|
||||
} else {
|
||||
this.selectedGroups = this.removeDuplicatedGroups(this.preSelectGroups);
|
||||
}
|
||||
|
||||
this.groupChipsCtrl.setValue(this.selectedGroups[0].name);
|
||||
if (this.isValidationEnabled()) {
|
||||
this.isLoading = true;
|
||||
await this.validatePreselectGroups();
|
||||
@@ -327,6 +335,7 @@ export class GroupCloudComponent implements OnInit, OnChanges, OnDestroy {
|
||||
|
||||
this.groupInput.nativeElement.value = '';
|
||||
this.searchGroupsControl.setValue('');
|
||||
this.groupChipsCtrlValue(this.selectedGroups[0].name);
|
||||
|
||||
this.changedGroups.emit(this.selectedGroups);
|
||||
this.resetSearchGroups();
|
||||
@@ -336,7 +345,14 @@ export class GroupCloudComponent implements OnInit, OnChanges, OnDestroy {
|
||||
this.removeGroup.emit(groupToRemove);
|
||||
this.removeGroupFromSelected(groupToRemove);
|
||||
this.changedGroups.emit(this.selectedGroups);
|
||||
if (this.selectedGroups.length === 0) {
|
||||
this.groupChipsCtrlValue('');
|
||||
|
||||
} else {
|
||||
this.groupChipsCtrlValue(this.selectedGroups[0].name);
|
||||
}
|
||||
this.searchGroupsControl.markAsDirty();
|
||||
this.searchGroupsControl.markAsTouched();
|
||||
|
||||
if (this.isValidationEnabled()) {
|
||||
this.removeGroupFromValidation(groupToRemove);
|
||||
@@ -344,6 +360,12 @@ export class GroupCloudComponent implements OnInit, OnChanges, OnDestroy {
|
||||
}
|
||||
}
|
||||
|
||||
private groupChipsCtrlValue(value: string) {
|
||||
this.groupChipsCtrl.setValue(value);
|
||||
this.groupChipsCtrl.markAsDirty();
|
||||
this.groupChipsCtrl.markAsTouched();
|
||||
}
|
||||
|
||||
private removeGroupFromSelected({ id, name }: IdentityGroupModel): void {
|
||||
const indexToRemove = this.selectedGroups.findIndex(group => {
|
||||
return group.id === id && group.name === name;
|
||||
|
Reference in New Issue
Block a user