Web/admin-sjzx
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'master' of http://192.168.1.22:3000/Web/admin-sjzx

Browse Source 
# Conflicts:
#	src/components/tree/pqs/bearingTree.vue
#	src/views/pqs/harmonicMonitoring/monitoringPoint/online/wentaizhibiaohegelv/index.vue
This commit is contained in:
sjl
2026-01-06 08:38:11 +08:00
parent cb19fef4c6 98c887b79d
commit 953b96fe05
14 changed files with 418 additions and 105 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/cockpit/integrity/index.vue
View File

@@ -223,7 +223,7 @@ const echart = () => {
series: [
{
name: '异常总数',
name: '',
type: 'bar',
barWidth: 12,
data: [100],
@@ -240,7 +240,7 @@ const echart = () => {
colorStops: [
{
offset: 1,
color: '#57bc6e' // 100% 处的颜色
color: '#FF9100' // 100% 处的颜色
}
],
global: false // 缺省为 false
@@ -249,7 +249,7 @@ const echart = () => {
}
},
{
name: '异常占比',
name: '',
type: 'bar',
barWidth: 13,
data: [
@@ -270,11 +270,11 @@ const echart = () => {
colorStops: [
{
offset: 0,
color: '#FF9100' // 0% 处的颜色
color: '#57bc6e ' // 0% 处的颜色
},
{
offset: 1,
color: '#FF9100' // 100% 处的颜色
color: '#57bc6e' // 100% 处的颜色
}
],
global: false // 缺省为 false

10
src/components/cockpit/onlineRate/index.vue
View File

@@ -222,7 +222,7 @@ const echart = () => {
series: [
{
name: '异常总数',
name: '',
type: 'bar',
barWidth: 12,
data: [100],
@@ -239,7 +239,7 @@ const echart = () => {
colorStops: [
{
offset: 1,
color: '#57bc6e' // 100% 处的颜色
color: '#FF9100' // 100% 处的颜色
}
],
global: false // 缺省为 false
@@ -248,7 +248,7 @@ const echart = () => {
}
},
{
name: '异常占比',
name: '',
type: 'bar',
barWidth: 13,
data: [
@@ -269,11 +269,11 @@ const echart = () => {
colorStops: [
{
offset: 0,
color: '#FF9100' // 0% 处的颜色
color: '#57bc6e' // 0% 处的颜色
},
{
offset: 1,
color: '#FF9100' // 100% 处的颜色
color: '#57bc6e' // 100% 处的颜色
}
],
global: false // 缺省为 false

187
src/components/tree/allocation.vue Normal file
View File

@@ -0,0 +1,187 @@
<template>
<div :style="{ width: menuCollapse ? '40px' : props.width }" style="transition: all 0.3s; overflow: hidden">
<div class="mt15 mr10" style="display: flex; justify-content: end">
<el-button type="primary" icon="el-icon-Select" @click="save" :loading="loading">保存</el-button>
</div>
<Icon
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"
/>
<div class="cn-tree" :style="{ opacity: menuCollapse ? 0 : 1 }">
<div style="display: flex; align-items: center" class="mb10">
<el-input maxlength="32" show-word-limit v-model.trim="filterText" placeholder="请输入内容" clearable>
<template #prefix>
<Icon name="el-icon-Search" style="font-size: 16px" />
</template>
</el-input>
<el-tooltip placement="bottom" :hide-after="0" v-if="props.showPush">
<template #content>
<span>台账推送</span>
</template>
<Icon
name="el-icon-Promotion"
size="20"
class="fold ml10 menu-collapse"
style="cursor: pointer"
:style="{ color: config.getColorVal('elementUiPrimary') }"
@click="onAdd"
/>
</el-tooltip>
<!-- <Icon @click='onMenuCollapse' :name="menuCollapse ? 'el-icon-Expand' : 'el-icon-Fold'" v-else
:class="menuCollapse ? 'unfold' : ''" size='18' class='fold ml10 menu-collapse'
style='cursor: pointer' v-if='props.canExpand' /> -->
</div>
<el-tree
:style="{ height: 'calc(100vh - 235px)' }"
style="overflow: auto"
ref="treeRef"
:props="defaultProps"
highlight-current
:default-expand-all="false"
@check-change="checkTreeNodeChange"
:filter-node-method="filterNode"
node-key="id"
v-bind="$attrs"
>
<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"
/>
<span style="margin-left: 4px">{{ node.label }}</span>
</span>
</template>
</el-tree>
</div>
</div>
</template>
<script lang="ts" setup>
import useCurrentInstance from '@/utils/useCurrentInstance'
import { ElTree } from 'element-plus'
import { emit } from 'process'
import { ref, watch } from 'vue'
import { t } from 'vxe-table'
import { useConfig } from '@/stores/config'
defineOptions({
name: 'govern/tree'
})
interface Props {
width?: string
canExpand?: boolean
showPush?: boolean
}
const loading = ref(false)
const props = withDefaults(defineProps<Props>(), {
width: '280px',
canExpand: true,
showPush: false
})
const config = useConfig()
const { proxy } = useCurrentInstance()
const menuCollapse = ref(false)
const filterText = ref('')
const defaultProps = {
label: 'name',
value: 'id'
}
const emit = defineEmits(['checkTreeNodeChange', 'onAdd', 'checkChange'])
watch(filterText, val => {
treeRef.value!.filter(val)
})
const onMenuCollapse = () => {
menuCollapse.value = !menuCollapse.value
proxy.eventBus.emit('cnTreeCollapse', menuCollapse)
}
const save = () => {
loading.value = true
emit('checkChange')
}
const filterNode = (value: string, data: any, node: any) => {
console.log(value, data, node, 'filterNode')
if (!value) return true
// return data.name.includes(value)
if (data.name) {
return chooseNode(value, data, node)
}
}
// 过滤父节点 / 子节点 (如果输入的参数是父节点且能匹配，则返回该节点以及其下的所有子节点；如果参数是子节点，则返回该节点的父节点。name是中文字符，enName是英文字符.
const chooseNode = (value: string, data: any, node: any) => {
if (data.name.indexOf(value) !== -1) {
return true
}
const level = node.level
// 如果传入的节点本身就是一级节点就不用校验了
if (level === 1) {
return false
}
// 先取当前节点的父节点
let parentData = node.parent
// 遍历当前节点的父节点
let index = 0
while (index < level - 1) {
// 如果匹配到直接返回，此处name值是中文字符，enName是英文字符。判断匹配中英文过滤
if (parentData.data.name.indexOf(value) !== -1) {
return true
}
// 否则的话再往上一层做匹配
parentData = parentData.parent
index++
}
// 没匹配到返回false
return false
}
const checkTreeNodeChange = () => {
// console.log(treeRef.value?.getCheckedNodes(), "ikkkkkiisiiisis");
emit('checkTreeNodeChange', treeRef.value?.getCheckedNodes())
}
const onAdd = () => {
emit('onAdd')
}
const treeRef = ref<InstanceType<typeof ElTree>>()
defineExpose({ treeRef, loading })
</script>
<style lang="scss" scoped>
.cn-tree {
flex-shrink: 0;
display: flex;
flex-direction: column;
box-sizing: border-box;
padding: 10px;
height: 100%;
width: 100%;
:deep(.el-tree) {
border: 1px solid var(--el-border-color);
}
:deep(.el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content) {
background-color: var(--el-color-primary-light-7);
}
.menu-collapse {
color: var(--el-color-primary);
}
}
.custom-tree-node {
display: flex;
align-items: center;
}
</style>

2
src/components/tree/index.vue
View File

@@ -22,7 +22,7 @@
<template #prefix>
<Icon name="el-icon-Search" style="font-size: 16px" />
</template>
</el-input>
</el-input>
<Icon
@click="onMenuCollapse"
:name="menuCollapse ? 'el-icon-Expand' : 'el-icon-Fold'"

1
src/components/tree/pqs/algorithmTree.vue
View File

@@ -19,7 +19,6 @@ 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 { queryAllAlgorithmLibrary } from '@/api/supervision-boot/database/index'
defineOptions({

1
src/components/tree/pqs/assessTree.vue
View File

@@ -11,7 +11,6 @@ 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'
import { getTree } from '@/api/advance-boot/assess'

2
src/components/tree/pqs/bearingTree.vue
View File

@@ -1,3 +1,4 @@
<template>
<div class="point-tree">
<!-- <el-select
@@ -143,3 +144,4 @@ loadData()
border: 1px solid var(--el-border-color);
}
</style>

226
src/components/tree/pqs/pointTree.vue
View File

@@ -28,6 +28,7 @@ import { useDictData } from '@/stores/dictData'
import { getTerminalTreeForFive } from '@/api/device-boot/terminalTree'
import { useConfig } from '@/stores/config'
import { defineProps } from 'vue'
const VITE_FLAG = import.meta.env.VITE_NAME == 'qujing'
defineOptions({
name: 'pms/pointTree'
})
@@ -61,6 +62,9 @@ const loadData = () => {
}) || { code: '' }
let form = JSON.parse(JSON.stringify(formData.value))
form.statisticalType = classificationData.find((item: any) => item.id == form.statisticalType)
if (VITE_FLAG && form.statisticalType.code == 'Power_Network') {
form.statisticalType.deptName = 'qujing'
}
let nodeKey = ''
getTerminalTreeForFive(form).then(res => {
//console.log('---',res)
@@ -74,62 +78,71 @@ const loadData = () => {
}
]
}
res.data.forEach((item: any) => {
item.icon = 'el-icon-HomeFilled'
item.color = config.getColorVal('elementUiPrimary')
item.children.forEach((item2: any) => {
item2.icon = 'el-icon-CollectionTag'
item2.color = config.getColorVal('elementUiPrimary')
item2.children.forEach((item3: any) => {
item3.icon = 'el-icon-Flag'
item3.color = config.getColorVal('elementUiPrimary')
item3.children.forEach((item4: any) => {
item4.icon = 'el-icon-OfficeBuilding'
item4.color = config.getColorVal('elementUiPrimary')
item4.children.forEach((item5: anyObj) => {
if (item5.level == 7) {
item5.icon = 'el-icon-DataAnalysis'
item5.color = config.getColorVal('elementUiPrimary')
item5.children.forEach((item6: anyObj) => {
item6.alias = `${item.name}>${item2.name}>${item3.name}>${item4.name}>${item5.name}>${item6.name}`
item6.pid = item4.id
item6.icon = 'fa-solid fa-location-dot'
item6.color = config.getColorVal('elementUiPrimary')
if (item6.comFlag == 0) {
item6.color = 'red !important'
} else if (item6.comFlag == 1) {
item6.color = '#00f93b !important'
} else if (item6.comFlag == 2) {
item6.color = '#8c8c8c !important'
}
})
} else {
item5.alias = `${item.name}>${item2.name}>${item3.name}>${item4.name}>${item5.name}`
item5.pid = item4.id
item5.icon = 'fa-solid fa-location-dot'
item5.color = config.getColorVal('elementUiPrimary')
if (item5.comFlag == 0) {
item5.color = 'red !important'
} else if (item5.comFlag == 1) {
item5.color = '#00f93b !important'
} else if (item5.comFlag == 2) {
item5.color = '#8c8c8c !important'
}
}
})
})
})
})
})
// if (VITE_FLAG) {
processTreeData(res.data)
let firstLevel6Node = findFirstLevel6Node(res.data)
nodeKey =
res.data[0].children[0].children[0].children[0].children[0].children[0]?.id ||
res.data[0].children[0].children[0].children[0].children[0]?.id
emit(
'init',
res.data[0].children[0].children[0].children[0].children[0]?.children[0] ||
res.data[0].children[0].children[0].children[0].children[0]
)
nodeKey = firstLevel6Node.id
emit('init', firstLevel6Node)
// } else {
// // 正常树处理
// res.data.forEach((item: any) => {
// item.icon = 'el-icon-HomeFilled'
// item.color = config.getColorVal('elementUiPrimary')
// item.children.forEach((item2: any) => {
// item2.icon = 'el-icon-CollectionTag'
// item2.color = config.getColorVal('elementUiPrimary')
// item2.children.forEach((item3: any) => {
// item3.icon = 'el-icon-Flag'
// item3.color = config.getColorVal('elementUiPrimary')
// item3.children.forEach((item4: any) => {
// item4.icon = 'el-icon-OfficeBuilding'
// item4.color = config.getColorVal('elementUiPrimary')
// item4.children.forEach((item5: anyObj) => {
// if (item5.level == 7) {
// item5.icon = 'el-icon-DataAnalysis'
// item5.color = config.getColorVal('elementUiPrimary')
// item5.children.forEach((item6: anyObj) => {
// item6.alias = `${item.name}>${item2.name}>${item3.name}>${item4.name}>${item5.name}>${item6.name}`
// item6.pid = item4.id
// item6.icon = 'fa-solid fa-location-dot'
// item6.color = config.getColorVal('elementUiPrimary')
// if (item6.comFlag == 0) {
// item6.color = 'red !important'
// } else if (item6.comFlag == 1) {
// item6.color = '#00f93b !important'
// } else if (item6.comFlag == 2) {
// item6.color = '#8c8c8c !important'
// }
// })
// } else {
// item5.alias = `${item.name}>${item2.name}>${item3.name}>${item4.name}>${item5.name}`
// item5.pid = item4.id
// item5.icon = 'fa-solid fa-location-dot'
// item5.color = config.getColorVal('elementUiPrimary')
// if (item5.comFlag == 0) {
// item5.color = 'red !important'
// } else if (item5.comFlag == 1) {
// item5.color = '#00f93b !important'
// } else if (item5.comFlag == 2) {
// item5.color = '#8c8c8c !important'
// }
// }
// })
// })
// })
// })
// })
// nodeKey =
// res.data[0].children[0].children[0].children[0].children[0].children[0]?.id ||
// res.data[0].children[0].children[0].children[0].children[0]?.id
// emit(
// 'init',
// res.data[0].children[0].children[0].children[0].children[0]?.children[0] ||
// res.data[0].children[0].children[0].children[0].children[0]
// )
// }
tree.value = res.data
if (nodeKey) {
@@ -145,6 +158,109 @@ const scrollToNode = (id: string) => {
// 树滚动
treeRef.value.scrollToNode(id)
}
// 定义不同层级对应的图标配置（可根据实际需求调整）
const levelIconMap = {
'-1': 'el-icon-HomeFilled',
0: 'el-icon-CollectionTag',
1: 'el-icon-CollectionTag',
2: 'el-icon-Flag',
3: 'el-icon-OfficeBuilding',
4: 'el-icon-DataAnalysis',
5: 'el-icon-DataAnalysis',
7: 'el-icon-DataAnalysis',
6: 'fa-solid fa-location-dot'
}
/**
* 递归处理树形数据，为不同层级节点设置图标和颜色
* @param data 树形数据数组
* @param level 当前层级（默认从1开始）
*/
function processTreeData(data: any[], level: number = -1, alias: string = '') {
// 空值判断，避免数组为空或undefined时报错
if (!Array.isArray(data) || data.length === 0) return
data.forEach(item => {
// 1. 设置基础图标（根据层级匹配）
item.icon = levelIconMap[level] || ''
item.alias = alias + `${item.name}`
// 2. 设置基础颜色
item.color = config.getColorVal('elementUiPrimary')
// 3. 第6层特殊处理：根据comFlag调整颜色
if (level === 6 && item.hasOwnProperty('comFlag')) {
switch (item.comFlag) {
case 0:
item.color = 'red !important'
break
case 1:
item.color = '#00f93b !important'
break
case 2:
item.color = '#8c8c8c !important'
break
// 默认值：保持原有基础颜色
default:
item.color = config.getColorVal('elementUiPrimary')
}
}
// 4. 递归处理子节点，层级+1
if (item.children && item.children.length > 0) {
processTreeData(item.children, item.children[0].level, level == '-1' ? '' : item.alias + '>')
}
})
}
/**
* 递归查找树形结构中第一个level===6的节点（找到即终止递归）
* @param {Object|Array} tree - 树形数据（根节点数组 或 单个根节点）
* @returns {Object|null} 第一个level为6的节点，无则返回null
*/
function findFirstLevel6Node(tree: any) {
// 统一处理入参：如果是数组，遍历根节点数组（按顺序找第一个符合条件的）
if (Array.isArray(tree)) {
for (const rootNode of tree) {
const result = traverse(rootNode)
// 找到第一个匹配节点，立即返回（终止根节点遍历）
if (result) return result
}
// 所有根节点遍历完未找到
return null
} else {
// 入参是单个节点，直接递归遍历
return traverse(tree)
}
// 核心递归遍历函数
function traverse(node) {
// 终止条件1：节点不存在，返回null
if (!node) return null
// 终止条件2：找到level===6的节点，立即返回（终止递归）
if (node.level === 6) {
return node
}
// 终止条件3：节点无children，返回null
if (!node.children || node.children.length === 0) {
return null
}
// 按顺序遍历当前节点的子节点
for (const child of node.children) {
const foundNode = traverse(child)
// 子节点中找到目标节点，立即返回（终止后续子节点遍历）
if (foundNode) {
return foundNode
}
}
// 当前节点及所有子节点都无匹配，返回null
return null
}
}
defineExpose({ treeRef, scrollToNode, tree })
loadData()
</script>