Skip to content

C
confucius
Commit 54e4e7d9 authored by 黄奎's avatar 黄奎
Browse files
Options

Merge branch 'master' of http://gitlab.oytour.com/luochao/confucius

parents 41267782 77e3fb8e
Hide whitespace changes
Inline Side-by-side
Showing with 283 additions and 193 deletions
src/pages/enterprise/customer/CSChild/components/choiceapprovalorbranch.vue
View file @ 54e4e7d9
<style> <style>
.choiceappoval .ApprovalProcessBg { .choiceappoval .ApprovalProcessBg {
background: #f8f8f8; background: #f8f8f8;
max-height: 400px; max-height: 400px;
overflow-y: auto; overflow-y: auto;
} }
.choiceappoval .Approval_yxList { .choiceappoval .Approval_yxList {
width: 300px; width: 300px;
background: #f8f8f8; background: #f8f8f8;
min-height: 400px; min-height: 400px;
max-height: 400px; max-height: 400px;
overflow-y: auto; overflow-y: auto;
} }
.choiceappoval .Approval_yxList li {
display: inline-block;
width: 100%;
line-height: 40px;
text-indent: 15px;
border-bottom: 1px dotted #eee;
}
.choiceappoval .Approval_yxList li {
display: inline-block;
width: 100%;
line-height: 40px;
text-indent: 15px;
border-bottom: 1px dotted #eee;
}
</style> </style>
<template> <template>
<div> <div>
<q-dialog v-model="IsShow" persistent> <q-dialog v-model="IsShow" persistent>
<q-card style="width: 700px; max-width: 80vw;" class="choiceappoval"> <q-card style="width: 700px; max-width: 80vw;" class="choiceappoval">
<q-card-section class="row items-center q-pb-none "> <q-card-section class="row items-center q-pb-none ">
<div class="text-h6">选择企业成员</div> <div class="text-h6">选择企业成员</div>
<q-space /> <q-space />
<q-btn icon="close" flat round dense v-close-popup /> <q-btn icon="close" flat round dense v-close-popup @click="closeEditOrder" />
</q-card-section> </q-card-section>
<q-separator /> <q-separator />
<q-card-section class="q-pt-none" style="padding: 20px 0;"> <q-card-section class="q-pt-none" style="padding: 20px 0;">
<div style="display: flex;align-items: flex-start;justify-content: space-between;"> <div style="display: flex;align-items: flex-start;justify-content: space-between;">
<div style="width: 300px; margin: 0 20px;"> <div style="width: 300px; margin: 0 20px;">
<p style="margin: 0 0 10px 0;display: flex;align-items: center;">选择：<el-input style="width: 200px;" <p style="margin: 0 0 10px 0;display: flex;align-items: center;">选择：<el-input
placeholder="输入关键字进行过滤" v-model="filterText"> style="width: 200px;" placeholder="输入关键字进行过滤" v-model="filterText">
</el-input> </el-input>
</p> </p>
<el-tree class='ApprovalProcessBg' :filter-node-method="filterNode" :data="memberList" show-checkbox <el-tree class='ApprovalProcessBg' :filter-node-method="filterNode" :data="memberList"
ref="treeUser" :props="defaultProps" :render-after-expand="false" node-key="DeptId" show-checkbox ref="treeUser" :props="defaultProps" :render-after-expand="false"
@check-change="handleNodeChange" @check='btncheck'> node-key="DeptId" @check-change="handleNodeChange" @check='btncheck'>
</el-tree> </el-tree>
</div> </div>
<div style="width: 300px; margin: 0 20px;"> <div style="width: 300px; margin: 0 20px;">
<p style="margin: 0 0 20px 0;">已选：</p> <p style="margin: 0 0 20px 0;">已选：</p>
<div class="Approval_yxList"> <div class="Approval_yxList">
<li v-for="item in showMember">{{item.DeptName}} <li v-for="item in newList">{{item.DeptName}}
<i @click="mySetCheckedKeys(item.DeptId)" class="el-icon-circle-close showMemberIcon"></i> <i @click="mySetCheckedKeys(item.DeptId)"
</li> class="el-icon-circle-close showMemberIcon"></i>
</div> </li>
</div> </div>
</div> </div>
</q-card-section> </div>
<q-separator />
<q-card-actions align="right" class="bg-white"> </q-card-section>
<q-btn class="q-mr-md" label="取消" @click="closeEditOrder" />
<q-btn color="accent" class="q-mr-md" label="确定" @click="saveOrderInfo()" /> <q-separator />
</q-card-actions> <q-card-actions align="right" class="bg-white">
</q-card> <q-btn class="q-mr-md" label="取消" @click="closeEditOrder" />
</q-dialog> <q-btn color="accent" class="q-mr-md" label="确定" @click="saveOrderInfo()" />
</div> </q-card-actions>
</q-card>
</q-dialog>
</div>
</template> </template>
<script> <script>
import { import {
getEmployeeAddrBook getEmployeeAddrBook
} from '../../../../../api/users/user' } from '../../../../../api/users/user'
export default { export default {
props: {
outerindex: { props: {
type: String, outerindex: {
default: '', type: String,
}, default: '',
byval: { },
type: Array, byval: {
default: [], type: Array,
}, default: [],
cptype: { //1是列表上使用2 新增使用 },
type: String, cptype: {//1是列表上使用2 新增使用
default: '1', type: String,
} default: '1',
},
data() {
return {
IsShow: true,
memberList: [],
filterText: "",
defaultProps: {
children: 'ChildList',
label: 'DeptName',
},
userList: [],
showMember: [],
memberSetCheckedKeys: [],
sysUserKeys: [],
newList: []
}
},
created() {
if (this.byval.length > 0) {
this.memberSetCheckedKeys = [];
this.showMember = JSON.parse(JSON.stringify(this.byval))
this.byval.forEach(x => {
this.memberSetCheckedKeys.push(x.DeptId)
})
}
this.getMember() //部门下面选择员工
},
mounted() {
},
watch: {
filterText(val) {
this.$refs.treeUser.filter(val);
},
},
methods: {
getMember() {
let _arr = this.sysUserKeys.concat(this.memberSetCheckedKeys)
getEmployeeAddrBook({}).then(res => {
if (res.Code == 1) {
this.memberList = res.Data
let _this = this;
_this.$refs.treeUser.setCheckedKeys(_arr);
}
}).catch(() => {
})
},
filterNode(value, data) {
if (!value) return true;
return data.DeptName.indexOf(value) !== -1;
},
handleNodeChange(data, checked) {
data.IsCheck = checked;
if (data.DataType == 2 && data.IsCheck) { //是员工且选中
let isExsit = false
this.showMember.forEach(x => {
if (x.DeptId == data.DeptId) {
isExsit = true
return false
} }
})
if (!isExsit) { },
this.showMember.push({
DeptName: data.DeptName, data() {
DeptId: data.DeptId, return {
DataType: data.DataType IsShow: true,
}) memberList: [],
this.memberSetCheckedKeys.push(data.DeptId) filterText: "",
} defaultProps: {
} else if (data.DataType == 2 && !data.IsCheck) { children: 'ChildList',
if (this.showMember.findIndex(item => item.DeptId === data.DeptId) != -1) { label: 'DeptName',
this.showMember.splice(this.showMember.findIndex(item => item.DeptId === data.DeptId), 1) },
this.memberSetCheckedKeys.splice(this.memberSetCheckedKeys.findIndex(item => item === data.DeptId), 1) userList: [],
if (this.showMember.findIndex(item => item.DeptId === data.ParentId) != -1) { showMember: [],
this.memberSetCheckedKeys.splice(this.memberSetCheckedKeys.findIndex(item => item === data.ParentId), 1) memberSetCheckedKeys: [],
sysUserKeys: [],
newList: []
} }
} },
} created() {
if (data.DataType != 2 && data.IsCheck) { this.IsShow = true
if (this.memberSetCheckedKeys.findIndex(item => item === data.DeptId) == -1) { if (this.byval.length > 0) {
this.memberSetCheckedKeys.push(data.DeptId) this.memberSetCheckedKeys = [];
} this.showMember = JSON.parse(JSON.stringify(this.byval))
} else if (data.DataType == 2 && !data.IsCheck) { this.newList = JSON.parse(JSON.stringify(this.byval))
if (this.memberSetCheckedKeys.findIndex(item => item === data.DeptId) != -1) { this.byval.forEach(x => {
this.memberSetCheckedKeys.splice(this.memberSetCheckedKeys.findIndex(item => item === data.DeptId), 1) this.memberSetCheckedKeys.push(x.DeptId)
if (this.showMember.findIndex(item => item.DeptId === data.ParentId) != -1) { })
this.memberSetCheckedKeys.splice(this.memberSetCheckedKeys.findIndex(item => item === data.ParentId), 1)
} }
} this.getMember()//部门下面选择员工
} },
}, mounted() {
btncheck() { //对数据的处理
this.getdataprocess()
}, },
getdataprocess() { watch: {
filterText(val) {
this.$refs.treeUser.filter(val);
},
},
methods: {
getMember() {
let _arr = this.sysUserKeys.concat(this.memberSetCheckedKeys)
getEmployeeAddrBook({}).then(res => {
if (res.Code == 1) {
this.memberList = res.Data
let _this = this;
_this.$refs.treeUser.setCheckedKeys(_arr);
}
}).catch(() => {
})
},
}, filterNode(value, data) {
getChildList(x, list) { if (!value) return true;
return data.DeptName.indexOf(value) !== -1;
},
}, handleNodeChange(data, checked) {
mySetCheckedKeys(id) { // console.log(data,checked)
if (this.memberSetCheckedKeys.length == 0) data.IsCheck = checked;
return if (data.DataType == 2 && data.IsCheck) { //是员工且选中
if (id == -1) { let isExsit = false
this.$refs.treeUser.setCheckedKeys(this.memberSetCheckedKeys) this.showMember.forEach(x => {
return if (x.DeptId == data.DeptId) {
} isExsit = true
this.showMember.splice(this.showMember.findIndex(item => item.DeptId === id), 1) return false
this.memberSetCheckedKeys.splice(this.memberSetCheckedKeys.findIndex(item => item === id), 1) }
this.$refs.treeUser.setCheckedKeys(this.memberSetCheckedKeys); })
}, if (!isExsit) {
//关闭弹窗 this.showMember.push(data)
closeEditOrder() { this.memberSetCheckedKeys.push(data.DeptId)
this.$emit('close') }
}, } else if (data.DataType == 2 && !data.IsCheck) {
saveOrderInfo() { if (this.showMember.findIndex(item => item.DeptId === data.DeptId) != -1) {
this.$emit('success', this.showMember, this.cptype) this.showMember.splice(this.showMember.findIndex(item => item.DeptId === data.DeptId), 1)
this.memberSetCheckedKeys.splice(this.memberSetCheckedKeys.findIndex(item => item === data.DeptId), 1)
} if (this.showMember.findIndex(item => item.DeptId === data.ParentId) != -1) {
this.memberSetCheckedKeys.splice(this.memberSetCheckedKeys.findIndex(item => item === data.ParentId), 1)
}
}
}
if (data.DataType != 2 && data.IsCheck) {
if (this.memberSetCheckedKeys.findIndex(item => item === data.DeptId) == -1) {
this.memberSetCheckedKeys.push(data.DeptId)
this.showMember.push(data)
}
} else if (data.DataType == 2 && !data.IsCheck) {
if (this.memberSetCheckedKeys.findIndex(item => item === data.DeptId) != -1) {
this.memberSetCheckedKeys.splice(this.memberSetCheckedKeys.findIndex(item => item === data.DeptId), 1)
if (this.showMember.findIndex(item => item.DeptId === data.ParentId) != -1) {
this.memberSetCheckedKeys.splice(this.memberSetCheckedKeys.findIndex(item => item === data.ParentId), 1)
}
}
} else if (data.DataType != 2 && !data.IsCheck) {
if (this.memberSetCheckedKeys.findIndex(item => item === data.DeptId) != -1) {
this.showMember.splice(this.showMember.findIndex(item => item.DeptId === data.DeptId), 1)
this.memberSetCheckedKeys.splice(this.memberSetCheckedKeys.findIndex(item => item === data.DeptId), 1)
if (this.showMember.findIndex(item => item.DeptId === data.ParentId) != -1) {
this.memberSetCheckedKeys.splice(this.memberSetCheckedKeys.findIndex(item => item === data.ParentId), 1)
}
}
}
},
btncheck() {//对数据的处理
this.newList = []
// console.log(this.memberList)
this.memberList.forEach(x => {
if (x.IsCheck == true) {
this.newList.push(x)
} else {
this.getChildList(x.ChildList)
}
})
// console.log(this.newList)
},
getChildList(ChildList) {
ChildList.forEach(x => {
if (x.IsCheck == true) {
this.newList.push(x)
} else {
this.getChildList(x.ChildList)
}
})
},
arrayUnique(arr, id) {//数组去重
var hash = {};
return arr.reduce(function (item, next) {
hash[next[id]] ? '' : hash[next[id]] = true && item.push(next);
return item;
}, []);
},
mySetCheckedKeys(id) {
console.log(id)
console.log(this.memberSetCheckedKeys)
if (this.memberSetCheckedKeys.length == 0)
return
if (id == -1) {
this.$refs.treeUser.setCheckedKeys(this.memberSetCheckedKeys)
return
}
this.showMember.splice(this.showMember.findIndex(item => item.DeptId === id), 1)
this.memberSetCheckedKeys.splice(this.memberSetCheckedKeys.findIndex(item => item === id), 1)
this.qudiaoziji(id)
console.log(this.memberSetCheckedKeys)
this.newList.splice(this.newList.findIndex(item => item.DeptId === id), 1)
this.$refs.treeUser.setCheckedKeys(this.memberSetCheckedKeys);
},
qudiaoziji(id) {
this.memberList.forEach(x => {
if (x.DeptId == id) {
let obj = []
if (x.ChildList && x.ChildList.length > 0) {
x.ChildList.forEach(j => {
obj.push(j.DeptId)
})
this.memberSetCheckedKeys = this.arrayWeightRemoval(this.memberSetCheckedKeys,obj)
}
} else {
this.qudiaoziji_t(x.ChildList, id)
}
})
},
arrayWeightRemoval(array1,array2) {
//临时数组存放
var tempArray1 = [];//临时数组1
var tempArray2 = [];//临时数组2
for (var i = 0; i < array2.length; i++) {
tempArray1[array2[i]] = true;//将数array2 中的元素值作为tempArray1 中的键，值为true；
}
for (var i = 0; i < array1.length; i++) {
if (!tempArray1[array1[i]]) {
tempArray2.push(array1[i]);//过滤array1 中与array2 相同的元素；
}
}
return tempArray2;
},
qudiaoziji_t(ChildList, id) {
ChildList.forEach(x => {
if (x.DeptId == id) {
let obj = []
if (x.ChildList && x.ChildList.length > 0) {
x.ChildList.forEach(j => {
obj.push(j.DeptId)
})
this.memberSetCheckedKeys = this.arrayWeightRemoval(this.memberSetCheckedKeys,obj)
}
} else {
this.qudiaoziji_t(x.ChildList, id)
}
})
},
//关闭弹窗
closeEditOrder() {
this.$emit('close')
},
saveOrderInfo() {
this.$emit('success', this.newList, this.cptype)
}
}
} }
}
</script> </script>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment