|
@@ -6,7 +6,7 @@
|
|
<a-input class="set-input" v-model="serachValue" placeholder="请输入" />
|
|
<a-input class="set-input" v-model="serachValue" placeholder="请输入" />
|
|
</a-form-item>
|
|
</a-form-item>
|
|
<div style="display: flex;height:40px;align-items:flex-start;justify-content: center;margin-top: 4px;">
|
|
<div style="display: flex;height:40px;align-items:flex-start;justify-content: center;margin-top: 4px;">
|
|
- <a-button style="margin-right: 8px;" @click="handleResetClick">重置</a-button>
|
|
|
|
|
|
+ <a-button style="margin-right: 8px;" @click="handleResetClick(false)">重置</a-button>
|
|
<a-button type="primary" @click="handleSearchOrgClick">查询</a-button>
|
|
<a-button type="primary" @click="handleSearchOrgClick">查询</a-button>
|
|
</div>
|
|
</div>
|
|
</a-form>
|
|
</a-form>
|
|
@@ -17,9 +17,19 @@
|
|
</a-form> -->
|
|
</a-form> -->
|
|
<div v-if="!isOnlyOrg" style="display: flex;align-items:center;justify-content: center;margin: 0 20px;">
|
|
<div v-if="!isOnlyOrg" style="display: flex;align-items:center;justify-content: center;margin: 0 20px;">
|
|
<div class="chooseOrg-style" style="width:80px;color:rgba(0, 0, 0, 0.85);">已选组织</div>
|
|
<div class="chooseOrg-style" style="width:80px;color:rgba(0, 0, 0, 0.85);">已选组织</div>
|
|
- <div style="flex:1;display: flex;align-items:center;flex-wrap:wrap;max-height:58px;overflow-y:scroll;">
|
|
|
|
|
|
+ <div style="flex:1;display: flex;align-items:center;flex-wrap:wrap;max-height:53px;overflow-y:scroll;">
|
|
<template v-if="chooseTags.length">
|
|
<template v-if="chooseTags.length">
|
|
- <div style="border:1px solid #e8e8e8;padding: 2px 3px;margin: 1px 2px;border-radius:2px;" v-for="(item,index) in chooseTags" :key="index">{{ item.name }}</div>
|
|
|
|
|
|
+ <!-- <div style="border:1px solid #e8e8e8;padding: 2px 3px;margin: 1px 2px;border-radius:2px;" v-for="(item,index) in chooseTags" :key="index">{{ item.name }}</div> -->
|
|
|
|
+ <!-- <a-tag style="margin-bottom: 2px;margin-top: 2px"
|
|
|
|
+ v-for="(item,index) in chooseTags"
|
|
|
|
+ :key="index"
|
|
|
|
+ closable
|
|
|
|
+ @close="handleTagClose(index,item.id)">{{ item.name }}
|
|
|
|
+ </a-tag> -->
|
|
|
|
+ <a-tag style="margin-bottom: 2px;margin-top: 2px"
|
|
|
|
+ v-for="(item,index) in chooseTags"
|
|
|
|
+ :key="index">{{ item.name }}
|
|
|
|
+ </a-tag>
|
|
</template>
|
|
</template>
|
|
<template v-else>
|
|
<template v-else>
|
|
<div>未选择组织</div>
|
|
<div>未选择组织</div>
|
|
@@ -33,7 +43,7 @@
|
|
<div style="width:100%;border:1px solid #e8e8e8;height:calc( 70vh - 150px );">
|
|
<div style="width:100%;border:1px solid #e8e8e8;height:calc( 70vh - 150px );">
|
|
<div class="rightDetailtop" style="text-align: center;">组织名称</div>
|
|
<div class="rightDetailtop" style="text-align: center;">组织名称</div>
|
|
<div style="height:calc( 100% - 38.8px );overflow-y:auto;padding: 20px 0 0 20px;">
|
|
<div style="height:calc( 100% - 38.8px );overflow-y:auto;padding: 20px 0 0 20px;">
|
|
- <div v-for="(item,index) in orgDataTree" :key="index">
|
|
|
|
|
|
+ <!-- <div v-for="(item,index) in orgDataTree" :key="index">
|
|
<rx-tree
|
|
<rx-tree
|
|
:treeData="item.orgData"
|
|
:treeData="item.orgData"
|
|
:async="true"
|
|
:async="true"
|
|
@@ -46,7 +56,19 @@
|
|
text-field="title"
|
|
text-field="title"
|
|
@check="(selKeys, e) => check(selKeys, e,index)"
|
|
@check="(selKeys, e) => check(selKeys, e,index)"
|
|
parent-field="groupId"></rx-tree>
|
|
parent-field="groupId"></rx-tree>
|
|
- </div>
|
|
|
|
|
|
+ </div> -->
|
|
|
|
+ <rx-tree
|
|
|
|
+ :treeData="orgData"
|
|
|
|
+ :async="true"
|
|
|
|
+ v-model="checkedKeys"
|
|
|
|
+ :loadByParent="onLoadGroupTree"
|
|
|
|
+ multiSelect
|
|
|
|
+ :showTreeIcon="true"
|
|
|
|
+ :expandOnLoad="0"
|
|
|
|
+ id-field="key"
|
|
|
|
+ text-field="title"
|
|
|
|
+ @check="check"
|
|
|
|
+ parent-field="groupId"></rx-tree>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
@@ -176,10 +198,10 @@
|
|
},
|
|
},
|
|
chooseTags: [],
|
|
chooseTags: [],
|
|
orgData: [],
|
|
orgData: [],
|
|
- orgDataTree: [{
|
|
|
|
- checkedKeys: {checked:[]},
|
|
|
|
- orgData: []
|
|
|
|
- }],
|
|
|
|
|
|
+ // orgDataTree: [{
|
|
|
|
+ // checkedKeys: {checked:[]},
|
|
|
|
+ // orgData: []
|
|
|
|
+ // }],
|
|
// 组织
|
|
// 组织
|
|
checkedTarget: {},
|
|
checkedTarget: {},
|
|
// 组织架构(多选)
|
|
// 组织架构(多选)
|
|
@@ -199,38 +221,37 @@
|
|
}
|
|
}
|
|
},
|
|
},
|
|
methods: {
|
|
methods: {
|
|
|
|
+ handleTagClose(index,id) {
|
|
|
|
+ this.chooseTags.splice(index,1)
|
|
|
|
+ if(this.checkedKeys.checked.some(item => item == id)) {
|
|
|
|
+ this.checkedKeys.checked.map((item,index) => {
|
|
|
|
+ if (item.indexOf(id) > -1) {
|
|
|
|
+ this.checkedKeys.checked.splice(index, 1);
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ },
|
|
// 多选节点
|
|
// 多选节点
|
|
- check(selKeys, e, index) {
|
|
|
|
|
|
+ check(selKeys, e) {
|
|
// console.log(this.orgDataTree[index].checkedKeys.checked)
|
|
// console.log(this.orgDataTree[index].checkedKeys.checked)
|
|
if(e.checked) {
|
|
if(e.checked) {
|
|
- if(this.chooseTags.some(item => item.id == e.node.value)) {
|
|
|
|
- // console.log(selKeys)
|
|
|
|
- // console.log( this.orgDataTree[index].checkedKeys.checked)
|
|
|
|
- // this.orgDataTree[index].checkedKeys.checked.map((item,index) => {
|
|
|
|
- // if(item.name == e.node.title) {
|
|
|
|
- // this.orgDataTree[index].checkedKeys.checked.splice(index, 1);
|
|
|
|
- // }
|
|
|
|
- // })
|
|
|
|
- // this.orgDataTree[index].checkedKeys.checked.remove(e.node.value)
|
|
|
|
- this.$message.error(`${e.node.title}已被选择`)
|
|
|
|
- return false
|
|
|
|
- } else {
|
|
|
|
- this.orgDataTree[index].checkedKeys.checked = selKeys
|
|
|
|
- this.chooseTags.push({
|
|
|
|
- id: e.node.value,
|
|
|
|
- name: e.node.title
|
|
|
|
- })
|
|
|
|
- }
|
|
|
|
|
|
+ this.checkedKeys.checked = selKeys
|
|
|
|
+ this.chooseTags.push({
|
|
|
|
+ id: e.node.value,
|
|
|
|
+ name: e.node.title
|
|
|
|
+ })
|
|
|
|
+ console.log(this.chooseTags)
|
|
} else {
|
|
} else {
|
|
let id = e.node.value
|
|
let id = e.node.value
|
|
- this.orgDataTree[index].checkedKeys.checked = selKeys
|
|
|
|
|
|
+ this.checkedKeys.checked = selKeys
|
|
this.chooseTags.map((item,index) => {
|
|
this.chooseTags.map((item,index) => {
|
|
if (item.id.indexOf(id) > -1) {
|
|
if (item.id.indexOf(id) > -1) {
|
|
this.chooseTags.splice(index, 1);
|
|
this.chooseTags.splice(index, 1);
|
|
}
|
|
}
|
|
})
|
|
})
|
|
}
|
|
}
|
|
-
|
|
|
|
|
|
+ // console.log(selKeys, e)
|
|
// this.chooseTags.push(e.checkedNodes.map(item => {
|
|
// this.chooseTags.push(e.checkedNodes.map(item => {
|
|
// return {
|
|
// return {
|
|
// id: item.key,
|
|
// id: item.key,
|
|
@@ -247,7 +268,7 @@
|
|
// 组织名称搜索
|
|
// 组织名称搜索
|
|
handleSearchOrgClick() {
|
|
handleSearchOrgClick() {
|
|
if(this.serachValue==''){
|
|
if(this.serachValue==''){
|
|
- this.handleResetClick()
|
|
|
|
|
|
+ this.handleResetClick(true)
|
|
}else{
|
|
}else{
|
|
let getData={
|
|
let getData={
|
|
"sortOrder": "asc",
|
|
"sortOrder": "asc",
|
|
@@ -276,15 +297,13 @@
|
|
for (let i = 0; i < data.length; i++) {
|
|
for (let i = 0; i < data.length; i++) {
|
|
var rs = data[i];
|
|
var rs = data[i];
|
|
var _isLeaf = rs.childAmount == 0 ? true : false;
|
|
var _isLeaf = rs.childAmount == 0 ? true : false;
|
|
- temp.push({title: rs.name, groupId: rs.groupId, key: rs.key, isLeaf: _isLeaf})
|
|
|
|
|
|
+ temp.push({title: `${rs.name}-${rs.key}`, groupId: rs.groupId, key: rs.key, isLeaf: _isLeaf})
|
|
}
|
|
}
|
|
-
|
|
|
|
- console.log(this.orgDataTree)
|
|
|
|
- // this.orgData = [...temp];
|
|
|
|
- this.orgDataTree.push({
|
|
|
|
- checkedKeys: {checked:[]},
|
|
|
|
- orgData: [...temp]
|
|
|
|
- })
|
|
|
|
|
|
+ this.orgData = [...temp]
|
|
|
|
+ // this.orgDataTree.push({
|
|
|
|
+ // checkedKeys: {checked:[]},
|
|
|
|
+ // orgData: [...temp]
|
|
|
|
+ // })
|
|
}
|
|
}
|
|
this.queryParam.params.groupId = ''
|
|
this.queryParam.params.groupId = ''
|
|
this.userData = []
|
|
this.userData = []
|
|
@@ -293,15 +312,15 @@
|
|
//清除下拉的数据
|
|
//清除下拉的数据
|
|
// this.$refs.orgTable.expandedRowKeys=[];
|
|
// this.$refs.orgTable.expandedRowKeys=[];
|
|
},
|
|
},
|
|
- handleResetClick() {
|
|
|
|
|
|
+ handleResetClick(arg = false) {
|
|
this.serachValue = ''
|
|
this.serachValue = ''
|
|
this.getTreeData()
|
|
this.getTreeData()
|
|
if(!this.isOnlyOrg) {
|
|
if(!this.isOnlyOrg) {
|
|
- this.chooseTags = []
|
|
|
|
- this.orgDataTree = [{
|
|
|
|
- checkedKeys: {checked:[]},
|
|
|
|
- orgData: []
|
|
|
|
- }]
|
|
|
|
|
|
+ this.orgData = []
|
|
|
|
+ if(!arg) {
|
|
|
|
+ this.chooseTags = []
|
|
|
|
+ this.checkedKeys.checked = []
|
|
|
|
+ }
|
|
} else {
|
|
} else {
|
|
this.userData = []
|
|
this.userData = []
|
|
this.queryParam.pageNo = 1
|
|
this.queryParam.pageNo = 1
|
|
@@ -323,15 +342,9 @@
|
|
for (let i = 0; i < data.length; i++) {
|
|
for (let i = 0; i < data.length; i++) {
|
|
var rs = data[i];
|
|
var rs = data[i];
|
|
var _isLeaf = rs.childAmount == 0 ? true : false;
|
|
var _isLeaf = rs.childAmount == 0 ? true : false;
|
|
- temp.push({title: rs.name, groupId: rs.groupId, key: rs.key, isLeaf: _isLeaf})
|
|
|
|
|
|
+ temp.push({title: `${rs.name}-${rs.key}`, groupId: rs.groupId, key: rs.key, isLeaf: _isLeaf})
|
|
}
|
|
}
|
|
- // this.orgData = [...temp]
|
|
|
|
- this.orgDataTree[0].orgData = [...temp]
|
|
|
|
- // this.orgDataTree.push({
|
|
|
|
- // checkedKeys: {checked:[]},
|
|
|
|
- // orgData: [...temp]
|
|
|
|
- // })
|
|
|
|
- console.log( this.orgDataTree)
|
|
|
|
|
|
+ this.orgData = [...temp]
|
|
}
|
|
}
|
|
})
|
|
})
|
|
//清除下拉的数据
|
|
//清除下拉的数据
|
|
@@ -468,8 +481,7 @@
|
|
})
|
|
})
|
|
},
|
|
},
|
|
//加载左树下的子节点
|
|
//加载左树下的子节点
|
|
- onLoadGroupTree(treeNode,index) {
|
|
|
|
- console.log(treeNode,index)
|
|
|
|
|
|
+ onLoadGroupTree(treeNode) {
|
|
if (treeNode.dataRef.children) {
|
|
if (treeNode.dataRef.children) {
|
|
return;
|
|
return;
|
|
}
|
|
}
|
|
@@ -479,15 +491,13 @@
|
|
for (let i = 0; i < data.length; i++) {
|
|
for (let i = 0; i < data.length; i++) {
|
|
var rs = data[i]
|
|
var rs = data[i]
|
|
var _isLeaf = rs.childAmount == 0 ? true : false;
|
|
var _isLeaf = rs.childAmount == 0 ? true : false;
|
|
- treeData.push({title: rs.name, groupId: rs.groupId, key: rs.key,isLeaf: _isLeaf})
|
|
|
|
|
|
+ // treeData.push({title: rs.name, groupId: rs.groupId, key: rs.key,isLeaf: _isLeaf})
|
|
|
|
+ treeData.push({title:`${rs.name}-${rs.key}`, groupId: rs.groupId, key: rs.key,isLeaf: _isLeaf})
|
|
}
|
|
}
|
|
- // var orgData = this.getGroupTree(this.orgData, treeNode.dataRef.groupId, treeData);
|
|
|
|
-
|
|
|
|
- // this.orgData = [...orgData];
|
|
|
|
- var orgData = this.getGroupTree(this.orgDataTree[index].orgData, treeNode.dataRef.groupId, treeData);
|
|
|
|
- this.orgDataTree[index].orgData = [...orgData];
|
|
|
|
- // console.info("onLoadGroupTree")
|
|
|
|
- // console.info(this.orgData)
|
|
|
|
|
|
+ var orgData = this.getGroupTree(this.orgData, treeNode.dataRef.groupId, treeData);
|
|
|
|
+ this.orgData = [...orgData];
|
|
|
|
+ // var orgData = this.getGroupTree(this.orgDataTree[index].orgData, treeNode.dataRef.groupId, treeData);
|
|
|
|
+ // this.orgDataTree[index].orgData = [...orgData];
|
|
})
|
|
})
|
|
},
|
|
},
|
|
getGroupTree(orgData, groupId, treeData) {
|
|
getGroupTree(orgData, groupId, treeData) {
|