<template>
|
<div>
|
<a-input-search style="margin-bottom: 8px" placeholder="搜索" @search="onSearchChange" />
|
<div style="overflow: auto" :style="{ height: height }">
|
<a-tree
|
@check="onCheck"
|
:checkedKeys="checkedKeys"
|
:treeData="treeData"
|
@expand="onExpand"
|
@select="onTreeNodeSelect"
|
:selectedKeys="selectedKeys"
|
:expandedKeys="expandedKeysss"
|
:checkStrictly="checkStrictly"
|
:auto-expand-parent="autoExpandParent"
|
/>
|
</div>
|
</div>
|
</template>
|
<script>
|
import { queryIdTree, queryDepartTreeList, searchByKeywords } from '@tievd/cube-block/lib/api/api'
|
import { getAction } from '@tievd/cube-block/lib/api/manage'
|
// import { getAreaPathIds } from '@/utils/util'
|
|
export default {
|
name: 'OrganTree',
|
data() {
|
return {
|
searchValue: '',
|
dataList: [],
|
treeData: [],
|
expandedKeysss: [], //展开的节点
|
indexTreeData: [],
|
defaultCheckedKeys: [],
|
selectedKeys: [],
|
checkedKeys: [],
|
// expandedKeys: ['2251'],
|
allTreeKeys: [],
|
autoExpandParent: true,
|
checkStrictly: true,
|
childOrgan: 0,
|
child: true,
|
selectedNodes: [],
|
defaultFirstData: {}, //默认第一条数据
|
}
|
},
|
props: {
|
height: {
|
type: String,
|
default: '500px',
|
},
|
},
|
watch:{
|
selectedKeys(newVal,oldVal){
|
console.log(newVal,oldVal);
|
}
|
},
|
mounted() {
|
this.loadTree()
|
},
|
created() {},
|
methods: {
|
setChildOrgan() {
|
this.child = !this.child
|
if (this.child) {
|
this.childOrgan = 0
|
} else {
|
this.childOrgan = 1
|
}
|
},
|
loadTree() {
|
// queryDepartTreeList().then(res => {
|
getAction('/sys/depart/queryTreeList', {myself: true}).then((res) => {
|
if (res.success) {
|
this.treeData = res.result
|
// if (this.checkedKeys && this.checkedKeys.length > 0) {
|
let treekey = []
|
let arr = res.result
|
if (arr && arr.length > 0) {
|
arr.forEach((item) => {
|
treekey.push(item.key)
|
if (item.children && item.children.length > 0) {
|
item.children.forEach((item1) => {
|
treekey.push(item1.key)
|
})
|
}
|
})
|
this.expandedKeysss = treekey
|
this.defaultFirstData = JSON.parse(JSON.stringify(arr[0]))
|
this.treeDataList()
|
}
|
// }
|
}
|
})
|
},
|
generateList(data) {
|
for (let i = 0; i < data.length; i++) {
|
const node = data[i]
|
const key = node.key
|
this.dataList.push({ key, title: node.title })
|
if (node.children) {
|
this.generateList(node.children)
|
}
|
}
|
},
|
onTreeNodeSelect(id, e) {
|
const { key } = e.node.dataRef
|
this.selectedKeys = [key]
|
// if (e.selectedNodes.length == 0) {
|
// e.selectedNodes = this.selectedNodes
|
// } else {
|
// this.selectedNodes = e.selectedNodes
|
// }
|
if (e.selectedNodes.length == 0) {
|
return;
|
}
|
this.$emit('on-tree-node-select', id, e)
|
},
|
// tree数据
|
treeDataList() {
|
if (!this.selectedKeys) {
|
this.$set(this.selectedKeys, 0, this.defaultFirstData.key); //默认第一个
|
this.$emit('tree-data-list', this.defaultFirstData) // 把tree数据传递到父组件
|
}
|
},
|
onCheck(o, e) {},
|
onExpand(expandedKeys, obj) {
|
this.expandedKeysss = expandedKeys
|
this.autoExpandParent = false
|
},
|
onSearchChange(value) {
|
let that = this
|
value = value.trim();
|
if (value) {
|
searchByKeywords({ keyWord: value }).then((res) => {
|
if (res.success) {
|
that.treeData = []
|
for (let i = 0; i < res.result.length; i++) {
|
let temp = res.result[i]
|
that.treeData.push(temp)
|
}
|
} else {
|
that.$message.warning(res.message)
|
}
|
})
|
} else {
|
that.loadTree()
|
}
|
},
|
},
|
}
|
</script>
|
<style lang="less" scoped></style>
|