From ad7b77ff92909dcecc7acd1ad0b776df5e54d120 Mon Sep 17 00:00:00 2001
From: stt <email>
Date: Fri, 7 Nov 2025 10:32:55 +0800
Subject: [PATCH] =?UTF-8?q?=E7=A8=B3=E6=80=81=E6=B2=BB=E7=90=86=E6=95=88?=
 =?UTF-8?q?=E6=9E=9C=E5=88=86=E6=9E=90=E6=B7=BB=E5=8A=A0=E6=97=B6=E9=97=B4?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../cockpit/governanceReport/index.vue        |  33 ++++-
 .../cockpit/gridSideStatistics/index.vue      |  69 +++++++--
 .../components/overLimitDetails copy.vue      | 134 ++++++++++++++++++
 .../cockpit/monitoringPointList/index.vue     |  95 +++++++++----
 .../cockpit/trendComparison/index.vue         |  35 ++++-
 5 files changed, 325 insertions(+), 41 deletions(-)
 create mode 100644 src/components/cockpit/listOfMainMonitoringPoints/components/overLimitDetails copy.vue

diff --git a/src/components/cockpit/governanceReport/index.vue b/src/components/cockpit/governanceReport/index.vue
index 3265470..a290b8b 100644
--- a/src/components/cockpit/governanceReport/index.vue
+++ b/src/components/cockpit/governanceReport/index.vue
@@ -1,7 +1,7 @@
 <template>
     <div>
         <!--治理效果报表 -->
-        <TableHeader :showReset="false" v-if="fullscreen">
+        <TableHeader :showReset="false" datePicker @selectChange="selectChange" v-if="fullscreen">
             <template v-slot:select>
                 <el-form-item label="治理对象">
                     <el-select
@@ -45,6 +45,8 @@ import { getTimeOfTheMonth } from '@/utils/formatTime'
 import MyEchart from '@/components/echarts/MyEchart.vue'
 import { useConfig } from '@/stores/config'
 import Json from './index.json'
+import { useRoute } from 'vue-router'
+import { useTimeCacheStore } from '@/stores/timeCache'
 
 const prop = defineProps({
     w: { type: String },
@@ -66,6 +68,9 @@ const powerList: any = ref([
     }
 ])
 
+const route = useRoute()
+const timeCacheStore = useTimeCacheStore()
+
 const tableStore: any = new TableStore({
     url: '/user-boot/role/selectRoleDetail?id=0',
     method: 'POST',
@@ -74,8 +79,20 @@ const tableStore: any = new TableStore({
     exportName: '主要监测点列表',
     column: [],
     beforeSearchFun: () => {
-        tableStore.table.params.searchBeginTime = prop.timeValue?.[0] || getTimeOfTheMonth(prop.timeKey)[0]
-        tableStore.table.params.searchEndTime = prop.timeValue?.[1] || getTimeOfTheMonth(prop.timeKey)[1]
+        // 尝试从缓存获取时间值
+        let beginTime, endTime
+
+        if (fullscreen.value) {
+            const cached = timeCacheStore.getCache(route.path)
+            if (cached && cached.timeValue) {
+                beginTime = cached.timeValue[0]
+                endTime = cached.timeValue[1]
+            }
+        }
+
+        // 如果缓存中没有则使用默认值
+        tableStore.table.params.searchBeginTime = beginTime || prop.timeValue?.[0] || getTimeOfTheMonth(prop.timeKey)[0]
+        tableStore.table.params.searchEndTime = endTime || prop.timeValue?.[1] || getTimeOfTheMonth(prop.timeKey)[1]
     },
     loadCallback: () => {}
 })
@@ -103,6 +120,16 @@ onMounted(() => {
 
     tableStore.index()
 })
+
+const selectChange = (showSelect: any, height: any, datePickerValue?: any) => {
+    // 如果有传入 datePicker 的值
+    if (datePickerValue) {
+        // 更新表格参数
+        tableStore.table.params.searchBeginTime = datePickerValue.timeValue?.[0]
+        tableStore.table.params.searchEndTime = datePickerValue.timeValue?.[1]
+    }
+}
+
 // 计算是否全屏展示
 const fullscreen = computed(() => {
     const w = Number(prop.w)
diff --git a/src/components/cockpit/gridSideStatistics/index.vue b/src/components/cockpit/gridSideStatistics/index.vue
index a221e71..aa8a9cf 100644
--- a/src/components/cockpit/gridSideStatistics/index.vue
+++ b/src/components/cockpit/gridSideStatistics/index.vue
@@ -1,13 +1,21 @@
 <template>
     <div>
-
         <!--电网侧指标越限统计 -->
+        <TableHeader :showReset="false" @selectChange="selectChange" datePicker v-if="fullscreen"></TableHeader>
         <my-echart
             class="tall"
             :options="echartList"
-            :style="{ width: prop.width, height: `calc(${prop.height} / 2 )` }"
+            :style="{
+                width: prop.width,
+                height: `calc(${prop.height} / 2 - ${headerHeight / 2}px + ${fullscreen ? 0 : 28}px )`
+            }"
         />
-        <Table ref="tableRef" @cell-click="cellClickEvent" :height="`calc(${prop.height} / 2 )`" isGroup></Table>
+        <Table
+            ref="tableRef"
+            @cell-click="cellClickEvent"
+            :height="`calc(${prop.height} / 2 - ${headerHeight / 2}px + ${fullscreen ? 0 : 28}px )`"
+            isGroup
+        ></Table>
         <!-- 指标越限详情 -->
         <OverLimitDetails ref="OverLimitDetailsRef" />
     </div>
@@ -17,16 +25,48 @@ import { ref, onMounted, provide, reactive, watch, h } from 'vue'
 import TableStore from '@/utils/tableStore'
 import Table from '@/components/table/index.vue'
 import MyEchart from '@/components/echarts/MyEchart.vue'
-import { useDictData } from '@/stores/dictData'
-import { ElMessage, ElMessageBox } from 'element-plus'
 import { getTimeOfTheMonth } from '@/utils/formatTime'
 import OverLimitDetails from '@/components/cockpit/listOfMainMonitoringPoints/components/overLimitDetails.vue'
+import TableHeader from '@/components/table/header/index.vue'
+import { useRoute } from 'vue-router'
+import { useTimeCacheStore } from '@/stores/timeCache'
+
 const prop = defineProps({
+    w: { type: String },
+    h: { type: String },
     width: { type: String },
     height: { type: String },
     timeKey: { type: String },
     timeValue: { type: Object }
 })
+
+const headerHeight = ref(57)
+
+const route = useRoute()
+const timeCacheStore = useTimeCacheStore()
+
+const selectChange = (showSelect: any, height: any, datePickerValue?: any) => {
+    headerHeight.value = height
+
+    // 如果有传入 datePicker 的值
+    if (datePickerValue) {
+        // 更新表格参数
+        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({
     title: {
         text: '指标越限占比'
@@ -52,7 +92,7 @@ const echartList = ref({
                 type: 'bar',
                 name: '越限占比',
                 data: [0, 45, 22, 0, 70],
-                barMaxWidth: 30,
+                barMaxWidth: 30
 
                 // label: {
                 //     show: true,
@@ -140,8 +180,21 @@ const tableStore: any = new TableStore({
         }
     ],
     beforeSearchFun: () => {
-       tableStore.table.params.searchBeginTime = prop.timeValue?.[0] || getTimeOfTheMonth(prop.timeKey)[0]
-        tableStore.table.params.searchEndTime = prop.timeValue?.[1] || getTimeOfTheMonth(prop.timeKey)[1]
+        // 尝试从缓存获取时间值
+        let beginTime, endTime
+
+        if (fullscreen.value) {
+            const cached = timeCacheStore.getCache(route.path)
+            if (cached && cached.timeValue) {
+                beginTime = cached.timeValue[0]
+                endTime = cached.timeValue[1]
+            }
+        }
+
+        // 如果缓存中没有则使用默认值
+        tableStore.table.params.searchBeginTime = beginTime || prop.timeValue?.[0] || getTimeOfTheMonth(prop.timeKey)[0]
+
+        tableStore.table.params.searchEndTime = endTime || prop.timeValue?.[1] || getTimeOfTheMonth(prop.timeKey)[1]
     },
     loadCallback: () => {
         tableStore.table.data = [
diff --git a/src/components/cockpit/listOfMainMonitoringPoints/components/overLimitDetails copy.vue b/src/components/cockpit/listOfMainMonitoringPoints/components/overLimitDetails copy.vue
new file mode 100644
index 0000000..6711d4a
--- /dev/null
+++ b/src/components/cockpit/listOfMainMonitoringPoints/components/overLimitDetails copy.vue	
@@ -0,0 +1,134 @@
+<template>
+    <!-- 综合评估详情 -->
+    <el-dialog draggable title="指标合格率统计" v-model="dialogVisible" append-to-body width="70%">
+        <TableHeader datePicker showExport :showReset="false">
+            <template v-slot:select>
+                <el-form-item label="监测点名称">
+                    <el-select
+                        v-model="tableStore.table.params.searchValue"
+                        placeholder="请选择监测点名称"
+                        style="width: 240px"
+                    >
+                        <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
+                    </el-select>
+                </el-form-item>
+            </template>
+        </TableHeader>
+        <Table ref="tableRef" isGroup :height="height"></Table>
+    </el-dialog>
+</template>
+<script setup lang="ts">
+import { ref, provide } from 'vue'
+import Table from '@/components/table/index.vue'
+import TableHeader from '@/components/table/header/index.vue'
+import TableStore from '@/utils/tableStore'
+import { mainHeight } from '@/utils/layout'
+const dialogVisible: any = ref(false)
+const options = [
+    {
+        value: '35kV进线',
+        label: '35kV进线'
+    }
+]
+const height = mainHeight(0, 2).height as any
+const loop50 = (key: string) => {
+    let list: any[] = []
+    for (let i = 2; i < 51; i++) {
+        list.push({
+            title: i + '次',
+            // field: key + i,
+            field: 'flicker',
+            width: '80'
+        })
+    }
+    return list
+}
+const tableStore: any = new TableStore({
+    url: '/user-boot/role/selectRoleDetail?id=0',
+    method: 'POST',
+    publicHeight: 30,
+    showPage: false,
+    exportName: '主要监测点列表',
+    column: [
+        {
+            field: 'index',
+            title: '序号',
+            width: '80',
+            formatter: (row: any) => {
+                return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
+            }
+        },
+        {
+            title: '日期',
+            field: 'time',
+            width: '150'
+        },
+        {
+            title: '名称',
+            field: 'name',
+            width: '150'
+        },
+        {
+            title: '闪变越限(分钟)',
+            field: 'flicker',
+            width: '80'
+        },
+        {
+            title: '谐波电压越限(分钟)',
+            children: loop50('voltage')
+        },
+        {
+            title: '谐波电流越限(分钟)',
+            children: loop50('harmonicCurrent')
+        },
+        {
+            title: '三相不平衡度越限(分钟)',
+            field: 'flicker',
+            width: '100'
+        },
+        {
+            title: '电压偏差越限(分钟)',
+            field: 'flicker',
+            width: '100'
+        },
+        {
+            title: '频率偏差越限(分钟)',
+            field: 'flicker',
+            width: '100'
+        }
+    ],
+    beforeSearchFun: () => {},
+    loadCallback: () => {
+        tableStore.table.data = [
+            {
+                time: '2024-01-01 00:00:00',
+                name: '35kV进线',
+                flicker: '0',
+              
+            },
+            {
+                time: '2024-01-01 00:00:00',
+                name: '35kV进线',
+                flicker: '0',
+              
+            },
+            {
+                time: '2024-01-01 00:00:00',
+                name: '35kV进线',
+                flicker: '0',
+              
+            },
+        ]
+    }
+})
+
+tableStore.table.params.searchValue = ''
+provide('tableStore', tableStore)
+const open = async (row: any) => {
+    dialogVisible.value = true
+    tableStore.index()
+}
+
+defineExpose({ open })
+</script>
+<style lang="scss" scoped></style>
diff --git a/src/components/cockpit/monitoringPointList/index.vue b/src/components/cockpit/monitoringPointList/index.vue
index dacc951..eb17e26 100644
--- a/src/components/cockpit/monitoringPointList/index.vue
+++ b/src/components/cockpit/monitoringPointList/index.vue
@@ -1,8 +1,8 @@
 <template>
     <div>
         <!--监测点列表 -->
-
-        <Table ref="tableRef" @cell-click="cellClickEvent" :height="`calc(${prop.height}  )`"></Table>
+        <TableHeader :showReset="false" @selectChange="selectChange" datePicker v-if="fullscreen"></TableHeader>
+        <Table ref="tableRef" @cell-click="cellClickEvent" :height="`calc(${prop.height} - ${headerHeight}px + ${fullscreen ? 0 : 56}px  )`"></Table>
         <!-- 指标越限详情 -->
         <OverLimitDetails ref="OverLimitDetailsRef" />
     </div>
@@ -11,19 +11,51 @@
 import { ref, onMounted, provide, reactive, watch, h } 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 { ElTag } from 'element-plus'
 import OverLimitDetails from '@/components/cockpit/listOfMainMonitoringPoints/components/overLimitDetails.vue'
+import TableHeader from '@/components/table/header/index.vue'
+import { useRoute } from 'vue-router'
+import { useTimeCacheStore } from '@/stores/timeCache'
+
 const prop = defineProps({
+    w: { type: String },
+    h: { type: String },
     width: { type: String },
     height: { type: String },
     timeKey: { type: String },
     timeValue: { type: Object }
 })
-const dictData = useDictData()
+
+const headerHeight = ref(57)
+
+const route = useRoute()
+const timeCacheStore = useTimeCacheStore()
+
+const selectChange = (showSelect: any, height: any, datePickerValue?: any) => {
+    headerHeight.value = height
+
+    // 如果有传入 datePicker 的值
+    if (datePickerValue) {
+        // 更新表格参数
+        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 OverLimitDetailsRef = ref()
 const tableStore: any = new TableStore({
     url: '/user-boot/role/selectRoleDetail?id=0',
@@ -63,8 +95,8 @@ const tableStore: any = new TableStore({
             minWidth: '80',
             render: 'customTemplate',
             customTemplate: (row: any) => {
-                 return `<span style='cursor: pointer;text-decoration: underline;' onclick="handleReportClick('${row.name}')">${row.type2}</span>`
-            },
+                return `<span style='cursor: pointer;text-decoration: underline;' onclick="handleReportClick('${row.name}')">${row.type2}</span>`
+            }
         },
         { title: '监测点名称', field: 'type3', minWidth: '70' },
         { title: '监测类型', field: 'type4', minWidth: '60' },
@@ -80,8 +112,21 @@ const tableStore: any = new TableStore({
         { title: '最新数据时间', field: 'type6', minWidth: '140' }
     ],
     beforeSearchFun: () => {
-        tableStore.table.params.searchBeginTime = prop.timeValue?.[0] || getTimeOfTheMonth(prop.timeKey)[0]
-        tableStore.table.params.searchEndTime = prop.timeValue?.[1] || getTimeOfTheMonth(prop.timeKey)[1]
+        // 尝试从缓存获取时间值
+        let beginTime, endTime
+
+        if (fullscreen.value) {
+            const cached = timeCacheStore.getCache(route.path)
+            if (cached && cached.timeValue) {
+                beginTime = cached.timeValue[0]
+                endTime = cached.timeValue[1]
+            }
+        }
+
+        // 如果缓存中没有则使用默认值
+        tableStore.table.params.searchBeginTime = beginTime || prop.timeValue?.[0] || getTimeOfTheMonth(prop.timeKey)[0]
+
+        tableStore.table.params.searchEndTime = endTime || prop.timeValue?.[1] || getTimeOfTheMonth(prop.timeKey)[1]
     },
     loadCallback: () => {
         tableStore.table.data = [
@@ -165,21 +210,21 @@ watch(
 )
 
 const handleReportClick = (id: string) => {
-  const row = tableStore.table.data.find((item: any) => item.id === id)
-  if (row && row.type2 !== '/') {
-    // 示例：触发下载逻辑（根据你注释掉的代码）
-    // getFileZip({ eventId: id }).then(res => {
-    //   let blob = new Blob([res], { type: 'application/zip' })
-    //   const url = window.URL.createObjectURL(blob)
-    //   const link = document.createElement('a')
-    //   link.href = url
-    //   link.download = row.wavePath?.split('/')[2] || '报告文件.zip'
-    //   link.click()
-    // })
-    console.log('点击了报告:', row.type2)
-  } else {
-    ElMessage.warning('暂无报告可下载')
-  }
+    const row = tableStore.table.data.find((item: any) => item.id === id)
+    if (row && row.type2 !== '/') {
+        // 示例：触发下载逻辑（根据你注释掉的代码）
+        // getFileZip({ eventId: id }).then(res => {
+        //   let blob = new Blob([res], { type: 'application/zip' })
+        //   const url = window.URL.createObjectURL(blob)
+        //   const link = document.createElement('a')
+        //   link.href = url
+        //   link.download = row.wavePath?.split('/')[2] || '报告文件.zip'
+        //   link.click()
+        // })
+        console.log('点击了报告:', row.type2)
+    } else {
+        ElMessage.warning('暂无报告可下载')
+    }
 }
 
 // 挂载到 window 供 HTML 调用
@@ -187,7 +232,7 @@ window.handleReportClick = handleReportClick
 
 // 组件销毁时清理全局方法
 onBeforeUnmount(() => {
-  delete window.handleReportClick
+    delete window.handleReportClick
 })
 </script>
 <style lang="scss" scoped></style>
diff --git a/src/components/cockpit/trendComparison/index.vue b/src/components/cockpit/trendComparison/index.vue
index dcbe6c5..133eee1 100644
--- a/src/components/cockpit/trendComparison/index.vue
+++ b/src/components/cockpit/trendComparison/index.vue
@@ -1,7 +1,7 @@
 <template>
     <div>
         <!--趋势对比 -->
-        <TableHeader :showReset="false" @selectChange="selectChange" v-if="fullscreen">
+        <TableHeader :showReset="false" datePicker @selectChange="selectChange" v-if="fullscreen">
             <template v-slot:select>
                 <el-form-item label="监测点名称">
                     <el-select
@@ -67,6 +67,8 @@ 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'
 const prop = defineProps({
     w: { type: String },
     h: { type: String },
@@ -75,6 +77,9 @@ const prop = defineProps({
     timeKey: { type: String },
     timeValue: { type: Object }
 })
+
+const route = useRoute()
+const timeCacheStore = useTimeCacheStore()
 const config = useConfig()
 const powerList: any = ref([
     {
@@ -238,8 +243,15 @@ const echartList = ref({
     }
 })
 const headerHeight = ref(57)
-const selectChange = (showSelect: any, height: any) => {
+const selectChange = (showSelect: any, height: any, datePickerValue?: any) => {
     headerHeight.value = height
+
+    // 如果有传入 datePicker 的值
+    if (datePickerValue) {
+        // 更新表格参数
+        tableStore.table.params.searchBeginTime = datePickerValue.timeValue?.[0]
+        tableStore.table.params.searchEndTime = datePickerValue.timeValue?.[1]
+    }
 }
 const tableStore: any = new TableStore({
     url: '/user-boot/role/selectRoleDetail?id=0',
@@ -248,9 +260,22 @@ const tableStore: any = new TableStore({
     showPage: false,
     exportName: '主要监测点列表',
     column: [],
-    beforeSearchFun: () => {
-        tableStore.table.params.searchBeginTime = prop.timeValue?.[0] || getTimeOfTheMonth(prop.timeKey)[0]
-        tableStore.table.params.searchEndTime = prop.timeValue?.[1] || getTimeOfTheMonth(prop.timeKey)[1]
+     beforeSearchFun: () => {
+        // 尝试从缓存获取时间值
+        let beginTime, endTime
+
+        if (fullscreen.value) {
+            const cached = timeCacheStore.getCache(route.path)
+            if (cached && cached.timeValue) {
+                beginTime = cached.timeValue[0]
+                endTime = cached.timeValue[1]
+            }
+        }
+
+        // 如果缓存中没有则使用默认值
+        tableStore.table.params.searchBeginTime = beginTime || prop.timeValue?.[0] || getTimeOfTheMonth(prop.timeKey)[0]
+
+        tableStore.table.params.searchEndTime = endTime || prop.timeValue?.[1] || getTimeOfTheMonth(prop.timeKey)[1]
     },
     loadCallback: () => {
         tableStore.table.height = `calc(${prop.height} - 80px)`