|
@@ -4,33 +4,17 @@
|
|
|
<div class="tree-text">组织机构</div>
|
|
|
<el-input placeholder="可按名字匹配所在部门" v-model="filterText">
|
|
|
</el-input>
|
|
|
- <el-tree
|
|
|
- ref="tree"
|
|
|
- @node-click="handleNodeClick"
|
|
|
- :data="treeList"
|
|
|
- node-key="o"
|
|
|
- :indent="20"
|
|
|
- :default-checked-keys="defaultListc"
|
|
|
- :default-expanded-keys="defaultList"
|
|
|
- >
|
|
|
+ <el-tree ref="tree" @node-click="handleNodeClick" :data="treeList" node-key="o" :indent="20"
|
|
|
+ :default-checked-keys="defaultListc" :default-expanded-keys="defaultList">
|
|
|
<span class="span-ellipsis" slot-scope="{ node, data }">
|
|
|
- <span :title="node.label"
|
|
|
- ><i
|
|
|
- v-if="data.children.length === 0"
|
|
|
- class="el-icon-caret-right icon-right"
|
|
|
- ></i>
|
|
|
- {{ node.label }}</span
|
|
|
- >
|
|
|
+ <span :title="node.label"><i v-if="data.children.length === 0" class="el-icon-caret-right icon-right"></i>
|
|
|
+ {{ node.label }}</span>
|
|
|
</span>
|
|
|
</el-tree>
|
|
|
</div>
|
|
|
<div class="flex-transfer">
|
|
|
- <el-transfer
|
|
|
- v-model="value"
|
|
|
- :titles="['待选人员', '已选人员']"
|
|
|
- @change="handleCheckChange"
|
|
|
- :data="transferList"
|
|
|
- ></el-transfer>
|
|
|
+ <el-transfer v-model="value" :titles="['待选人员', '已选人员']" @change="handleCheckChange"
|
|
|
+ :data="transferList"></el-transfer>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
@@ -59,13 +43,13 @@ export default {
|
|
|
},
|
|
|
methods: {
|
|
|
handleNodeClick(v) {
|
|
|
- for(let i = v.children.length-1;i>=0;i--){
|
|
|
- if(v.children[i].haveUserFlag == "N"){
|
|
|
+ for (let i = v.children.length - 1; i >= 0; i--) {
|
|
|
+ if (v.children[i].haveUserFlag == "N") {
|
|
|
v.children.splice(i, 1);
|
|
|
}
|
|
|
}
|
|
|
// v.children.map((item,index) =>{
|
|
|
-
|
|
|
+
|
|
|
// if(item.haveUserFlag == "N"){
|
|
|
// v.children.splice(index, 1);
|
|
|
// }
|
|
@@ -83,11 +67,16 @@ export default {
|
|
|
for (let i = 0; i <= this.transferList.length - 1; i++) {
|
|
|
for (let y = 0; y <= this.value.length; y++) {
|
|
|
if (this.transferList[i].key === this.value[y]) {
|
|
|
+ console.log(this.transferList[i].key);
|
|
|
+ console.log(this.value[y]);
|
|
|
a.push(this.transferList[i]);
|
|
|
+
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+ console.log(a);
|
|
|
this.transferList = a;
|
|
|
+ // console.log(this.transferList);
|
|
|
} else {
|
|
|
this.transferList = [];
|
|
|
}
|
|
@@ -113,7 +102,7 @@ export default {
|
|
|
headers: {
|
|
|
"Content-Type": "application/json",
|
|
|
},
|
|
|
- data:list
|
|
|
+ data: list
|
|
|
}).then((res) => {
|
|
|
v.children = v.children ? v.children : [];
|
|
|
this.treeId = v.o;
|
|
@@ -124,12 +113,18 @@ export default {
|
|
|
key: item.loginNoStr,
|
|
|
});
|
|
|
});
|
|
|
+ const dalaoyang = (arr, key) => {
|
|
|
+ let map = new Map()
|
|
|
+ return arr.filter(item => !map.has(item[key]) && map.set(item[key], 1))
|
|
|
+ }
|
|
|
+ this.transferList = dalaoyang(this.transferList, "key")
|
|
|
+ console.log(this.transferList);
|
|
|
});
|
|
|
} else {
|
|
|
console.log(this.transferList);
|
|
|
}
|
|
|
},
|
|
|
- getTree(v,e) {
|
|
|
+ getTree(v, e) {
|
|
|
let list = {
|
|
|
parentorgid: v,
|
|
|
// functionName: e,
|
|
@@ -203,33 +198,40 @@ export default {
|
|
|
::v-deep .el-checkbox.el-transfer-panel__item {
|
|
|
display: block !important;
|
|
|
}
|
|
|
+
|
|
|
::v-deep .el-transfer-panel__list.is-filterable {
|
|
|
height: calc(100% - 110px);
|
|
|
}
|
|
|
+
|
|
|
::v-deep .el-transfer-panel__body {
|
|
|
height: 100%;
|
|
|
}
|
|
|
+
|
|
|
.tree-text {
|
|
|
font-size: 20px;
|
|
|
color: black;
|
|
|
padding: 15px;
|
|
|
font-weight: 600;
|
|
|
}
|
|
|
+
|
|
|
.flex-box {
|
|
|
display: flex;
|
|
|
width: 100%;
|
|
|
justify-content: center;
|
|
|
height: 80%;
|
|
|
}
|
|
|
+
|
|
|
::v-deep .el-icon-caret-right {
|
|
|
font-size: 12px;
|
|
|
background-size: cover;
|
|
|
margin-left: px;
|
|
|
}
|
|
|
+
|
|
|
.icon-right {
|
|
|
margin-left: 5px;
|
|
|
color: #fff;
|
|
|
}
|
|
|
+
|
|
|
.treebox {
|
|
|
width: 30%;
|
|
|
border: 1px solid #ddd;
|
|
@@ -238,16 +240,19 @@ export default {
|
|
|
overflow: scroll;
|
|
|
overflow-x: hidden;
|
|
|
}
|
|
|
+
|
|
|
.flex-transfer {
|
|
|
width: 50%;
|
|
|
height: 100%;
|
|
|
margin-left: 30px;
|
|
|
}
|
|
|
+
|
|
|
::v-deep .el-transfer-panel {
|
|
|
width: 35%;
|
|
|
height: 100%;
|
|
|
}
|
|
|
+
|
|
|
::v-deep .el-transfer {
|
|
|
height: 100%;
|
|
|
}
|
|
|
-</style>
|
|
|
+</style>
|