稳态治理效果分析时间修改

src/components/cockpit/trendComparison/index.vue

@@ -1,7 +1,14 @@
 <template>
     <div>
         <!--趋势对比 -->
-        <TableHeader datePicker :showReset="false" @selectChange="selectChange" v-if="fullscreen">
+        <TableHeader
+            datePicker
+            ref="TableHeaderRef"
+            :timeKeyList="['4', '5']"
+            :showReset="false"
+            @selectChange="selectChange"
+            v-if="fullscreen"
+        >
             <template v-slot:select>
                 <el-form-item label="监测对象">
                     <el-select v-model="tableStore.table.params.sensitiveUserId" placeholder="请选择监测对象" clearable>
@@ -77,10 +84,9 @@ import TableStore from '@/utils/tableStore'
 import TableHeader from '@/components/table/header/index.vue'
 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'
+import { getTime } from '@/utils/formatTime'
 
 const prop = defineProps({
     w: { type: [String, Number] },
@@ -88,15 +94,13 @@ const prop = defineProps({
     width: { type: [String, Number] },
     height: { type: [String, Number] },
     timeKey: { type: [String, Number] },
-    timeValue: { type: Object }
+    timeValue: { type: Object },
+    interval: { type: Number }
 })
 
-const route = useRoute()
-const timeCacheStore = useTimeCacheStore()
+const TableHeaderRef = ref()
 const config = useConfig()
 
-const lineIdList = ref(JSON.parse(window.localStorage.getItem('lineIdList') || '[]'))
-
 // 计算是否全屏展示
 const fullscreen = computed(() => {
     const w = Number(prop.w)
@@ -231,7 +235,7 @@ const setEchart = () => {
             data: afterGroupedByPhase[phase],
             itemStyle: {
                 normal: {
-                    color:color
+                    color: color
                 }
             },
             lineStyle: {
@@ -324,8 +328,7 @@ const tableStore: any = new TableStore({
     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]
+        setTime()
         if (!tableStore.table.params.sensitiveUserId && idList.value?.length > 0) {
             tableStore.table.params.sensitiveUserId = idList.value[0].id
         }
@@ -356,7 +359,7 @@ const tableStore: any = new TableStore({
             chartsListBefore.value = tableStore.table.data.before
             chartsListAfter.value = tableStore.table.data.after
             setEchart()
-        } 
+        }
     }
 })
 
@@ -370,6 +373,25 @@ onMounted(() => {
     initListByIds()
 })
 
+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 不是一个有效数组')
+    }
+}
+
 // 判断是否应该显示谐波次数选择框
 const shouldShowHarmonicCount = () => {
     if (!tableStore.table.params.indicator || !indicatorList.value) return false
@@ -405,12 +427,7 @@ watch(
 watch(
     () => prop.timeValue,
     (newVal, oldVal) => {
-        // 当外部时间值变化时，更新表格的时间参数
-        if (newVal && (!oldVal || newVal[0] !== oldVal[0] || newVal[1] !== oldVal[1])) {
-            tableStore.table.params.searchBeginTime = newVal[0]
-            tableStore.table.params.searchEndTime = newVal[1]
-            tableStore.index()
-        }
+        tableStore.index()
     },
     {
         deep: true
@@ -433,7 +450,6 @@ watch(
     }
 )
 
-const addMenu = () => {}
 </script>
 <style lang="scss" scoped>
 // :deep(.el-select) {