98 lines
2.9 KiB
HTML

<div fxFlex fxLayout="row" class="chatroom-search">
<div fxLayout="row" fxLayoutAlign="start center" class="input search-form">
<form [formGroup]="fgSearch">
<i class="material-icons icon-search"> </i>
<mat-form-field floatLabel="never">
<input
matInput
#inputSearch
type="text"
placeholder="{{ 'chat.searchEventByText' | translate }}"
value=""
formControlName="searchInput"
(keydown.enter)="onKeyDownEnter($event, inputSearch.value)"
/>
<!-- <button
mat-button
matSuffix
mat-icon-button
aria-label="Clear"
(click)="inputSearch.value = ''; onClickSearchCancel()"
>
-->
<button
mat-button
matSuffix
mat-icon-button
aria-label="Clear"
*ngIf="inputSearch.value"
(click)="inputSearch.value = ''"
>
<mat-icon>close</mat-icon>
</button>
</mat-form-field>
<span class="text-amount">{{ curIndex }} / {{ totalCount }}</span>
</form>
</div>
<span class="stroke-bar"></span>
<div class="btns">
<button
*ngIf="false"
mat-stroked-button
(click)="onClickSearchAndPrev()"
class="btn-toggle"
>
<svg
xmlns="http://www.w3.org/2000/svg"
width="20"
height="20"
viewBox="0 0 20 20"
fill="none"
stroke="currentColor"
stroke-width="1.5"
stroke-linecap="round"
stroke-linejoin="round"
class="feather feather-arrow-up"
>
<path d="M3.3,9v6.7c0,0.9,0.7,1.7,1.7,1.7h10c0.9,0,1.7-0.7,1.7-1.7V9" />
<polyline class="st0" points="13.3,6 10,2.7 6.7,6 " />
<line class="st0" x1="10" y1="2.7" x2="10" y2="12.5" />
</svg>
</button>
<button class="icon-button btn-search" (click)="onClickPrevSearch()">
<i class="mid mdi-arrow-up"></i>
</button>
<button class="icon-button btn-search" (click)="onClickNextSearch()">
<i class="mid mdi-arrow-down"></i>
</button>
<!--<mat-button-toggle-group>
<mat-button-toggle></mat-button-toggle>
<mat-button-toggle >
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
class="feather feather-arrow-up"
>
<line x1="12" y1="19" x2="12" y2="5"></line>
<polyline points="5 12 12 5 19 12"></polyline>
</svg>
</mat-button-toggle>
<mat-button-toggle ></mat-button-toggle>
</mat-button-toggle-group>-->
<button
class="icon-button btn-close-searchbox bg-accent-dark"
(click)="inputSearch.value = ''; onClickSearchCancel()"
>
<i class="mid mdi-window-close"></i>
</button>
</div>
</div>