不喜勿喷惹,插件市场没找到现成的。反正这样可以用,但是如果数据量过大的话,可能会卡顿。
这里写了两个checkboxgroup。一个放全部的数据,一个用来放过滤之后的数据。
watch: {
searchHospitalValue(val) {
this.markHosParamsArr()
let arr = []
if(!val){
this.showChecked()
this.showTreeData = this.hosTreeData
return
}
for(let i of this.hosTreeData){
if(i.name.indexOf(val) != -1){
arr.push(i)
}
}
this.showTreeData = arr
},
},
methods:{
// 获取医院数据
gethospitalList(){
getAreaListtoHos(paramsStr).then(res=>{
for(let item in res.data){
res.data[item].checked = false
}
this.hospitalSelectArr = []
this.filterSelect = []
this.hosParamsArr = []
this.hosTreeData = res.data
this.showTreeData = res.data
})
},
// 显示医院
showHosDrawer(){
this.$refs.hospitalDrawer.open();
this.showChecked()
},
// 医院勾选
checkboxChange(e){
if(e.detail.value.length == 0){
this.hospitalSelectArr = []
this.filterSelect = []
this.hosParamsArr = []
}
this.hospitalSelectArr = e.detail.value
this.markHosParamsArr()
},
// 医院过滤
filterChange(e){
this.filterSelect = e.detail.value
},
//处理多选
markHosParamsArr(){
let Arr = Array.from(new Set(this.hospitalSelectArr.concat(this.filterSelect)))
this.hosCheckNum = Arr.length
this.hosParamsArr = Arr
this.hospitalSelectArr = Array.from(new Set(this.hospitalSelectArr.concat(Arr)))
for(let i of this.hosTreeData){
for(let j of Arr){
if(i.code == j){
i.checked = true
}
}
}
},
// 勾选显示
showChecked(){
for(let i of this.hosTreeData){
i.checked = false
for(let j of this.hospitalSelectArr){
if(i.code == j){
i.checked = true
}
}
}
}
}