scFilterBar 字段支持全拼,首字搜索

This commit is contained in:
sakuya 2021-07-31 23:29:53 +08:00
parent 3add6861ba
commit 7e7e7ed0b5
3 changed files with 55 additions and 3 deletions

View File

@ -39,9 +39,8 @@
<el-tag size="medium">{{index+1}}</el-tag>
</td>
<td>
<el-select v-model="item.field" placeholder="过滤字段" filterable @change="fieldChange(item)">
<el-option v-for="field in fields" :key="field.value" :label="field.label" :value="field"></el-option>
</el-select>
<py-select v-model="item.field" :options="fields" placeholder="过滤字段" filterable @change="fieldChange(item)">
</py-select>
</td>
<td>
<el-select v-model="item.operator" placeholder="运算符">
@ -98,11 +97,13 @@
<script>
import config from "@/config/filterBar"
import pySelect from './pySelect'
import my from './my'
export default {
name: 'filterBar',
components: {
pySelect,
my
},
props: {

View File

@ -0,0 +1,51 @@
<!--
* @Descripttion: 二次封装el-select 支持拼音
* @version: 1.0
* @Author: sakuya
* @Date: 2021年7月31日22:26:56
* @LastEditors:
* @LastEditTime:
-->
<template>
<el-select v-bind="$attrs" :filter-method="filterMethod" @visible-change="visibleChange">
<el-option v-for="field in optionsList" :key="field.value" :label="field.label" :value="field"></el-option>
</el-select>
</template>
<script>
import pinyin from './pinyin'
export default {
props: {
options: { type: Array, default: () => [] }
},
data() {
return {
optionsList: [],
optionsList_: []
}
},
mounted() {
this.optionsList = this.options
this.optionsList_ = [...this.options]
},
methods: {
filterMethod(keyword){
if(keyword){
this.optionsList = this.optionsList_
this.optionsList = this.optionsList.filter((item) =>
pinyin.match(item.label, keyword)
);
}else{
this.optionsList = this.optionsList_
}
},
visibleChange(isopen){
if(isopen){
this.optionsList = this.optionsList_
}
}
}
}
</script>