diff --git a/ui-ngx/src/app/modules/home/components/filter/key-filter-dialog.component.html b/ui-ngx/src/app/modules/home/components/filter/key-filter-dialog.component.html index c69c74c45f..e0930b8e7d 100644 --- a/ui-ngx/src/app/modules/home/components/filter/key-filter-dialog.component.html +++ b/ui-ngx/src/app/modules/home/components/filter/key-filter-dialog.component.html @@ -29,13 +29,6 @@
- - filter.key-name - - - {{ 'filter.key-name-required' | translate }} - - filter.key-type.key-type @@ -44,10 +37,24 @@ + + filter.key-name + + + + {{option}} + + + + {{ 'filter.key-name-required' | translate }} + +
filter.value-type.value-type - + {{ entityKeyValueTypes.get(keyFilterFormGroup.get('valueType').value)?.name | translate }} diff --git a/ui-ngx/src/app/modules/home/components/filter/key-filter-dialog.component.ts b/ui-ngx/src/app/modules/home/components/filter/key-filter-dialog.component.ts index 6e105aa3d6..e475d37f29 100644 --- a/ui-ngx/src/app/modules/home/components/filter/key-filter-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/filter/key-filter-dialog.component.ts @@ -27,10 +27,14 @@ import { entityKeyTypeTranslationMap, EntityKeyValueType, entityKeyValueTypesMap, - KeyFilterInfo, KeyFilterPredicate + KeyFilterInfo, + KeyFilterPredicate } from '@shared/models/query/query.models'; import { DialogService } from '@core/services/dialog.service'; import { TranslateService } from '@ngx-translate/core'; +import { EntityField, entityFields } from '@shared/models/entity.models'; +import { Observable } from 'rxjs'; +import { filter, map, startWith } from 'rxjs/operators'; export interface KeyFilterDialogData { keyFilter: KeyFilterInfo; @@ -61,6 +65,14 @@ export class KeyFilterDialogComponent extends submitted = false; + entityFields: { [fieldName: string]: EntityField }; + + entityFieldsList: string[]; + + readonly entityField = EntityKeyType.ENTITY_FIELD; + + filteredEntityFields: Observable; + constructor(protected store: Store, protected router: Router, @Inject(MAT_DIALOG_DATA) public data: KeyFilterDialogData, @@ -99,9 +111,28 @@ export class KeyFilterDialogComponent extends ); } }); + + this.keyFilterFormGroup.get('key.key').valueChanges.pipe( + filter((keyName) => this.keyFilterFormGroup.get('key.type').value === this.entityField && this.entityFields.hasOwnProperty(keyName)) + ).subscribe((keyName: string) => { + const prevValueType: EntityKeyValueType = this.keyFilterFormGroup.value.valueType; + const newValueType = this.entityFields[keyName]?.time ? EntityKeyValueType.DATE_TIME : EntityKeyValueType.STRING; + if (prevValueType !== newValueType) { + this.keyFilterFormGroup.get('valueType').patchValue(newValueType, {emitEvent: false}); + } + }); + + this.entityFields = entityFields; + this.entityFieldsList = Object.values(entityFields).map(entityField => entityField.keyName).sort(); } ngOnInit(): void { + this.filteredEntityFields = this.keyFilterFormGroup.get('key.key').valueChanges.pipe( + startWith(''), + map(value => { + return this.entityFieldsList.filter(option => option.startsWith(value)); + }) + ); } isErrorState(control: FormControl | null, form: FormGroupDirective | NgForm | null): boolean {