实时数据-实时趋势页面调试

src/views/govern/device/control/index.vue

@@ -207,9 +207,9 @@
                 <!-- 实时数据 -->
                 <div style="height: calc(100vh - 200px)" v-if="dataSet.indexOf('_realtimedata') != -1">
                     <div class="view_top_btn" v-if="realTimeFlag">
-                        <el-button type="primary" size="small" :icon="Platform" @click="handleRecordWaves">
+                        <!-- <el-button type="primary" size="small" :icon="Platform" @click="handleRecordWaves">
                             实时录波
-                        </el-button>
+                        </el-button> -->
                         <el-button type="primary" size="small" :icon="TrendCharts" @click="handleTrend">
                             实时趋势
                         </el-button>
@@ -225,9 +225,9 @@
                     <!-- 实时数据-实时录波组件 -->
                     <recordWoves v-if="!realTimeFlag && sonTab == 0"></recordWoves>
                     <!-- 实时数据-实时趋势组件 -->
-                    <realTrend v-if="!realTimeFlag && sonTab == 1"></realTrend>
+                    <realTrend v-show="!realTimeFlag && sonTab == 1" ref="realTrendRef"></realTrend>
                     <!-- 实时数据-谐波频谱组件 -->
-                    <harmonicSpectrum v-if="!realTimeFlag && sonTab == 2" ref="harmonicSpectrumRef"></harmonicSpectrum>
+                    <harmonicSpectrum v-show="!realTimeFlag && sonTab == 2" ref="harmonicSpectrumRef"></harmonicSpectrum>
                 </div>
                 <!-- 暂态事件 -->
                 <div style="height: calc(100vh - 200px)" v-show="dataSet.indexOf('_event') != -1">
@@ -244,7 +244,6 @@
         <analysisList ref="analysisListRef"></analysisList>
     </div>
 </template>
-
 <script setup lang="ts">
 import Detail from './detail.vue'
 import PointTree from '@/components/tree/govern/pointTree.vue'
@@ -338,18 +337,24 @@ const sonTab = ref()
 const handleRecordWaves = () => {
     realTimeFlag.value = false
     sonTab.value = 0
+    window.clearInterval(timer.value)
 }
 //实时趋势
+const realTrendRef = ref()
 const handleTrend = () => {
     realTimeFlag.value = false
     sonTab.value = 1
+    console.log(realTrendRef.value, '++++++')
+    realTrendRef.value && realTrendRef.value.open({ devId: deviceId.value, lineId: lineId.value })
+    window.clearInterval(timer.value)
 }
 //谐波频谱
 const harmonicSpectrumRef = ref()
 const handleHarmonicSpectrum = () => {
     realTimeFlag.value = false
     sonTab.value = 2
-    harmonicSpectrumRef.value && harmonicSpectrumRef.value.init()
+    harmonicSpectrumRef.value && harmonicSpectrumRef.value.getHarmonicSpectrumParams({ devId: deviceId.value, lineId: lineId.value })
+    window.clearInterval(timer.value)
 }
 //返回
 const handleReturn = () => {
@@ -430,14 +435,21 @@ const nodeClick = async (e: anyObj) => {
 }
 const realTimeRef: any = ref()
 const intRealTime = async (val: any) => {
-    await getTabsDataByType(val).then(res => {
+    getTabsDataByType(val).then(res => {
         realTimeRef.value && realTimeRef.value.getRealTimeData(res.data)
     })
+    timer.value = window.setInterval(() => {
+        getTabsDataByType(val).then(res => {
+            realTimeRef.value && realTimeRef.value.getRealTimeData(res.data)
+        })
+        console.log(timer.value, '定时器时间666666 ')
+    }, 20000)
 }
 //趋势数据组件
 const trendRef: any = ref()
 //暂态事件组件
 const eventRef: any = ref()
+const timer: any = ref()
 //tab点击事件
 const handleClick = async (tab?: any) => {
     tableLoading.value = true
@@ -449,10 +461,13 @@ const handleClick = async (tab?: any) => {
         tableData.value = []
         formInline.pageNum = 1
     }
+    if (timer.value) {
+        window.clearInterval(timer.value)
+    }
+
     // setTimeout(async () => {
     //查询历史指标
     if (dataSet.value.includes('_history')) {
-        console.log('执行次数55555')
         formInline.startTime = datePickerRef.value && datePickerRef.value.timeValue[0]
         formInline.endTime = datePickerRef.value && datePickerRef.value.timeValue[1]
         formInline.id = dataSet.value.replace('_history', '')
@@ -461,7 +476,6 @@ const handleClick = async (tab?: any) => {
             formInline.total = res.data.total
             tableLoading.value = false
         })
-        console.log(tableData.value, '++++++++++++')
     }
     //查询趋势数据
     if (dataSet.value.includes('_trenddata')) {
@@ -492,9 +506,12 @@ const handleClick = async (tab?: any) => {
             lineId: lineId.value //e.pid
         }
         intRealTime(obj)
-        await setTimeout(() => {
-            intRealTime(obj)
-        }, 20000)
+    }
+    if (!dataSet.value.includes('_realtimedata')) {
+        // console.log(timer.value, '=====定时球带哦用时间=====')
+        // if(timer.value){
+        //      window.clearInterval(timer.value)
+        // }
     }
     //查询暂态事件
     if (dataSet.value.includes('_event')) {
@@ -517,7 +534,6 @@ const handleClick = async (tab?: any) => {
         // })
     }
     //查询当前指标
-    console.log(dataSet.value.indexOf('_'), '查询当前指标')
     if (!dataSet.value.includes('_')) {
         formInline.id = dataSet.value
         await deviceRtData(formInline).then((res: any) => {
@@ -526,6 +542,7 @@ const handleClick = async (tab?: any) => {
             tableLoading.value = false
         })
     }
+
     // }, 100)
 }
 //模版下载