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.
289 lines
7.9 KiB
289 lines
7.9 KiB
3 years ago
|
<template>
|
||
|
|
<view class="ass-content">
|
||
|
|
<view class="flex-align-start">
|
||
|
|
<view class="ass-label">
|
||
|
|
<text>A角选择</text>
|
||
|
|
</view>
|
||
|
|
<view class="assign-view">
|
||
|
|
<view class="cu-bar search">
|
||
|
|
<view class="search-form round">
|
||
|
|
<input type="text" v-model="aSearch" placeholder="请输入" confirm-type="search"></input>
|
||
|
|
<text class="cuIcon-search"></text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<mix-tree @checkedRund = "getCheckedA" :fliter="aSearch" :list="data" @treeItemClick="handleCheck"></mix-tree>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view class="flex-align-start mat15">
|
||
|
|
<view class="ass-label">
|
||
|
|
<text>B角选择</text>
|
||
|
|
</view>
|
||
|
|
<view class="assign-view">
|
||
|
|
<view class="cu-bar search">
|
||
|
|
<view class="search-form round">
|
||
|
|
<input type="text" v-model="bSearch" placeholder="请输入" confirm-type="search"></input>
|
||
|
|
<text class="cuIcon-search"></text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<mix-tree @checkedRund = "getCheckedB" :fliter="bSearch" :list="data" @treeItemClick="handleCheck"></mix-tree>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view class="flex-align-start mat15">
|
||
|
|
<view class="ass-label">
|
||
|
|
<text>已选员工</text>
|
||
|
|
</view>
|
||
|
|
<view class="AB-input">
|
||
|
|
<view class="flex">
|
||
|
|
<input disabled type="text" :value="'A角: '+A" placeholder="请选择A角"/>
|
||
|
|
<!-- <text class="cuIcon-roundclosefill" @click="A = ''"></text> -->
|
||
|
|
</view>
|
||
|
|
<view class="flex mat15">
|
||
|
|
<input disabled type="text" :value="'B角: '+B" placeholder="请选择B角"/>
|
||
|
|
<!-- <text class="cuIcon-roundclosefill" @click="B = ''"></text> -->
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view class="mat40 flex-justify-center ass-foot-btn">
|
||
|
|
<button class="cu-btn block def-btn margin-tb-sm lg round mar15" @click="geDesignateAB">确定</button>
|
||
|
|
<button class="cu-btn block cancel-btn margin-tb-sm lg round mal15" @click="back()">取消</button>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import LyTree from '@/components/ly-tree/ly-tree.vue'
|
||
|
|
// import mix-tree from '@/components/mix-tree/mix-tree.vue'
|
||
|
|
export default {
|
||
|
|
components: {
|
||
|
|
LyTree
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
filterText: '',
|
||
|
|
A: '',
|
||
|
|
B: '',
|
||
|
|
data: [],
|
||
|
|
defaultProps: {
|
||
|
|
children: 'children',
|
||
|
|
label: 'name'
|
||
|
|
},
|
||
|
|
bSearch:'',
|
||
|
|
aSearch:'',
|
||
|
|
getItem:{},// 取得传递的item
|
||
|
|
arrDatas:[],//扁平化
|
||
|
|
aID:'',
|
||
|
|
bID:'',
|
||
|
|
|
||
|
|
};
|
||
|
|
},
|
||
|
|
created() {
|
||
|
|
if(uni.getStorageSync('decideIndex')){
|
||
|
|
let data = JSON.parse(uni.getStorageSync('decideIndex'))
|
||
|
|
this.getItem.businessId = data.businessId
|
||
|
|
this.getItem.companyId = data.companyId
|
||
|
|
this.getItem.id = data.detailId
|
||
|
|
uni.removeStorageSync('decideIndex')
|
||
|
|
}else{
|
||
|
|
this.getItem = JSON.parse(uni.getStorageSync('applyMsg'))
|
||
|
|
}
|
||
|
|
},
|
||
|
|
onHide() {
|
||
|
|
uni.removeStorageSync('applyMsg')
|
||
|
|
},
|
||
|
|
onShow() {
|
||
|
|
this.trees()// 每次展示调用树数据
|
||
|
|
},
|
||
|
|
onLoad() {
|
||
|
|
// 如果初始化树时设置节点选择需要做适当延时，可以在下一个事件轮询中执行
|
||
|
|
// this.$nextTick(() => {
|
||
|
|
// this.$refs.tree.setCheckedKeys([6])
|
||
|
|
// })
|
||
|
|
},
|
||
|
|
watch: {
|
||
|
|
filterText(val) {
|
||
|
|
this.$refs.tree.filter(val);
|
||
|
|
},
|
||
|
|
bSearch(val){
|
||
|
|
}
|
||
|
|
},
|
||
|
|
// 如果不需要不用到这些方法，需要删除相应代码，打印大量日志会造成性能损耗
|
||
|
|
methods: {
|
||
|
|
// 只有在"点击"修改的指定节点会触发(也就是说这个方法只会触发一次)，obj中包含当前选中
|
||
|
|
handleCheck(obj) {
|
||
|
|
},
|
||
|
|
// 获取树结构数据
|
||
|
|
trees(){
|
||
|
|
this.$http.get('/api-hrms//hrms/dept/empTrees').then(res=>{
|
||
|
|
this.data = res.data
|
||
|
|
this.disposeData(this.data)// 处理数据
|
||
|
|
})
|
||
|
|
},
|
||
|
|
// 处理树结构数据
|
||
|
|
disposeData(data){// children和员工分开，整合到一个children里
|
||
|
|
let len = data.length
|
||
|
|
for(let i = 0;i<len;i++){
|
||
|
|
if(data[i].children){ // children有值则---进入整合，实际上可能没有children，也需要整合
|
||
|
|
if(data[i].userDept){//有员工就整合
|
||
|
|
if(data[i].userDept.length!==0){//多个员工处理
|
||
|
|
let len = data[i].userDept.length
|
||
|
|
for(let a=0;a<len;a++){
|
||
|
|
data[i].userDept[a].name=data[i].userDept[a].account
|
||
|
|
}
|
||
|
|
}
|
||
|
|
data[i].children = [...data[i].children,...data[i].userDept]
|
||
|
|
data[i].children = [...new Set(data[i].children)]
|
||
|
|
}
|
||
|
|
if(data[i].children.length!==0){//有子级则进入子级，继续循环
|
||
|
|
this.disposeData(data[i].children)
|
||
|
|
}
|
||
|
|
}else if(!data[i].children&&data[i].userDept&&data[i].userDept.length!==0){//没有子级，而有员工时，创建新的children
|
||
|
|
data[i].children = []
|
||
|
|
let len = data[i].userDept.length
|
||
|
|
for(let a=0;a<len;a++){
|
||
|
|
data[i].userDept[a].name=data[i].userDept[a].account
|
||
|
|
}
|
||
|
|
data[i].children = [...data[i].children,...data[i].userDept]
|
||
|
|
data[i].children =[...new Set(data[i].children)]
|
||
|
|
}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
// 获取点击事件，可设置单选多选等
|
||
|
|
getCheckedA(nameList,idsList){
|
||
|
|
if(idsList.length!==0){
|
||
|
|
this.aID = idsList[0]
|
||
|
|
}else{
|
||
|
|
this.aID = ''
|
||
|
|
}
|
||
|
|
if(nameList&&nameList.length!==0){
|
||
|
|
this.A = nameList[0]
|
||
|
|
}else{
|
||
|
|
this.A = ''
|
||
|
|
}
|
||
|
|
|
||
|
|
if(this.aID&&this.aID===this.bID){
|
||
|
|
this.aID = ''
|
||
|
|
return uni.showToast({title: '请勿选择相同的A/B角！',icon:'none'})
|
||
|
|
}
|
||
|
|
|
||
|
|
},
|
||
|
|
// 获取点击事件b
|
||
|
|
getCheckedB(nameList,idsList){
|
||
|
|
this.B = nameList[0]
|
||
|
|
this.bID = idsList[0]
|
||
|
|
if(this.aID===this.bID){
|
||
|
|
this.bID = ''
|
||
|
|
return uni.showToast({title: '请勿选择相同的A/B角！',icon:'none'})
|
||
|
|
}
|
||
|
|
},
|
||
|
|
// 扁平化树结构数据
|
||
|
|
renderTreeList(list=[], rank=0, parentId=[]){
|
||
|
|
list.forEach(item=>{
|
||
|
|
this.arrDatas.push({
|
||
|
|
id: item.id,
|
||
|
|
name: item.name,
|
||
|
|
parentId, // 父级id数组
|
||
|
|
rank, // 层级
|
||
|
|
showChild: false, //子级是否显示
|
||
|
|
show: rank === 0 ,// 自身是否显示
|
||
|
|
// 自定义
|
||
|
|
account: item.account?item.account:false,// 设置展示员工的勾选
|
||
|
|
})
|
||
|
|
if(Array.isArray(item.children) && item.children.length > 0){
|
||
|
|
let parents = [...parentId];
|
||
|
|
parents.push(item.id);
|
||
|
|
this.renderTreeList(item.children, rank+1, parents);
|
||
|
|
}else{
|
||
|
|
this.arrDatas[this.arrDatas.length-1].lastRank = true;
|
||
|
|
}
|
||
|
|
})
|
||
|
|
},
|
||
|
|
// // 把值过滤传递--扁平化后的处理
|
||
|
|
// async filterNode(value,data,str) {
|
||
|
|
// if(!value){
|
||
|
|
// this.trees()
|
||
|
|
// return
|
||
|
|
// }
|
||
|
|
// let arr = JSON.parse(JSON.stringify(data))
|
||
|
|
// this.renderTreeList(data)// 扁平化处理
|
||
|
|
// this.data = []
|
||
|
|
// this.arrDatas.forEach(e=>{// 处理传值
|
||
|
|
// if (e.name.includes(value)){
|
||
|
|
// this.data.push(e)
|
||
|
|
// }
|
||
|
|
// })
|
||
|
|
// this.data = [...new Set(this.data)]
|
||
|
|
// },
|
||
|
|
|
||
|
|
// 指派ab
|
||
|
|
geDesignateAB(){
|
||
|
|
let obj = {
|
||
|
|
businessId:this.getItem.businessId,
|
||
|
|
companyId:this.getItem.companyId,
|
||
|
|
id:this.getItem.id,
|
||
|
|
}
|
||
|
|
|
||
|
|
obj.empAId = this.aID
|
||
|
|
obj.empBId = this.bID
|
||
|
|
if(!obj.empAId||!obj.empBId){
|
||
|
|
return uni.showToast({title: '请选择角色后再确定！',icon:'none'})
|
||
|
|
}
|
||
|
|
this.$http.post('/api-guarantee/dg-guarantee-assign-user/assignCorners',obj).then(res=>{
|
||
|
|
uni.showToast({
|
||
|
|
title: "操作成功！"
|
||
|
|
})
|
||
|
|
this.back()
|
||
|
|
})
|
||
|
|
}
|
||
|
|
}
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
.ass-content{
|
||
|
|
padding: 40rpx 40rpx;
|
||
|
|
.ass-foot-btn .cu-btn.lg{
|
||
|
|
padding: 0 100rpx;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.ass-label{
|
||
|
|
color: #00B9FF;
|
||
|
|
font-size: 28rpx;
|
||
|
|
margin-right: 40rpx;
|
||
|
|
}
|
||
|
|
.assign-view{
|
||
|
|
border-radius: 20rpx;
|
||
|
|
background-color: #fff;
|
||
|
|
box-shadow: 0 0 16rpx #ccc;
|
||
|
|
height: 600rpx;
|
||
|
|
overflow-x: hidden;
|
||
|
|
overflow-y: scroll;
|
||
|
|
}
|
||
|
|
.cu-bar .search-form{
|
||
|
|
border-radius: 20rpx;
|
||
|
|
background-color: #f5f5f5;
|
||
|
|
height: 72rpx;
|
||
|
|
line-height: 72rpx;
|
||
|
|
input{
|
||
|
|
height: 72rpx;
|
||
|
|
line-height: 72rpx;
|
||
|
|
padding: 0 40rpx;
|
||
|
|
}
|
||
|
|
.cuIcon-search{
|
||
|
|
margin: 0 20rpx;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.AB-input{
|
||
|
|
view{
|
||
|
|
background-color: #f5f5f5;
|
||
|
|
color: #666;
|
||
|
|
padding: 20rpx 40rpx;
|
||
|
|
border-radius: 20rpx;
|
||
|
|
text{
|
||
|
|
color: #B2B2B2;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|