pet-system-merchant-app/components/search-bar/index.vue

<template>
	<view class="search-bar-wrap" @click="$emit('click')">
		<uni-icons type="search" size="14" color="#999"></uni-icons>
		<text class="search-placeholder">{{ placeholder }}</text>
	</view>
</template>

<script setup>
defineProps({
	placeholder: { type: String, default: '搜索服务内容' }
})
defineEmits(['click'])
</script>

<style lang="scss" scoped>
.search-bar-wrap {
	display: flex;
	align-items: center;
	background: rgba(255, 255, 255, 0.85);
	border-radius: 40rpx;
	padding: 16rpx 24rpx;
	gap: 12rpx;
}
.search-placeholder {
	font-size: 26rpx;
	color: #999;
}
</style>