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.
143 lines
4.2 KiB
143 lines
4.2 KiB
<!-- 选择部门 -->
|
|
|
|
<template>
|
|
<el-dialog :close-on-click-modal="false" :close-on-press-escape="false" :title="$t('form.selectMember')" :visible.sync="open" width="800px" append-to-body>
|
|
<el-row style="height: 500px;overflow-y: scroll;">
|
|
<el-col :span="12" class="select-user-left">
|
|
<el-input
|
|
:placeholder="$t('form.placeholderInput')"
|
|
v-model="filterText"
|
|
style="margin-bottom:10px">
|
|
</el-input>
|
|
|
|
<el-tree
|
|
class="filter-tree"
|
|
:data="list"
|
|
:props="defaultProps"
|
|
:default-expand-all="true"
|
|
:default-expanded-keys="selected.id=='' ? []:[selected.id]"
|
|
:filter-node-method="filterNode"
|
|
ref="tree"
|
|
node-key="id"
|
|
>
|
|
<span class="custom-tree-node" slot-scope="{ node, data }">
|
|
<!-- <el-radio :ref="'radio'+data.id" v-if="data.type===7" v-model="selected.id" :label="data.id" @change="handleChange(data)" class="select-dept-user-check-radio-box">{{ $i18n.locale === 'zh_CN'?data.name:data.nameEn }}</el-radio> -->
|
|
<el-radio :ref="'radio'+data.id" v-if="data.type===7" v-model="selected.id" :label="data.id" @change="handleChange(data)" class="select-dept-user-check-radio-box">{{data.name }}</el-radio>
|
|
<!-- <span v-else>{{ $i18n.locale === 'zh_CN'?data.name:data.nameEn }}</span> -->
|
|
<span v-else>{{ data.name }}</span>
|
|
</span>
|
|
</el-tree>
|
|
</el-col>
|
|
<el-col :span="12" class="select-user-right">
|
|
<div>已选</div>
|
|
<div class="select-user-selected" v-if="selected.id!=''">
|
|
<div class="select-user-selected-item">
|
|
<!-- <div class="select-user-selected-name">{{$i18n.locale === 'zh_CN'?selected.name:selected.nameEn}}</div> -->
|
|
<div class="select-user-selected-name">{{selected.name}}</div>
|
|
<div class="select-user-selected-del"><i class="el-icon-delete" @click="delSelected"></i></div>
|
|
</div>
|
|
</div>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
|
|
<div slot="footer" class="dialog-footer">
|
|
<el-button @click="open=false">{{$t('form.cancel')}}</el-button>
|
|
<el-button type="primary" @click="save">{{$t('form.saveConfirm')}}</el-button>
|
|
</div>
|
|
</el-dialog>
|
|
</template>
|
|
|
|
<script>
|
|
import { deptUserList } from "@/api/system/user"
|
|
export default {
|
|
name: "SelectDeptUserDialog",
|
|
components: {},
|
|
props: {
|
|
},
|
|
watch: {
|
|
filterText(val) {
|
|
this.$refs.tree.filter(val);
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
open:false,
|
|
|
|
selected:{
|
|
id:'',
|
|
name:'',
|
|
nameEn:''
|
|
},
|
|
|
|
listData: [],
|
|
list: [],
|
|
filterText:'',
|
|
defaultProps: {
|
|
children: 'children',
|
|
label: 'name'
|
|
}
|
|
};
|
|
},
|
|
mounted() {
|
|
},
|
|
methods: {
|
|
show(id,name,nameEn){
|
|
this.getList()
|
|
|
|
this.selected.id = id ?((id+'').indexOf('u_')>-1? id:('u_'+id)):''
|
|
this.selected.name=name || ''
|
|
this.selected.nameEn=nameEn || ''
|
|
this.open = true
|
|
this.filterText = ''
|
|
},
|
|
filterNode(value, data) {
|
|
if (!value) return true;
|
|
// return this.$i18n.locale === 'zh_CN'?(data.name.indexOf(value) !== -1):(data.nameEn.indexOf(value) !== -1);
|
|
return data.name.indexOf(value) !== -1;
|
|
},
|
|
getList() {
|
|
this.listData = []
|
|
this.list = []
|
|
deptUserList().then(response => {
|
|
this.listData = response.data
|
|
this.list = this.handleTree(response.data, "id")
|
|
})
|
|
},
|
|
handleChange(data) {
|
|
if(data && data.type===7){
|
|
this.selected = {
|
|
id:data.id,
|
|
name:data.name,
|
|
nameEn:data.nameEn,
|
|
}
|
|
}
|
|
},
|
|
// getName(id){
|
|
// let name = ''
|
|
// let arr = _.filter(this.listData, (o)=> { return o.id===id })
|
|
// if(arr && arr.length>0){
|
|
// name = arr[0].name
|
|
// }
|
|
// return name
|
|
// },
|
|
save(){
|
|
let obj = {
|
|
id:this.selected && this.selected.id?this.selected.id.replace('u_',''):'',
|
|
name:this.selected.name,
|
|
nameEn:this.selected.nameEn,
|
|
}
|
|
this.$emit('change', obj)
|
|
this.$emit('input', obj.id)
|
|
this.open = false
|
|
},
|
|
delSelected(){
|
|
this.selected = {
|
|
id:'',
|
|
name:'',
|
|
nameEn:'',
|
|
}
|
|
}
|
|
}
|
|
};
|
|
</script>
|