20230607

package.json

@@ -20,6 +20,7 @@
     "highcharts": "^10.3.2",
     "highcharts-vue": "^1.4.0",
     "md5": "^2.3.0",
+    "mitt": "^3.0.0",
     "pinia": "^2.0.32",
     "qiniu-js": "^3.4.1",
     "ramda": "^0.29.0",

src/components/highcharts-h.vue

@@ -1,151 +1,172 @@
 <template>
-    <div style="height: 100%;" id="Chartid">
-    <Chart ref="chart1" style="min-height: 600px" :options="chartOptions()" constructor-type="stockChart"></Chart>
+    <div style="height: 100%;">
+        <Chart style="min-height: 600px;" :options="chartOptions()" constructor-type="stockChart"></Chart>
+        <div style="text-align: center;margin-top: 20px;">{{ computedData }}</div>
     </div>
 </template>
 
-<script>
+<script setup>
+import emitter from "@/plugin/bus";
 import { Chart } from 'highcharts-vue';
-import moment from 'moment';
+import { computed, onBeforeUnmount } from "vue";
+import { useMessage } from "naive-ui";
+import {useStore} from 'vuex'
+const message = useMessage()
+const popData = defineProps({
+    dataList: {
+        type: Array,
+        default: () => [],
+    }
+})
 
 
 
-export default {
-    props:['higData'],
-    components: { Chart },
-    data() {
-        return {
-            seriesData:[],
-            selfshow:true,//true显示默认显示温度
-        }
-    },
-    watch:{
-        higData:{
-            handler(newVal){
-                this.TidyUpData(newVal)
-            },
-            deep:true
-        }
-    },
-    mounted(){
-        
-    },
-    methods: {
-        seIfchart(){//切换温湿度
-            console.log('切换',this.seriesData,this.selfshow)
-            this.selfshow = !this.selfshow
-           
-        },
-        
+let plotLinesData = reactive({
+    hBottom:null,
+    hTop:null
+})
 
+const store = useStore()
+const plot = computed(() => store.state.plotLineList)
+plotLinesData.hBottom = plot.value.hBottom
+plotLinesData.hTop = plot.value.hTop
 
 
-        async TidyUpData(arr){
-            const loading = this.$loading({
-                lock: true,
-                text: '图表数据渲染中，请稍后...',
-                spinner: 'el-icon-loading',
-                background: 'rgba(0, 0, 0, 0.7)'
-            });
-            this.seriesData = []
-            for (let i = 0; i < arr.length; i++) {
-                let resIt = await this.setDataFun(arr[i])
-                this.seriesData.push(resIt)
-            }
-            loading.close()
+emitter.on("onMessage", (val) => {
+    plotLinesData.hBottom = val.hBottom
+    plotLinesData.hTop = val.hTop
+});
+//关闭
+onBeforeUnmount(() => {
+    emitter.off("onMessage");
+});
+const computedData = computed(() => {
+    console.log('计算属性',popData.dataList)
+    if (popData.dataList.length != 0) {
+        return computedDataFun()
+    } else {
+        return ''
+    }
+})
+const computedDataFun = () => {
+    let arr = popData.dataList
+    let mapData = []
+    for (const key of arr) {
+        for (let i = 0; i < key.data.length; i++) {
+            mapData.push(key.data[i][1])
+        }
+    }
+    if (mapData.length == 0) {
+        message.error('哎呀，没有可展示的数据哦')
+        return
+    }
+    //求和
+    let num = mapData.reduce((n, m) => n + m);//求和
+    //最大值
+    let maxData = Math.max(...mapData)
+    //最小值
+    let minData = Math.min(...mapData)
+    //平均值
+    let pingjun = (num / mapData.length).toFixed(1)
+
+    return `最大值${maxData}，最小值${minData}，平均值${pingjun}`
+}
+const chartOptions = () => {
+    var obj = {
+        chart: {
+            zoomType: 'x',//框选放大
+            panning: true, //禁用放大
+            // zooming: {
+            //     singleTouch: true,
+            //     resetButton: {},
+            //     type: 'x',
+            //     panning: true, //禁用放大
+            // },
+            events: {
+                selection(event) {
+                    console.log('时间区间选择', event)
+                },
+            },
+        },
+        time: {
+            useUTC: false
+        },
+        boost: {
+            useGPUTranslations: false
         },
-        
-        setDataFun(arr){
-            return new Promise(resolve=>{
-                const obj = {
-                    name:arr[0].T_sn,
-                    data:[]
+        xAxis: {
+            // labels: {
+            //     format: '{value:%Y-%m-%d %H:%M:%S}',
+            // },
+            type: 'datetime',
+        },
+        yAxis: {
+            opposite: false, //设置y轴提示在左边
+            title: {
+                // text: '温度℃'
+            },
+            plotLines:[{
+                color: '#FF1D00', //线的颜色，定义为红色
+                dashStyle: 'DashDot', //默认值，这里定义为实线
+                value: plotLinesData.hTop, //定义在那个值上显示标示线，这里是在x轴上刻度为3的值处垂直化一条线  
+                width: 2, //标示线的宽度，2px
+                label: {
+                    text: `湿度上限（${plotLinesData.hTop}Rh）`, //标签的内容
+                    align: 'right', //标签的水平位置，水平居左,默认是水平居中center
+                    // x: 10 //标签相对于被定位的位置水平偏移的像素，重新定位，水平居左10px
+                }
+            },{
+                color: '#FF1D00', //线的颜色，定义为红色
+                dashStyle: 'DashDot', //默认值，这里定义为实线
+                value: plotLinesData.hBottom, //定义在那个值上显示标示线，这里是在x轴上刻度为3的值处垂直化一条线  
+                width: 2, //标示线的宽度，2px
+                label: {
+                    text: `湿度下限（${plotLinesData.hBottom}Rh）`, //标签的内容
+                    align: 'right', //标签的水平位置，水平居左,默认是水平居中center
+                    // x: 10 //标签相对于被定位的位置水平偏移的像素，重新定位，水平居左10px
                 }
-                arr.forEach(item => {
-                    obj.data.push([new Date(item.T_time).getTime(),item.T_rh,item.T_t,item.T_sn,item.T_id,item.ID])
-                });
-                
-                setTimeout(() => {
-                    resolve(obj)
-                }, 500);
-            }) 
+            }]
+           
         },
-        chartOptions() {
-            let seIf = this
-            var obj = {
-                chart: {
-                    zoomType: 'x',//框选放大
-                    panning: true, //禁用放大
-                    // zooming: {
-                    //     singleTouch: true,
-                    //     resetButton: {},
-                    //     type: 'x',
-                    //     panning: true, //禁用放大
-                    // },
-                    events: {
-                        selection(event) {
-                            let maxTime1 = moment(Math.floor(event.xAxis[0].min)).format('YYYY-MM-DD HH:mm:ss');
-                            let maxTime2 = moment(Math.floor(event.xAxis[0].max)).format('YYYY-MM-DD HH:mm:ss')
-                            console.log('时间区间选择',maxTime1,maxTime2)
-                            let timearr = [maxTime1,maxTime2]
-                            seIf.$emit("setTime",timearr)
-                        },
-                    },
-                },
-                time: {
-                    useUTC: false
-                },
-                boost: {
-                    useGPUTranslations: true
-                },
-                // xAxis: {
-                //     labels: {
-                //         format: '{value:%Y-%m-%d %H:%M:%S}',
-                //     },
-                // },
-                yAxis: {
-                    title: {
-                        text: '湿度Rh'
-                    },
-                    opposite: false, //设置y轴提示在左边
-                },
-                plotOptions: {
-                    series:{
-                        turboThreshold:0 //性能阈值检查,默认值为1000，当数据量超过这个值就会报错；如果需要关掉性能阈值检查，可以将此参数设置为 0
-                    },
-                },
-                legend: {
-                    layout: 'vertical',
-                    align: 'right',
-                    verticalAlign: 'middle'
-                },
-                rangeSelector: {
-                    buttons: [], // 不显示左边的zoom
-                    selected: 1,
-                    inputEnabled: false // 不显示日期输入框
-                },
-                title: {
-                    text: '冷链湿度曲线图'
-                },
-                subtitle: {
-                    useHTML: true,
-                    // text:'1111'//副标题
-                },
-                dataGrouping: {
-                    enabled: true // 取消根据日期进行数据分组
-                },
-                tooltip: {
-                    valueSuffix: 'Rh',
-                    xDateFormat: '%Y-%m-%d %H:%M:%S',
-                    // chart: {
-                    //     type: 'spline' //图表类型,column,line,spline,area等
-                    // }
-                },
-                series:this.seriesData
-            }
-            // window.onresize = resize;
-            return obj
+        plotOptions: {
+            series: {
+                turboThreshold: 0 //性能阈值检查,默认值为1000，当数据量超过这个值就会报错；如果需要关掉性能阈值检查，可以将此参数设置为 0
+            },
+        },
+        legend: {
+            layout: 'vertical',
+            align: 'right',
+            verticalAlign: 'middle'
+        },
+        rangeSelector: {
+            buttons: [], // 不显示左边的zoom
+            selected: 1,
+            inputEnabled: false // 不显示日期输入框
+        },
+        title: {
+            // text: '冷链温度曲线图'
+        },
+        subtitle: {
+            useHTML: true,
+            // text:'1111'//副标题
         },
+        dataGrouping: {
+            enabled: true // 取消根据日期进行数据分组
+        },
+        tooltip: {
+            valueSuffix: ' Rh',
+            xDateFormat: '%Y-%m-%d %H:%M:%S',
+            // pointFormat: '<span style="color:{series.color}">{series.name}: <b>{point.y:,.0f}%</b><br/>',
+            shared: true
+            // chart: {
+            //     type: 'spline' //图表类型,column,line,spline,area等
+            // }
+        },
+        series: popData.dataList
     }
+    return obj
 }
+
+
+
 </script>

src/components/highcharts-t.vue

@@ -6,25 +6,47 @@
 </template>
 
 <script setup>
+import emitter from "@/plugin/bus";
 import { Chart } from 'highcharts-vue';
-import { computed } from "vue";
+import { computed, onBeforeUnmount, ref } from "vue";
 import { useMessage } from "naive-ui";
+import {useStore} from 'vuex'
 const message = useMessage()
 const popData = defineProps({
-    dataList:{
-        type:Array,
+    dataList: {
+        type: Array,
         default: () => [],
     }
 })
-const computedData = computed(()=>{
-    // console.log('计算属性',popData.dataList)
-    if(popData.dataList.length!=0){
+
+
+const plotLinesData = reactive({
+    tBottom:null,
+    tTop:null
+})
+const store = useStore()
+const plot = computed(() => store.state.plotLineList)
+plotLinesData.tBottom = plot.value.tBottom
+plotLinesData.tTop = plot.value.tTop
+
+
+emitter.on("onMessage", (val) => {
+    plotLinesData.tBottom = val.tBottom
+    plotLinesData.tTop = val.tTop
+});
+//关闭
+onBeforeUnmount(() => {
+    emitter.off("onMessage");
+});
+const computedData = computed(() => {
+    console.log('计算属性',popData.dataList)
+    if (popData.dataList.length != 0) {
         return computedDataFun()
-    }else{
+    } else {
         return ''
     }
 })
-const computedDataFun = ()=>{
+const computedDataFun = () => {
     let arr = popData.dataList
     let mapData = []
     for (const key of arr) {
@@ -32,26 +54,26 @@ const computedDataFun = ()=>{
             mapData.push(key.data[i][1])
         }
     }
-    if(mapData.length==0){
+    if (mapData.length == 0) {
         message.error('哎呀，没有可展示的数据哦')
         return
     }
     //求和
-    let num = mapData.reduce((n,m) => n + m);//求和
+    let num = mapData.reduce((n, m) => n + m);//求和
     //最大值
     let maxData = Math.max(...mapData)
     //最小值
     let minData = Math.min(...mapData)
     //平均值
-    let pingjun = num/mapData.length
-    
+    let pingjun = (num / mapData.length).toFixed(1)
+
     return `最大值${maxData}，最小值${minData}，平均值${pingjun}`
 }
 const chartOptions = () => {
     var obj = {
         chart: {
             zoomType: 'x',//框选放大
-            panning: true, //禁用放大
+            // panning: true, //禁用放大
             // zooming: {
             //     singleTouch: true,
             //     resetButton: {},
@@ -60,15 +82,17 @@ const chartOptions = () => {
             // },
             events: {
                 selection(event) {
-                    console.log('时间区间选择', event.xAxis)
+                    console.log('时间区间选择', event.xAxis[0].min)
                 },
             },
+            
         },
         time: {
             useUTC: false
         },
+        
         boost: {
-            useGPUTranslations: false
+            useGPUTranslations: true
         },
         xAxis: {
             // labels: {
@@ -77,10 +101,32 @@ const chartOptions = () => {
             type: 'datetime',
         },
         yAxis: {
+            opposite: false, //设置y轴提示在左边
             title: {
                 // text: '温度℃'
             },
-            opposite: false, //设置y轴提示在左边
+            plotLines:[{
+                color: '#FF1D00', //线的颜色，定义为红色
+                dashStyle: 'DashDot', //默认值，这里定义为实线
+                value: plotLinesData.tTop, //定义在那个值上显示标示线，这里是在x轴上刻度为3的值处垂直化一条线  
+                width: 2, //标示线的宽度，2px
+                label: {
+                    text: `温度上限（${plotLinesData.tTop}℃）`, //标签的内容
+                    align: 'right', //标签的水平位置，水平居左,默认是水平居中center
+                    // x: 10 //标签相对于被定位的位置水平偏移的像素，重新定位，水平居左10px
+                }
+            },{
+                color: '#FF1D00', //线的颜色，定义为红色
+                dashStyle: 'DashDot', //默认值，这里定义为实线
+                value: plotLinesData.tBottom, //定义在那个值上显示标示线，这里是在x轴上刻度为3的值处垂直化一条线  
+                width: 2, //标示线的宽度，2px
+                label: {
+                    text: `温度下限（${plotLinesData.tBottom}℃）`, //标签的内容
+                    align: 'right', //标签的水平位置，水平居左,默认是水平居中center
+                    // x: 10 //标签相对于被定位的位置水平偏移的像素，重新定位，水平居左10px
+                }
+            }]
+           
         },
         plotOptions: {
             series: {
@@ -88,14 +134,18 @@ const chartOptions = () => {
             },
         },
         legend: {
-            layout: 'vertical',
+            // layout: 'vertical',
             align: 'right',
-            verticalAlign: 'middle'
+            verticalAlign: 'middle',
+            x: -10,
+            y: 100,
+            borderWidth: 0
         },
         rangeSelector: {
             buttons: [], // 不显示左边的zoom
             selected: 1,
             inputEnabled: false // 不显示日期输入框
+            
         },
         title: {
             // text: '冷链温度曲线图'
@@ -116,11 +166,17 @@ const chartOptions = () => {
             //     type: 'spline' //图表类型,column,line,spline,area等
             // }
         },
+        
         series: popData.dataList
     }
     return obj
 }
 
-
-
+// const dataLists = ref([])
+// let t = ref(1681621260000)
+// for (let index = 0; index < 2000; index++) {
+//     t.value = t.value + 60000
+//     dataLists.data.push([t.value,(Math.random()*10).toFixed(1)])
+// }
+// console.log('显示的值',dataLists)
 </script>

src/plugin/bus.js

@@ -0,0 +1,3 @@
+import mitt from "mitt";
+const emitter = mitt();
+export default emitter;

src/store/index.js

@@ -3,14 +3,23 @@ import { createStore } from 'vuex'
 
 export default createStore({
   state: {
-    TaskId:''
+    TaskId:'',
+    plotLineList:{
+      tBottom:null,
+      tTop:null,
+      hBottom:null,
+      hTop:null
+    }
   },
   getters: {
    
   },
   mutations: {
+    setplotData(state,data){
+      console.log('存储',data)
+      state.plotLineList = data
+    },
     setTaskId(state,data){
-        console.log('存储',data)
       state.TaskId = data;
     }
   },

src/views/data/edit/FormList.vue

@@ -93,7 +93,7 @@ import { getVerifyTemplateMapDataList,putVerifyTemplateMapData} from '@/api';
 import { getToken } from '@/utils/storage/sessionToken';
 import { ref, watch } from 'vue';
 import { InformationCircleOutline } from '@vicons/ionicons5';
-
+import { TimeDate } from '@/plugin/timeFun';
 const props = defineProps({
   task: {
     type: Object,
@@ -125,23 +125,25 @@ const blurFun = () =>{
   console.log('失去焦点')
 }
 const focusFun = (obj,index)=>{
+  console.log('获得焦点',obj,index)
   focusData.fNum = index
   focusData.obj = obj
+  console.log('获得焦点',obj,index,focusData)
 }
 //监听单个时间点击赋值
 watch(
   () => props.time,
   (newValue) => {
-    console.log('单击',newValue,focusData.fNum)
+    console.log('单击',TimeDate(newValue),focusData.fNum)
     if(focusData.fNum==null){
       return
     }else{
       console.log('继续单击',newValue,focusData.fNum,focusData.obj)
       if (focusData.obj.T_label === 7) {
-        formValue.formList[focusData.fNum].T_value = newValue.length==19?newValue.slice(0,16):newValue
+        formValue.formList[focusData.fNum].T_value = TimeDate(newValue)
       }
       if (focusData.obj.T_label === 12) {
-        formValue.formList[focusData.fNum].T_value[0] = newValue.length==19?newValue.slice(0,16):newValue
+        formValue.formList[focusData.fNum].T_value[0] = TimeDate(newValue)
       }
       
     }
@@ -154,16 +156,16 @@ watch(
   () => props.temporalInterval,
   (newValue) => {
     console.log('框选',newValue)
-    if(focusData.fNum==null){
-      return
-    }
-    if(focusData.obj.T_label === 9){
-      formValue.formList[focusData.fNum].T_value = newValue
-    }
-    if(focusData.obj.T_label === 13){
-      formValue.formList[focusData.fNum].T_value[0] = newValue
-    }
-    focusData.fNum = null
+    // if(focusData.fNum==null){
+    //   return
+    // }
+    // if(focusData.obj.T_label === 9){
+    //   formValue.formList[focusData.fNum].T_value = newValue
+    // }
+    // if(focusData.obj.T_label === 13){
+    //   formValue.formList[focusData.fNum].T_value[0] = newValue
+    // }
+    // focusData.fNum = null
   }
 );
 watch(()=>formValue.formList, async(newValue,old)=>{
@@ -253,6 +255,7 @@ const getTemplateList = async () => {
           item.T_value = item.T_value.split('|')
         }
       }else if (item.T_label === 12) {
+        // item.T_value = item.T_value = [null,null]
         if(item.T_value=='' || item.T_value==null){
           item.T_value = [null,null]
         }else{
@@ -261,7 +264,6 @@ const getTemplateList = async () => {
           }else{
             item.T_value = [item.T_value.split('/')[0], item.T_value.split('/')[1]]
           }
-         
         }
       } else if (item.T_label === 13) {
         if(item.T_value=='' || item.T_value==null || item.T_value=='null'){

src/views/data/edit/SetVue.vue

@@ -29,11 +29,15 @@
 </template>
 
 <script setup>
+import { useStore } from 'vuex';
+import emitter from "@/plugin/bus";
 const emit = defineEmits(['submit']);
 
-//
+const store = useStore()
 const submitCallback = () => {
-  emit('submit', formValue);
+  emitter.emit("onMessage",formValue);
+  store.commit('setplotData',formValue)  
+  // emit('submit', formValue);
 };
 
 // 是否展示 Modal
@@ -41,16 +45,16 @@ const showModal = ref(false);
 
 // 表单数据
 const formValue = reactive({
-  tTop: null,
-  tBottom: null,
-  hTop: null,
-  hBottom: null,
+  tTop: 8.25,
+  tBottom: 8.15,
+  hTop: 73.07,
+  hBottom: 73.03,
 });
 
 // 显示设置
 const showSetModal = () => {
   showModal.value = true;
-  Object.keys(formValue).forEach((key) => (formValue[key] = null));
+  // Object.keys(formValue).forEach((key) => (formValue[key] = null));
 };
 </script>
 

src/views/data/edit/index.vue

@@ -66,19 +66,16 @@
               <ImportVue :task="task" />
               <ImportPlatform :task="task" />
               <AddVue :class-list="classList" :task="task" />
-              <SetVue @submit="handleSet" />
+              <SetVue/>
               <n-button type="primary" @click="goDataEd">数据编辑</n-button>
             </n-space>
           </n-space>
           <n-tabs type="segment" animated v-model:value="tabChart" @update:value="handleTabChange">
             <n-tab-pane name="温度" tab="温度">
-              <!-- <Chart :style="{ minHeight: `${height - 300}px` }" ref="chart1" constructor-type="stockChart"
-                :options="chartOptions1"></Chart> -->
               <highchartsT :dataList="dataList"></highchartsT>
             </n-tab-pane>
             <n-tab-pane name="湿度" tab="湿度">
-              <Chart :style="{ minHeight: `${height - 300}px` }" ref="chart2" constructor-type="stockChart"
-                :options="chartOptions2"></Chart>
+              <highchartsH :dataList="dataList"></highchartsH>
             </n-tab-pane>
           </n-tabs>
         </div>
@@ -125,6 +122,8 @@
 
 import { Chart } from 'highcharts-vue';
 import highchartsT from '@/components/highcharts-t.vue'
+import highchartsH from '@/components/highcharts-h.vue'
+
 import {
   deleteTaskData,
   editTaskData,
@@ -146,6 +145,7 @@ import DeleteClass from './DeleteTaskClass.vue';
 import { dateFormat } from 'highcharts';
 import { TimeDate } from '@/plugin/timeFun';
 import { useMessage } from "naive-ui";
+import { ref } from 'vue';
 
 const formatted = useDateFormat(useNow(), 'YYYY-MM-DD HH:mm:ss');
 
@@ -159,8 +159,6 @@ const task = window.sessionStorage.getItem('task')
   ? JSON.parse(window.sessionStorage.getItem('task'))
   : {};
 
-const chart1 = ref(null);
-const chart2 = ref(null);
 
 // Modal 数据源
 const modal = reactive({
@@ -209,10 +207,13 @@ const queryData = reactive({
   T_task_id: task.T_task_id,
   T_sn: '',
   T_id: '',
-  Time_start: '2023-04-18 07:14:00',
-  Time_end: '2023-04-18 07:25:00',
-  // Time_start: '',
-  // Time_end: '',
+  // Time_start: '2023-04-18 07:14:00',
+  // Time_end: '2023-04-18 07:25:00',
+  // Time_start: '2023-04-06 23:50:00',
+  // Time_end: '2023-04-07 00:00:00',
+  
+  Time_start: '',
+  Time_end: '',
   page: 1,
   page_z: 9999,
 });
@@ -225,7 +226,7 @@ const getClassList = async () => {
 };
 getClassList();
 
-
+const resData = ref()
 //渲染按钮
 const renderFun = async () => {
   if(checkValues.value==null){
@@ -238,7 +239,7 @@ const renderFun = async () => {
     queryData.T_id = checkValues.value[i].T_id;
     queryData.T_sn = checkValues.value[i].T_sn;
     const resIt = await getDataList();
-    console.log('/*/*/',resIt)
+    resData.value = resIt
     arr.push(convertDataFun(resIt.data.Data.List))
   }
   dataList.value = arr
@@ -262,7 +263,8 @@ const deleteTask = async () => {
 
 // 编辑
 const editTask = async () => {
-  console.log(tabValue.value, dataInfo.value)
+  console.log('88',tabValue.value, dataInfo.value,formValue.T_t,formValue.T_rh)
+  // return
   const { data: res } = await editTaskData({
     T_task_id: queryData.T_task_id,
     Id: dataInfo.value[5],
@@ -283,10 +285,17 @@ const convertDataFun = (array) => {
     data: [],
     events: {
       click(e) {
-        formValue.T_t = e.point.y
+        console.log('点击',e.point.x)
+        time.value = e.point.x
+        if(tabChart.value == '温度'){
+          formValue.T_t = e.point.y
+        }else{
+          formValue.T_rh = e.point.y
+        }
+        // formValue.T_t = e.point.y
         modal.showModal = true
         queryData.T_id = e.point.series.name;
-        modal.title = '温度';
+        modal.title = tabChart.value == '温度'?'温度':'湿度';
         let serName = e.point.series.name
         const b = dataList.value.find(item => item.name == serName)
         dataInfo.value = b.data[e.point.index];
@@ -297,7 +306,7 @@ const convertDataFun = (array) => {
     let arr = array.reverse()
     objData.name = arr[0].T_sn
     arr.forEach(item => {
-      objData.data.push([new Date(item.T_time).getTime(), item.T_t, item.T_rh, item.T_sn, item.T_id, item.ID])
+      objData.data.push([new Date(item.T_time).getTime(), tabChart.value=='温度'?item.T_t:item.T_rh, tabChart.value=='温度'?item.T_rh:item.T_t, item.T_sn, item.T_id, item.ID])
     });
   } else {
     objData.data = []
@@ -359,171 +368,18 @@ const checkValues = ref(null);
 // tab
 const tabChart = ref('温度');
 
-const handleTabChange = (value) => {
-  tabValue.value = value
-  checkValues.value = [];
-  checked.value = false;
-};
-
-//
-const handleSet = (data) => {
-  if (tabChart.value === '温度') {
-    chart1.value.chart.yAxis[0].addPlotLine({
-      color: 'red',
-      width: 2,
-      value: data.tTop,
-      label: {
-        text: `上限（${data.tTop}）`,
-      },
-    });
-    chart1.value.chart.yAxis[0].addPlotLine({
-      color: 'red',
-      width: 2,
-      value: data.tBottom,
-      label: {
-        text: `下限（${data.tBottom}）`,
-      },
-    });
-  } else {
-    chart2.value.chart.yAxis[0].addPlotLine({
-      color: 'red',
-      width: 2,
-      value: data.hTop,
-      label: {
-        text: `上限（${data.hTop}）`,
-      },
-    });
-    chart2.value.chart.yAxis[0].addPlotLine({
-      color: 'red',
-      width: 2,
-      value: data.hBottom,
-      label: {
-        text: `下限（${data.hBottom}）`,
-      },
-    });
-  }
+const handleTabChange = (e) => {
+  tabValue.value = e
+  // console.log('切换',resData.value,tabValue.value,e)
+  renderFun()
+ 
 };
 
 
 
-const selectedValue = ref([]);
-
 
 const temporalInterval = ref('');
 
-// 图表配置
-const chartOptions1 = {
-  xAxis: {
-    labels: {
-      format: '{value:%Y-%m-%d %H:%M:%S}',
-    },
-  },
-  time: {
-    useUTC: false
-  },
-  boost: {
-    useGPUTranslations: true
-  },
-
-  tooltip: {
-    xDateFormat: '%Y-%m-%d %H:%M:%S',
-    // headerFormat: '<small class="headerFormat">{.key}:{point.stackTotal}</small><table>',
-    // valueDecimals: 0  //会导致提示框内容显示错误
-
-  },
-  yAxis: {
-    labels: {
-      format: '{text}℃',
-    },
-    plotLines: [],
-  },
-
-  legend: {
-    enabled: true,
-  },
-
-  accessibility: {
-    enabled: false,
-  },
-
-  boost: {
-    useGPUTranslations: true,
-    seriesThreshold: 5,
-  },
-
-  scrollbar: {
-    enabled: false,
-  },
-
-  // tooltip: {
-  //   formatter() {
-  //     return `${this.y} ${dateFormat('%Y-%m-%d %H:%M:%S', this.x)}`;
-  //   },
-  // },
-
-  chart: {
-    zooming: {
-      singleTouch: true,
-      resetButton: {},
-      type: 'xy',
-    },
-    events: {
-      selection(event) {
-        // console.log(
-        //   dateFormat('%Y-%m-%d %H:%M', event.xAxis[0].min),
-        //   dateFormat('%Y-%m-%d %H:%M', event.xAxis[0].max)
-        // );
-        if (event.xAxis) {
-          console.log('时间区间选择', event.xAxis)
-          temporalInterval.value = [
-            dateFormat('%Y-%m-%d %H:%M', event.xAxis[0].min),
-            dateFormat('%Y-%m-%d %H:%M', event.xAxis[0].max),
-          ];
-        }
-      },
-    },
-  },
-
-  series: [],
-};
-const chartOptions2 = {
-  xAxis: {
-    labels: {
-      format: '{value:%Y-%m-%d %H:%M:%S}',
-    },
-  },
-
-  yAxis: {
-    labels: {
-      format: '{text}%',
-    },
-  },
-
-  legend: {
-    enabled: true,
-  },
-
-  accessibility: {
-    enabled: false,
-  },
-
-  boost: {
-    useGPUTranslations: true,
-    seriesThreshold: 5,
-  },
-
-  scrollbar: {
-    enabled: false,
-  },
-
-  chart: {
-    zoomType: 'xy',
-  },
-
-  series: [],
-};
-
-