sxhundred/ISA-Frontend
1
0
Fork 0
mirror of https://dev.azure.com/hugendubel/ISA/_git/ISA-Frontend synced 2025-12-31 09:37:15 +01:00
Code Issues Packages Projects Releases Wiki Activity

#966 Start Search on Tap / Click Autocomplete Results

Browse Source
This commit is contained in:
Sebastian
2020-10-28 14:02:42 +01:00
parent 71b0302333
commit c12e319ce0
1 changed files with 33 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
apps/page/customer/src/lib/customer-search/shared/customer-searchbox/customer-searchbox.component.html
View File

@@ -12,7 +12,12 @@
<ui-searchbox-warning *ngIf="searchState === 'empty'">
Keine Suchergebnisse
</ui-searchbox-warning>
<button *ngIf="queryControl?.value?.length" type="reset" uiSearchboxClearButton (click)="queryControl.reset(); input.focus()">
<button
*ngIf="queryControl?.value?.length"
type="reset"
uiSearchboxClearButton
(click)="queryControl.reset(); input.focus()"
>
<ui-icon icon="close" size="22px"></ui-icon>
</button>
<button
@@ -22,15 +27,37 @@
(click)="search.startSearch()"
[disabled]="searchState === 'fetching'"
>
<ui-icon class="spin" *ngIf="searchState === 'fetching'" icon="spinner" size="32px"></ui-icon>
<ui-icon
class="spin"
*ngIf="searchState === 'fetching'"
icon="spinner"
size="32px"
></ui-icon>
<ng-container *ngIf="searchState !== 'fetching'">
<ui-icon *ngIf="isMobile && !input?.value?.length" icon="scan" size="32px"></ui-icon>
<ui-icon *ngIf="!isMobile || !!input?.value?.length" icon="search" size="24px"></ui-icon>
<ui-icon
*ngIf="isMobile && !input?.value?.length"
icon="scan"
size="32px"
></ui-icon>
<ui-icon
*ngIf="!isMobile || !!input?.value?.length"
icon="search"
size="24px"
></ui-icon>
</ng-container>
</button>
<ui-searchbox-autocomplete uiClickOutside (clicked)="autocomplete.close()" #autocomplete>
<button uiSearchboxAutocompleteOption [value]="result?.display" *ngFor="let result of autocompleteResult$ | async">
<ui-searchbox-autocomplete
uiClickOutside
(clicked)="autocomplete.close()"
#autocomplete
>
<button
uiSearchboxAutocompleteOption
[value]="result?.display"
*ngFor="let result of autocompleteResult$ | async"
(click)="search.startSearch(); autocomplete.close()"
>
{{ result?.display }}
</button>
</ui-searchbox-autocomplete>