|
@@ -0,0 +1,56 @@
|
|
|
|
+<template>
|
|
|
|
+ <view class="search adfac">
|
|
|
|
+ <image class="icon" src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/09/19/d568b395-8490-4e44-af30-7fb5288b8bad.png"></image>
|
|
|
|
+ <div class="input">
|
|
|
|
+ <up-input :placeholder="placeholder" v-model="keyword" border="none" style="font-size: 26rpx;"></up-input>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="btn" @tap="handleSearch">搜索</div>
|
|
|
|
+ </view>
|
|
|
|
+</template>
|
|
|
|
+
|
|
|
|
+<script setup name="CusSearch">
|
|
|
|
+ defineProps({
|
|
|
|
+ placeholder:{
|
|
|
|
+ typeof: String,
|
|
|
|
+ default: '查找公益活动'
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+
|
|
|
|
+ import { ref } from 'vue'
|
|
|
|
+
|
|
|
|
+ const keyword = ref('')
|
|
|
|
+ const emits = defineEmits(['handleSearch'])
|
|
|
|
+
|
|
|
|
+ const handleSearch = () => {
|
|
|
|
+ emits('handleSearch',keyword.value);
|
|
|
|
+ }
|
|
|
|
+</script>
|
|
|
|
+
|
|
|
|
+<style scoped lang="scss">
|
|
|
|
+ .search{
|
|
|
|
+ width: 100%;
|
|
|
|
+ background: #FFFFFF;
|
|
|
|
+ border-radius: 34rpx;
|
|
|
|
+ padding: 6rpx 6rpx 6rpx 26rpx;
|
|
|
|
+ box-sizing: border-box;
|
|
|
|
+ .icon{
|
|
|
|
+ width: 36rpx;
|
|
|
|
+ height: 36rpx;
|
|
|
|
+ }
|
|
|
|
+ .input{
|
|
|
|
+ flex: 1;
|
|
|
|
+ padding: 0 11rpx;
|
|
|
|
+ box-sizing: border-box;
|
|
|
|
+ }
|
|
|
|
+ .btn{
|
|
|
|
+ padding: 9rpx 27rpx;
|
|
|
|
+ background: #B7F358;
|
|
|
|
+ border-radius: 34rpx;
|
|
|
|
+ font-family: PingFangSC, PingFang SC;
|
|
|
|
+ font-weight: 400;
|
|
|
|
+ font-size: 26rpx;
|
|
|
|
+ color: #252525;
|
|
|
|
+ line-height: 37rpx;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+</style>
|