联调算法库
修改冀北台账问题
This commit is contained in:
@@ -1,50 +1,50 @@
|
||||
<template>
|
||||
<div :style="{ width: menuCollapse ? '40px' : props.width }" style='transition: all 0.3s; overflow: hidden'>
|
||||
<div :style="{ width: menuCollapse ? '40px' : props.width }" style="transition: all 0.3s; overflow: hidden">
|
||||
<Icon
|
||||
v-show='menuCollapse'
|
||||
@click='onMenuCollapse'
|
||||
v-show="menuCollapse"
|
||||
@click="onMenuCollapse"
|
||||
:name="menuCollapse ? 'el-icon-Expand' : 'el-icon-Fold'"
|
||||
:class="menuCollapse ? 'unfold' : ''"
|
||||
size='18'
|
||||
class='fold ml10 mt20 menu-collapse'
|
||||
style='cursor: pointer'
|
||||
size="18"
|
||||
class="fold ml10 mt20 menu-collapse"
|
||||
style="cursor: pointer"
|
||||
/>
|
||||
<div class='cn-tree' :style='{ opacity: menuCollapse ? 0 : 1 }'>
|
||||
<div style='display: flex; align-items: center' class='mb10'>
|
||||
<el-input v-model='filterText' placeholder='请输入内容' clearable>
|
||||
<div class="cn-tree" :style="{ opacity: menuCollapse ? 0 : 1 }">
|
||||
<div style="display: flex; align-items: center" class="mb10">
|
||||
<el-input v-model="filterText" placeholder="请输入内容" clearable>
|
||||
<template #prefix>
|
||||
<Icon name='el-icon-Search' style='font-size: 16px' />
|
||||
<Icon name="el-icon-Search" style="font-size: 16px" />
|
||||
</template>
|
||||
</el-input>
|
||||
<Icon
|
||||
@click='onMenuCollapse'
|
||||
@click="onMenuCollapse"
|
||||
:name="menuCollapse ? 'el-icon-Expand' : 'el-icon-Fold'"
|
||||
:class="menuCollapse ? 'unfold' : ''"
|
||||
size='18'
|
||||
class='fold ml10 menu-collapse'
|
||||
style='cursor: pointer'
|
||||
v-if='props.canExpand'
|
||||
size="18"
|
||||
class="fold ml10 menu-collapse"
|
||||
style="cursor: pointer"
|
||||
v-if="props.canExpand"
|
||||
/>
|
||||
<el-button icon="el-icon-Plus" v-if="props.addTree" type="primary" class="ml10" @click="onAddTree">新增</el-button>
|
||||
</div>
|
||||
<el-tree
|
||||
style='flex: 1; overflow: auto'
|
||||
ref='treeRef'
|
||||
:props='defaultProps'
|
||||
style="flex: 1; overflow: auto"
|
||||
ref="treeRef"
|
||||
:props="defaultProps"
|
||||
highlight-current
|
||||
|
||||
:filter-node-method='filterNode'
|
||||
node-key='id'
|
||||
v-bind='$attrs'
|
||||
:filter-node-method="filterNode"
|
||||
node-key="id"
|
||||
v-bind="$attrs"
|
||||
>
|
||||
<template #default='{ node, data }'>
|
||||
<span class='custom-tree-node'>
|
||||
<template #default="{ node, data }">
|
||||
<span class="custom-tree-node">
|
||||
<Icon
|
||||
:name='data.icon'
|
||||
style='font-size: 16px'
|
||||
:style='{ color: data.color }'
|
||||
v-if='data.icon'
|
||||
:name="data.icon"
|
||||
style="font-size: 16px"
|
||||
:style="{ color: data.color }"
|
||||
v-if="data.icon"
|
||||
/>
|
||||
<span style='margin-left: 4px'>{{ node.label }}</span>
|
||||
<span style="margin-left: 4px">{{ node.label }}</span>
|
||||
</span>
|
||||
</template>
|
||||
</el-tree>
|
||||
@@ -52,7 +52,7 @@
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang='ts' setup>
|
||||
<script lang="ts" setup>
|
||||
import useCurrentInstance from '@/utils/useCurrentInstance'
|
||||
import { ElTree } from 'element-plus'
|
||||
import { ref, watch } from 'vue'
|
||||
@@ -60,15 +60,17 @@ import { ref, watch } from 'vue'
|
||||
defineOptions({
|
||||
name: 'govern/tree'
|
||||
})
|
||||
|
||||
const emit = defineEmits(['onAddTree'])
|
||||
interface Props {
|
||||
width?: string
|
||||
canExpand?: boolean
|
||||
addTree?: boolean
|
||||
}
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
width: '280px',
|
||||
canExpand: true
|
||||
canExpand: true,
|
||||
addTree: false
|
||||
})
|
||||
const { proxy } = useCurrentInstance()
|
||||
const menuCollapse = ref(false)
|
||||
@@ -88,11 +90,15 @@ const filterNode = (value: string, data: any) => {
|
||||
if (!value) return true
|
||||
return data.name.includes(value)
|
||||
}
|
||||
// 添加树
|
||||
const onAddTree = () => {
|
||||
emit('onAddTree')
|
||||
}
|
||||
const treeRef = ref<InstanceType<typeof ElTree>>()
|
||||
defineExpose({ treeRef })
|
||||
</script>
|
||||
|
||||
<style lang='scss' scoped>
|
||||
<style lang="scss" scoped>
|
||||
.cn-tree {
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
|
||||
@@ -39,11 +39,14 @@ const info = (id: any) => {
|
||||
item4.children.forEach((item5: any) => {
|
||||
item5.icon = 'el-icon-OfficeBuilding'
|
||||
item5.level = 300
|
||||
item5.id = item4.id
|
||||
// item5.id = item4.id
|
||||
item5.children.forEach((item6: any) => {
|
||||
item6.icon = 'el-icon-HelpFilled'
|
||||
item6.level = 300
|
||||
item6.id = item4.id
|
||||
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.level = 400
|
||||
|
||||
@@ -1,7 +1,16 @@
|
||||
<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" />
|
||||
<Tree
|
||||
ref="treeRef"
|
||||
:data="tree"
|
||||
:canExpand="false"
|
||||
style="width: 100%; height: 100%"
|
||||
v-bind="$attrs"
|
||||
default-expand-all
|
||||
addTree
|
||||
@onAddTree="onAddTree"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -13,11 +22,11 @@ import { useAdminInfo } from '@/stores/adminInfo'
|
||||
import { useDictData } from '@/stores/dictData'
|
||||
import { getTerminalTreeForFive } from '@/api/device-boot/terminalTree'
|
||||
import { useConfig } from '@/stores/config'
|
||||
|
||||
import { queryAllAlgorithmLibrary } from '@/api/supervision-boot/database/index'
|
||||
defineOptions({
|
||||
name: 'pms/pointTree'
|
||||
})
|
||||
const emit = defineEmits(['init'])
|
||||
const emit = defineEmits(['init', 'onAddTree'])
|
||||
const attrs = useAttrs()
|
||||
const adminInfo = useAdminInfo()
|
||||
const dictData = useDictData()
|
||||
@@ -26,48 +35,45 @@ const classificationData = dictData.getBasicData('Statistical_Type', ['Report_Ty
|
||||
const tree = ref()
|
||||
const treeRef = ref()
|
||||
|
||||
const loadData = () => {
|
||||
const loadData = (id?: any) => {
|
||||
console.log('🚀 ~ loadData ~ id:', id)
|
||||
let nodeKey = ''
|
||||
let res = {
|
||||
data: [
|
||||
{
|
||||
name: '运行管理',
|
||||
id: '1',
|
||||
children: [
|
||||
{
|
||||
name: '运行指标',
|
||||
id: '2'
|
||||
},
|
||||
{
|
||||
name: '数据质量核查',
|
||||
id: '3'
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
// getTerminalTreeForFive(form).then(res => {
|
||||
res.data.forEach((item: any) => {
|
||||
item.icon = 'el-icon-FolderOpened'
|
||||
item.color = config.getColorVal('elementUiPrimary')
|
||||
item.children.forEach((item2: any) => {
|
||||
item2.icon = 'el-icon-Document'
|
||||
queryAllAlgorithmLibrary().then(res => {
|
||||
res.data.forEach((item: any) => {
|
||||
item.icon = 'el-icon-FolderOpened'
|
||||
item.color = config.getColorVal('elementUiPrimary')
|
||||
item.children.forEach((item2: any) => {
|
||||
item2.icon = 'el-icon-Document'
|
||||
item2.color = config.getColorVal('elementUiPrimary')
|
||||
item2.childrens = item2.children
|
||||
item2.children = []
|
||||
if (item2.id == id) {
|
||||
emit('init', item2)
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
nodeKey = res.data[0].children[0].id
|
||||
|
||||
tree.value = res.data
|
||||
if (id) {
|
||||
setTimeout(() => {
|
||||
treeRef.value.treeRef.setCurrentKey(id)
|
||||
}, 10)
|
||||
} else {
|
||||
setTimeout(() => {
|
||||
treeRef.value.treeRef.setCurrentKey(nodeKey)
|
||||
emit('init', res.data[0].children[0])
|
||||
}, 10)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
nodeKey = res.data[0].children[0].id
|
||||
emit('init', res.data[0].children[0])
|
||||
|
||||
tree.value = res.data
|
||||
if (nodeKey) {
|
||||
setTimeout(() => {
|
||||
treeRef.value.treeRef.setCurrentKey(nodeKey)
|
||||
}, 10)
|
||||
}
|
||||
// })
|
||||
const onAddTree = () => {
|
||||
emit('onAddTree')
|
||||
}
|
||||
loadData()
|
||||
defineExpose({ loadData })
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.point-tree {
|
||||
|
||||
Reference in New Issue
Block a user