mirror of
https://dev.azure.com/hugendubel/ISA/_git/ISA-Frontend
synced 2025-12-28 22:42:11 +01:00
✨ Enhance searchbox functionality
Improved the searchbox components to utilize environment service for mobile detection. - ✨ **Feature**: Integrated EnvironmentService for mobile device detection - 🛠️ **Refactor**: Cleaned up provider definitions for better readability - 🎨 **Style**: Reformatted code for consistency in style #5001
This commit is contained in:
@@ -15,6 +15,7 @@ import {
|
||||
HostListener,
|
||||
forwardRef,
|
||||
Optional,
|
||||
inject,
|
||||
} from '@angular/core';
|
||||
import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
|
||||
import { UiAutocompleteComponent } from '@ui/autocomplete';
|
||||
@@ -23,12 +24,15 @@ import { containsElement } from '@utils/common';
|
||||
import { Subscription } from 'rxjs';
|
||||
import { ScanAdapterService } from '@adapter/scan';
|
||||
import { injectCancelSearch } from '@shared/services/cancel-subject';
|
||||
import { EnvironmentService } from '@core/environment';
|
||||
|
||||
@Component({
|
||||
selector: 'shared-searchbox',
|
||||
templateUrl: 'searchbox.component.html',
|
||||
styleUrls: ['searchbox.component.scss'],
|
||||
providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SearchboxComponent), multi: true }],
|
||||
providers: [
|
||||
{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SearchboxComponent), multi: true },
|
||||
],
|
||||
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||
standalone: false,
|
||||
})
|
||||
@@ -36,6 +40,8 @@ export class SearchboxComponent
|
||||
extends UiFormControlDirective<any>
|
||||
implements AfterViewInit, OnDestroy, AfterContentInit, ControlValueAccessor
|
||||
{
|
||||
#env = inject(EnvironmentService);
|
||||
|
||||
cancelSearch = injectCancelSearch({ optional: true });
|
||||
|
||||
disabled: boolean;
|
||||
@@ -104,7 +110,7 @@ export class SearchboxComponent
|
||||
}
|
||||
|
||||
get canScan() {
|
||||
return !this.query && this.scanner && this.scanAdapterService?.isReady();
|
||||
return this.#env.isMobileDevice() && this.scanAdapterService?.isReady();
|
||||
}
|
||||
|
||||
get canClear() {
|
||||
@@ -228,7 +234,10 @@ export class SearchboxComponent
|
||||
|
||||
@HostListener('window:click', ['$event'])
|
||||
focusLost(event: MouseEvent) {
|
||||
if (this.autocomplete?.opend && !containsElement(this.elementRef.nativeElement, event.target as Element)) {
|
||||
if (
|
||||
this.autocomplete?.opend &&
|
||||
!containsElement(this.elementRef.nativeElement, event.target as Element)
|
||||
) {
|
||||
this.autocomplete?.close();
|
||||
}
|
||||
}
|
||||
|
||||
@@ -15,6 +15,7 @@ import {
|
||||
HostListener,
|
||||
forwardRef,
|
||||
Optional,
|
||||
inject,
|
||||
} from '@angular/core';
|
||||
import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
|
||||
import { UiAutocompleteComponent } from '@ui/autocomplete';
|
||||
@@ -23,12 +24,19 @@ import { Subscription } from 'rxjs';
|
||||
import { ScanAdapterService } from '@adapter/scan';
|
||||
import { injectCancelSearch } from '@shared/services/cancel-subject';
|
||||
import { containsElement } from '@utils/common';
|
||||
import { EnvironmentService } from '@core/environment';
|
||||
|
||||
@Component({
|
||||
selector: 'ui-searchbox',
|
||||
templateUrl: 'searchbox.component.html',
|
||||
styleUrls: ['searchbox.component.scss'],
|
||||
providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => UiSearchboxNextComponent), multi: true }],
|
||||
providers: [
|
||||
{
|
||||
provide: NG_VALUE_ACCESSOR,
|
||||
useExisting: forwardRef(() => UiSearchboxNextComponent),
|
||||
multi: true,
|
||||
},
|
||||
],
|
||||
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||
standalone: false,
|
||||
})
|
||||
@@ -36,6 +44,8 @@ export class UiSearchboxNextComponent
|
||||
extends UiFormControlDirective<any>
|
||||
implements AfterViewInit, OnDestroy, AfterContentInit, ControlValueAccessor
|
||||
{
|
||||
#env = inject(EnvironmentService);
|
||||
|
||||
private readonly _cancelSearch = injectCancelSearch({ optional: true });
|
||||
|
||||
disabled: boolean;
|
||||
@@ -107,7 +117,7 @@ export class UiSearchboxNextComponent
|
||||
}
|
||||
|
||||
get canScan() {
|
||||
return !this.query && this.scanner && this.scanAdapterService?.isReady();
|
||||
return this.#env.isMobileDevice() && this.scanAdapterService?.isReady();
|
||||
}
|
||||
|
||||
get canClear() {
|
||||
@@ -232,7 +242,10 @@ export class UiSearchboxNextComponent
|
||||
|
||||
@HostListener('window:click', ['$event'])
|
||||
focusLost(event: MouseEvent) {
|
||||
if (this.autocomplete?.opend && !containsElement(this.elementRef.nativeElement, event.target as Element)) {
|
||||
if (
|
||||
this.autocomplete?.opend &&
|
||||
!containsElement(this.elementRef.nativeElement, event.target as Element)
|
||||
) {
|
||||
this.autocomplete?.close();
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user