<template>
|
<div>
|
<win-md :title="'项目成员'" @close="close">
|
<table class="myTable" bordercolor="#E5E6ED" border="1" cellpadding="0" cellspacing="0">
|
<tr v-for="(org,i) in dataList" :key="i">
|
<td class="bg-f6f">
|
<el-checkbox @change="checkAllChange($event,i)" v-model="org.checked">{{ org.orgName }}</el-checkbox>
|
</td>
|
<td>
|
<div v-if="org.userList.length>0">
|
<el-checkbox-group v-model="org.checkUsers" @change="checkedUsersChange(i)">
|
<el-checkbox v-for="(r,rIndex) in org.userList" :label="JSON.stringify(r)" :key="r.id">{{r.userName}}</el-checkbox>
|
</el-checkbox-group>
|
</div>
|
</td>
|
</tr>
|
</table>
|
<el-form ref="form" :model="formData" :rules="rules" label-width="80px" v-if="manageList.length>0" style="margin-top: 15px">
|
<el-form-item label="项目经理" prop="managerId">
|
<el-select v-model="formData.managerId" placeholder="请选择项目经理">
|
<el-option v-for="user in manageList" :label="user.userName" :value="user.id"></el-option>
|
</el-select>
|
</el-form-item>
|
</el-form>
|
<div slot="footer" align="center" class="dialog-footer">
|
<my-button name="取消" site="form" @click="close"/>
|
<my-button name="保存" site="form" @click="save"/>
|
</div>
|
</win-md>
|
</div>
|
</template>
|
|
<script>
|
import winMd from '@/components/win/win-md'
|
import myButton from '@/components/myButton/myButton'
|
import * as finsystenant from '@/api/baseSetting/finsystenant'
|
export default {
|
name: "chooseUser",
|
components: { winMd, myButton },
|
props: {
|
orgId: {
|
type: String,
|
default: ''
|
},
|
// 被选中的项目经理id
|
projectManager: {
|
type: String,
|
default: ''
|
},
|
// 被选中的人员id
|
checkIds: {
|
type: Array,
|
default: []
|
},
|
},
|
computed:{
|
manageList(){
|
let arr = []
|
this.dataList.map((c,j)=>{
|
c.checkUsers.map((x,i)=>{
|
arr.push(JSON.parse(x))
|
})
|
})
|
return arr
|
}
|
},
|
data() {
|
return {
|
formData:{
|
managerId:'' // 项目经理id
|
},
|
dataList:[],
|
rules: {
|
managerId: [
|
{required: true, message: '请选择项目经理', trigger: 'change'}
|
],
|
}
|
}
|
},
|
created() {
|
if(this.projectManager){
|
this.formData.managerId = this.projectManager
|
}
|
this.getTableInfo(this.orgId)
|
},
|
methods:{
|
// 获取人员
|
getTableInfo(orgId){
|
finsystenant.getUserByOrgId({orgId: orgId}).then(res => {
|
if (res) {
|
res.map(i=>{
|
i.checkUsers = []
|
i.checked = false
|
})
|
if(this.checkIds.length>0 ){
|
res.map((c,j)=>{
|
c.checkUsers = this.checkIds[j]
|
c.checked = this.checkIds[j].length===c.userList.length
|
})
|
}
|
this.dataList = res.reverse()
|
}
|
})
|
},
|
// 左侧全选
|
checkAllChange(val,index){
|
this.dataList[index].checkUsers = []
|
if(val){
|
this.dataList[index].userList.map(x=>{
|
this.dataList[index].checkUsers.push(JSON.stringify(x))
|
})
|
}
|
},
|
// 右侧选择单独项
|
checkedUsersChange(index){
|
let val = this.dataList[index].checkUsers.length===this.dataList[index].userList.length
|
this.$set(this.dataList[index],'checked',val)
|
this.$forceUpdate()
|
},
|
// 保存成员
|
save(){
|
if(!this.manageList.length > 0){
|
this.$message.error('请选择项目成员')
|
return
|
}
|
this.$refs.form.validate((valid) => {
|
if (valid) {
|
let params = Object.assign({},this.formData)
|
params.checkUsers = []
|
this.dataList.map(x=>{
|
params.checkUsers.push(x.checkUsers)
|
})
|
this.$emit('save',params)
|
this.close()
|
}
|
})
|
},
|
close(){
|
this.$emit('close')
|
}
|
}
|
}
|
</script>
|
|
<style scoped>
|
.myTable {
|
width: 100%;
|
}
|
.bg-f6f {
|
background-color: #F6F8FC;
|
}
|
.myTable td, .myTable th {
|
min-width: 100px;
|
padding: 15px 10px;
|
font-size: 14px;
|
}
|
</style>
|
