LiuShu_0203 hace 2 meses
padre
commit
ccde6aed37
Se han modificado 1 ficheros con 40 adiciones y 14 borrados
  1. 40 14
      src/App.vue

+ 40 - 14
src/App.vue

@@ -367,6 +367,9 @@ const tableData = ref<any>();
 const alarmdata = ref<any>([]);
 const falogTitle = ref<string>('');
 
+const handleResize = () => handleScreenAuto();
+const interval = ref<number | null>(null);
+
 const showAlam = (item: any) => {
     selectIotlist(item.id)
         .then((res: any) => {
@@ -655,7 +658,12 @@ const initChart = (item: string, index: number, ThawingtemperatureDatalength: nu
     const chartElement = document.getElementById(chartId);
 
     if (chartElement) {
-        const myChart = echarts.init(chartElement);
+        // const myChart = echarts.init(chartElement);
+        let myChart = echarts.getInstanceByDom(chartElement);
+        if (myChart) {
+            myChart.dispose();
+        }
+        myChart = echarts.init(chartElement);
         const data = ThawingtemperatureDatalength === 3 ? 40 : 15; // 百分比
         let bgImageURL = '';
         if (ThawingtemperatureDatalength === 3) {
@@ -845,19 +853,26 @@ const initChart = (item: string, index: number, ThawingtemperatureDatalength: nu
         // console.log('bgImageURL', bgImageURL);
         myChart.setOption(option);
 
-        const resizeHandler = () => {
-            myChart.setOption(option);
-            console.log('试图变化了');
-            myChart.resize();
-        };
-
+        const resizeHandler = () => myChart.resize();
         window.addEventListener('resize', resizeHandler);
-
-        // 在组件卸载时移除事件监听器
         onUnmounted(() => {
             window.removeEventListener('resize', resizeHandler);
             myChart.dispose();
         });
+
+        // const resizeHandler = () => {
+        //     myChart.setOption(option);
+        //     console.log('试图变化了');
+        //     myChart.resize();
+        // };
+
+        // window.addEventListener('resize', resizeHandler);
+
+        // // 在组件卸载时移除事件监听器
+        // onUnmounted(() => {
+        //     window.removeEventListener('resize', resizeHandler);
+        //     myChart.dispose();
+        // });
     }
 };
 
@@ -986,8 +1001,12 @@ const handleMqttMessage = (topic: string, message: any) => {
     if (topic === 'warn') {
         try {
             const data = JSON.parse(message.toString());
+            // if (alarmdata.value.length >= 10) {
+            //     alarmdata.value.shift();
+            // }
+            // alarmdata.value.push(data);
             if (alarmdata.value.length >= 10) {
-                alarmdata.value.shift();
+                alarmdata.value.splice(0, alarmdata.value.length - 10);
             }
             alarmdata.value.push(data);
         } catch (error) {
@@ -1040,7 +1059,7 @@ const handleMqttMessage = (topic: string, message: any) => {
 
 onMounted(() => {
     updateTime(); // 初始化时立即更新一次时间
-    const interval = setInterval(updateTime, 1000);
+    interval.value = setInterval(updateTime, 1000);
 
     uselistData();
     // 连接 MQTT
@@ -1049,11 +1068,18 @@ onMounted(() => {
     // 初始化自适应
     handleScreenAuto();
     window.onresize = () => handleScreenAuto();
+    window.addEventListener('resize', handleResize);
 
     // 清除定时器以避免内存泄漏
-    onUnmounted(() => {
-        clearInterval(interval);
-    });
+    // onUnmounted(() => {
+    //     clearInterval(interval);
+    // });
+});
+onUnmounted(() => {
+    clearInterval(interval.value as number);
+    window.removeEventListener('resize', handleResize);
+    unsubscribes();
+    // unsubscribeTopic();
 });
 </script>
 <style scope lang="less">