imacat/lucia-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feature: keypress of search bar

Browse Source
This commit is contained in:
Cindy Chang
2024-07-03 15:42:09 +08:00
parent 7f1efba2b3
commit 8a77df285b
1 changed files with 8 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/components/AccountMenu/SearchBar.vue
View File

@@ -2,7 +2,7 @@
<div id="search_bar_container" class="flex w-[280px] h-8 px-4 items-center border-[#64748B] border-[1px] rounded-full <div id="search_bar_container" class="flex w-[280px] h-8 px-4 items-center border-[#64748B] border-[1px] rounded-full
justify-between"> justify-between">
<input id="input_search" class="w-full outline-0" :placeholder="i18next.t('AcctMgmt.Search')" <input id="input_search" class="w-full outline-0" :placeholder="i18next.t('AcctMgmt.Search')"
v-model="inputQuery" v-model="inputQuery" @keypress="handleKeyPressOfSearch"
/> />
<img src="@/assets/icon-search.svg" class="w-[17px] h-[17px] flex cursor-pointer" @click="onSearchClick"/> <img src="@/assets/icon-search.svg" class="w-[17px] h-[17px] flex cursor-pointer" @click="onSearchClick"/>
</div> </div>
@@ -20,9 +20,16 @@ export default {
emit('on-search-account-button-click', inputQuery.value); emit('on-search-account-button-click', inputQuery.value);
}; };
const handleKeyPressOfSearch = (event) => {
if (event.key === 'Enter') {
emit('on-search-account-button-click', inputQuery.value);
}
}
return { return {
inputQuery, inputQuery,
onSearchClick, onSearchClick,
handleKeyPressOfSearch,
i18next, i18next,
}; };
}, },