Merge pull request #140 from netgrif/NAE-1751

[NAE-1751] Autocomplete new  filter "include"

Author: machacjozef

projects/netgrif-components-core/src/lib/data-fields/enumeration-field/enumeration-autocomplete-select-field/abstract-enumeration-autocomplete-select-field.component.ts

@@ -6,6 +6,7 @@ import {EnumerationField, EnumerationFieldValidation, EnumerationFieldValue} fro
 import {WrappedBoolean} from '../../data-field-template/models/wrapped-boolean';
 import {TranslateService} from '@ngx-translate/core';
 import {MatAutocompleteSelectedEvent} from '@angular/material/autocomplete';
+import {EnumerationAutocompleteFilterProperty} from './enumeration-autocomplete-filter-property';
 
 @Component({
     selector: 'ncc-abstract-enumeration-autocomplete-field',
@@ -44,18 +45,6 @@ export abstract class AbstractEnumerationAutocompleteSelectFieldComponent implem
         this.filteredOptions = undefined;
     }
 
-    /**
-     * Function to filter out matchless options without accent and case-sensitive differences
-     * @param  value to compare matching options
-     * @return  return matched options
-     */
-    private _filter(value: string): Array<EnumerationFieldValue> {
-        const filterValue = value?.toLowerCase().normalize('NFD').replace(/[\u0300-\u036f]/g, '');
-
-        return this.enumerationField.choices.filter(option => option.value.toLowerCase().normalize('NFD')
-            .replace(/[\u0300-\u036f]/g, '').indexOf(filterValue) === 0);
-    }
-
     change() {
         if (this.text.value !== undefined) {
             this.filteredOptions = of(this._filter(this.text.value));
@@ -71,6 +60,50 @@ export abstract class AbstractEnumerationAutocompleteSelectFieldComponent implem
         return !this.formControlRef.disabled && !this.formControlRef.valid && this.text.control.touched;
     }
 
+    protected checkPropertyInComponent(property: string): boolean {
+        return !!this.enumerationField.component && !!this.enumerationField.component.properties && property in this.enumerationField.component.properties;
+    }
+
+    protected filterType(): string | undefined {
+        if (this.checkPropertyInComponent('filter')) {
+            return this.enumerationField.component.properties.filter;
+        }
+    }
+
+    protected _filter(value: string): Array<EnumerationFieldValue> {
+        let filterType = this.filterType()?.toLowerCase()
+        switch (filterType) {
+            case EnumerationAutocompleteFilterProperty.SUBSTRING:
+                return this._filterInclude(value);
+            case EnumerationAutocompleteFilterProperty.PREFIX:
+                return this._filterIndexOf(value);
+            default:
+                return this._filterIndexOf(value);
+        }
+    }
+
+    protected _filterInclude(value: string): Array<EnumerationFieldValue> {
+        const filterValue = value?.toLowerCase().normalize('NFD').replace(/[\u0300-\u036f]/g, '');
+        return this.enumerationField.choices.filter(option =>
+            option.value.toLowerCase()
+                .normalize('NFD')
+                .replace(/[\u0300-\u036f]/g, '')
+                .includes(filterValue));
+    }
+
+
+    /**
+     * Function to filter out matchless options without accent and case-sensitive differences
+     * @param  value to compare matching options
+     * @return  return matched options
+     */
+    protected _filterIndexOf(value: string): Array<EnumerationFieldValue> {
+        const filterValue = value?.toLowerCase().normalize('NFD').replace(/[\u0300-\u036f]/g, '');
+
+        return this.enumerationField.choices.filter(option => option.value.toLowerCase().normalize('NFD')
+            .replace(/[\u0300-\u036f]/g, '').indexOf(filterValue) === 0);
+    }
+
     public renderSelection = (key) => {
         if (key !== undefined && key !== '' && key !== null) {
             if (this.enumerationField.choices.find(choice => choice.key === key)) {

projects/netgrif-components-core/src/lib/data-fields/enumeration-field/enumeration-autocomplete-select-field/enumeration-autocomplete-filter-property.ts

@@ -0,0 +1,4 @@
+export enum EnumerationAutocompleteFilterProperty {
+    PREFIX='prefix',
+    SUBSTRING='substring'
+}

projects/netgrif-components-core/src/lib/data-fields/multichoice-field/multichoice-autocomplete-field/abstract-multichoice-autocomplete-field-component.component.ts

@@ -6,6 +6,7 @@ import {COMMA, ENTER} from '@angular/cdk/keycodes';
 import {MatChipInputEvent} from '@angular/material/chips';
 import {Observable, of} from 'rxjs';
 import {map, startWith} from 'rxjs/operators';
+import {MultichoiceAutocompleteFilterProperty} from './multichoice-autocomplete-filter-property';
 
 @Component({
     selector: 'ncc-abstract-multichoice-autocomplete-field',
@@ -65,7 +66,37 @@ export abstract class AbstractMultichoiceAutocompleteFieldComponentComponent imp
         }
     }
 
-    private _filter(value: string): Array<MultichoiceFieldValue> {
+    protected checkPropertyInComponent(property: string): boolean {
+        return !!this.multichoiceField.component && !!this.multichoiceField.component.properties && property in this.multichoiceField.component.properties;
+    }
+
+    protected filterType(): string | undefined {
+        if (this.checkPropertyInComponent('filter')) {
+            return this.multichoiceField.component.properties.filter;
+        }
+    }
+
+    protected _filter(value: string): Array<MultichoiceFieldValue> {
+        let filterType = this.filterType()?.toLowerCase()
+        switch (filterType) {
+            case MultichoiceAutocompleteFilterProperty.SUBSTRING:
+                return this._filterInclude(value);
+            case MultichoiceAutocompleteFilterProperty.PREFIX:
+                return this._filterIndexOf(value);
+            default:
+                return this._filterIndexOf(value);
+        }
+    }
+
+    protected _filterInclude(value: string): Array<MultichoiceFieldValue> {
+        if (Array.isArray(value)) {
+            value = '';
+        }
+        const filterValue = value?.toLowerCase().normalize('NFD').replace(/[\u0300-\u036f]/g, '');
+        return this.multichoiceField.choices.filter(option => option.value.toLowerCase().normalize('NFD').replace(/[\u0300-\u036f]/g, '').includes(filterValue));
+    }
+
+    protected _filterIndexOf(value: string): Array<MultichoiceFieldValue> {
         if (Array.isArray(value)) {
             value = '';
         }

projects/netgrif-components-core/src/lib/data-fields/multichoice-field/multichoice-autocomplete-field/multichoice-autocomplete-filter-property.ts

@@ -0,0 +1,4 @@
+export enum MultichoiceAutocompleteFilterProperty {
+    PREFIX='prefix',
+    SUBSTRING='substring'
+}

projects/netgrif-components-core/src/lib/data-fields/public-api.ts

@@ -80,6 +80,8 @@ export * from './filter-field/models/filter-field-injection-token';
 /* Enums */
 export * from './models/template-appearance';
 export * from './models/material-appearance';
+export * from './enumeration-field/enumeration-autocomplete-select-field/enumeration-autocomplete-filter-property'
+export * from './multichoice-field/multichoice-autocomplete-field/multichoice-autocomplete-filter-property'
 
 /* Services */
 export * from './i18n-field/language-icons.service';