From 042798c6a7020174961c634788de2c5f572aa89e Mon Sep 17 00:00:00 2001
From: stt <email>
Date: Mon, 24 Nov 2025 10:18:38 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B6=8B=E5=8A=BF=E5=AF=B9=E6=AF=94=E8=81=94?=
 =?UTF-8?q?=E8=B0=83=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/harmonic-boot/cockpit/cockpit.ts      |   9 +
 .../listOfMainMonitoringPoints/index.vue      | 104 ----
 .../cockpit/trendComparison/index.vue         | 549 +++++++++++-------
 src/utils/tableStore.ts                       |  10 +-
 4 files changed, 364 insertions(+), 308 deletions(-)

diff --git a/src/api/harmonic-boot/cockpit/cockpit.ts b/src/api/harmonic-boot/cockpit/cockpit.ts
index 908c83c..1e8d656 100644
--- a/src/api/harmonic-boot/cockpit/cockpit.ts
+++ b/src/api/harmonic-boot/cockpit/cockpit.ts
@@ -171,3 +171,12 @@ export function getReportUrl(data: any) {
     })
 }
 
+// 查询监测对象电网侧和负载侧监测点指标趋势对比数据
+export function sensitiveUserTrendData(data: any) {
+    return request({
+        url: '/cs-device-boot/csGroup/sensitiveUserTrendData',
+        method: 'post',
+        params: data
+    })
+}
+
diff --git a/src/components/cockpit/listOfMainMonitoringPoints/index.vue b/src/components/cockpit/listOfMainMonitoringPoints/index.vue
index 44d9b61..14451c5 100644
--- a/src/components/cockpit/listOfMainMonitoringPoints/index.vue
+++ b/src/components/cockpit/listOfMainMonitoringPoints/index.vue
@@ -131,110 +131,6 @@ const initLineList = async () => {
 
 const echartList = ref()
 
-// const echartList = ref({
-//     title: {
-//         text: '谐波电压总畸变率越限与功率负荷曲线拟合图'
-//     },
-
-//     xAxis: {
-//         type: 'time',
-//         axisLabel: {
-//             formatter: {
-//                 day: '{MM}-{dd}',
-//                 month: '{MM}',
-//                 year: '{yyyy}'
-//             }
-//         }
-//     },
-
-//     yAxis: [{}, {}],
-//     grid: {
-//         left: '10px',
-//         right: '20px'
-//     },
-//     options: {
-//         series: [
-//             {
-//                 //   name: '暂降次数',
-//                 type: 'bar',
-//                 name: '有功功率',
-//                 // data: [
-//                 //     ['2025-10-16 07:00:00', 10],
-//                 //     ['2025-10-16 07:15:00', 10],
-//                 //     ['2025-10-16 07:30:00', 10],
-//                 //     ['2025-10-16 07:45:00', 10],
-//                 //     ['2025-10-16 08:00:00', 30],
-//                 //     ['2025-10-16 08:15:00', 50],
-//                 //     ['2025-10-16 08:30:00', 60],
-//                 //     ['2025-10-16 08:45:00', 70],
-//                 //     ['2025-10-16 09:00:00', 100],
-//                 //     ['2025-10-16 09:15:00', 120],
-//                 //     ['2025-10-16 09:30:00', 130],
-//                 //     ['2025-10-16 09:45:00', 140],
-//                 //     ['2025-10-16 10:00:00', 160],
-//                 //     ['2025-10-16 10:15:00', 160],
-//                 //     ['2025-10-16 10:30:00', 130],
-//                 //     ['2025-10-16 10:45:00', 120],
-//                 //     ['2025-10-16 11:00:00', 140],
-//                 //     ['2025-10-16 11:15:00', 80],
-//                 //     ['2025-10-16 11:30:00', 70],
-//                 //     ['2025-10-16 11:45:00', 90],
-//                 //     ['2025-10-16 12:00:00', 60],
-//                 //     ['2025-10-16 12:15:00', 60],
-//                 //     ['2025-10-16 12:30:00', 60],
-//                 //     ['2025-10-16 12:45:00', 60]
-//                 // ],
-//                 data:[],
-//                 itemStyle: {
-//                     normal: {
-//                         //这里是颜色
-//                         color: function (params: any) {
-//                             if (params.value[1] == 0 || params.value[1] == 3.14159) {
-//                                 return '#ccc'
-//                             } else {
-//                                 return config.layout.elementUiPrimary[0]
-//                             }
-//                         }
-//                     }
-//                 },
-//                 yAxisIndex: 0
-//             },
-//             {
-//                 name: '谐波总畸变率',
-//                 type: 'line',
-//                 showSymbol: false,
-//                 smooth: true,
-//                 data: [
-//                     ['2025-10-16 07:00:00', 0],
-//                     ['2025-10-16 07:15:00', 0],
-//                     ['2025-10-16 07:30:00', 0],
-//                     ['2025-10-16 07:45:00', 0],
-//                     ['2025-10-16 08:00:00', 0],
-//                     ['2025-10-16 08:15:00', 0.1],
-//                     ['2025-10-16 08:30:00', 0.1],
-//                     ['2025-10-16 08:45:00', 0.1],
-//                     ['2025-10-16 09:00:00', 1],
-//                     ['2025-10-16 09:15:00', 1],
-//                     ['2025-10-16 09:30:00', 1],
-//                     ['2025-10-16 09:45:00', 1],
-//                     ['2025-10-16 10:00:00', 0.8],
-//                     ['2025-10-16 10:15:00', 0.8],
-//                     ['2025-10-16 10:30:00', 0.8],
-//                     ['2025-10-16 10:45:00', 0.8],
-//                     ['2025-10-16 11:00:00', 0.8],
-//                     ['2025-10-16 11:15:00', 0.1],
-//                     ['2025-10-16 11:30:00', 0.1],
-//                     ['2025-10-16 11:45:00', 0.1],
-//                     ['2025-10-16 12:00:00', 0],
-//                     ['2025-10-16 12:15:00', 0],
-//                     ['2025-10-16 12:30:00', 0],
-//                     ['2025-10-16 12:45:00', 0]
-//                 ],
-//                 yAxisIndex: 1
-//             }
-//         ]
-//     }
-// })
 const headerHeight = ref(57)
 const selectChange = (showSelect: any, height: any, datePickerValue?: any) => {
     headerHeight.value = height
diff --git a/src/components/cockpit/trendComparison/index.vue b/src/components/cockpit/trendComparison/index.vue
index 76301ef..ef84769 100644
--- a/src/components/cockpit/trendComparison/index.vue
+++ b/src/components/cockpit/trendComparison/index.vue
@@ -1,77 +1,88 @@
 <template>
     <div>
         <!--趋势对比 -->
-        <TableHeader :showReset="false" datePicker @selectChange="selectChange" v-if="fullscreen">
+        <TableHeader datePicker :showReset="false" @selectChange="selectChange" v-if="fullscreen">
             <template v-slot:select>
-                <el-form-item label="监测点名称">
-                    <el-select
-                        v-model="tableStore.table.params.power"
-                        placeholder="请选择监测点名称"
-                        clearable
-                        style="width: 130px"
-                    >
-                        <el-option
-                            v-for="item in powerList"
-                            :key="item.value"
-                            :label="item.label"
-                            :value="item.value"
-                        />
+                <el-form-item label="监测对象">
+                    <el-select v-model="tableStore.table.params.sensitiveUserId" placeholder="请选择监测对象" clearable>
+                        <el-option v-for="item in idList" :key="item.id" :label="item.name" :value="item.id" />
                     </el-select>
                 </el-form-item>
+                <!-- <el-form-item label="监测点名称">
+                    <el-select v-model="tableStore.table.params.lineId" placeholder="请选择监测点名称" clearable>
+                        <el-option
+                            v-for="item in lineIdList"
+                            :key="item.lineId"
+                            :label="item.name"
+                            :value="item.lineId"
+                        />
+                    </el-select>
+                </el-form-item> -->
                 <el-form-item label="电能质量指标">
-                    <el-select
-                        v-model="tableStore.table.params.indicator"
-                        placeholder="请选择电能质量指标"
-                        clearable
-                        style="width: 130px"
-                    >
-                        <el-option
-                            v-for="item in indicatorList"
-                            :key="item.value"
-                            :label="item.label"
-                            :value="item.value"
-                        />
+                    <el-select v-model="tableStore.table.params.indicator" placeholder="请选择电能质量指标" clearable>
+                        <el-option v-for="item in indicatorList" :key="item.id" :label="item.name" :value="item.id" />
                     </el-select>
                 </el-form-item>
-                <el-form-item label="谐波次数">
+                <el-form-item>
+                    <el-radio-group v-model="tableStore.table.params.dataLevel">
+                        <el-radio-button label="一次值" value="Primary" />
+                        <el-radio-button label="二次值" value="Secondary" />
+                    </el-radio-group>
+                </el-form-item>
+                <el-form-item label="统计类型">
                     <el-select
-                        v-model="tableStore.table.params.exceedingTheLimit"
-                        placeholder="请选择谐波次数"
-                        clearable
-                        style="width: 90px"
+                        style="min-width: 120px !important"
+                        placeholder="请选择"
+                        v-model="tableStore.table.params.valueType"
                     >
-                        <el-option
-                            v-for="item in exceedingTheLimitList"
-                            :key="item.value"
-                            :label="item.label"
-                            :value="item.value"
-                        />
+                        <el-option value="max" label="最大值"></el-option>
+                        <el-option value="min" label="最小值"></el-option>
+                        <el-option value="avg" label="平均值"></el-option>
+                        <el-option value="cp95" label="cp95"></el-option>
                     </el-select>
                 </el-form-item>
+                <el-form-item>
+                    <div v-if="shouldShowHarmonicCount()" style="display: flex; color: var(--el-text-color-regular)">
+                        <span style="width: 160px">{{ getHarmonicTypeName() }}谐波次数</span>
+                        <el-select
+                            v-model="tableStore.table.params.harmonicCount"
+                            placeholder="请选择谐波次数"
+                            style="min-width: 80px !important"
+                        >
+                            <el-option
+                                v-for="num in harmonicCountOptions"
+                                :key="num"
+                                :label="num"
+                                :value="num"
+                            ></el-option>
+                        </el-select>
+                    </div>
+                </el-form-item>
             </template>
         </TableHeader>
         <my-echart
+            v-loading="tableStore.table.loading"
             class="tall"
             :options="echartList"
             :style="{
                 width: prop.width,
                 height: `calc(${prop.height} - ${headerHeight}px + ${fullscreen ? 0 : 56}px)`
             }"
+            v-if="showEchart"
         />
     </div>
 </template>
 <script setup lang="ts">
-import { ref, onMounted, provide, reactive, watch, h, computed } from 'vue'
+import { ref, onMounted, provide, reactive, watch, h, computed, nextTick } from 'vue'
 import TableStore from '@/utils/tableStore'
-import Table from '@/components/table/index.vue'
 import TableHeader from '@/components/table/header/index.vue'
-import { useDictData } from '@/stores/dictData'
-import { ElMessage, ElMessageBox } from 'element-plus'
-import { getTimeOfTheMonth } from '@/utils/formatTime'
 import MyEchart from '@/components/echarts/MyEchart.vue'
 import { useConfig } from '@/stores/config'
 import { useRoute } from 'vue-router'
 import { useTimeCacheStore } from '@/stores/timeCache'
+import { queryByCode, queryCsDictTree } from '@/api/system-boot/dictTree'
+import { getListByIds } from '@/api/harmonic-boot/cockpit/cockpit'
+
 const prop = defineProps({
     w: { type: [String, Number] },
     h: { type: [String, Number] },
@@ -84,16 +95,9 @@ const prop = defineProps({
 const route = useRoute()
 const timeCacheStore = useTimeCacheStore()
 const config = useConfig()
-const powerList: any = ref([
-    {
-        label: '1#变压器',
-        value: '1'
-    },
-    {
-        label: '2#变压器',
-        value: '2'
-    }
-])
+
+const lineIdList = ref(JSON.parse(window.localStorage.getItem('lineIdList') || '[]'))
+
 // 计算是否全屏展示
 const fullscreen = computed(() => {
     const w = Number(prop.w)
@@ -105,147 +109,29 @@ const fullscreen = computed(() => {
         return false
     }
 })
-const exceedingTheLimitList: any = ref([
-    {
-        label: '2次',
-        value: '2'
-    },
-    {
-        label: '3次',
-        value: '3'
-    },
-    {
-        label: '4次',
-        value: '4'
-    },
-    {
-        label: '5次',
-        value: '5'
-    }
-])
-const indicatorList: any = ref([
-    {
-        label: '谐波电压总畸变率',
-        value: '1'
-    },
-    {
-        label: '各次谐波电压',
-        value: '2'
-    },
-    {
-        label: '各次谐波电压',
-        value: '3'
-    },
-    {
-        label: '三相电压不平衡',
-        value: '4'
-    }
-])
-const echartList = ref({
-    title: {
-        text: '趋势对比'
-    },
+// 添加谐波次数选项（2-50）
+const harmonicCountOptions = ref(Array.from({ length: 49 }, (_, i) => i + 2))
 
-    xAxis: {
-        type: 'time',
-        axisLabel: {
-            formatter: {
-                day: '{MM}-{dd}',
-                month: '{MM}',
-                year: '{yyyy}'
-            }
-        }
-    },
+const indicatorList = ref()
+
+const echartList = ref()
+
+const showEchart = ref(true)
 
-    yAxis: {},
-    grid: {
-        left: '10px',
-        right: '20px'
-    },
-    options: {
-        series: [
-            {
-                //   name: '暂降次数',
-                type: 'line',
-                name: '治理前',
-                showSymbol: false,
-                smooth: true,
-                data: [
-                    ['2025-10-16 07:00:00', 1],
-                    ['2025-10-16 07:15:00', 1],
-                    ['2025-10-16 07:30:00', 1],
-                    ['2025-10-16 07:45:00', 1],
-                    ['2025-10-16 08:00:00', 3],
-                    ['2025-10-16 08:15:00', 5],
-                    ['2025-10-16 08:30:00', 6],
-                    ['2025-10-16 08:45:00', 7],
-                    ['2025-10-16 09:00:00', 10],
-                    ['2025-10-16 09:15:00', 12],
-                    ['2025-10-16 09:30:00', 13],
-                    ['2025-10-16 09:45:00', 14],
-                    ['2025-10-16 10:00:00', 16],
-                    ['2025-10-16 10:15:00', 16],
-                    ['2025-10-16 10:30:00', 13],
-                    ['2025-10-16 10:45:00', 12],
-                    ['2025-10-16 11:00:00', 14],
-                    ['2025-10-16 11:15:00', 8],
-                    ['2025-10-16 11:30:00', 7],
-                    ['2025-10-16 11:45:00', 9],
-                    ['2025-10-16 12:00:00', 6],
-                    ['2025-10-16 12:15:00', 6],
-                    ['2025-10-16 12:30:00', 6],
-                    ['2025-10-16 12:45:00', 6]
-                ],
-                itemStyle: {
-                    normal: {
-                        //这里是颜色
-                        color: function (params: any) {
-                            if (params.value[1] == 0 || params.value[1] == 3.14159) {
-                                return '#ccc'
-                            } else {
-                                return config.layout.elementUiPrimary[0]
-                            }
-                        }
-                    }
-                },
-                yAxisIndex: 0
-            },
-            {
-                name: '治理后',
-                type: 'line',
-                showSymbol: false,
-                smooth: true,
-                data: [
-                    ['2025-10-16 07:00:00', 10],
-                    ['2025-10-16 07:15:00', 10],
-                    ['2025-10-16 07:30:00', 10],
-                    ['2025-10-16 07:45:00', 10],
-                    ['2025-10-16 08:00:00', 30],
-                    ['2025-10-16 08:15:00', 50],
-                    ['2025-10-16 08:30:00', 60],
-                    ['2025-10-16 08:45:00', 70],
-                    ['2025-10-16 09:00:00', 100],
-                    ['2025-10-16 09:15:00', 120],
-                    ['2025-10-16 09:30:00', 130],
-                    ['2025-10-16 09:45:00', 140],
-                    ['2025-10-16 10:00:00', 160],
-                    ['2025-10-16 10:15:00', 160],
-                    ['2025-10-16 10:30:00', 130],
-                    ['2025-10-16 10:45:00', 120],
-                    ['2025-10-16 11:00:00', 140],
-                    ['2025-10-16 11:15:00', 80],
-                    ['2025-10-16 11:30:00', 70],
-                    ['2025-10-16 11:45:00', 90],
-                    ['2025-10-16 12:00:00', 60],
-                    ['2025-10-16 12:15:00', 60],
-                    ['2025-10-16 12:30:00', 60],
-                    ['2025-10-16 12:45:00', 60]
-                ]
-            }
-        ]
-    }
-})
 const headerHeight = ref(57)
+
+// 监测对象
+const idList = ref()
+
+// 监测对象
+const initListByIds = () => {
+    getListByIds({}).then((res: any) => {
+        if (res.data.length > 0) {
+            idList.value = res.data
+            initCode()
+        }
+    })
+}
 const selectChange = (showSelect: any, height: any, datePickerValue?: any) => {
     headerHeight.value = height
 
@@ -255,31 +141,278 @@ const selectChange = (showSelect: any, height: any, datePickerValue?: any) => {
         tableStore.table.params.searchEndTime = datePickerValue.timeValue[1]
     }
 }
-const tableStore: any = new TableStore({
-    url: '/user-boot/role/selectRoleDetail?id=0',
-    method: 'POST',
 
+const initCode = () => {
+    queryByCode('steady_state_limit_trend').then(res => {
+        queryCsDictTree(res.data.id).then(item => {
+            indicatorList.value = item.data
+            tableStore.table.params.indicator = indicatorList.value[0].id
+            nextTick(() => {
+                tableStore.index()
+            })
+        })
+    })
+}
+// 治理前
+const chartsListBefore = ref()
+// 治理后
+const chartsListAfter = ref()
+
+const setEchart = () => {
+    // 从接口数据中提取治理前和治理后的数据
+    const beforeData = chartsListBefore.value || []
+    const afterData = chartsListAfter.value || []
+
+    // 按相位分组数据
+    const beforeGroupedByPhase: any = {}
+    const afterGroupedByPhase: any = {}
+
+    // 处理治理前数据
+    beforeData.forEach((item: any) => {
+        const phase = item.phase || 'default'
+        if (!beforeGroupedByPhase[phase]) {
+            beforeGroupedByPhase[phase] = []
+        }
+        beforeGroupedByPhase[phase].push([item.time, item.statisticalData])
+    })
+
+    // 处理治理后数据
+    afterData.forEach((item: any) => {
+        const phase = item.phase || 'default'
+        if (!afterGroupedByPhase[phase]) {
+            afterGroupedByPhase[phase] = []
+        }
+        afterGroupedByPhase[phase].push([item.time, item.statisticalData])
+    })
+
+    // 构建系列数据
+    const series: any = []
+
+    // 定义相位颜色
+    const phaseColors: any = {
+        A: '#DAA520',
+        B: '#2E8B57',
+        C: '#A52a2a'
+    }
+
+    // 添加治理前数据系列（实线）
+    Object.keys(beforeGroupedByPhase).forEach(phase => {
+        const phaseName = phase === 'default' ? '' : `${phase}相`
+        const color = phaseColors[phase] || config.layout.elementUiPrimary[0]
+
+        series.push({
+            name: `治理前${phaseName}`,
+            type: 'line',
+            showSymbol: false,
+            smooth: true,
+            symbol: 'none',
+            data: beforeGroupedByPhase[phase],
+            itemStyle: {
+                normal: {
+                    color: function (params: any) {
+                        if (params.value[1] == 0 || params.value[1] == 3.14159) {
+                            return '#ccc'
+                        } else {
+                            return color
+                        }
+                    }
+                }
+            },
+            lineStyle: {
+                type: 'solid', // 实线
+                width: 2 // 线条宽度
+            },
+            yAxisIndex: 0
+        })
+    })
+
+    // 添加治理后数据系列（虚线）
+    Object.keys(afterGroupedByPhase).forEach(phase => {
+        const phaseName = phase === 'default' ? '' : `${phase}相`
+        const color = phaseColors[phase] || config.layout.elementUiPrimary[0]
+
+        series.push({
+            name: `治理后${phaseName}`,
+            type: 'line',
+            showSymbol: false,
+            smooth: true,
+            symbol: 'none',
+            data: afterGroupedByPhase[phase],
+            itemStyle: {
+                normal: {
+                    color: function (params: any) {
+                        if (params.value[1] == 0 || params.value[1] == 3.14159) {
+                            return '#ccc'
+                        } else {
+                            return color
+                        }
+                    }
+                }
+            },
+            lineStyle: {
+                type: 'dashed', // 虚线
+                width: 2 // 线条宽度
+            },
+            yAxisIndex: 0
+        })
+    })
+
+    // 获取指标名称用于图表标题
+    let titleText = '治理前后对比'
+    if (beforeData.length > 0 && beforeData[0].anotherName) {
+        titleText = beforeData[0].anotherName
+    } else if (afterData.length > 0 && afterData[0].anotherName) {
+        titleText = afterData[0].anotherName
+    }
+
+    // 构建图例数据
+    const legendData = series.map((item: any, index: number) => {
+        let color = config.layout.elementUiPrimary[0]
+        const name = item.name
+        if (name.includes('A相')) {
+            color = '#DAA520'
+        } else if (name.includes('B相')) {
+            color = '#2E8B57'
+        } else if (name.includes('C相')) {
+            color = '#A52a2a'
+        }
+
+        // 判断是治理前还是治理后，设置不同的线条样式
+        const isBefore = name.includes('治理前')
+
+        return {
+            name: item.name,
+            icon: isBefore
+                ? 'rect'
+                : 'path://M0,2 L8,2 L8,6 L0,6 Z M12,2 L20,2 L20,6 L12,6 Z M24,2 L32,2 L32,6 L24,6 Z M36,2 L44,2 L44,6 L36,6 Z', // 矩形组成的粗虚线
+            itemStyle: {
+                color: color // 明确指定图例图标的颜色
+            },
+            lineStyle: {
+                type: isBefore ? 'solid' : 'dashed', // 治理前实线，治理后虚线
+                width: 2
+            }
+        }
+    })
+
+    echartList.value = {
+        title: {
+            text: titleText
+        },
+        legend: {
+            data: legendData,
+            icon: 'rect',
+            itemWidth: 18,
+            itemHeight: 3,
+            itemStyle: {
+                borderWidth: 0
+            },
+            lineStyle: {
+                width: 2 // 确保图例线条宽度与系列线条宽度一致
+            }
+        },
+        xAxis: {
+            type: 'time',
+            axisLabel: {
+                formatter: {
+                    day: '{MM}-{dd}',
+                    month: '{MM}',
+                    year: '{yyyy}'
+                }
+            }
+        },
+        yAxis: {
+            name: beforeData.length > 0 ? beforeData[0].unit : afterData.length > 0 ? afterData[0].unit : ''
+        },
+        grid: {
+            left: '10px',
+            right: '20px'
+        },
+        series: series
+    }
+}
+
+const tableStore: any = new TableStore({
+    url: '/cs-device-boot/csGroup/sensitiveUserTrendData',
+    method: 'POST',
     showPage: false,
-    exportName: '主要监测点列表',
+    exportName: '趋势对比',
     column: [],
     beforeSearchFun: () => {
         tableStore.table.params.searchBeginTime = tableStore.table.params.searchBeginTime || prop.timeValue?.[0]
         tableStore.table.params.searchEndTime = tableStore.table.params.searchEndTime || prop.timeValue?.[1]
+        if (!tableStore.table.params.sensitiveUserId && idList.value?.length > 0) {
+            tableStore.table.params.sensitiveUserId = idList.value[0].id
+        }
+        let lists: any = []
+        // 处理电能质量指标
+        const selectedIndicator = indicatorList.value?.find(
+            (item: any) => item.id === tableStore.table.params.indicator
+        )
+        if (selectedIndicator) {
+            let frequencys = ''
+            if (selectedIndicator.name.includes('谐波含有率')) {
+                frequencys = tableStore.table.params.harmonicCount
+            }
+
+            lists.push({
+                statisticalId: tableStore.table.params.indicator,
+                frequency: frequencys !== null && frequencys !== undefined ? String(frequencys) : ''
+            })
+        }
+
+        // 将 lists 添加到请求参数中
+        tableStore.table.params.list = lists
     },
     loadCallback: () => {
         tableStore.table.height = `calc(${prop.height} - 80px)`
+        // 数据加载完成后的处理
+        if (tableStore.table.data) {
+            chartsListBefore.value = tableStore.table.data.before
+            chartsListAfter.value = tableStore.table.data.after
+            setEchart()
+        } else if (tableStore.table.data) {
+            showEchart.value = false
+        }
     }
 })
 
-tableStore.table.params.power = '1'
 tableStore.table.params.indicator = '1'
 tableStore.table.params.exceedingTheLimit = '1'
-tableStore.table.params.searchValue = ''
+tableStore.table.params.dataLevel = 'Primary'
+tableStore.table.params.valueType = 'avg'
 provide('tableStore', tableStore)
 
 onMounted(() => {
-    tableStore.index()
+    initListByIds()
 })
+
+// 判断是否应该显示谐波次数选择框
+const shouldShowHarmonicCount = () => {
+    if (!tableStore.table.params.indicator || !indicatorList.value) return false
+
+    const currentIndicator = indicatorList.value.find((item: any) => item.id === tableStore.table.params.indicator)
+
+    return (
+        currentIndicator &&
+        (currentIndicator.name.includes('电压谐波含有率') || currentIndicator.name.includes('电流谐波含有率'))
+    )
+}
+
+// 获取谐波类型名称
+const getHarmonicTypeName = () => {
+    const currentIndicator = indicatorList.value.find((item: any) => item.id === tableStore.table.params.indicator)
+
+    if (currentIndicator) {
+        if (currentIndicator.name.includes('电压谐波含有率')) {
+            return '电压'
+        } else if (currentIndicator.name.includes('电流谐波含有率')) {
+            return '电流'
+        }
+    }
+    return ''
+}
+
 watch(
     () => prop.timeKey,
     val => {
@@ -301,10 +434,26 @@ watch(
     }
 )
 
+// 监听指标变化，当指标变化时重置谐波次数
+watch(
+    () => tableStore.table.params.indicator,
+    newVal => {
+        if (shouldShowHarmonicCount()) {
+            // 如果之前没有设置过谐波次数，则默认设置为2
+            if (!tableStore.table.params.harmonicCount) {
+                tableStore.table.params.harmonicCount = 2
+            }
+        } else {
+            // 如果不是谐波含有率指标，则清除谐波次数设置
+            tableStore.table.params.harmonicCount = ''
+        }
+    }
+)
+
 const addMenu = () => {}
 </script>
 <style lang="scss" scoped>
-:deep(.el-select) {
-    min-width: 80px;
-}
+// :deep(.el-select) {
+//     min-width: 80px;
+// }
 </style>
diff --git a/src/utils/tableStore.ts b/src/utils/tableStore.ts
index 60e7414..7ab340c 100644
--- a/src/utils/tableStore.ts
+++ b/src/utils/tableStore.ts
@@ -52,7 +52,7 @@ export default class TableStore {
         beforeSearchFun: null,
         height: '',
         publicHeight: 0,
-        filename: '',
+        filename: ''
     })
 
     constructor(public options: TableStoreParams) {
@@ -98,10 +98,14 @@ export default class TableStore {
                     this.table.data = []
                     this.table.total = 0
                 }
-                this.table.copyData = filtration(this.table.data)
+                // 只有当 this.table.data 是数组时才执行 filtration 处理
+                if (Array.isArray(this.table.data)) {
+                    this.table.copyData = filtration(this.table.data)
+                }
                 if (Array.isArray(res)) {
                     this.table.data = res
                 }
+
                 if (this.isWebPaging) {
                     this.table.webPagingData = window.XEUtils.chunk(this.table.data, this.table.params.pageSize)
                     this.table.data = this.table.webPagingData[this.table.params.pageNum - 1]
@@ -109,7 +113,6 @@ export default class TableStore {
 
                 this.table.loadCallback && this.table.loadCallback()
                 this.table.loading = false
-
             })
             .catch(() => {
                 this.table.loading = false
@@ -145,7 +148,6 @@ export default class TableStore {
                 'selection-change',
                 () => {
                     this.table.selection = data as TableRow[]
-                    
                 }
             ],
             [