Merge branch 'main' of http://192.168.1.22:3000/Web/admin-govern

src/api/harmonic-boot/cockpit/cockpit.ts

@@ -70,6 +70,14 @@ export function limitExtentData(data: any) {
         data: data
     })
 }
+// 指标日趋势图数据
+export function limitExtentDayData(data: any) {
+    return request({
+        url: '/harmonic-boot/limitRateDetailD/limitExtentDayData',
+        method: 'post',
+        data: data
+    })
+}
 
 
 

src/components/cockpit/F47Curve/index.vue

@@ -12,12 +12,20 @@
             ref="chartRef"
             class="tall"
             :options="echartList"
-            :style="{ width: prop.width, height: `calc(${prop.height} - 80px - ${headerHeight}px + ${fullscreen ? 0 : 56}px)` }"
+            :style="{
+                width: prop.width,
+                height: `calc(${prop.height} - 80px - ${headerHeight}px + ${fullscreen ? 0 : 56}px)`
+            }"
             @chart-click="handleChartClick"
         />
         <el-dialog v-model="isWaveCharts" draggable title="瞬时/RMS波形" append-to-body width="70%">
-            <waveFormAnalysis v-loading="loading" v-if="isWaveCharts" ref="waveFormAnalysisRef"
+            <waveFormAnalysis
-            @handleHideCharts="isWaveCharts = false" :wp="wp" />
+                v-loading="loading"
+                v-if="isWaveCharts"
+                ref="waveFormAnalysisRef"
+                @handleHideCharts="isWaveCharts = false"
+                :wp="wp"
+            />
         </el-dialog>
     </div>
 </template>
@@ -27,10 +35,11 @@ import TableStore from '@/utils/tableStore'
 import MyEchart from '@/components/echarts/MyEchart.vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import { getTimeOfTheMonth } from '@/utils/formatTime'
-import waveFormAnalysis from '@/views/govern/device/control/tabs/components/waveFormAnalysis.vue';
+import waveFormAnalysis from '@/views/govern/device/control/tabs/components/waveFormAnalysis.vue'
 import TableHeader from '@/components/table/header/index.vue'
 import { useRoute } from 'vue-router'
 import { useTimeCacheStore } from '@/stores/timeCache'
+import { analyseWave } from '@/api/common'
 
 const prop = defineProps({
     w: { type: String },
@@ -79,7 +88,10 @@ const loading = ref(false)
 
 const wp = ref({})
 
-const OverLimitDetailsRef = ref()
+const boxoList: any = ref({})
+
+const waveFormAnalysisRef: any = ref(null)
+
 const data = reactive({
     name: '事件个数',
     gs: 0,
@@ -419,7 +431,6 @@ onMounted(() => {
 
 // 点击事件处理函数
 const handleChartClick = (params: any) => {
-
     if (params.seriesName === '可容忍事件') {
         // 处理可容忍事件点击
         ElMessage.info(`点击了可容忍事件: 持续时间${params.value[0]}s, 幅值${params.value[1].toFixed(2)}%`)
@@ -432,9 +443,30 @@ const handleChartClick = (params: any) => {
 }
 
 // 可容忍事件点击处理函数
-const handleTolerableEventClick = (params: any) => {
+const handleTolerableEventClick = async (row: any) => {
-    console.log('可容忍事件详情:', params)
+    console.log('可容忍事件详情:', row)
     isWaveCharts.value = true
+    loading.value = true
+    isWaveCharts.value = true
+    await analyseWave(row.id)
+        .then(res => {
+            row.loading1 = false
+            if (res != undefined) {
+                boxoList.value = row
+                boxoList.value.featureAmplitude = row.evtParamVVaDepth != '-' ? row.evtParamVVaDepth - 0 : null
+                boxoList.value.systemType = 'WX'
+                wp.value = res.data
+            }
+            loading.value = false
+        })
+        .catch(() => {
+            row.loading1 = false
+            loading.value = false
+        })
+
+    nextTick(() => {
+        waveFormAnalysisRef.value && waveFormAnalysisRef.value.getWpData(wp.value, boxoList.value, true)
+    })
 }
 
 // 不可容忍事件点击处理函数

src/components/cockpit/exceedanceLevel/components/dailyTrendChart.vue

@@ -1,11 +1,9 @@
 <template>
     <!-- 指标日趋势图 -->
-    <el-dialog draggable title="指标日趋势图" v-model="dialogVisible" append-to-body width="70%">
+    <el-dialog draggable :title="dialogTitle" v-model="dialogVisible" append-to-body width="70%">
-        <my-echart
+        <div :style="pageHeight">
-            class="tall"
+            <my-echart class="tall" :options="echartList" style="width: 98%" />
-            :options="echartList"
+        </div>
-            style="width: 98%; height: 320px"
-        />
     </el-dialog>
 </template>
 
@@ -13,6 +11,9 @@
 import { ref, onMounted, provide, reactive, watch, h } from 'vue'
 import MyEchart from '@/components/echarts/MyEchart.vue'
 import { useConfig } from '@/stores/config'
+import { mainHeight } from '@/utils/layout'
+import { limitExtentDayData } from '@/api/harmonic-boot/cockpit/cockpit'
+
 const prop = defineProps({
     width: { type: String },
     height: { type: String },
@@ -20,70 +21,130 @@ const prop = defineProps({
     timeValue: { type: Object }
 })
 
+const pageHeight = ref(mainHeight(332))
+
 const dialogVisible: any = ref(false)
 
+const dialogTitle = ref('')
 
 const config = useConfig()
 
-const echartList = ref({
+const dialogText = ref('')
+
+const echartList = ref()
+
+const init = () => {
+    echartList.value = {
         title: {
-        text: '指标日趋势图',
+            text: dialogText.value,
+            textStyle: {
+                fontSize: 14,
+                rich: {
+                    lineName: {
+                        color: '#333',
+                        fontSize: 14
+                    },
+                    timeLabel: {
+                        color: '#333',
+                        fontSize: 14,
+                        padding: [0, 0, 0, 10]
+                    },
+                    name: {
+                        color: '#333',
+                        fontSize: 14,
+                        padding: [0, 0, 0, 10]
+                    }
+                }
+            }
         },
         xAxis: {
             type: 'category',
-        data: [
+            data: []
-            '00:00', '01:00', '02:00', '03:00', '04:00', '05:00', 
-            '06:00', '07:00', '08:00', '09:00', '10:00', '11:00',
-            '12:00', '13:00', '14:00', '15:00', '16:00', '17:00',
-            '18:00', '19:00', '20:00', '21:00', '22:00', '23:00'
-        ],
-        axisLabel: {
-            interval: 1
-        }
         },
         yAxis: {
             type: 'value',
             name: '数值'
         },
         grid: {
-        left: '10px',
+            left: '1%',
-        right: '20px',
+            right: '45px',
+            bottom: '40px',
+            top: '15%',
             containLabel: true
         },
-    options: {
+        dataZoom: [
-        series: [
             {
-                name: '指标值',
+                type: 'inside',
+                height: 13,
+                start: 0,
+                bottom: '20px',
+                end: 100
+            },
+            {
+                start: 0,
+                height: 13,
+                bottom: '20px',
+                end: 100
+            }
+        ],
+        options: {
+            series: []
+        }
+    }
+}
+
+const initData = async (row: any) => {
+    limitExtentDayData({ code: row.code, lineId: row.lineId, time: row.time }).then(res => {
+        if (res.data && res.data.length > 0) {
+            // 重新初始化图表
+            init()
+
+            // 从第一条数据中提取时间作为x轴数据
+            const firstItem = res.data[0]
+            const xAxisData = firstItem.time.split(',')
+
+            // 定义相位颜色映射
+            const phaseColors: any = {
+                A: '#DAA520',
+                B: '#2E8B57',
+                C: '#A52a2a'
+            }
+
+            // 处理每条相位数据
+            const seriesData = res.data.map((item: any) => {
+                const values = item.value.split(',').map((v: string) => parseFloat(v) || 0)
+
+                return {
+                    name: `${item.phasic}相`,
                     type: 'line',
                     showSymbol: true,
                     smooth: true,
-                data: [
+                    data: values,
-                    10, 12, 15, 18, 22, 28, 
-                    35, 45, 60, 75, 88, 95,
-                    100, 98, 90, 80, 70, 60,
-                    50, 40, 30, 25, 20, 15
-                ],
                     itemStyle: {
                         normal: {
-                        color: config.layout.elementUiPrimary[0]
+                            // 根据相位设置对应颜色
-                    }
+                            color: phaseColors[item.phasic] || config.layout.elementUiPrimary[0]
-                },
-                areaStyle: {
-                    opacity: 0.3
                         }
                     }
-        ]
                 }
-})
+            })
 
+            // 更新图表配置
+            echartList.value.xAxis.data = xAxisData
+            echartList.value.options.series = seriesData
+        }
+    })
+}
 
-onMounted(() => {
+onMounted(() => {})
-    
-})
-
 
 const open = async (row: any) => {
     dialogVisible.value = true
+    dialogTitle.value = row.name + '日趋势图'
+    dialogText.value = `{lineName|${row.lineName}}{timeLabel|${row.time}}{name|${row.name}日趋势图}`
+    nextTick(() => {
+        initData(row)
+    })
 }
 
 defineExpose({ open })

src/components/cockpit/exceedanceLevel/index.vue

@@ -66,34 +66,6 @@ const fullscreen = computed(() => {
 
 const echartList = ref()
 
-// const echartList = ref({
-//     title: {
-//         text: '指标越限严重度'
-//     },
-
-//     xAxis: {
-//         data: ['闪变', '谐波电压', '谐波电流', '电压偏差', '三相不平衡']
-//     },
-
-//     yAxis: {
-//         name: '%', // 给X轴加单位
-//         interval: 20
-//     },
-//     grid: {
-//         left: '10px',
-//         right: '20px'
-//     },
-//     options: {
-//         series: [
-//             {
-//                 type: 'bar',
-//                 name: '越限占比',
-//                 data: [0, 7.5, 36, 0, 80],
-//                 barMaxWidth: 30
-//             }
-//         ]
-//     }
-// })
 const dailyTrendChartRef = ref()
 const tableStore: any = new TableStore({
     url: '/harmonic-boot/limitRateDetailD/limitExtentData',
@@ -122,7 +94,7 @@ const tableStore: any = new TableStore({
             minWidth: '60',
             render: 'customTemplate',
             customTemplate: (row: any) => {
-                return `<span style='cursor: pointer;text-decoration: underline;'>${row.type}</span>`
+                return `<span style='cursor: pointer;text-decoration: underline;'>${row.maxValue}</span>`
             }
         },
         {
@@ -138,12 +110,32 @@ const tableStore: any = new TableStore({
         {
             title: '发生日期',
             field: 'time',
-            minWidth: '100'
+            minWidth: '60',
+            render: 'customTemplate',
+            customTemplate: (row: any) => {
+                if (
+                    row.time !== null &&
+                    row.time !== undefined &&
+                    row.time !== ''
+                ) {
+                    return `<span>${row.time}</span>`
+                } else {
+                    return `<span>/</span>`
+                }
+            }
         },
         {
             title: '越限最高监测点',
             field: 'lineName',
-            minWidth: '90'
+            minWidth: '90',
+            render: 'customTemplate',
+            customTemplate: (row: any) => {
+                if (row.lineName !== null && row.lineName !== undefined && row.lineName !== '') {
+                    return `<span>${row.lineName}</span>`
+                } else {
+                    return `<span>/</span>`
+                }
+            }
         }
     ],
     beforeSearchFun: () => {
@@ -166,12 +158,12 @@ const tableStore: any = new TableStore({
         // 定义 x 轴标签顺序
         const xAxisLabels = ['闪变', '谐波电压', '谐波电流', '电压偏差', '三相不平衡']
 
-        // 根据指标名称顺序提取对应的 maxValue 数据
+        // 根据指标名称顺序提取对应的 extent 数据
         const chartData = xAxisLabels.map(label => {
             // 在表格数据中查找对应指标名称的数据项
             const item = tableStore.table.data.find((row: any) => row.name === label)
-            // 如果找到对应项，则返回 maxValue 值，否则返回 0
+            // 如果找到对应项，则返回 extent 值，否则返回 0
-            return item ? parseFloat(item.maxValue) || 0 : 0
+            return item ? item.extent || 0 : 0
         })
         echartList.value = {
             title: {
@@ -183,8 +175,8 @@ const tableStore: any = new TableStore({
             },
 
             yAxis: {
-                name: '%', // 给X轴加单位
+                name: '%' // 给X轴加单位
-                interval: 20
+                // interval: 20
             },
             grid: {
                 left: '10px',
@@ -211,8 +203,7 @@ provide('tableStore', tableStore)
 
 // 点击行
 const cellClickEvent = ({ row, column }: any) => {
-    if (column.field != 'name') {
+    if (column.field == 'maxValue' && row.lineId) {
-        console.log(row)
         dailyTrendChartRef.value.open(row)
     }
 }

src/components/cockpit/indicatorFittingChart/components/harmonicRatio‌.vue

@@ -1,5 +1,5 @@
 <template>
-    <el-dialog draggable title="谐波电压/电流含有率" v-model="dialogVisible" append-to-body width="70%">
+    <el-dialog draggable title="趋势图" v-model="dialogVisible" append-to-body width="70%">
         <!-- 总体指标占比详情谐波含有率 -->
         <div>
             <TableHeader ref="tableHeaderRef" :showSearch="false" @selectChange="selectChange">

src/components/cockpit/indicatorFittingChart/index.vue

@@ -11,7 +11,7 @@
         <Table
             ref="tableRef"
             @cell-click="cellClickEvent"
-            :height="`calc(${prop.height} - ${headerHeight}px + ${fullscreen ? -50 : 56}px )`"
+            :height="`calc(${prop.height} - ${headerHeight}px + ${fullscreen ? -58 : 56}px )`"
         ></Table>
         <!-- 指标越限详情 -->
         <OverLimitDetails ref="OverLimitDetailsRef" />