2025-03-31 14:33:05 +08:00
|
|
|
<template>
|
|
|
|
|
<div class="point-tree">
|
|
|
|
|
<div style="flex: 1; overflow: hidden">
|
|
|
|
|
<Tree ref="treeRef" :data="tree" style="width: 100%; height: 100%" :canExpand="false" v-bind="$attrs" />
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script lang="ts" setup>
|
|
|
|
|
import { nextTick, onMounted, ref, useAttrs } from 'vue'
|
|
|
|
|
import Tree from '../index.vue'
|
|
|
|
|
import { useAdminInfo } from '@/stores/adminInfo'
|
|
|
|
|
import { useDictData } from '@/stores/dictData'
|
|
|
|
|
import { getTerminalTreeForFive } from '@/api/device-boot/terminalTree'
|
|
|
|
|
import { useConfig } from '@/stores/config'
|
|
|
|
|
import { defineProps } from 'vue'
|
|
|
|
|
defineOptions({
|
|
|
|
|
name: 'pms/pointTree'
|
|
|
|
|
})
|
|
|
|
|
interface Props {
|
|
|
|
|
showSelect?: boolean
|
|
|
|
|
}
|
|
|
|
|
const props = withDefaults(defineProps<Props>(), {
|
|
|
|
|
showSelect: true
|
|
|
|
|
})
|
|
|
|
|
const emit = defineEmits(['init'])
|
|
|
|
|
const attrs = useAttrs()
|
|
|
|
|
const adminInfo = useAdminInfo()
|
|
|
|
|
const dictData = useDictData()
|
|
|
|
|
const config = useConfig()
|
|
|
|
|
const classificationData = dictData.getBasicData('Statistical_Type', ['Report_Type'])
|
|
|
|
|
const tree = ref()
|
|
|
|
|
const treeRef = ref()
|
|
|
|
|
const formData = ref({
|
|
|
|
|
deptIndex: adminInfo.$state.deptIndex,
|
|
|
|
|
monitorFlag: 2,
|
|
|
|
|
powerFlag: 2,
|
|
|
|
|
loadType: null,
|
|
|
|
|
manufacturer: null,
|
|
|
|
|
serverName: 'event-boot',
|
|
|
|
|
statisticalType: classificationData[0].id,
|
|
|
|
|
scale: null
|
|
|
|
|
})
|
|
|
|
|
const loadData = () => {
|
|
|
|
|
let obj = classificationData.find(function (i) {
|
|
|
|
|
return i.id === formData.value.statisticalType
|
|
|
|
|
}) || { code: '' }
|
|
|
|
|
let form = JSON.parse(JSON.stringify(formData.value))
|
|
|
|
|
form.statisticalType = classificationData.find((item: any) => item.id == form.statisticalType)
|
|
|
|
|
let nodeKey = ''
|
|
|
|
|
getTerminalTreeForFive(form).then(res => {
|
|
|
|
|
console.log(res)
|
|
|
|
|
|
|
|
|
|
res.data = [
|
|
|
|
|
{
|
2025-04-03 16:08:47 +08:00
|
|
|
name: '张家口供电公司',
|
2025-03-31 14:33:05 +08:00
|
|
|
level: -1,
|
|
|
|
|
id: 0,
|
|
|
|
|
children: [
|
|
|
|
|
{
|
|
|
|
|
name: '特种钢厂',
|
|
|
|
|
level: 1,
|
|
|
|
|
id: 2
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
name: '体育中心',
|
|
|
|
|
level: 1,
|
|
|
|
|
id: 3
|
|
|
|
|
}
|
|
|
|
|
]
|
|
|
|
|
}
|
|
|
|
|
]
|
|
|
|
|
|
|
|
|
|
nodeKey = res.data[0].children[0]
|
|
|
|
|
emit('init', res.data[0].children[0])
|
|
|
|
|
|
|
|
|
|
tree.value = res.data
|
|
|
|
|
if (nodeKey) {
|
|
|
|
|
nextTick(() => {
|
|
|
|
|
treeRef.value.treeRef.setCurrentKey(nodeKey)
|
|
|
|
|
// treeRef.value.treeRef.setExpandedKeys(nodeKey)
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
loadData()
|
|
|
|
|
</script>
|
|
|
|
|
<style lang="scss">
|
|
|
|
|
.point-tree {
|
|
|
|
|
height: 100%;
|
|
|
|
|
width: 100%;
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
background: #fff;
|
|
|
|
|
border: 1px solid var(--el-border-color);
|
|
|
|
|
}
|
|
|
|
|
</style>
|