修改测试bug 优化页面

src/components/cockpit/crossingTime/index.vue

@@ -0,0 +1,308 @@
+<template>
+    <div>
+        <!--暂态越限时间分布 -->
+        <TableHeader
+            ref="TableHeaderRef"
+            :timeKeyList="prop.timeKey"
+            :showReset="false"
+            @selectChange="selectChange"
+            datePicker
+            v-if="fullscreen"
+        ></TableHeader>
+        <my-echart
+            class="tall"
+            :options="echartList1"
+            :style="{
+                width: prop.width,
+                height: `calc(${prop.height} - ${headerHeight}px + ${fullscreen ? 0 : 56}px)`
+            }"
+        />
+        <!-- <my-echart
+            class="mt10"
+            :options="echartList1"
+            :style="{
+                width: prop.width,
+                height: `calc(${prop.height} / 2  - ${headerHeight / 2}px + ${fullscreen ? 0 : 28}px )`
+            }"
+        /> -->
+    </div>
+</template>
+<script setup lang="ts">
+import { ref, onMounted, provide, reactive, watch } from 'vue'
+import TableStore from '@/utils/tableStore'
+import MyEchart from '@/components/echarts/MyEchart.vue'
+import { useConfig } from '@/stores/config'
+import TableHeader from '@/components/table/header/index.vue'
+import { getTime } from '@/utils/formatTime'
+
+const prop = defineProps({
+    w: { type: [String, Number] },
+    h: { type: [String, Number] },
+    width: { type: [String, Number] },
+    height: { type: [String, Number] },
+    timeKey: { type: Array as () => string[] },
+    timeValue: { type: Object },
+    interval: { type: Number }
+})
+
+const TableHeaderRef = ref()
+
+const headerHeight = ref(57)
+
+const selectChange = (showSelect: any, height: any, datePickerValue?: any) => {
+    headerHeight.value = height
+
+    if (datePickerValue && datePickerValue.timeValue) {
+        // 更新时间参数
+        tableStore.table.params.searchBeginTime = datePickerValue.timeValue[0]
+        tableStore.table.params.searchEndTime = datePickerValue.timeValue[1]
+    }
+}
+
+// 计算是否全屏展示
+const fullscreen = computed(() => {
+    const w = Number(prop.w)
+    const h = Number(prop.h)
+    if (!isNaN(w) && !isNaN(h) && w === 12 && h === 6) {
+        // 执行相应逻辑
+        return true
+    } else {
+        return false
+    }
+})
+
+const config = useConfig()
+
+const echartList = ref({})
+
+const echartList1 = ref({})
+
+const processDataForChart = (rawData: any[]) => {
+    // 将后端返回的扁平数据转换为 ECharts 需要的三维坐标格式 [x, y, z]
+    const chartData = rawData.map(item => [item.x, item.y, item.z])
+
+    return chartData
+}
+
+const tableStore: any = new TableStore({
+    url: '/cs-harmonic-boot/csevent/getEventCoords',
+    method: 'POST',
+    showPage: false,
+    column: [],
+    beforeSearchFun: () => {
+        setTime()
+    },
+    loadCallback: () => {
+        const processedData = processDataForChart(tableStore.table.data.innerList || [])
+        const trendList = tableStore.table.data.trendList || []
+        const xlist = tableStore.table.data.xlist || []
+
+        // 处理趋势图数据
+        const seriesData = trendList.map((item: any) => {
+            // 根据接口返回的name字段确定系列名称和颜色
+            let name = ''
+            let color = ''
+
+            switch (item.name) {
+                case 'Evt_Sys_DipStr':
+                    name = '电压暂降'
+                    color = '#FFBF00'
+                    break
+                case 'Evt_Sys_IntrStr':
+                    name = '电压中断'
+                    color = '#FF9100'
+                    break
+                case 'Evt_Sys_SwlStr':
+                    name = '电压暂升'
+                    color = config.layout.elementUiPrimary[0]
+                    break
+                default:
+                    name = item.name
+                    color = '#000000'
+            }
+
+            return {
+                name: name,
+                type: 'line',
+                showSymbol: false,
+                color: color,
+                data: item.trendList?.map((value: number, index: number) => [xlist[index], value]) || []
+            }
+        })
+
+        // 获取x轴和y轴的标签值
+        const xLabels = [
+            '0-10%',
+            '10%-20%',
+            '20%-30%',
+            '30%-40%',
+            '40%-50%',
+            '50%-60%',
+            '60%-70%',
+            '70%-80%',
+            '80%-90%',
+            '90%-100%'
+        ]
+        const yLabels = ['0-0.01s', '0.01s-0.1s', '0.1s-1s', '1s-10s', '10s']
+
+        echartList.value = {
+            options: {
+                xAxis: null,
+                yAxis: null,
+                dataZoom: null,
+                backgroundColor: '#fff',
+                tooltip: {
+                    textStyle: {
+                        color: '#fff',
+                        fontStyle: 'normal',
+                        opacity: 0.35,
+                        fontSize: 14
+                    },
+                    backgroundColor: 'rgba(0,0,0,0.55)',
+                    borderWidth: 0,
+                    formatter: function (params: any) {
+                        var tips = ''
+                        tips += '持续时间: ' + yLabels[params.value[1]] + '</br>'
+                        tips += '特征幅值: ' + xLabels[params.value[0]] + '</br>'
+                        tips += '事件次数: ' + params.value[2] + '</br>'
+                        return tips
+                    }
+                },
+                title: {
+                    text: '暂态事件概率分布',
+                    x: 'center'
+                },
+                visualMap: {
+                    max: 500,
+                    show: false,
+                    inRange: {
+                        color: ['#313695', '#00BB00', '#ff8000', '#a50026']
+                    }
+                },
+                xAxis3D: {
+                    type: 'category',
+                    name: '特征幅值',
+                    data: xLabels,
+                    nameGap: 40
+                },
+                yAxis3D: {
+                    type: 'category',
+                    name: '持续时间',
+                    data: yLabels,
+                    nameGap: 40,
+
+                    splitLine: {
+                        lineStyle: {
+                            type: 'dashed',
+                            opacity: 0.5
+                        }
+                    }
+                },
+                zAxis3D: {
+                    type: 'value',
+                    minInterval: 10,
+                    name: '暂态事件次数',
+                    nameGap: 30
+                },
+                grid3D: {
+                    viewControl: {
+                        projection: 'perspective',
+                        distance: 260
+                    },
+                    boxWidth: 200,
+                    boxDepth: 80,
+                    light: {
+                        main: {
+                            intensity: 1.2
+                        },
+                        ambient: {
+                            intensity: 0.3
+                        }
+                    }
+                },
+                series: [
+                    {
+                        type: 'bar3D',
+                        data: processedData,
+                        shading: 'realistic',
+                        label: {
+                            show: false,
+                            textStyle: {
+                                fontSize: 16,
+                                borderWidth: 1
+                            }
+                        }
+                    }
+                ]
+            }
+        }
+
+        echartList1.value = {
+            title: {
+                text: '暂态越限时间概率分布'
+            },
+            xAxis: {
+                type: 'category',
+                data: xlist,
+                axisLabel: {
+                    formatter: '{value}'
+                }
+            },
+            yAxis: {
+                name: '次'
+            },
+            grid: {
+                left: '10px',
+                right: '20px'
+            },
+            series: seriesData
+        }
+    }
+})
+
+const tableRef = ref()
+provide('tableRef', tableRef)
+
+provide('tableStore', tableStore)
+
+onMounted(() => {
+    tableStore.index()
+})
+
+const setTime = () => {
+    const time = getTime(
+        (TableHeaderRef.value?.datePickerRef.interval || prop.interval) ?? 0,
+        prop.timeKey,
+        fullscreen.value
+            ? [tableStore.table.params.searchBeginTime, tableStore.table.params.searchEndTime]
+            : prop.timeValue
+    )
+
+    if (Array.isArray(time)) {
+        tableStore.table.params.searchBeginTime = time[0]
+        tableStore.table.params.searchEndTime = time[1]
+        TableHeaderRef.value?.setInterval(time[2] - 0)
+        TableHeaderRef.value?.setTimeInterval([time[0], time[1]])
+    } else {
+        console.warn('获取时间失败，time 不是一个有效数组')
+    }
+}
+
+watch(
+    () => prop.timeKey,
+    val => {
+        tableStore.index()
+    }
+)
+
+watch(
+    () => prop.timeValue,
+    (newVal, oldVal) => {
+        tableStore.index()
+    },
+    {
+        deep: true
+    }
+)
+</script>
+<style lang="scss" scoped></style>

src/components/cockpit/governanceReport/index.vue

@@ -15,7 +15,7 @@
                 </el-form-item>
             </template>
             <template v-slot:operation>
-                <el-button @click="downloadExcel" class="" type="primary" icon="el-icon-Download">导出excel</el-button>
+                <el-button @click="downloadExcel" class="" type="primary" icon="el-icon-Download">导出</el-button>
             </template>
         </TableHeader>
         <div style="display: flex">
@@ -72,7 +72,7 @@ const initListByIds = () => {
 
 const templateListData = () => {
     getTemplateList({}).then(res => {
-        templateList.value = res.data
+        templateList.value = res.data.filter(item => item.name === '稳态治理报表')
         if (!tableStore.table.params.tempId && templateList.value?.length > 0) {
             tableStore.table.params.tempId = templateList.value[0].id
         }
@@ -156,6 +156,8 @@ const setTime = () => {
     if (Array.isArray(time)) {
         tableStore.table.params.searchBeginTime = time[0]
         tableStore.table.params.searchEndTime = time[1]
+        tableStore.table.params.startTime = time[0]
+        tableStore.table.params.endTime = time[1]
         TableHeaderRef.value?.setInterval(time[2] - 0)
         TableHeaderRef.value?.setTimeInterval([time[0], time[1]])
     } else {

src/components/cockpit/indicatorCrossingTime/index.vue

@@ -0,0 +1,463 @@
+<template>
+    <div>
+        <!--指标越限时间分布
+         -->
+        <TableHeader :showReset="false"  :timeKeyList="prop.timeKey" ref="TableHeaderRef" @selectChange="selectChange" datePicker v-if="fullscreen">
+            <template v-slot:select>
+                <el-form-item label="监测点">
+                    <el-select size="small" filterable v-model="tableStore.table.params.lineId">
+                        <el-option
+                            v-for="item in lineList"
+                            :key="item.lineId"
+                            :label="item.name"
+                            :value="item.lineId"
+                        />
+                    </el-select>
+                </el-form-item>
+            </template>
+        </TableHeader>
+        <div v-loading="tableStore.table.loading">
+            <my-echart
+                class="tall"
+                :options="echartList1"
+                :style="{
+                    width: prop.width,
+                      height: `calc(${prop.height} - ${headerHeight}px + ${fullscreen ? 0 : 56}px)`
+                }"
+            />
+            <!-- <my-echart
+                class="mt10"
+                :options="echartList1"
+                :style="{
+                    width: prop.width,
+                    height: `calc(${prop.height} / 2 - ${headerHeight / 2}px + ${fullscreen ? 0 : 28}px )`
+                }"
+            /> -->
+        </div>
+    </div>
+</template>
+<script setup lang="ts">
+import { ref, onMounted, provide, reactive, watch, h } from 'vue'
+import TableStore from '@/utils/tableStore'
+import TableHeader from '@/components/table/header/index.vue'
+import MyEchart from '@/components/echarts/MyEchart.vue'
+import { limitProbabilityData, cslineList } from '@/api/harmonic-boot/cockpit/cockpit'
+import { getTime } from '@/utils/formatTime'
+
+const prop = defineProps({
+    w: { type: [String, Number] },
+    h: { type: [String, Number] },
+    width: { type: [String, Number] },
+    height: { type: [String, Number] },
+   timeKey: { type: Array as () => string[] },
+    timeValue: { type: Object },
+    interval: { type: Number }
+})
+
+// const options = ref(JSON.parse(window.localStorage.getItem('lineIdList') || '[]'))
+
+const lineList = ref()
+
+const headerHeight = ref(57)
+
+const TableHeaderRef = ref()
+
+const selectChange = (showSelect: any, height: any, datePickerValue?: any) => {
+    headerHeight.value = height
+
+    if (datePickerValue && datePickerValue.timeValue) {
+        // 更新时间参数
+        tableStore.table.params.searchBeginTime = datePickerValue.timeValue[0]
+        tableStore.table.params.searchEndTime = datePickerValue.timeValue[1]
+    }
+}
+
+// 计算是否全屏展示
+const fullscreen = computed(() => {
+    const w = Number(prop.w)
+    const h = Number(prop.h)
+    if (!isNaN(w) && !isNaN(h) && w === 12 && h === 6) {
+        // 执行相应逻辑
+        return true
+    } else {
+        return false
+    }
+})
+
+const echartList = ref()
+
+const echartList1 = ref()
+
+const probabilityData = ref()
+
+const initLineList = async () => {
+    cslineList({}).then(res => {
+        lineList.value = res.data
+        tableStore.table.params.lineId = lineList.value[0].lineId
+        tableStore.index()
+    })
+}
+
+// 越限程度概率分布
+const initProbabilityData = () => {
+    // 只有当 lineList 已加载且有数据时才设置默认 lineId
+    if (!tableStore.table.params.lineId && lineList.value && lineList.value.length > 0) {
+        tableStore.table.params.lineId = lineList.value[0].lineId
+    }
+    const params = {
+        searchBeginTime: tableStore.table.params.searchBeginTime || prop.timeValue?.[0],
+        searchEndTime: tableStore.table.params.searchEndTime || prop.timeValue?.[1],
+        lineId: tableStore.table.params.lineId
+    }
+    limitProbabilityData(params).then((res: any) => {
+        probabilityData.value = res.data
+
+        // 处理接口返回的数据，转换为图表所需格式
+        if (res.data && Array.isArray(res.data)) {
+            // 定义指标类型顺序
+            const indicatorOrder = ['闪变', '谐波电压', '谐波电流', '电压偏差', '三相电压不平衡度', '频率偏差']
+            // 按照指定顺序排序数据
+            const sortedData = [...res.data].sort((a, b) => {
+                return indicatorOrder.indexOf(a.indexName) - indicatorOrder.indexOf(b.indexName)
+            })
+
+            // 构造 series 数据
+            const seriesData: any = []
+            let maxValue: any = 0 // 用于存储数据中的最大值
+            // 遍历每个越限程度区间（0-20%, 20-40%, 40-60%, 60-80%, 80-100%）
+            for (let xIndex = 0; xIndex < 5; xIndex++) {
+                // 遍历每个指标类型
+                sortedData.forEach((item, yIndex) => {
+                    // 从 extentGrades 中获取对应区间的值
+                    const extentGrade = item.extentGrades[xIndex]
+                    const value = extentGrade ? (Object.values(extentGrade)[0] as number) : 0
+                    seriesData.push([xIndex, yIndex, value])
+
+                    // 更新最大值
+                    if (value > maxValue) {
+                        maxValue = value
+                    }
+                })
+            }
+
+            // 计算 z 轴最大值（最大值加 5）
+            const zAxisMax = Math.ceil(maxValue) + 5
+            // 构造 yAxis 数据（指标类型名称）
+            const yAxisData = sortedData.map(item => item.indexName)
+
+            echartList.value = {
+                options: {
+                    backgroundColor: '#fff',
+                    tooltip: {
+                        textStyle: {
+                            color: '#fff',
+                            fontStyle: 'normal',
+                            opacity: 0.35,
+                            fontSize: 14
+                        },
+                        backgroundColor: 'rgba(0,0,0,0.55)',
+                        borderWidth: 0,
+                        formatter: function (params: any) {
+                            var yIndex = params.value[1] //获取y轴索引
+                            var tips = ''
+                            tips += '指标类型: ' + yAxisData[yIndex] + '</br>'
+                            tips += '越限程度: ' + params.seriesName + '</br>'
+                            tips += '越限次数: ' + params.value[2] + '</br>'
+                            return tips
+                        }
+                    },
+                    title: {
+                        text: '指标越限概率分布',
+                        x: 'center',
+                        textStyle: {
+                            fontSize: 16,
+                            fontWeight: 'normal'
+                        }
+                    },
+                    // 移除或隐藏 visualMap 组件
+                    visualMap: {
+                        show: false, // 设置为 false 隐藏右侧颜色条
+                        min: 0,
+                        // max: 100,
+                        max: zAxisMax, // 使用计算出的最大值加5
+                        inRange: {
+                            color: ['#313695', '#00BB00', '#ff8000', '#d73027', '#a50026']
+                        }
+                    },
+                    // 添加 legend 配置并设置为不显示
+                    legend: {
+                        show: false // 隐藏图例
+                    },
+                    xAxis3D: {
+                        type: 'category',
+                        name: '越限程度',
+                        nameLocation: 'middle',
+                        nameGap: 50,
+                        data: ['0-20%', '20-40%', '40-60%', '60-80%', '80-100%']
+                    },
+                    yAxis3D: {
+                        type: 'category',
+                        name: '指标类型',
+                        nameLocation: 'middle',
+                        nameGap: 50,
+                        data: yAxisData,
+
+                        splitLine: {
+                            lineStyle: {
+                                type: 'dashed',
+                                opacity: 0.5
+                            }
+                        }
+                    },
+                    zAxis3D: {
+                        type: 'value',
+                        name: '越限次数',
+                        nameLocation: 'middle',
+                        nameGap: 30,
+                        minInterval: 10
+
+                        // max: 100
+                    },
+                    grid3D: {
+                        viewControl: {
+                            projection: 'perspective',
+                            distance: 260,
+                            rotateSensitivity: 10,
+                            zoomSensitivity: 2
+                        },
+                        boxWidth: 150,
+                        boxDepth: 100,
+                        boxHeight: 100,
+                        light: {
+                            main: {
+                                intensity: 1.2
+                            },
+                            ambient: {
+                                intensity: 0.4
+                            }
+                        }
+                    },
+                    series: [
+                        {
+                            type: 'bar3D',
+                            name: '0-20%',
+                            data: seriesData.filter((item: any) => item[0] === 0),
+                            shading: 'realistic',
+                            label: {
+                                show: false
+                            },
+                            itemStyle: {
+                                opacity: 0.9
+                            },
+                            emphasis: {
+                                label: {
+                                    show: true,
+                                    textStyle: {
+                                        fontSize: 14,
+                                        color: '#000'
+                                    }
+                                },
+                                itemStyle: {
+                                    color: '#ff8000'
+                                }
+                            }
+                        },
+                        {
+                            type: 'bar3D',
+                            name: '20-40%',
+                            data: seriesData.filter((item: any) => item[0] === 1),
+                            shading: 'realistic',
+                            label: {
+                                show: false
+                            },
+                            itemStyle: {
+                                opacity: 0.9
+                            },
+                            emphasis: {
+                                label: {
+                                    show: true,
+                                    textStyle: {
+                                        fontSize: 14,
+                                        color: '#000'
+                                    }
+                                },
+                                itemStyle: {
+                                    color: '#ff8000'
+                                }
+                            }
+                        },
+                        {
+                            type: 'bar3D',
+                            name: '40-60%',
+                            data: seriesData.filter((item: any) => item[0] === 2),
+                            shading: 'realistic',
+                            label: {
+                                show: false
+                            },
+                            itemStyle: {
+                                opacity: 0.9
+                            },
+                            emphasis: {
+                                label: {
+                                    show: true,
+                                    textStyle: {
+                                        fontSize: 14,
+                                        color: '#000'
+                                    }
+                                },
+                                itemStyle: {
+                                    color: '#ff8000'
+                                }
+                            }
+                        },
+                        {
+                            type: 'bar3D',
+                            name: '60-80%',
+                            data: seriesData.filter((item: any) => item[0] === 3),
+                            shading: 'realistic',
+                            label: {
+                                show: false
+                            },
+                            itemStyle: {
+                                opacity: 0.9
+                            },
+                            emphasis: {
+                                label: {
+                                    show: true,
+                                    textStyle: {
+                                        fontSize: 14,
+                                        color: '#000'
+                                    }
+                                },
+                                itemStyle: {
+                                    color: '#ff8000'
+                                }
+                            }
+                        },
+                        {
+                            type: 'bar3D',
+                            name: '80-100%',
+                            data: seriesData.filter((item: any) => item[0] === 4),
+                            shading: 'realistic',
+                            label: {
+                                show: false
+                            },
+                            itemStyle: {
+                                opacity: 0.9
+                            },
+                            emphasis: {
+                                label: {
+                                    show: true,
+                                    textStyle: {
+                                        fontSize: 14,
+                                        color: '#000'
+                                    }
+                                },
+                                itemStyle: {
+                                    color: '#ff8000'
+                                }
+                            }
+                        }
+                    ]
+                }
+            }
+        }
+    })
+}
+
+const tableStore: any = new TableStore({
+    url: '/cs-harmonic-boot/limitRateDetailD/limitTimeProbabilityData',
+    method: 'POST',
+    showPage: false,
+    column: [],
+    beforeSearchFun: () => {
+        setTime()
+        // 只有当 lineList 已加载且有数据时才设置默认 lineId
+        if (!tableStore.table.params.lineId && lineList.value && lineList.value.length > 0) {
+            tableStore.table.params.lineId = lineList.value[0].lineId
+        }
+    },
+    loadCallback: () => {
+        // 处理返回的数据，将其转换为图表所需格式
+        const indexNames: any = [...new Set(tableStore.table.data.map((item: any) => item.indexName))]
+        const timePeriods = [...new Set(tableStore.table.data.map((item: any) => item.timePeriod))]
+
+        // 构建系列数据
+        const seriesData = indexNames.map((indexName: string) => {
+            const dataIndex = tableStore.table.data.filter((item: any) => item.indexName === indexName)
+            return {
+                name: indexName,
+                type: 'line',
+                symbol: 'none',
+                data: dataIndex.map((item: any) => [item.timePeriod, item.times])
+            }
+        })
+
+        echartList1.value = {
+            title: {
+                text: '指标越限时间概率分布'
+            },
+            tooltip: {
+                trigger: 'axis'
+            },
+            legend: {
+                data: indexNames
+            },
+            xAxis: {
+                type: 'category',
+                name: '时间段',
+                data: timePeriods
+            },
+            yAxis: {
+                type: 'value'
+                // name: '次数'
+            },
+            series: seriesData
+        }
+        initProbabilityData()
+    }
+})
+
+provide('tableStore', tableStore)
+
+onMounted(() => {
+    initLineList()
+})
+
+const setTime = () => {
+    const time = getTime(
+        (TableHeaderRef.value?.datePickerRef.interval || prop.interval) ?? 0,
+        prop.timeKey,
+        fullscreen.value
+            ? [tableStore.table.params.searchBeginTime, tableStore.table.params.searchEndTime]
+            : prop.timeValue
+    )
+
+    if (Array.isArray(time)) {
+        tableStore.table.params.searchBeginTime = time[0]
+        tableStore.table.params.searchEndTime = time[1]
+        TableHeaderRef.value?.setInterval(time[2] - 0)
+        TableHeaderRef.value?.setTimeInterval([time[0], time[1]])
+    } else {
+        console.warn('获取时间失败，time 不是一个有效数组')
+    }
+}
+watch(
+    () => prop.timeKey,
+    val => {
+        tableStore.index()
+    }
+)
+watch(
+    () => prop.timeValue,
+    (newVal, oldVal) => {
+        tableStore.index()
+    },
+    {
+        deep: true
+    }
+)
+
+const addMenu = () => {}
+</script>
+<style lang="scss" scoped></style>

src/components/cockpit/indicatorDistribution/index.vue

@@ -21,17 +21,17 @@
                 :options="echartList"
                 :style="{
                     width: prop.width,
-                    height: `calc(${prop.height} / 2 - ${headerHeight / 2}px + ${fullscreen ? 0 : 28}px )`
+                      height: `calc(${prop.height} - ${headerHeight}px + ${fullscreen ? 0 : 56}px)`
                 }"
             />
-            <my-echart
+            <!-- <my-echart
                 class="mt10"
                 :options="echartList1"
                 :style="{
                     width: prop.width,
                     height: `calc(${prop.height} / 2 - ${headerHeight / 2}px + ${fullscreen ? 0 : 28}px )`
                 }"
-            />
+            /> -->
         </div>
     </div>
 </template>
@@ -220,7 +220,7 @@ const initProbabilityData = () => {
                     grid3D: {
                         viewControl: {
                             projection: 'perspective',
-                            distance: 250,
+                            distance: 260,
                             rotateSensitivity: 10,
                             zoomSensitivity: 2
                         },
@@ -394,7 +394,7 @@ const tableStore: any = new TableStore({
 
         echartList1.value = {
             title: {
-                text: '越限时间概率分布'
+                text: '指标越限时间概率分布'
             },
             tooltip: {
                 trigger: 'axis'

src/components/cockpit/sensitiveLoad/index.vue

@@ -39,7 +39,7 @@ const headerHeight = ref(57)
 const TableHeaderRef = ref()
 
 const dictData = useDictData()
-const sensitiveUserType = dictData.getBasicData('Sensitive_User_Type')
+const sensitiveUserType = dictData.getBasicData('Interference_Source')
 
 const selectChange = (showSelect: any, height: any, datePickerValue?: any) => {
     headerHeight.value = height

src/components/cockpit/transientDistribution/index.vue

@@ -1,23 +1,30 @@
 <template>
     <div>
         <!--暂态事件概率分布 -->
-        <TableHeader ref="TableHeaderRef"  :timeKeyList="prop.timeKey" :showReset="false" @selectChange="selectChange" datePicker v-if="fullscreen"></TableHeader>
+        <TableHeader
+            ref="TableHeaderRef"
+            :timeKeyList="prop.timeKey"
+            :showReset="false"
+            @selectChange="selectChange"
+            datePicker
+            v-if="fullscreen"
+        ></TableHeader>
         <my-echart
             class="tall"
             :options="echartList"
             :style="{
                 width: prop.width,
-                height: `calc(${prop.height} / 2 - ${headerHeight / 2}px + ${fullscreen ? 0 : 28}px )`
+                height: `calc(${prop.height} - ${headerHeight}px + ${fullscreen ? 0 : 56}px)`
             }"
         />
-        <my-echart
+        <!-- <my-echart
             class="mt10"
             :options="echartList1"
             :style="{
                 width: prop.width,
                 height: `calc(${prop.height} / 2  - ${headerHeight / 2}px + ${fullscreen ? 0 : 28}px )`
             }"
-        />
+        /> -->
     </div>
 </template>
 <script setup lang="ts">
@@ -33,7 +40,7 @@ const prop = defineProps({
     h: { type: [String, Number] },
     width: { type: [String, Number] },
     height: { type: [String, Number] },
-   timeKey: { type: Array as () => string[] },
+    timeKey: { type: Array as () => string[] },
     timeValue: { type: Object },
     interval: { type: Number }
 })
@@ -70,7 +77,6 @@ const echartList = ref({})
 
 const echartList1 = ref({})
 
-
 const processDataForChart = (rawData: any[]) => {
     // 将后端返回的扁平数据转换为 ECharts 需要的三维坐标格式 [x, y, z]
     const chartData = rawData.map(item => [item.x, item.y, item.z])
@@ -84,7 +90,7 @@ const tableStore: any = new TableStore({
     showPage: false,
     column: [],
     beforeSearchFun: () => {
-       setTime()
+        setTime()
     },
     loadCallback: () => {
         const processedData = processDataForChart(tableStore.table.data.innerList || [])
@@ -177,15 +183,14 @@ const tableStore: any = new TableStore({
                     type: 'category',
                     name: '特征幅值',
                     data: xLabels,
-                      nameGap: 40,
-                   
+                    nameGap: 40
                 },
                 yAxis3D: {
                     type: 'category',
                     name: '持续时间',
                     data: yLabels,
-                     nameGap: 40,
-                  
+                    nameGap: 40,
+
                     splitLine: {
                         lineStyle: {
                             type: 'dashed',
@@ -197,24 +202,26 @@ const tableStore: any = new TableStore({
                     type: 'value',
                     minInterval: 10,
                     name: '暂态事件次数',
-                       nameGap: 30,
+                    nameGap: 30
                 },
                 grid3D: {
                     viewControl: {
-                        projection: 'perspective',
-                        distance: 250
-                    },
-                     
-                    boxWidth: 200,
-                    boxDepth: 80,
-                    light: {
-                        main: {
-                            intensity: 1.2
+                            projection: 'perspective',
+                            distance: 260,
+                            rotateSensitivity: 10,
+                            zoomSensitivity: 2
                         },
-                        ambient: {
-                            intensity: 0.3
+                        boxWidth: 150,
+                        boxDepth: 100,
+                        boxHeight: 100,
+                        light: {
+                            main: {
+                                intensity: 1.2
+                            },
+                            ambient: {
+                                intensity: 0.4
+                            }
                         }
-                    }
                 },
                 series: [
                     {
@@ -227,9 +234,7 @@ const tableStore: any = new TableStore({
                                 fontSize: 16,
                                 borderWidth: 1
                             }
-                        },
-                      
-                        
+                        }
                     }
                 ]
             }
@@ -296,7 +301,7 @@ watch(
 watch(
     () => prop.timeValue,
     (newVal, oldVal) => {
-         tableStore.index()
+        tableStore.index()
     },
     {
         deep: true

src/components/echarts/rmsWorker.js

@@ -252,50 +252,56 @@ self.onmessage = function (e) {
         let titles = ''
         if (boxoList.systemType == 'pms') {
             titles =
-                '变电站名称：' +
+                '变电站名称:' +
                 boxoList.powerStationName +
-                ' 监测点名称：' +
+                '　监测点名称:' +
                 boxoList.measurementPointName +
-                ' 发生时刻：' +
+                '　发生时刻:' +
                 boxoList.startTime +
-                ' 暂降(骤升)幅值：' +
+                '　暂降(骤升)幅值:' +
                 (boxoList.featureAmplitude * 100).toFixed(2) +
-                '% 持续时间：' +
+                '% 　持续时间:' +
                 boxoList.duration +
                 's'
         } else if (boxoList.systemType == 'ZL') {
             titles =
-                ' 监测点名称：' +
+                (boxoList.engineeringName == undefined ? '' : ' 项目名称:' + boxoList.engineeringName) +
+                '　项目名称:' +
+                boxoList.engineeringName +
+                '　监测点名称:' +
                 boxoList.equipmentName +
-                ' 发生时刻：' +
+                '　发生时刻:' +
                 boxoList.startTime +
-                ' 暂降(骤升)幅值：' +
+                '　暂降(骤升)幅值:' +
                 boxoList.evtParamVVaDepth +
-                ' 持续时间：' +
+                '%　持续时间:' +
                 boxoList.evtParamTm +
                 's'
         } else if (boxoList.systemType == 'YPT') {
             titles =
-                ' 监测点名称：' +
+                (boxoList.engineeringName == undefined ? '' : ' 项目名称:' + boxoList.engineeringName) +
+                '　项目名称:' +
+                boxoList.engineeringName +
+                '　监测点名称:' +
                 boxoList.lineName +
-                ' 发生时刻：' +
+                '　发生时刻:' +
                 boxoList.startTime +
-                ' 暂降(骤升)幅值：' +
+                '　暂降(骤升)幅值:' +
                 (boxoList.featureAmplitude * 100).toFixed(2) +
-                '% 持续时间：' +
+                '%　持续时间:' +
                 boxoList.persistTime +
                 's'
         } else {
             titles =
-                '变电站名称：' +
+                '变电站名称:' +
                 boxoList.subName +
-                ' 监测点名称：' +
+                ' 监测点名称:' +
                 boxoList.lineName +
-                ' 发生时刻：' +
+                ' 发生时刻:' +
                 boxoList.startTime +
-                ' 暂降(骤升)幅值：' +
+                ' 暂降(骤升)幅值:' +
                 (boxoList.featureAmplitude * 100).toFixed(2) +
-                '% 持续时间：' +
+                '% 持续时间:' +
                 boxoList.duration +
                 's'
         }

src/components/echarts/shuWorker.js

@@ -125,50 +125,52 @@ self.addEventListener('message', function (e) {
     let titles = ''
     if (boxoList.systemType == 'pms') {
         titles =
-            '变电站名称：' +
+            '变电站名称:' +
             boxoList.powerStationName +
-            ' 监测点名称：' +
+            ' 监测点名称:' +
             boxoList.measurementPointName +
-            ' 发生时刻：' +
+            ' 发生时刻:' +
             boxoList.startTime +
-            ' 暂降(骤升)幅值：' +
+            ' 暂降(骤升)幅值:' +
             (boxoList.featureAmplitude * 100).toFixed(2) +
-            '% 持续时间：' +
+            '% 持续时间:' +
             boxoList.duration +
             's'
     } else if (boxoList.systemType == 'ZL') {
         titles =
-            ' 监测点名称：' +
+            (boxoList.engineeringName == undefined ? '' : ' 项目名称:' + boxoList.engineeringName) +
+            '　监测点名称:' +
             boxoList.equipmentName +
-            ' 发生时刻：' +
+            ' 发生时刻:' +
             boxoList.startTime +
-            ' 暂降(骤升)幅值：' +
+            ' 暂降(骤升)幅值:' +
             boxoList.evtParamVVaDepth +
-            ' 持续时间：' +
+            '% 持续时间:' +
             boxoList.evtParamTm +
             's'
     } else if (boxoList.systemType == 'YPT') {
         titles =
-            ' 监测点名称：' +
+            (boxoList.engineeringName == undefined ? '' : ' 项目名称:' + boxoList.engineeringName) +
+            '　监测点名称:' +
             boxoList.lineName +
-            ' 发生时刻：' +
+            '　发生时刻:' +
             boxoList.startTime +
-            ' 暂降(骤升)幅值：' +
+            '　暂降(骤升)幅值:' +
             (boxoList.featureAmplitude * 100).toFixed(2) +
-            '% 持续时间：' +
+            '%　持续时间:' +
             boxoList.persistTime +
             's'
     } else {
         titles =
-            '变电站名称：' +
+            '变电站名称:' +
             boxoList.subName +
-            ' 监测点名称：' +
+            '　监测点名称:' +
             boxoList.lineName +
-            ' 发生时刻：' +
+            '　发生时刻:' +
             boxoList.startTime +
-            ' 暂降(骤升)幅值：' +
+            '　暂降(骤升)幅值:' +
             (boxoList.featureAmplitude * 100).toFixed(2) +
-            '% 持续时间：' +
+            '%　持续时间:' +
             boxoList.duration +
             's'
     }

src/components/tree/allocation.vue

@@ -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>

src/components/tree/cloudDevice.vue

@@ -14,7 +14,7 @@
                     :class="menuCollapse ? 'unfold' : ''" size='18' class='fold ml10 menu-collapse'
                     style='cursor: pointer' v-if='props.canExpand' /> -->
             </div>
-            <el-tree :style="{ height:  'calc(100vh - 110px)' }"
+            <el-tree :style="{ height:  'calc(100vh - 230px)' }"
             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 }'>
@@ -32,7 +32,6 @@
 <script lang='ts' setup>
 import useCurrentInstance from '@/utils/useCurrentInstance'
 import { ElTree } from 'element-plus'
-import { emit } from 'process';
 import { ref, watch } from 'vue'
 
 defineOptions({

src/components/tree/device.vue

@@ -1,27 +1,48 @@
 <!-- 设备管理使用折叠面板渲染多个tree -->
 <template>
     <div :style="{ width: menuCollapse ? '40px' : props.width }" style="display: flex; overflow: hidden">
-        <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" />
+        <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-form-item> -->
-                <el-input maxlength="32" show-word-limit v-model.trim="filterText" autocomplete="off"
-                    placeholder="请输入内容" clearable>
+                <el-input
+                    maxlength="32"
+                    show-word-limit
+                    v-model.trim="filterText"
+                    autocomplete="off"
+                    placeholder="请输入内容"
+                    clearable
+                >
                     <template #prefix>
                         <Icon name="el-icon-Search" style="font-size: 16px" />
                     </template>
                 </el-input>
                 <!-- </el-form-item> -->
-                <Icon @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" />
+                <Icon
+                    @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"
+                />
             </div>
 
-            <el-collapse :accordion="true" v-model.trim="activeName" style="flex: 1; height: 100%"
-                @change="changeDevice">
-
+            <el-collapse
+                :accordion="true"
+                v-model.trim="activeName"
+                style="flex: 1; height: 100%"
+                @change="changeDevice"
+            >
                 <el-collapse-item title="治理设备" name="0" v-if="zlDeviceData.length != 0">
                     <el-select v-model.trim="process" clearable placeholder="请选择状态" class="mb10">
                         <el-option label="功能调试" value="2"></el-option>
@@ -29,13 +50,30 @@
                         <el-option label="正式投运" value="4"></el-option>
                     </el-select>
                     <el-tree
-                        :style="{ height: bxsDeviceData.length != 0 ? 'calc(100vh - 340px)' : 'calc(100vh - 278px)' }"
-                        ref="treeRef1" :props="defaultProps" highlight-current :filter-node-method="filterNode"
-                        node-key="id" :default-expand-all="false" v-bind="$attrs" :data="zlDevList" style="overflow: auto">
+                        :style="{
+                            height:
+                                bxsDeviceData.length != 0
+                                    ? `calc(100vh - 380px - ${props.height}px)`
+                                    : 'calc(100vh - 278px)'
+                        }"
+                        ref="treeRef1"
+                        :props="defaultProps"
+                        highlight-current
+                        :filter-node-method="filterNode"
+                        node-key="id"
+                        :default-expand-all="false"
+                        v-bind="$attrs"
+                        :data="zlDevList"
+                        style="overflow: auto"
+                    >
                         <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" />
+                                <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>
@@ -43,14 +81,30 @@
                 </el-collapse-item>
                 <el-collapse-item title="便携式设备" name="1" v-if="bxsDeviceData.length != 0">
                     <el-tree
-                        :style="{ height: zlDeviceData.length != 0 ? 'calc(100vh - 280px)' : 'calc(100vh - 238px)' }"
-                        ref="treeRef2" :props="defaultProps" highlight-current :default-expand-all="false"
-                        :filter-node-method="filterNode" node-key="id" :data="bxsDeviceData" v-bind="$attrs"
-                        style="overflow: auto">
+                        :style="{
+                            height:
+                                zlDeviceData.length != 0
+                                    ? `calc(100vh - 340px - ${props.height}px)`
+                                    : 'calc(100vh - 238px)'
+                        }"
+                        ref="treeRef2"
+                        :props="defaultProps"
+                        highlight-current
+                        :default-expand-all="false"
+                        :filter-node-method="filterNode"
+                        node-key="id"
+                        :data="bxsDeviceData"
+                        v-bind="$attrs"
+                        style="overflow: auto"
+                    >
                         <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" />
+                                <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>
@@ -58,14 +112,30 @@
                 </el-collapse-item>
                 <el-collapse-item title="在线设备" name="2" v-if="frontDeviceData.length != 0">
                     <el-tree
-                        :style="{ height: zlDeviceData.length != 0 ? 'calc(100vh - 280px)' : 'calc(100vh - 238px)' }"
-                        ref="treeRef3" :props="defaultProps" highlight-current :default-expand-all="false"
-                        :filter-node-method="filterNode" node-key="id" :data="frontDeviceData" v-bind="$attrs"
-                        style="overflow: auto">
+                        :style="{
+                            height:
+                                zlDeviceData.length != 0
+                                    ? `calc(100vh - 340px - ${props.height}px)`
+                                    : 'calc(100vh - 238px)'
+                        }"
+                        ref="treeRef3"
+                        :props="defaultProps"
+                        highlight-current
+                        :default-expand-all="false"
+                        :filter-node-method="filterNode"
+                        node-key="id"
+                        :data="frontDeviceData"
+                        v-bind="$attrs"
+                        style="overflow: auto"
+                    >
                         <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" />
+                                <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>
@@ -90,13 +160,15 @@ interface Props {
     canExpand?: boolean
     type?: string
     data?: any
+    height?: number
 }
 
 const props = withDefaults(defineProps<Props>(), {
     width: '280px',
     canExpand: true,
     type: '',
-    data: []
+    data: [],
+    height: 0
 })
 const { proxy } = useCurrentInstance()
 const menuCollapse = ref(false)
@@ -124,19 +196,18 @@ watch(
                     item.children.map((vv: any) => {
                         zlDeviceData.value.push(vv)
                     })
-                    zlDevList.value = JSON.parse(JSON.stringify(zlDeviceData.value))    
+                    zlDevList.value = JSON.parse(JSON.stringify(zlDeviceData.value))
                 } else if (item.name == '便携式设备') {
                     bxsDeviceData.value = []
                     item.children.map((vv: any) => {
                         bxsDeviceData.value.push(vv)
                     })
-                }else if (item.name == '在线设备') {
+                } else if (item.name == '在线设备') {
                     frontDeviceData.value = []
 
                     item.children.map((vv: any) => {
                         frontDeviceData.value.push(vv)
                     })
-
                 }
             })
         }
@@ -157,8 +228,9 @@ watch(filterText, val => {
     }
 })
 watch(process, val => {
-    if (val == '') {
+    if (val == '' || val == undefined) {
         zlDevList.value = JSON.parse(JSON.stringify(zlDeviceData.value))
+        console.log('🚀 ~ zlDevList.value:', zlDeviceData.value)
     } else {
         zlDevList.value = filterProcess(JSON.parse(JSON.stringify(zlDeviceData.value)))
     }
@@ -176,7 +248,7 @@ function filterProcess(nodes: any) {
             const children = node.children ? filterProcess(node.children) : []
 
             // 如果当前节点的process=4，或者有子节点满足条件，则保留当前节点
-            if (  node.process == process.value || children.length > 0) {
+            if (node.process == process.value || children.length > 0) {
                 return {
                     ...node,
                     children: children
@@ -283,7 +355,7 @@ const treeRef1 = ref<InstanceType<typeof ElTree>>()
 const treeRef2 = ref<InstanceType<typeof ElTree>>()
 //前置
 const treeRef3 = ref<InstanceType<typeof ElTree>>()
-defineExpose({ treeRef1, treeRef2 })
+defineExpose({ treeRef1, treeRef2, treeRef3 })
 onMounted(() => {
     setTimeout(() => {
         if (zlDeviceData.value.length != 0) {
@@ -293,6 +365,9 @@ onMounted(() => {
         if (zlDeviceData.value.length === 0 && bxsDeviceData.value.length != 0) {
             activeName.value = '1'
         }
+        if (zlDeviceData.value.length === 0 && bxsDeviceData.value.length === 0) {
+            activeName.value = '2'
+        }
         if (!zlDeviceData.value && !bxsDeviceData.value) {
             activeName.value = ''
         }

src/components/tree/govern/cloudDeviceEntryTree.vue

@@ -158,7 +158,7 @@ const onAdd = () => {
     emit('onAdd')
 }
 if (props.template) {
-    getTemplateByDept({ id: dictData.state.area[0].id })
+    getTemplateByDept({ id: dictData.state.area[0]?.id })
         .then((res: any) => {
             emit('Policy', res.data)
             info()

src/components/tree/govern/cloudDeviceEntryTreeZL.vue

@@ -0,0 +1,106 @@
+<template>
+    <Tree
+        ref="treRef"
+        :width="width"
+        :showPush="props.showPush"
+        :data="tree"
+        default-expand-all
+        @changePointType="changePointType"
+        @onAdd="onAdd"
+    />
+</template>
+
+<script lang="ts" setup>
+import { ref, nextTick, onMounted, defineProps } from 'vue'
+import Tree from '../index.vue'
+import { getLineTree, objTree } from '@/api/cs-device-boot/csLedger'
+import { useConfig } from '@/stores/config'
+import { getTemplateByDept } from '@/api/harmonic-boot/luckyexcel'
+import { useDictData } from '@/stores/dictData'
+
+interface Props {
+    template?: boolean
+    showPush?: boolean
+}
+const props = withDefaults(defineProps<Props>(), {
+    template: false,
+    showPush: false
+})
+defineOptions({
+    name: 'govern/deviceTree'
+})
+
+const emit = defineEmits(['init', 'checkChange', 'pointTypeChange', 'Policy', 'onAdd'])
+const config = useConfig()
+const tree = ref()
+const dictData = useDictData()
+const treRef = ref()
+const width = ref('')
+
+const info = (selectedNodeId?: string) => {
+    tree.value = []
+    let arr1: any[] = []
+    objTree().then(res => {
+        try {
+            res.data.map((item: any) => {
+                item.icon = 'el-icon-HomeFilled'
+                item.level = 1
+                item.color = config.getColorVal('elementUiPrimary')
+                item.children.forEach((item: any) => {
+                    item.icon = 'el-icon-List'
+                    item.level = 2
+                    item.color = config.getColorVal('elementUiPrimary')
+                    item.children.forEach((item2: any) => {
+                        arr1.push(item2)
+                        item2.icon = 'el-icon-Platform'
+                        item2.level = 3
+                        item2.color = config.getColorVal('elementUiPrimary')
+                    })
+                })
+            })
+            tree.value = res.data
+            nextTick(() => {
+                if (arr1.length) {
+                    //初始化选中
+                    treRef.value.treeRef.setCurrentKey(arr1[0].id)
+                    // 注册父组件事件
+                    emit('init', arr1[0])
+                    return
+                } else {
+                    emit('init')
+                    return
+                }
+            })
+        } catch (error) {
+            console.error('Error in processing getCldTree response:', error)
+        }
+    })
+}
+
+const changePointType = (val: any, obj: any) => {
+    emit('pointTypeChange', val, obj)
+}
+
+const onAdd = () => {
+    emit('onAdd')
+}
+if (props.template) {
+    getTemplateByDept({ id: dictData.state.area[0]?.id })
+        .then((res: any) => {
+            emit('Policy', res.data)
+            info()
+        })
+        .catch(err => {
+            info()
+        })
+} else {
+    info()
+}
+
+// 暴露 info 方法给父组件调用
+defineExpose({
+    info
+})
+
+onMounted(() => {})
+</script>

src/components/tree/govern/deviceTree.vue

@@ -5,6 +5,7 @@
         :default-checked-keys="defaultCheckedKeys"
         :show-checkbox="props.showCheckbox"
         :data="tree"
+        :height="props.height"
         @changeDeviceType="changeDeviceType"
     />
 </template>
@@ -21,10 +22,12 @@ const props = withDefaults(
     defineProps<{
         showCheckbox?: boolean
         defaultCheckedKeys?: any
+        height?: number
     }>(),
     {
         showCheckbox: false,
-        defaultCheckedKeys: []
+        defaultCheckedKeys: [],
+        height:0
     }
 )
 const emit = defineEmits(['init', 'checkChange', 'deviceTypeChange'])
@@ -124,6 +127,8 @@ getDeviceTree().then(res => {
                 })
                 return
             } else if (arr3.length > 0) {
+                console.log('🚀 ~ arr3:', arr3)
+
                 treRef.value.treeRef3.setCurrentKey(arr3[0].id)
                 // 注册父组件事件
                 emit('init', {

src/components/tree/govern/pointTree.vue

@@ -102,7 +102,7 @@ const info = () => {
             setTimeout(() => {
                 if (arr1.length > 0) {
                     //初始化选中
-                    treRef.value.treeRef1.setCurrentKey(arr1[0].id)
+                    treRef.value?.treeRef1.setCurrentKey(arr1[0].id)
                     // 注册父组件事件
                     emit('init', {
                         level: 2,
@@ -111,7 +111,7 @@ const info = () => {
                     return
                 } else if (arr2.length > 0) {
                     //初始化选中
-                    treRef.value.treeRef2.setCurrentKey(arr2[0].id)
+                    treRef.value?.treeRef2.setCurrentKey(arr2[0].id)
                     // 注册父组件事件
                     emit('init', {
                         level: 2,
@@ -119,7 +119,8 @@ const info = () => {
                     })
                     return
                 } else if (arr3.length > 0) {
-                    treRef.value.treeRef3.setCurrentKey(arr3[0].id)
+
+                    treRef.value?.treeRef3?.setCurrentKey(arr3[0].id)
                     emit('init', {
                         level: 2,
                         ...arr3[0]
@@ -137,7 +138,7 @@ const changePointType = (val: any, obj: any) => {
     emit('pointTypeChange', val, obj)
 }
 if (props.template) {
-    getTemplateByDept({ id: dictData.state.area[0].id })
+    getTemplateByDept({ id: dictData.state.area[0]?.id })
         .then((res: any) => {
             emit('Policy', res.data)
             info()

src/components/tree/govern/pointTreeWx.vue

@@ -157,7 +157,7 @@ const clickNode = (e: anyObj) => {
 }
 
 if (props.template) {
-    getTemplateByDept({ id: dictData.state.area[0].id })
+    getTemplateByDept({ id: dictData.state.area[0]?.id })
         .then((res: any) => {
             emit('Policy', res.data)
             getTreeList()

src/components/tree/govern/selectTree.vue

@@ -87,7 +87,7 @@ const handleCheckedNodesChange = (nodes: any[]) => {
 
 
 if (props.template) {
-    getTemplateByDept({ id: dictData.state.area[0].id })
+    getTemplateByDept({ id: dictData.state.area[0]?.id })
         .then((res: any) => {
             emit('Policy', res.data)
             info()

src/components/tree/index.vue

@@ -28,7 +28,7 @@
                     style='cursor: pointer' v-if='props.canExpand' /> -->
             </div>
 
-            <el-tree :style="{ height:  'calc(100vh - 200px)' }"
+            <el-tree :style="{ height:  'calc(100vh - 190px)' }"
             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 }'>

src/components/tree/point.vue

@@ -1,9 +1,16 @@
 <!-- 设备监控使用折叠面板渲染多个tree -->
 <template>
     <div :style="{ width: menuCollapse ? '40px' : props.width }" style="display: flex; overflow: hidden">
-        <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"
-            v-if="route.path != '/admin/govern/reportCore/statistics/index'" />
+        <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"
+            v-if="route.path != '/admin/govern/reportCore/statistics/index'"
+        />
         <div class="cn-tree" :style="{ opacity: menuCollapse ? 0 : 1, display: menuCollapse ? 'none' : '' }">
             <div style="display: flex; align-items: center" class="mb10">
                 <el-input maxlength="32" show-word-limit v-model.trim="filterText" placeholder="请输入内容" clearable>
@@ -11,13 +18,23 @@
                         <Icon name="el-icon-Search" style="font-size: 16px" />
                     </template>
                 </el-input>
-                <Icon @click="onMenuCollapse" :name="menuCollapse ? 'el-icon-Expand' : 'el-icon-Fold'"
-                    :class="menuCollapse ? 'unfold' : ''" size="18" class="fold ml10 menu-collapse"
+                <Icon
+                    @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 && route.path != '/admin/govern/reportCore/statistics/index'" />
+                    v-if="props.canExpand && route.path != '/admin/govern/reportCore/statistics/index'"
+                />
             </div>
-            <el-collapse :accordion="true" v-model.trim="activeName" style="flex: 1; height: 100%"
-                @change="changeDevice">
+
+            <el-collapse
+                :accordion="true"
+                v-model.trim="activeName"
+                style="flex: 1; height: 100%"
+                @change="changeDevice"
+            >
                 <el-collapse-item title="治理设备" name="0" v-if="zlDeviceData.length != 0">
                     <el-select v-model.trim="process" clearable placeholder="请选择状态" class="mb10">
                         <el-option label="功能调试" value="2"></el-option>
@@ -26,14 +43,25 @@
                     </el-select>
 
                     <el-tree
-                        :style="{ height: bxsDeviceData.length != 0 ? 'calc(100vh - 340px)' : 'calc(100vh - 278px)' }"
-                        ref="treeRef1" :props="defaultProps" highlight-current :filter-node-method="filterNode"
-                        node-key="id"  v-bind="$attrs" :data="zlDevList" style="overflow: auto"
-                        :default-expand-all="false">
+                        :style="{ height: bxsDeviceData.length != 0 ? 'calc(100vh - 380px)' : 'calc(100vh - 278px)' }"
+                        ref="treeRef1"
+                        :props="defaultProps"
+                        highlight-current
+                        :filter-node-method="filterNode"
+                        node-key="id"
+                        v-bind="$attrs"
+                        :data="zlDevList"
+                        style="overflow: auto"
+                        :default-expand-all="false"
+                    >
                         <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" />
+                                <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>
@@ -41,14 +69,25 @@
                 </el-collapse-item>
                 <el-collapse-item title="便携式设备" name="1" v-if="bxsDeviceData.length != 0">
                     <el-tree
-                        :style="{ height: zlDeviceData.length != 0 ? 'calc(100vh - 330px)' : 'calc(100vh - 238px)' }"
-                        ref="treeRef2" :props="defaultProps" highlight-current :default-expand-all="false"
-                        :filter-node-method="filterNode" node-key="id" :data="bxsDeviceData" v-bind="$attrs"
-                        style="overflow: auto" >
+                        :style="{ height: zlDeviceData.length != 0 ? 'calc(100vh - 340px)' : 'calc(100vh - 238px)' }"
+                        ref="treeRef2"
+                        :props="defaultProps"
+                        highlight-current
+                        :default-expand-all="false"
+                        :filter-node-method="filterNode"
+                        node-key="id"
+                        :data="bxsDeviceData"
+                        v-bind="$attrs"
+                        style="overflow: auto"
+                    >
                         <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" />
+                                <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>
@@ -56,14 +95,25 @@
                 </el-collapse-item>
                 <el-collapse-item title="在线设备" name="2" v-if="yqfDeviceData.length != 0">
                     <el-tree
-                        :style="{ height: zlDeviceData.length != 0 ? 'calc(100vh - 330px)' : 'calc(100vh - 238px)' }"
-                        ref="treeRef3" :props="defaultProps" highlight-current :default-expand-all="false"
-                        :filter-node-method="filterNode" node-key="id" :data="yqfDeviceData" v-bind="$attrs"
-                        style="overflow: auto">
+                        :style="{ height: zlDeviceData.length != 0 ? 'calc(100vh - 340px)' : 'calc(100vh - 238px)' }"
+                        ref="treeRef3"
+                        :props="defaultProps"
+                        highlight-current
+                        :default-expand-all="false"
+                        :filter-node-method="filterNode"
+                        node-key="id"
+                        :data="yqfDeviceData"
+                        v-bind="$attrs"
+                        style="overflow: auto"
+                    >
                         <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" />
+                                <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>
@@ -118,27 +168,25 @@ watch(
     () => props.data,
     (val, oldVal) => {
         if (val && val.length != 0) {
-            
             val.map((item: any) => {
                 if (item.name == '治理设备') {
                     zlDeviceData.value = []
                     item.children.map((vv: any) => {
                         zlDeviceData.value.push(vv)
                     })
-                zlDevList.value = JSON.parse(JSON.stringify(zlDeviceData.value))    
+                    zlDevList.value = JSON.parse(JSON.stringify(zlDeviceData.value))
                 } else if (item.name == '便携式设备') {
                     bxsDeviceData.value = []
                     item.children.map((vv: any) => {
                         bxsDeviceData.value.push(vv)
                     })
-                }else if (item.name == '在线设备') {
+                } else if (item.name == '在线设备') {
                     yqfDeviceData.value = []
                     item.children.map((vv: any) => {
                         yqfDeviceData.value.push(vv)
                     })
                 }
             })
-
         }
     },
     {
@@ -157,12 +205,10 @@ watch(filterText, val => {
     }
 })
 watch(process, val => {
-    
-    if (val == '') {
+        if (val == '' || val == undefined) {
         zlDevList.value = JSON.parse(JSON.stringify(zlDeviceData.value))
     } else {
         zlDevList.value = filterProcess(JSON.parse(JSON.stringify(zlDeviceData.value)))
-      
     }
 
     setTimeout(() => {
@@ -170,9 +216,8 @@ watch(process, val => {
     }, 0)
 })
 
-
-
 const changeDevice = (val: any) => {
+    console.log('🚀 ~ changeDevice ~ val:', val)
 
     let arr1: any = []
     //zlDeviceData
@@ -263,8 +308,7 @@ function filterProcess(nodes: any) {
             // 1. 如果有满足条件的子节点则保留
             // 2. 如果本身 process 值匹配则保留
             // 3. 如果是叶子节点也保留（监测点通常没有子节点）
-            if (children.length > 0 || node.process == process.value || 
-                (!node.children || node.children.length === 0)) {
+            if (children.length > 0 || node.process == process.value || !node.children || node.children.length === 0) {
                 return {
                     ...node,
                     children: children
@@ -276,7 +320,6 @@ function filterProcess(nodes: any) {
         .filter(Boolean) // 移除null节点
 }
 
-
 // function filterProcess(nodes: any) {
 //     if (process.value == '') {
 //         return nodes
@@ -332,11 +375,9 @@ const treeRef1 = ref<InstanceType<typeof ElTree>>()
 const treeRef2 = ref<InstanceType<typeof ElTree>>()
 //在线
 const treeRef3 = ref<InstanceType<typeof ElTree>>()
-defineExpose({ treeRef1, treeRef2 })
+defineExpose({ treeRef1, treeRef2, treeRef3 })
 onMounted(() => {
-     
     setTimeout(() => {
-       
         if (zlDeviceData.value.length != 0) {
             zlDevList.value = filterProcess(JSON.parse(JSON.stringify(zlDeviceData.value)))
             activeName.value = '0'
@@ -344,8 +385,11 @@ onMounted(() => {
         if (zlDeviceData.value.length === 0 && bxsDeviceData.value.length != 0) {
             activeName.value = '1'
         }
+        if (zlDeviceData.value.length === 0 && bxsDeviceData.value.length === 0) {
+            activeName.value = '2'
+        }
         if (!zlDeviceData.value && !bxsDeviceData.value) {
-            activeName.value = ''
+            activeName.value = '2'
         }
         nextTick(() => {
             changeDevice(activeName.value)