暂态事件明细只能选择月份

src/components/cockpit/transientDetails/index.vue

@@ -1,7 +1,13 @@
 <template>
     <div>
         <!--暂态事件明细 -->
-        <TableHeader :showReset="false" @selectChange="selectChange" datePicker v-if="fullscreen"></TableHeader>
+        <TableHeader
+            :showReset="false"
+            ref="TableHeaderRef"
+            @selectChange="selectChange"
+            datePicker
+            v-if="fullscreen"
+        ></TableHeader>
         <el-calendar
             v-model="value"
             :style="{
@@ -14,12 +20,7 @@
                     <p :class="data.isSelected ? 'is-selected' : ''">
                         {{ data.day.split('-').slice(2).join('-') }}
                     </p>
-                    <el-tooltip
+                    <el-tooltip effect="dark" placement="top" :hide-after="0" v-if="hasEventData(data.day)">
-                        effect="dark"
-                        placement="top"
-                        :hide-after="0"
-                         v-if="hasEventData(data.day)"
-                    >
                         <template #content>
                             <!-- <span v-html="list?.filter(item => item.time == data.day)[0]?.type || ''"></span> -->
                             <div v-for="item in list?.filter((item:any) => item.name == data.day)">
@@ -46,7 +47,7 @@
     </div>
 </template>
 <script setup lang="ts">
-import { ref, onMounted, provide, reactive, watch, h } from 'vue'
+import { ref, onMounted, provide, reactive, watch, nextTick } from 'vue'
 import TableStore from '@/utils/tableStore'
 import { getTimeOfTheMonth } from '@/utils/formatTime'
 import { dayjs } from 'element-plus'
@@ -66,21 +67,23 @@ const prop = defineProps({
 
 const headerHeight = ref(57)
 
-const hasEventData = (day: string) => {
+const TableHeaderRef = ref()
-    const item = list.value?.find((item: any) => item.name == day);
-    if (!item) return false;
 
-    return (item.eventDown || item.eventOff || item.eventUp) > 0;
+const hasEventData = (day: string) => {
+    const item = list.value?.find((item: any) => item.name == day)
+    if (!item) return false
+
+    return (item.eventDown || item.eventOff || item.eventUp) > 0
 }
 
 const selectChange = (showSelect: any, height: any, datePickerValue?: any) => {
     headerHeight.value = height
 
-    if (datePickerValue && datePickerValue.timeValue) {
+    // if (datePickerValue && datePickerValue.timeValue) {
-        // 更新时间参数
+    //     // 更新时间参数
-        tableStore.table.params.searchBeginTime = datePickerValue.timeValue[0]
+    //     tableStore.table.params.searchBeginTime = datePickerValue.timeValue[0]
-        tableStore.table.params.searchEndTime = datePickerValue.timeValue[1]
+    //     tableStore.table.params.searchEndTime = datePickerValue.timeValue[1]
-    }
+    // }
 }
 
 // 计算是否全屏展示
@@ -100,51 +103,7 @@ const value = ref(new Date())
 
 const transientListRef = ref()
 const list = ref()
-// const list = ref([
+
-//     {
-//         time: '2025-10-01',
-//         key: 81,
-//         type: 1,
-//         type1: 1,
-//         type2: 1
-//     },
-//     {
-//         time: '2025-10-31',
-//         key: 81,
-//         type: 1,
-//         type1: 1,
-//         type2: 1
-//     },
-//     {
-//         time: '2025-10-08',
-//         key: 20,
-//         type: 1,
-//         type1: 1,
-//         type2: 1
-//     },
-//     {
-//         time: '2025-10-16',
-//         key: 20,
-//         type: 1,
-//         type1: 1,
-//         type2: 1
-//     },
-//     {
-//         time: '2025-10-23',
-//         key: 20,
-//         type: 1,
-//         type1: 1,
-//         type2: 1
-//     },
-//     {
-//         time: '2025-10-04',
-//         key: 0
-//     },
-//     {
-//         time: '2025-10-05',
-//         key: 0
-//     }
-// ])
 const tableStore: any = new TableStore({
     url: '/cs-harmonic-boot/csevent/getEventDate',
     method: 'POST',
@@ -154,8 +113,8 @@ const tableStore: any = new TableStore({
     column: [],
 
     beforeSearchFun: () => {
-        tableStore.table.params.searchBeginTime = tableStore.table.params.searchBeginTime || prop.timeValue?.[0]
+        // tableStore.table.params.searchBeginTime = tableStore.table.params.searchBeginTime 
-        tableStore.table.params.searchEndTime = tableStore.table.params.searchEndTime || prop.timeValue?.[1]
+        // tableStore.table.params.searchEndTime = tableStore.table.params.searchEndTime
     },
 
     loadCallback: () => {
@@ -179,7 +138,13 @@ const setBackground = (value: string) => {
 provide('tableStore', tableStore)
 
 onMounted(() => {
+  nextTick(() => {
+    if (TableHeaderRef.value && typeof TableHeaderRef.value.setDatePicker === 'function') {
+      TableHeaderRef.value.setDatePicker([{ label: '月份', value: 3 }])
+    }
+    TableHeaderRef.value.setInterval(3)
     tableStore.index()
+  })
 })
 watch(
     () => prop.timeKey,
@@ -187,20 +152,20 @@ watch(
         tableStore.index()
     }
 )
-watch(
+// watch(
-    () => prop.timeValue,
+//     () => prop.timeValue,
-    (newVal, oldVal) => {
+//     (newVal, oldVal) => {
-        // 当外部时间值变化时，更新表格的时间参数
+//         // 当外部时间值变化时，更新表格的时间参数
-        if (newVal && (!oldVal || newVal[0] !== oldVal[0] || newVal[1] !== oldVal[1])) {
+//         if (newVal && (!oldVal || newVal[0] !== oldVal[0] || newVal[1] !== oldVal[1])) {
-            tableStore.table.params.searchBeginTime = newVal[0]
+//             tableStore.table.params.searchBeginTime = newVal[0]
-            tableStore.table.params.searchEndTime = newVal[1]
+//             tableStore.table.params.searchEndTime = newVal[1]
-            tableStore.index()
+//             tableStore.index()
-        }
+//         }
-    },
+//     },
-    {
+//     {
-        deep: true
+//         deep: true
-    }
+//     }
-)
+// )
 
 // 电压暂降点击事件
 const descentClick = () => {