<template>
  <view class="ie-search px-20 py-20 border-0 border-b border-solid border-border-light">
    <uv-search v-model="modelValue" shape="square" :showAction="false" :placeholder="placeholder" @input="handleInput"
      @search="handleSearch" @clear="handleClear">
      <!-- <template #suffix>
        <view class="text-24 text-fore-title bg-primary text-white px-24 py-10 rounded-full translate-x-10"
          @click="handleSearch">搜索
        </view>
      </template> -->
    </uv-search>
  </view>
</template>
<script lang="ts" setup>
const props = defineProps<{
  placeholder?: string;
}>();
const modelValue = defineModel<string>('modelValue', {
  default: ''
});

const emit = defineEmits(['search', 'clear']);
const handleSearch = (value: string) => {
  emit('search', value);
};
const handleInput = (value: string) => {
  modelValue.value = value;
};
const handleClear = () => {
  emit('clear');
};
</script>
<style lang="scss" scoped></style>