2019-12-26 11:39:02 +09:00
|
|
|
<div fxFlex fxLayout="row" class="chatroom-search">
|
2020-01-29 17:08:20 +09:00
|
|
|
<div fxLayout="row" fxLayoutAlign="start center" class="input input-lineless search-form">
|
2020-01-28 20:50:52 +09:00
|
|
|
<form [formGroup]="fgSearch">
|
2020-01-29 17:08:20 +09:00
|
|
|
<span class="icon-img">
|
|
|
|
<i class="mid mdi-magnify"></i>
|
|
|
|
</span>
|
2019-12-23 15:23:27 +09:00
|
|
|
<mat-form-field floatLabel="never">
|
|
|
|
<input
|
|
|
|
matInput
|
|
|
|
#inputSearch
|
|
|
|
type="text"
|
2020-01-08 16:13:00 +09:00
|
|
|
placeholder="{{ 'chat.searchEventByText' | translate }}"
|
2019-12-23 15:23:27 +09:00
|
|
|
value=""
|
|
|
|
formControlName="searchInput"
|
|
|
|
(keydown.enter)="onKeyDownEnter($event, inputSearch.value)"
|
|
|
|
/>
|
2020-01-07 19:30:58 +09:00
|
|
|
<button
|
|
|
|
mat-button
|
|
|
|
matSuffix
|
|
|
|
mat-icon-button
|
|
|
|
aria-label="Clear"
|
|
|
|
*ngIf="inputSearch.value"
|
|
|
|
(click)="inputSearch.value = ''"
|
2019-12-23 15:23:27 +09:00
|
|
|
>
|
|
|
|
<mat-icon>close</mat-icon>
|
|
|
|
</button>
|
|
|
|
</mat-form-field>
|
2020-01-28 20:50:52 +09:00
|
|
|
<span class="text-amount">{{ curIndex }} / {{ totalCount }}</span>
|
2019-12-23 15:23:27 +09:00
|
|
|
</form>
|
|
|
|
</div>
|
2020-01-28 20:50:52 +09:00
|
|
|
<span class="stroke-bar"></span>
|
2019-12-26 11:39:02 +09:00
|
|
|
<div class="btns">
|
2019-12-30 19:19:39 +09:00
|
|
|
<button
|
2020-01-08 08:19:57 +09:00
|
|
|
*ngIf="false"
|
2019-12-30 19:19:39 +09:00
|
|
|
mat-stroked-button
|
|
|
|
(click)="onClickSearchAndPrev()"
|
|
|
|
class="btn-toggle"
|
|
|
|
>
|
2020-01-29 17:08:20 +09:00
|
|
|
<i class="mid mdi-arrow-up"></i>
|
2019-12-23 15:23:27 +09:00
|
|
|
</button>
|
2020-01-28 20:50:52 +09:00
|
|
|
<button class="icon-button btn-search" (click)="onClickPrevSearch()">
|
|
|
|
<i class="mid mdi-arrow-up"></i>
|
2019-12-23 15:23:27 +09:00
|
|
|
</button>
|
2020-01-28 20:50:52 +09:00
|
|
|
<button class="icon-button btn-search" (click)="onClickNextSearch()">
|
|
|
|
<i class="mid mdi-arrow-down"></i>
|
2019-12-23 15:23:27 +09:00
|
|
|
</button>
|
2020-01-07 19:30:58 +09:00
|
|
|
|
2019-12-30 19:19:39 +09:00
|
|
|
<!--<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>-->
|
2020-01-28 20:50:52 +09:00
|
|
|
<button
|
|
|
|
class="icon-button btn-close-searchbox bg-accent-dark"
|
|
|
|
(click)="inputSearch.value = ''; onClickSearchCancel()"
|
2020-01-07 19:30:58 +09:00
|
|
|
>
|
2020-01-28 20:50:52 +09:00
|
|
|
<i class="mid mdi-window-close"></i>
|
|
|
|
</button>
|
|
|
|
</div>
|
2019-12-23 15:23:27 +09:00
|
|
|
</div>
|