scFilterBar 字段支持全拼,首字搜索
This commit is contained in:
parent
3add6861ba
commit
7e7e7ed0b5
|
@ -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: {
|
||||
|
|
|
@ -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>
|
Loading…
Reference in New Issue