华西海圻ELN前端工程
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.
 
 
 
 

84 lines
2.1 KiB

<!-- 选择部门 -->
<template>
<treeselect v-model="selected" :options="list" :show-count="true" :disabled="readonly" :multiple="multiple" :placeholder="$t('form.placeholderSelect')" @input="handleChange" />
</template>
<script>
import Treeselect from "@riophae/vue-treeselect"
import { deptTreeSelect } from "@/api/system/user"
import "@riophae/vue-treeselect/dist/vue-treeselect.css"
export default {
name: "SelectDept",
components: {Treeselect},
props: {
value: {
type: [Number, String , Array],
default: null,
},
readonly: {
type: Boolean,
default: false
},
multiple: {
type: Boolean,
default: false
},
},
watch: {
value: {
immediate: true,
handler(v) {
if (!this.multiple) {
this.selected = v ? parseInt(v) : null
} else {
if (v) {
//默认传的,分割的字符串,有传数组再改造
debugger
let arr = (v+'').split(',')
let s = []
_.forEach(arr, a => {
s.push(parseInt(a))
})
this.selected = s
} else {
this.selected = []
}
}
}
},
},
data() {
return {
selected: null,
list: [],
};
},
mounted() {
this.getList()
},
methods: {
getList() {
this.list = []
deptTreeSelect().then(response => {
this.list = this.filterDisabledDept(JSON.parse(JSON.stringify(response.data)))
})
},
// 过滤禁用的部门
filterDisabledDept(deptList) {
return deptList.filter(dept => {
if (dept.disabled) {
return false
}
if (dept.children && dept.children.length) {
dept.children = this.filterDisabledDept(dept.children)
}
return true
})
},
handleChange(val) {
this.$emit('input', this.multiple ? (val && val.length > 0 ? val.join(',') : '') : (val || ''))
this.$emit('change', this.multiple ? (val && val.length > 0 ? val.join(',') : '') : (val || ''))
},
}
};
</script>