feature: search bar works. Beautiful two return code.

src/components/AccountMenu/SearchBar.vue

@@ -1,24 +1,30 @@
 <template>
     <div id="search_bar_container" class="flex w-[280px] h-8 px-4 items-center border-[#64748B] border-[1px] rounded-full 
         justify-between">
-        <input id="input_search" class="w-full outline-0" :placeholder="i18next.t('AcctMgmt.Search')"/>
-        <img src="@/assets/icon-search.svg" class="w-[17px] h-[17px] flex cursor-pointer"/>
+        <input id="input_search" class="w-full outline-0" :placeholder="i18next.t('AcctMgmt.Search')"
+            v-model="inputQuery"
+        />
+        <img src="@/assets/icon-search.svg" class="w-[17px] h-[17px] flex cursor-pointer" @click="onSearchClick"/>
     </div>
 </template>
 
 <script>
+import { ref, } from 'vue';
 import i18next from '@/i18n/i18n.js';
 export default {
-    setup() {
+    setup(props, { emit, }) {
+        const inputQuery = ref("");
+
+        const onSearchClick = (event) => {
+            event.preventDefault();
+            emit('on-search-account-button-click', inputQuery.value);
+        };
 
-    },
-    data() {
         return {
-            i18next: i18next,
-        }
-    },
-    created() {
-
+            inputQuery,
+            onSearchClick,
+            i18next,
+        };
     },
 };
 </script>