You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

85 lines
1.5 KiB

<template>
<view class="content">
<view class="screen-input">
<u-search
v-model='keyWord'
:show-action='false'
:bg-color="searchData.bgBolor ||'white'"
:border-color="searchData.borderColor ||'#E4E4E4'"
:shape="searchData.shape ||'square'"
:height="searchData.height || 80"
:placeholder="searchData.placeholder ||'请输入设备名称'"
:clearabled="true"
@search='search'
@clear='clear'
>
</u-search>
</view>
<view class="screen-btn" @click="screen" v-if="isShowScreen">
<image src="../../static/icon/screen.png" mode="widthFix"></image>
<view>筛选</view>
</view>
</view>
</template>
<script>
export default {
props: {
searchData:{
type: Object,
default:()=>{return {}},
require:false
},
isShowScreen: {
type: Boolean,
default:()=>{return true},
require:false
},
},
data() {
return {
keyWord: '',
}
},
methods: {
// 搜索
search() {
this.$emit('search', this.keyWord)
},
// 搜索
clear() {
this.$emit('search', '')
},
// 筛选
screen() {
this.$emit('screen')
}
}
}
</script>
<style lang="scss" scoped>
.content {
padding: 20rpx;
display: flex;
align-items: center;
background: white;
.screen-input {
flex: 1;
width: 0px;
}
.screen-btn {
display: flex;
align-items: center;
margin-left:20rpx;
image {
width: 30rpx;
margin-right: 6rpx;
}
}
}
</style>