mirror of
https://gitlab.com/Chill-Projet/chill-bundles.git
synced 2025-08-22 07:33:50 +00:00
40 lines
1.2 KiB
Vue
40 lines
1.2 KiB
Vue
<script setup lang="ts">
|
|
import { ADDRESS_PICKER_SEARCH_FOR_ADDRESSES, trans } from 'translator';
|
|
const emits = defineEmits<{
|
|
search: [search: string];
|
|
}>();
|
|
|
|
let searchTimer = 0;
|
|
let searchString: string;
|
|
|
|
const onInput = function (event: InputEvent) {
|
|
const target = event.target as HTMLInputElement;
|
|
const value = target.value;
|
|
searchString = value;
|
|
|
|
if (0 === searchTimer) {
|
|
window.clearTimeout(searchTimer);
|
|
searchTimer = 0;
|
|
}
|
|
|
|
searchTimer = window.setTimeout(() => {
|
|
if (value === searchString) {
|
|
emits("search", value);
|
|
}
|
|
}, 500);
|
|
};
|
|
</script>
|
|
|
|
<template>
|
|
<div class="input-group mb-3">
|
|
<span class="input-group-text">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-search" viewBox="0 0 16 16">
|
|
<path d="M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001q.044.06.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1 1 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0"/>
|
|
</svg>
|
|
</span>
|
|
<input type="search" class="form-control" @input="onInput" :placeholder="trans(ADDRESS_PICKER_SEARCH_FOR_ADDRESSES)" />
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped lang="scss"></style>
|