153 lines
6.7 KiB
Vue
153 lines
6.7 KiB
Vue
<template>
|
|
<Tree ref="treRef" :data="tree" style="height: 100%" :width="'100%'" :expanded="expanded" />
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import { ref, nextTick } from 'vue'
|
|
import Tree from './index.vue'
|
|
|
|
import { getTerminalTree } from '@/api/device-boot/Business.ts'
|
|
import { useConfig } from '@/stores/config'
|
|
const VITE_FLAG = import.meta.env.VITE_NAME == 'jibei'
|
|
defineOptions({
|
|
name: 'govern/deviceTree'
|
|
})
|
|
const emit = defineEmits(['init'])
|
|
const config = useConfig()
|
|
const expanded: any = ref([])
|
|
const tree = ref()
|
|
const treRef = ref()
|
|
const info = (id: any) => {
|
|
expanded.value = [id]
|
|
getTerminalTree().then(res => {
|
|
// let arr: any[] = []
|
|
if (VITE_FLAG) {
|
|
res.data.forEach((item: any) => {
|
|
item.icon = 'el-icon-Menu'
|
|
item.plevel = item.level
|
|
item.level = 0
|
|
item.children.forEach((item2: any) => {
|
|
item2.icon = 'el-icon-HomeFilled'
|
|
|
|
item2.plevel = item2.level
|
|
item2.level = 100
|
|
expanded.value.push(item2.id)
|
|
item2.children.forEach((item3: any) => {
|
|
item3.icon = 'el-icon-CollectionTag'
|
|
item3.plevel = item3.level
|
|
item3.level = 200
|
|
item3.children.forEach((item4: any) => {
|
|
item4.icon = 'el-icon-Flag'
|
|
item4.plevel = item4.level
|
|
item4.level = 300
|
|
// arr.push(item4)
|
|
item4.children.forEach((item5: any) => {
|
|
item5.icon = 'el-icon-OfficeBuilding'
|
|
item5.plevel = item5.level
|
|
item5.level = 300
|
|
// item5.id = item4.id
|
|
item5.children.forEach((item6: any) => {
|
|
item6.icon = 'el-icon-HelpFilled'
|
|
item6.plevel = 4
|
|
if (item6.name == '电网侧' && item6.children.length == 0) {
|
|
item6.level = 400
|
|
} else {
|
|
item6.level = 400
|
|
}
|
|
item6.children.forEach((item7: any) => {
|
|
item7.icon = 'el-icon-Film'
|
|
item7.plevel = item7.level
|
|
item7.level = 400
|
|
item7.children.forEach((item8: any) => {
|
|
item8.icon = 'el-icon-Collection'
|
|
item8.plevel = item8.level
|
|
item8.level = 500
|
|
item8.children.forEach((item9: any) => {
|
|
item9.icon = 'el-icon-Share'
|
|
item9.plevel = item9.level
|
|
item9.level = 600
|
|
item9.children.forEach((item10: any) => {
|
|
item10.icon = 'el-icon-Location'
|
|
item10.plevel = item10.level
|
|
item10.level = 700
|
|
})
|
|
})
|
|
})
|
|
})
|
|
})
|
|
})
|
|
})
|
|
})
|
|
})
|
|
})
|
|
} else {
|
|
res.data.forEach((item: any) => {
|
|
item.icon = 'el-icon-Menu'
|
|
item.plevel = item.level
|
|
item.level = (item.level + 1) * 100
|
|
item.children.forEach((item2: any) => {
|
|
item2.icon = 'el-icon-HomeFilled'
|
|
item2.plevel = item2.level
|
|
item2.level = (item2.level + 1) * 100
|
|
expanded.value.push(item2.id)
|
|
item2.children.forEach((item3: any) => {
|
|
item3.icon = 'el-icon-CollectionTag'
|
|
item3.plevel = item3.level
|
|
item3.level = (item3.level + 1) * 100
|
|
item3.children.forEach((item4: any) => {
|
|
item4.icon = 'el-icon-Flag'
|
|
item4.plevel = item4.level
|
|
item4.level = (item4.level + 1) * 100
|
|
item4.children.forEach((item5: any) => {
|
|
item5.icon = 'el-icon-OfficeBuilding'
|
|
item5.plevel = item5.level
|
|
item5.level = (item5.level == 7 ? 4 : item5.level + 1) * 100
|
|
item5.children.forEach((item6: any) => {
|
|
item6.icon = 'el-icon-Film'
|
|
item6.plevel = item6.level
|
|
item6.level = (item6.level + 1) * 100
|
|
item6.children.forEach((item7: any) => {
|
|
item7.icon = 'el-icon-Share'
|
|
item7.plevel = item7.level
|
|
item7.level = (item7.level + 1) * 100
|
|
item7.children.forEach((item8: any) => {
|
|
item8.icon = 'el-icon-Location'
|
|
item8.plevel = item8.level
|
|
item8.level = (item8.level + 1) * 100
|
|
})
|
|
})
|
|
})
|
|
})
|
|
})
|
|
})
|
|
})
|
|
})
|
|
}
|
|
|
|
tree.value = res.data
|
|
|
|
nextTick(() => {
|
|
treRef.value.setCurrentKey(id)
|
|
// if (arr.length) {
|
|
// treRef.value.treeRef.setCurrentKey(arr[0].id)
|
|
// // 注册父组件事件
|
|
// emit('init', {
|
|
// level: 2,
|
|
// ...arr[0]
|
|
// })
|
|
// } else {
|
|
// emit('init')
|
|
// }
|
|
})
|
|
})
|
|
}
|
|
info('')
|
|
|
|
defineExpose({ info })
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
.el-tree {
|
|
background: #efeff0;
|
|
}
|
|
</style>
|