src/components/chart/lineChart.vue

@@ -3,9 +3,9 @@
         <div class="tableTitle">
             <div>
                 <span
-                    style="width: 10px;height:10px;border-radius: 50%;background-color: #3297ff;display: inline-block;vertical-align: middle;margin-right: 8px;"></span>
+                    style="width: 10px;height:10px;border-radius: 50%;background-color: #3297ff;display: inline-block;vertical-align: middle;margin-right: 8px;"
-                <span style="font-size:18px;">{{ this.componentName + '-' + this.chartName + '-' + '曲线图' + '-' + status,
+                ></span>
-                                    }}</span>
+                <span style="font-size:18px;">{{this.componentName + '-' + this.chartName + '-' + '曲线图'+'-'+status, }}</span>
             </div>
         </div>
         <div id="lineChart" ref="lineChart" style="width: 100%; height: 300px"></div>
@@ -67,14 +67,12 @@ export default {
     created() {
         // console.log( this.componentName + '-' + this.chartName + '-' + '曲线图','40');
     },
-
     methods: {
         drawLine() {
             let myChart = this.$echarts.getInstanceByDom(this.$refs.lineChart);
             if (myChart == null) {
                 myChart = this.$echarts.init(this.$refs.lineChart);
             }
-            // myChart.showLoading()　　//开启loading
             let option = {
                 // title: {
                 //     show: true,
@@ -138,34 +136,23 @@ export default {
                 ],
                 series: this.series
             };
-            myChart.setOption(option)　　//再设置配置
+
-            // myChart.hideLoading()
+            myChart.setOption(option);
-            // myChart.setOption(option);
             // window.onresize = () => {  // 根据窗口大小变化图表自适应
             //     myChart.resize();
             // };
-            window.addEventListener('resize', function () {
+            window.addEventListener('resize', function() {
                 myChart.resize();
             });
         }
     },
     mounted() {
         this.drawLine();
-<<<<<<< HEAD
-        console.log(this.title);
-=======
->>>>>>> 1d018c9bfd7d477b50f1c160150339f6011f2622
     },
     watch: {
         list: {
             handler(newVal) {
-<<<<<<< HEAD
-                if (newVal) {
-                    console.log(this.title);
-                    console.log(newVal, this.title + '折现图的数据');
-=======
                 if (newVal.length != 0) {
->>>>>>> 1d018c9bfd7d477b50f1c160150339f6011f2622
                     // x轴的数据
                     this.xData = newVal.map(val => {
                         return val.time;
@@ -196,7 +183,7 @@ export default {
                         this.series[0].name = '总量';
                         console.log('折线图', newVal);
                         // 映射出类型数组
-                        let arr = newVal.map(function (ele) {
+                        let arr = newVal.map(function(ele) {
                             if (ele.type_data != null) {
                                 return ele.type_data;
                             }
@@ -207,34 +194,6 @@ export default {
                                 mapN.push(arr[t][i]);
                             }
                         }
-<<<<<<< HEAD
-                        var lineArr = [{
-                            name: '机动车',
-                            type: 'line',
-                            data: [],
-                            smooth: true
-                        }, {
-                            name: '非机动车',
-                            type: 'line',
-                            data: [],
-                            smooth: true
-                        }, {
-                            name: '行人',
-                            type: 'line',
-                            data: [],
-                            smooth: true
-                        }];
-                        // if (newVal[0].type_data != undefined) {
-                        //     newVal[0].type_data.forEach(ele => {
-                        //         lineArr.push({
-                        //             name: ele.name,
-                        //             type: 'line',
-                        //             data: [],
-                        //             smooth: true
-                        //         });
-                        //     });
-                        // }
-=======
                         var lineArr = [];
                         // 遍历需要多少条类型折线
                         if (newVal[0].type_data != undefined) {
@@ -248,7 +207,6 @@ export default {
                             });
                         }
                         // 筛选类型的数量
->>>>>>> 1d018c9bfd7d477b50f1c160150339f6011f2622
                         mapN.forEach(ele => {
                             if (ele.name == '机动车') {
                                 lineArr[0].data.push(ele.quantity);
@@ -263,9 +221,9 @@ export default {
                         }
                         // 总和数量
                         let mapNR1 = [];
-                        newVal.map(function (ele) {
+                        newVal.map(function(ele) {
                             if (ele.type_data != null) {
-                                var sum = ele.type_data.reduce(function (prev, cur) {
+                                var sum = ele.type_data.reduce(function(prev, cur) {
                                     return cur.quantity + prev;
                                 }, 0);
                                 mapNR1.push(sum);
@@ -293,11 +251,7 @@ export default {
                             return ele.in_flow + ele.out_flow;
                         });
                     } else if (this.title == '车头时距') {
-<<<<<<< HEAD
-                        console.log("车头时距", newVal)
-=======
                         console.log('车头时距', newVal);
->>>>>>> 1d018c9bfd7d477b50f1c160150339f6011f2622
                         this.tooltip = {
                             formatter: '{a} {b}:{c}/s',
                             show: true,
@@ -306,14 +260,10 @@ export default {
                         this.series[0].data = newVal.map(val => {
                             return val.headway;
                         });
-                    } else if (this.title == '排队数' && this.status == '触发') {
+                    } else if (this.title == '排队数') {
                         this.series[0].data = newVal.map(val => {
                             return val.n_queue;
                         });
-                    } else if (this.title == '排队数' && this.status == '周期统计') {
-                        this.series[0].data = newVal.map(val => {
-                            return val.ave_queue;
-                        });
                     } else if (this.title == '检测数') {
                         this.series[0].data = newVal.map(val => {
                             return val.n_stay;
@@ -323,18 +273,16 @@ export default {
                             return val.ave_delay;
                         });
                     } else if (this.title == '拥堵') {
-                        this.series[0].data = newVal.map(val => { });
+                        this.series[0].data = newVal.map(val => {});
+                    }
+                    if (this.$refs.lineChart) {
+                        this.$nextTick(() => {
+                            this.drawLine();
+                        });
                     }
-
-                    this.drawLine()
-
                 }
             },
-<<<<<<< HEAD
-            deep: true
-=======
             immediate: true
->>>>>>> 1d018c9bfd7d477b50f1c160150339f6011f2622
         }
     }
 };

src/components/target/typeChart.vue

@@ -1,19 +1,15 @@
-<template><!-- 触发类型 -->
+<template
-    <div class="setion">
+    ><!-- 触发类型 -->
+    <div class="setion" v-if="isRefer">
         <p class="chartTitle"><span class="titleIcon"></span> {{ componentName }} {{ triggerType }}</p>
         <!-- 触发数据数值渲染 -->
-<<<<<<< HEAD
-        <div class="typeContent">
-            <div v-if="dataArr && dataArr.length != 0">
-=======
         <div class="typeContent" v-if="triggerType == '触发' || '周期时刻'">
             <div v-if="dataArr && dataArr.length != 0 && dataArr!=undefined">
->>>>>>> 1d018c9bfd7d477b50f1c160150339f6011f2622
                 <div v-if="title == '类型'" style="display:flex">
-                    <el-card v-for="(n, i) in typeValue.type_data" :key="i"
+                    <el-card v-for="(n, i) in typeValue.type_data" :key="i" style="width: 150px; margin-bottom: 20px; text-align: center">
-                        style="width: 150px; margin-bottom: 20px; text-align: center">
                         <div>
-                            <span style="font-size: 15px;">{{ n.name }}</span><br />
+                            <span style="font-size: 15px;">{{ n.name }}</span
+                            ><br />
                             <span style="font-size: 30px; font-weight: bold">{{ n.quantity }}</span>
                         </div>
                         <div>
@@ -25,11 +21,7 @@
                 </div>
             </div>
             <el-card v-show="echartArr.includes('数值')" style="width: 150px; margin-bottom: 20px; text-align: center">
-<<<<<<< HEAD
-                <div v-if="dataArr && dataArr.length != 0">
-=======
                 <div v-if="dataArr&& dataArr.length != 0 && dataArr!=undefined">
->>>>>>> 1d018c9bfd7d477b50f1c160150339f6011f2622
                     <div v-if="title == '类型'">
                         <span style="font-size: 15px;">类型数量总和</span><br />
                         <span style="font-size: 30px; font-weight: bold">
@@ -76,16 +68,9 @@
             <div class="tableTitle" v-if="dataArr&& dataArr.length != 0 && dataArr!=undefined">
                 <div>
                     <span
-<<<<<<< HEAD
-                        style="width: 10px;height:10px;border-radius: 50%;background-color: #3297ff;display: inline-block;vertical-align: middle;margin-right: 8px;"></span>
-                    <span style="font-size:18px;">{{ this.chartName + '-' + this.componentName + '-' + '表格' + '-' +
-                        triggerType
-                    }}</span>
-=======
                         style="width: 10px;height:10px;border-radius: 50%;background-color: #3297ff;display: inline-block;vertical-align: middle;margin-right: 8px;"
                     ></span>
                     <span style="font-size:18px;">{{ this.chartName + '-' + this.componentName + '-' + '表格' + '-' + triggerType }}</span>
->>>>>>> 1d018c9bfd7d477b50f1c160150339f6011f2622
                 </div>
                 <div class="tableTime">
                     {{ dataArr[0].time ? dataArr[0].time : '' }}
@@ -100,10 +85,6 @@
         </div>
         <div class="border" v-if="echartArr.includes('曲线图')">
             <detailDialog />
-<<<<<<< HEAD
-            <lineChart :componentName="componentName" :chartName="chartName" :pageType="pageType" :list="dataArr"
-                :status="triggerType" :title="title" :typeValue="typeValue" />
-=======
             <lineChart
             v-if="dataArr && dataArr.length != 0 && dataArr!=undefined"
                 :componentName="componentName"
@@ -114,22 +95,43 @@
                 :title="title"
                 :typeValue="typeValue"
             />
->>>>>>> 1d018c9bfd7d477b50f1c160150339f6011f2622
         </div>
         <div class="border" v-if="echartArr.includes('饼状图')">
             <detailDialog />
-            <pieChart :componentName="componentName" :chartName="chartName" :pageType="pageType" :list="dataArr"
+            <pieChart
-                :status="triggerType" :title="title" :typeValue="typeValue" />
+                :componentName="componentName"
+                :chartName="chartName"
+                :pageType="pageType"
+                :list="dataArr"
+                :status="triggerType"
+                :title="title"
+                :typeValue="typeValue"
+            />
         </div>
         <div class="border" v-if="echartArr.includes('均值图')">
             <detailDialog />
-            <avgChart ref="avgRefChart" :componentName="componentName" :chartName="chartName" :pageType="pageType"
+            <avgChart
-                :list="dataArr" :status="triggerType" :title="title" :typeValue="typeValue" />
+                ref="avgRefChart"
+                :componentName="componentName"
+                :chartName="chartName"
+                :pageType="pageType"
+                :list="dataArr"
+                :status="triggerType"
+                :title="title"
+                :typeValue="typeValue"
+            />
         </div>
         <div class="border" v-if="echartArr.includes('直方图')">
             <detailDialog />
-            <barChart :componentName="componentName" :chartName="chartName" :pageType="pageType" :list="dataArr"
+            <barChart
-                :status="triggerType" :title="title" :typeValue="typeValue" />
+                :componentName="componentName"
+                :chartName="chartName"
+                :pageType="pageType"
+                :list="dataArr"
+                :status="triggerType"
+                :title="title"
+                :typeValue="typeValue"
+            />
         </div>
     </div>
 </template>
@@ -167,24 +169,18 @@ export default {
             valueShow: {}
         };
     },
-    created() { 
+    created() {},
-       
-    },
     methods: {
         // 计算类型的数值
     },
 
     computed: {},
-    mounted() { },
+    mounted() {},
     watch: {
         // 监听触发数据
         dataArr: {
             handler(newVal) {
-<<<<<<< HEAD
-                console.log("dataArr", newVal)
-=======
                 console.log('dataArr', newVal);
->>>>>>> 1d018c9bfd7d477b50f1c160150339f6011f2622
             },
 
             immediate: true
@@ -213,7 +209,6 @@ export default {
     margin-bottom: 5px;
     padding: 8px;
 }
-
 .typeContent {
     box-sizing: border-box;
 }

src/views/bounced/dataBoard.vue

@@ -1,6 +1,6 @@
 <template>
     <div ref="box" class="box">
-        <el-empty v-show="sectionData.length == 0" :image-size="400"></el-empty>
+        <el-empty v-show="componentList.length == 0" :image-size="400"></el-empty>
         <!-- <p class="title" style="margin-bottom: 20px;font-size: 20px;font-weight: 400;">数据看板</p> -->
         <el-scrollbar class="scrollbar">
             <div class="dataBoard" ref="dataBoard" v-if="activeName == 'second'">
@@ -20,33 +20,6 @@
                                     </p>
                                     <!-- <span class="downPull1" data-num="1" @click="sectionHandle(i)"></span> -->
                                 </div>
-<<<<<<< HEAD
-                                <div v-if="s.children">
-                                    <div v-for="o in s.children" :key="o.analogAreaComponentId">
-                                        <OD v-if="o.componentName.includes('OD')" :pageType="o.graphicType" triggerType="触发"
-                                            :componentName="o.componentName" :echartArr="o.presentationForm"
-                                            :dataArr="o.trigger" :title="o.componentName.split('_')[0]"
-                                            :chartName="o.combinationName" />
-                                        <!--触发的组件  -->
-                                        <typeChart v-if="o.timeMode === '触发'" :pageType="o.graphicType"
-                                            :triggerType="o.timeMode" :componentName="o.componentName" :dataArr="o.trigger"
-                                            :echartArr="o.presentationForm" :title="o.componentName.split('_')[0]"
-                                            :chartName="o.combinationName" :typeValue="typeValue" />
-                                        <typeChart v-if="o.timeMode === '周期时刻'" :pageType="o.graphicType"
-                                            :triggerType="o.timeMode" :componentName="o.componentName"
-                                            :dataArr="o.cycleTimeData" :echartArr="o.presentationForm"
-                                            :title="o.componentName.split('_')[0]" :chartName="o.combinationName"
-                                            :typeValue="typeCycleTimeData" />
-                                        <!-- 周期统计的组件 -->
-                                        <typeChart v-if="o.timeMode === '周期统计'" :pageType="o.graphicType"
-                                            :triggerType="o.timeMode" :componentName="o.componentName"
-                                            :dataArr="o.cycleStatistics" :echartArr="o.presentationForm"
-                                            :title="o.componentName.split('_')[0]" :chartName="o.combinationName"
-                                            :typeValue="typeCycleStatistics" />
-                                    </div>
-                                </div>
-                                <!-- :data="triggerList.length != 0 ? triggerList : tableData" -->
-=======
                                 <el-tabs>
                                     <el-collapse v-model="acticveName">
                                         <div v-for="o in s.children" :key="o.analogAreaComponentId">
@@ -101,7 +74,6 @@
                                         </div>
                                     </el-collapse>
                                 </el-tabs>
->>>>>>> 1d018c9bfd7d477b50f1c160150339f6011f2622
                             </div>
                         </template>
                     </div>
@@ -151,15 +123,6 @@ export default {
             default() {
                 return [];
             }
-<<<<<<< HEAD
-        },
-        componentList:{
-            type:Array,
-            default(){
-                return []
-            }
-=======
->>>>>>> 1d018c9bfd7d477b50f1c160150339f6011f2622
         }
     },
     data() {
@@ -408,9 +371,6 @@ export default {
             typeCycleStatistics: {}
         };
     },
-    // beforeCeated(){
-
-    // },
     created() {
         this.getNew()
     },
@@ -442,7 +402,6 @@ export default {
                 });
                 return item;
             });
-
         },
         // 组件图标点击下拉事件
         sectionHandle(i) {
@@ -523,7 +482,8 @@ export default {
         cycleTimeData: {
             handler(newVal) {
                 // 监听到打印周期时刻数据
-                if (newVal.length != 0 && this.sectionData) {
+                console.log(newVal, '440');
+                if (newVal.length != 0) {
                     this.componentList.forEach(ele => {
                         if (ele.cycleTimeData == undefined && ele.timeMode == '周期时刻') {
                             ele.cycleTimeData = [];
@@ -559,8 +519,9 @@ export default {
         // }
         cycleStatistics: {
             handler(newVal) {
+                console.log(newVal, '周期统计');
 
-                if (newVal.length != 0 && this.sectionData) {
+                if (newVal.length != 0) {
                     this.componentList.forEach(ele => {
                         if (ele.cycleStatistics == undefined && ele.timeMode == '周期统计') {
                             ele.cycleStatistics = [];

src/views/index.vue

@@ -3,18 +3,29 @@
         <!-- <div class="container"> -->
         <div>
             <!-- <el-tabs type="border-card"  v-model="activeName" tab-position="left"> -->
-            <el-tabs type="border-card" v-model="activeName" >
+            <el-tabs type="border-card" v-model="activeName">
                 <el-tab-pane :label="titName" name="first">
                     <div class="mapModuleApp">
-                        <iframe id="mapModule" src="./VideoWeb/index.html" frameborder="0" style="width: 100%; height:100%;"
+                        <iframe
-                            scrolling="no" v-if="videoUnityShow"></iframe>
+                            id="mapModule"
+                            src="./VideoWeb/index.html"
+                            frameborder="0"
+                            style="width: 100%; height:100%;"
+                            scrolling="no"
+                            v-if="videoUnityShow"
+                        ></iframe>
                         <!-- <iframe src="./VideoWeb/index.html" style="height: 100%; width: 100%;border: none" ref="iframe"></iframe> -->
                         <el-empty :description="description" v-if="videoAnalysisShow"> </el-empty>
                     </div>
                 </el-tab-pane>
                 <el-tab-pane label="数据看板" name="second">
-                    <dataBoard ref="dataBoardRef" :activeName="activeName" :triggerData="triggerData" :triggerListData="triggerListData"
+                    <dataBoard
-                        :cycleTimeData="cycleTimeData" :cycleStatistics="cycleStatistics"  v-if="activeName='second'"></dataBoard>
+                        :activeName="activeName"
+                        :triggerData="triggerData"
+                        :triggerListData="triggerListData"
+                        :cycleTimeData="cycleTimeData"
+                        :cycleStatistics="cycleStatistics"
+                    ></dataBoard>
                 </el-tab-pane>
                 <el-tab-pane label="分析配置" name="third">
                     <analysisConfiguration :analysisConfigurationdata="analysisConfigurationdata"></analysisConfiguration>
@@ -26,12 +37,31 @@
             </el-tabs>
             <!-- <el-button class="videoAnalysis" type="primary" size="mini" @click="videoAnalysisBtn" v-if="videoAnalysisShow" :disabled='disabledVideoAnalysis'
                 >视频分析</el-button> -->
-            <el-button class="trafficAnalysis" type="primary" plain size="mini" @click="trafficAnalysisBtn"
+            <el-button
-                v-if="trafficAnalysisShow" :disabled="disabledTrafficAnalysis">交通分析</el-button>
+                class="trafficAnalysis"
+                type="primary"
+                plain
+                size="mini"
+                @click="trafficAnalysisBtn"
+                v-if="trafficAnalysisShow"
+                :disabled="disabledTrafficAnalysis"
+                >交通分析</el-button
+            >
         </div>
-        <el-drawer class="new-dialog" :visible.sync="dialogFormVisible" direction="btt" custom-class="demo-drawer"
+        <el-drawer
-            ref="drawer" :modal="false" :close-on-click-modal="false" v-alterELDialogMarginTop="{ marginTop: '0vh' }"
+            class="new-dialog"
-            width="100%" :wrapperClosable="false" :with-header="false" size="100%">
+            :visible.sync="dialogFormVisible"
+            direction="btt"
+            custom-class="demo-drawer"
+            ref="drawer"
+            :modal="false"
+            :close-on-click-modal="false"
+            v-alterELDialogMarginTop="{ marginTop: '0vh' }"
+            width="100%"
+            :wrapperClosable="false"
+            :with-header="false"
+            size="100%"
+        >
             <div class="formBox">
                 <el-form ref="form" :model="form" label-width="80px" :inline="true">
                     <el-form-item label="组件名称">
@@ -52,9 +82,8 @@
             </div>
         </el-drawer>
         <!-- 组件弹框 -->
-        <el-dialog :title="componentTitle + '指标组件'" width="40%" :visible.sync="component" :close-on-click-modal="false"
+        <el-dialog :title="componentTitle + '指标组件'" width="40%" :visible.sync="component" :close-on-click-modal ="false" @close="closeComponentForm()">
-            @close="closeComponentForm()">
+            <el-form ref="form" :model="componentForm" label-width="150px" >
-            <el-form ref="form" :model="componentForm" label-width="150px">
                 <el-form-item label="名称：">
                     <el-input v-model="componentForm.componentName"></el-input>
                 </el-form-item>
@@ -64,11 +93,14 @@
                         <el-checkbox v-for="item in typeData" :label="item" :key="item">{{ item }}</el-checkbox>
                     </el-checkbox-group>
                 </el-form-item>
-                <el-form-item label="数值筛选：" v-if="
+                <el-form-item
+                    label="数值筛选："
+                    v-if="
                         componentForm.componentType != 'OD' &&
                             componentForm.componentType != '类型' &&
                             componentForm.componentType != '流量'
-                ">
+                    "
+                >
                     <el-input-number v-model="componentForm.startValue"></el-input-number>
                     <el-input-number v-model="componentForm.endValue" style="margin-left:5%"></el-input-number>
                 </el-form-item>
@@ -80,15 +112,22 @@
                 </el-form-item>
                 <el-form-item label="时间模式：">
                     <el-select v-model="componentForm.timeMode" placeholder="请选择时间模式">
-                        <el-option label="触发" value="触发"
+                        <el-option
-                            v-if="componentForm.componentType != '延误' && componentForm.componentType != '拥堵'"></el-option>
+                            label="触发"
-                        <el-option label="周期时刻" value="周期时刻" v-if="
+                            value="触发"
+                            v-if="componentForm.componentType != '延误' && componentForm.componentType != '拥堵'"
+                        ></el-option>
+                        <el-option
+                            label="周期时刻"
+                            value="周期时刻"
+                            v-if="
                                 componentForm.componentType != '排队数' &&
                                     componentForm.componentType != '检测数' &&
                                     componentForm.componentType != '延误' &&
                                     componentForm.componentType != '拥堵' &&
                                     componentForm.componentType != '流量'
-                        "></el-option>
+                            "
+                        ></el-option>
                         <el-option label="周期统计" value="周期统计" v-if="componentForm.componentType != 'OD'"> </el-option>
                     </el-select>
                 </el-form-item>
@@ -129,15 +168,11 @@
                 <el-form-item label="展现形式：" v-if="componentForm.componentType != 'OD'">
                     <el-checkbox-group v-model="componentForm.presentation" @change="handlePresentation">
                         <el-checkbox label="数值" name="presentation"></el-checkbox>
-                        <el-checkbox label="表格" name="presentation"
+                        <el-checkbox label="表格" name="presentation" v-if="componentForm.componentType != '拥堵'"></el-checkbox>
-                            v-if="componentForm.componentType != '拥堵'"></el-checkbox>
                         <el-checkbox label="时间曲线图" name="type"></el-checkbox>
-                        <el-checkbox label="直方图" name="presentation"
+                        <el-checkbox label="直方图" name="presentation" v-if="componentForm.componentType == '类型'"></el-checkbox>
-                            v-if="componentForm.componentType == '类型'"></el-checkbox>
+                        <el-checkbox label="饼状图" name="presentation" v-if="componentForm.componentType == '类型'"></el-checkbox>
-                        <el-checkbox label="饼状图" name="presentation"
+                        <el-checkbox label="均值图" name="presentation" v-if="componentForm.componentType != '拥堵'||componentForm.componentType != '流量'||componentForm.componentType != '类型'||componentForm.componentType != '延误'"></el-checkbox>
-                            v-if="componentForm.componentType == '类型'"></el-checkbox>
-                        <el-checkbox label="均值图" name="presentation"
-                            v-if="componentForm.componentType != '拥堵' || componentForm.componentType != '流量' || componentForm.componentType != '类型' || componentForm.componentType != '延误'"></el-checkbox>
                     </el-checkbox-group>
                     <!-- <el-checkbox-group v-model="componentForm.presentation" @change="handlePresentation">
               <el-checkbox v-for="item in sectionals" :label="item.graphicName" :key="item.graphicId" >{{item.graphicName}}</el-checkbox>
@@ -335,15 +370,12 @@ export default {
                 videoType: '实时视频'
             },
             description: '请等待排队',
-            ipData: '',
+            ipData: ''
-
-
-            componentList:[]
         };
     },
 
     //离开当前页面后执行
-    destroyed: function () {
+    destroyed: function() {
         //console.log("离开当前页")
         //   client.publish('msg_stream',JSON.stringify({"msg_flag":-1}))
         //client.end();
@@ -388,16 +420,8 @@ export default {
             // }
         }
     },
-    mounted() { },
+    mounted() {},
     methods: {
-        
-        // 数据看板的标签点击
-        // handleClick(tab, event) {
-        //     if(tab._props.name=='second'){
-        //         this.$refs.dataBoardRef.getNEW()
-        //     }
-
-        // },
         /** 创建mqtt */
         createMqtt() {
             //创建链接，接收数据
@@ -549,7 +573,7 @@ export default {
                         } else {
                             this.analysisConfigurationdata = msg;
                         }
-                    } catch (error) { }
+                    } catch (error) {}
                     break;
                 // 树结构
                 case 'stream' + this.number:
@@ -560,7 +584,7 @@ export default {
                         const msg = JSON.parse(temp);
                         //   console.log("msg",msg)
                         document.getElementById('mapModule').contentWindow.getData(JSON.stringify(msg));
-                    } catch (error) { }
+                    } catch (error) {}
                     break;
                 // 控制台输出
                 case 'trajectory' + this.number:
@@ -571,7 +595,7 @@ export default {
                         const msg = JSON.parse(temp);
                         //   console.log("msg",msg)
                         document.getElementById('mapModule').contentWindow.getGuiJi(JSON.stringify(msg));
-                    } catch (error) { }
+                    } catch (error) {}
                     break;
                 // 触发
                 case 'detection' + this.number:
@@ -589,7 +613,7 @@ export default {
                             }
                             document.getElementById('mapModule').contentWindow.getChuFa(JSON.stringify(detId));
                         }
-                    } catch (error) { }
+                    } catch (error) {}
                     break;
                 case 'trigger-' + this.$route.query.id:
                     try {
@@ -601,7 +625,7 @@ export default {
                         const msgN = JSON.parse(temp);
                             // console.log("trigger_msgN",msgN)
                         this.triggerListData = msgN;
-                    } catch (error) { }
+                    } catch (error) {}
                     break;
                 case 'cycle_time-' + this.$route.query.id:
                     try {
@@ -612,7 +636,7 @@ export default {
                         var detId = [];
                         const msgN = JSON.parse(temp);
                         this.cycleTimeData = msgN;
-                    } catch (error) { }
+                    } catch (error) {}
                     break;
                 case 'cycle_statistics-' + this.$route.query.id:
                     try {
@@ -623,7 +647,7 @@ export default {
                         var detId = [];
                         const msgN = JSON.parse(temp);
                         this.cycleStatistics = msgN;
-                    } catch (error) { }
+                    } catch (error) {}
                     break;
             }
             this.receiveNews = '';
@@ -1247,25 +1271,19 @@ export default {
 }
 
 .content-box::-webkit-scrollbar {
-    display: none;
+    display: none; /* Chrome Safari */
-    /* Chrome Safari */
 }
-
 .new-dialog {
     width: 49%;
     height: 11%;
     left: calc(24vw);
     top: 90vh;
-    bottom: 0
+    bottom: 0 /* right:auto;; */;
-        /* right:auto;; */
-    ;
 }
-
 .formBox {
     margin-top: 20px;
     margin-left: 20px;
 }
-
 /* .new-dialog .el-dialog {
     width:100%!important;
         margin: 0vh auto !important;
@@ -1276,17 +1294,13 @@ export default {
     margin: 0 auto 0px !important;
     /* margin-top: 0vh!important; */
 }
-
 .new-dialog .el-dialog__wrapper::-webkit-scrollbar {
-    display: none;
+    display: none; /* Chrome Safari */
-    /* Chrome Safari */
 }
-
 .new-dialog .customWidth {
     width: 100%;
     min-width: 150px;
 }
-
 .mapModuleApp {
     /* width:100%; */
     width: 1600px;
@@ -1294,7 +1308,6 @@ export default {
     display: inline-block;
     border: 1px soild #eee;
 }
-
 .el-drawer.btt,
 .el-drawer.ttb {
     width: 100%;
@@ -1312,13 +1325,11 @@ export default {
     height: 100%;
     width: 100%;
 }
-
 .videoAnalysis {
     position: absolute;
     right: 200px;
     top: 17px;
 }
-
 .trafficAnalysis {
     position: absolute;
     right: 100px;