parent
69ccdd769d
commit
16cd8ca4d7
4 changed files with 131 additions and 97 deletions
@ -1,111 +1,145 @@ |
||||
<template> |
||||
<div> |
||||
<a-input-search |
||||
<!-- <a-input |
||||
v-model="userNames" |
||||
placeholder="请先选择用户" |
||||
placeholder="请点击选择用户" |
||||
readOnly |
||||
unselectable="on" |
||||
@search="onSearchDepUser"> |
||||
@search="onSearchDepUser" |
||||
:disabled="disabled" |
||||
@click="onSearchDepUser" |
||||
> |
||||
<a-icon slot="enterButton" type="cluster" title="部门选择控件" /> |
||||
</a-input> --> |
||||
<a-input-search v-model="userNames" placeholder="请先选择用户" readOnly unselectable="on" @search="onSearchDepUser"> |
||||
<a-button slot="enterButton" :disabled="disabled">选择用户</a-button> |
||||
</a-input-search> |
||||
<j-select-user-by-dep-modal ref="selectModal" :modal-width="modalWidth" :multi="multi" @ok="selectOK" :user-ids="value" @initComp="initComp"/> |
||||
<j-select-user-by-dep-modal |
||||
ref="selectModal" |
||||
:modal-width="modalWidth" |
||||
:multi="multi" |
||||
@ok="selectOK" |
||||
:user-ids="value" |
||||
@initComp="initComp" |
||||
/> |
||||
<!-- :user-ids="value" --> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
import JSelectUserByDepModal from './modal/JSelectUserByDepModal' |
||||
import JSelectUserByDepModal from './modal/JSelectUserByDepModal' |
||||
|
||||
export default { |
||||
name: 'JSelectUserByDep', |
||||
components: {JSelectUserByDepModal}, |
||||
props: { |
||||
modalWidth: { |
||||
type: Number, |
||||
default: 1250, |
||||
required: false |
||||
}, |
||||
value: { |
||||
type: String, |
||||
required: false |
||||
}, |
||||
disabled: { |
||||
type: Boolean, |
||||
required: false, |
||||
default: false |
||||
}, |
||||
multi: { |
||||
type: Boolean, |
||||
default: true, |
||||
required: false |
||||
}, |
||||
backUser: { |
||||
type: Boolean, |
||||
default: false, |
||||
required: false |
||||
} |
||||
}, |
||||
data() { |
||||
return { |
||||
userIds: "", |
||||
userNames: "" |
||||
} |
||||
}, |
||||
mounted() { |
||||
this.userIds = this.value |
||||
}, |
||||
watch: { |
||||
value(val) { |
||||
this.userIds = val |
||||
} |
||||
}, |
||||
model: { |
||||
prop: 'value', |
||||
event: 'change' |
||||
}, |
||||
methods: { |
||||
initComp(userNames) { |
||||
this.userNames = userNames |
||||
}, |
||||
//返回选中的用户信息 |
||||
backDeparInfo(){ |
||||
if(this.backUser===true){ |
||||
if(this.userIds && this.userIds.length>0){ |
||||
let arr1 = this.userIds.split(',') |
||||
let arr2 = this.userNames.split(',') |
||||
let info = [] |
||||
for(let i=0;i<arr1.length;i++){ |
||||
info.push({ |
||||
value: arr1[i], |
||||
text: arr2[i] |
||||
}) |
||||
export default { |
||||
name: 'JSelectUserByDep', |
||||
components: { JSelectUserByDepModal }, |
||||
props: { |
||||
modalWidth: { |
||||
type: Number, |
||||
default: 1250, |
||||
required: false, |
||||
}, |
||||
value: { |
||||
type: String, |
||||
required: false, |
||||
}, |
||||
disabled: { |
||||
type: Boolean, |
||||
required: false, |
||||
default: false, |
||||
}, |
||||
multi: { |
||||
type: Boolean, |
||||
default: false, |
||||
required: false, |
||||
}, |
||||
backUser: { |
||||
type: Boolean, |
||||
default: false, |
||||
required: false, |
||||
}, |
||||
}, |
||||
data() { |
||||
return { |
||||
userIds: '', |
||||
userNames: '', |
||||
} |
||||
this.$emit('back', info) |
||||
} |
||||
} |
||||
}, |
||||
onSearchDepUser() { |
||||
this.$refs.selectModal.showModal() |
||||
}, |
||||
selectOK(rows, idstr) { |
||||
console.log("当前选中用户", rows) |
||||
console.log("当前选中用户ID", idstr) |
||||
if (!rows) { |
||||
this.userNames = '' |
||||
this.userIds = '' |
||||
} else { |
||||
let temp = '' |
||||
for (let item of rows) { |
||||
temp += ',' + item.realname |
||||
} |
||||
this.userNames = temp.substring(1) |
||||
this.userIds = idstr |
||||
} |
||||
this.$emit("change", this.userIds) |
||||
} |
||||
}, |
||||
mounted() { |
||||
this.userIds = this.value |
||||
}, |
||||
watch: { |
||||
value(val) { |
||||
this.userIds = val |
||||
}, |
||||
}, |
||||
// model: { |
||||
// prop: 'value', |
||||
// event: 'change', |
||||
// }, |
||||
methods: { |
||||
initComp(userNames) { |
||||
this.userNames = userNames |
||||
}, |
||||
//返回选中的用户信息 |
||||
backDeparInfo() { |
||||
if (this.backUser === true) { |
||||
if (this.userIds && this.userIds.length > 0) { |
||||
let arr1 = this.userIds.split(',') |
||||
let arr2 = this.userNames.split(',') |
||||
let info = [] |
||||
for (let i = 0; i < arr1.length; i++) { |
||||
info.push({ |
||||
value: arr1[i], |
||||
text: arr2[i], |
||||
}) |
||||
} |
||||
this.$emit('back', info) |
||||
} |
||||
} |
||||
}, |
||||
onSearchDepUser() { |
||||
this.$refs.selectModal.showModal() |
||||
}, |
||||
selectOK(rows, idstr) { |
||||
//修改 |
||||
let temp = '' |
||||
console.log('当前选中用户', rows) |
||||
console.log('当前选中用户ID', idstr) |
||||
//修改if(!rows) |
||||
if (!rows && rows.length <= 0) { |
||||
this.userNames = '' |
||||
this.userIds = '' |
||||
} else { |
||||
// let temp = '' |
||||
//修改 |
||||
|
||||
for (let item of rows) { |
||||
// |
||||
console.log(item) |
||||
// temp += item.realname |
||||
console.log(temp) |
||||
//修改 |
||||
temp += ' ' + item.realname |
||||
} |
||||
// this.userNames = temp.substring(1) |
||||
|
||||
this.userNames = temp |
||||
console.log(this.userNames) |
||||
this.userIds = idstr |
||||
console.log(rows) |
||||
} |
||||
this.$emit('change', this.userIds) |
||||
//修改 |
||||
// this.$emit('change', this.userNames) |
||||
this.backDeparInfo() |
||||
}, |
||||
}, |
||||
model: { |
||||
prop: 'userNames', |
||||
event: 'change', |
||||
}, |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style scoped> |
||||
<style scoped></style> |
||||
|
||||
</style> |
||||
Loading…
Reference in new issue