|
|
@@ -5,7 +5,7 @@
|
|
|
<div class="title">{{ title }}</div>
|
|
|
<div class="sure" @click="onSearchConfirm">确定</div>
|
|
|
</div>
|
|
|
- <van-search v-if="showSearch" placeholder="输入您想搜索的内容" v-model="searchValue" @input="inputSearchValue" />
|
|
|
+ <van-search v-if="showSearch" placeholder="输入搜索内容" v-model="searchValue" @input="inputSearchValue" />
|
|
|
<!-- <div class="tip">已选{{temp_datas.length}}条</div>-->
|
|
|
<div v-if="itemList?.length >0" class="lists">
|
|
|
<div class="line" v-for="(item, index) in itemList" :key="item[valueKey]">
|
|
|
@@ -22,7 +22,7 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div v-else class="lists">
|
|
|
- <van-empty description="暂无数据" />
|
|
|
+ <van-empty description="无数据" />
|
|
|
</div>
|
|
|
</van-popup>
|
|
|
</template>
|
|
|
@@ -96,7 +96,11 @@ export default {
|
|
|
this.$set(this.columns[i],'checked',!this.columns[i].checked);
|
|
|
},
|
|
|
inputSearchValue(query) {
|
|
|
- if(query == ''){return this.itemList = this.options }
|
|
|
+ console.log(query,'query')
|
|
|
+ if(!query){
|
|
|
+ this.itemList = this.options
|
|
|
+ return
|
|
|
+ }
|
|
|
//搜索框值发生改变
|
|
|
setTimeout(() => {
|
|
|
this.itemList= this.temp_datas.filter(item => {
|
|
|
@@ -117,50 +121,55 @@ export default {
|
|
|
},
|
|
|
}
|
|
|
</script>
|
|
|
-<style scoped>
|
|
|
-.search-data-popup .tip {
|
|
|
- color: #666;
|
|
|
- padding-bottom: 5px;
|
|
|
-}
|
|
|
-.search-data-popup .header-line {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- height: 90px;
|
|
|
-}
|
|
|
-.search-data-popup .header-line .cancel {
|
|
|
- padding: 0 30px;
|
|
|
- font-size: 28px;
|
|
|
- color: #969799;
|
|
|
-}
|
|
|
-.search-data-popup .header-line .title {
|
|
|
- font-weight: 500;
|
|
|
- font-size: 30px;
|
|
|
- color: #343434;
|
|
|
-}
|
|
|
-.search-data-popup .header-line .sure {
|
|
|
- padding: 0 30px;
|
|
|
- font-size: 28px;
|
|
|
- color: #1989fa;
|
|
|
-}
|
|
|
-.search-data-popup .lists {
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- padding: 10px 12px 20px 12px;
|
|
|
- min-height: 300px;
|
|
|
- max-height: 700px;
|
|
|
- overflow: auto;
|
|
|
-}
|
|
|
-.search-data-popup .lists .line {
|
|
|
- line-height: 40px;
|
|
|
- font-size: 16px;
|
|
|
- color: #000;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
-}
|
|
|
-.search-data-popup .lists .line img {
|
|
|
- width: 20px;
|
|
|
- height: 20px;
|
|
|
+<style lang="scss" scoped>
|
|
|
+.search-data-popup{
|
|
|
+ .header-line {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ height: 90px;
|
|
|
+ }
|
|
|
+ .header-line .cancel {
|
|
|
+ padding: 0 30px;
|
|
|
+ font-size: 28px;
|
|
|
+ color: #969799;
|
|
|
+ }
|
|
|
+ .header-line .title {
|
|
|
+ font-weight: 500;
|
|
|
+ font-size: 30px;
|
|
|
+ color: #343434;
|
|
|
+ }
|
|
|
+ .header-line .sure {
|
|
|
+ padding: 0 30px;
|
|
|
+ font-size: 28px;
|
|
|
+ color: #1989fa;
|
|
|
+ }
|
|
|
+ .lists {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ padding: 10px 12px 20px 12px;
|
|
|
+ min-height: 300px;
|
|
|
+ max-height: 700px;
|
|
|
+ overflow: auto;
|
|
|
+ }
|
|
|
+ .lists .line {
|
|
|
+ line-height: 40px;
|
|
|
+ font-size: 16px;
|
|
|
+ color: #000;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+ .lists .line img {
|
|
|
+ width: 20px;
|
|
|
+ height: 20px;
|
|
|
+ }
|
|
|
+ .tip {
|
|
|
+ color: #666;
|
|
|
+ padding-bottom: 5px;
|
|
|
+ }
|
|
|
+ .van-empty{
|
|
|
+ padding: 0;
|
|
|
+ }
|
|
|
}
|
|
|
</style>
|