Merge branch 'master' of http://git.lgzn.space/chengdandan/TransFlow

public/VideoWeb/index.html

@@ -238,7 +238,10 @@
         console.log("组件名称",name)
         window.parent.getSimulationAreaEdit(id,type,componentType,name,2);
     }
-  
+    //获取左侧区域删除图形或断面成功后返回的数据
+    function getdeleData(data){
+        console.log("id",data)
+    }
       document.body.appendChild(script);
 
      

src/views/AnalysisMain.vue

@@ -38,7 +38,7 @@
         <div class="bottom clearfix">
           <time class="time">{{ item.title }}</time>
           <!-- <el-button type="text" class="button">操作按钮</el-button> -->
-         <div class="streamAddress">{{ item.videoStreamAddress}}</div>
+         <div class="streamAddress" :content="item.videoStreamAddress!=''? item.videoStreamAddress:item.videoPath">{{item.videoStreamAddress!=''? item.videoStreamAddress:item.videoPath}}</div>
         </div>
         
         <div class="st">
@@ -134,6 +134,7 @@ export default {
           videoName:'测试视频01',
           city:'',
           videoStreamAddress:'',
+        videoPath:''
         },
         formLabelWidth: '120px',
         formLabelWidth: '200px',
@@ -266,6 +267,7 @@ destroyed: function () {
           videoName:'测试视频01',
           city:'',
           videoStreamAddress:'',
+          videoPath:''
         },
         
          this.dialogFormVisible = true;
@@ -453,6 +455,7 @@ destroyed: function () {
                               num:item.number,
                               status:item.status,
                               videoStreamAddress:item.videoStreamAddress,
+                              videoPath:item.videoPath,
                               img: require('@/assets/img/AnalysisMain/img1.png'),
                             });
                         }) 
@@ -500,14 +503,18 @@ destroyed: function () {
   .streamAddress{
    color: coral;
     font-size: 12px;
-    /* line-height: 16px; */
     padding-top: 5px;  
+     
   }
   .bottom {
     margin-top: 10px;
     line-height: 12px;
     display: inline-block;
     margin-left: 15px;
+     width: 67%;
+    text-overflow:ellipsis;
+    white-space:nowrap; 
+    overflow:hidden;  
   }
 .st{
     position: absolute;

src/views/index.vue

@@ -32,12 +32,10 @@
                 </el-tab-pane>
                 <el-tab-pane label="存储" name="five">存储</el-tab-pane>
             </el-tabs>
-            <el-button class="videoAnalysis" type="primary" size="mini" @click="videoAnalysisBtn" v-if="videoAnalysisShow"
+            <el-button class="videoAnalysis" type="primary" size="mini" @click="videoAnalysisBtn" v-if="videoAnalysisShow" :disabled='disabledVideoAnalysis'
-                >视频分析</el-button
+                >视频分析</el-button>
-            >
             <el-button class="trafficAnalysis" type="primary" plain size="mini" @click="trafficAnalysisBtn" v-if="trafficAnalysisShow" :disabled='disabledTrafficAnalysis'
-                >交通分析</el-button
+                >交通分析</el-button>
-            >
         </div>
         <el-drawer
             class="new-dialog"
@@ -65,9 +63,6 @@
                             <el-option label="双向" value="双向"></el-option>
                         </el-select>
                     </el-form-item>
-                    <!-- <el-form-item label="速度阈值" v-if="form.type=='区域'">
-            <el-input-number v-model="form.StoppingSpeed" :precision="1" :step="0.1"></el-input-number>
-          </el-form-item> -->
                     <el-form-item>
                         <el-button type="primary" @click="onSubmit(form)">确认</el-button>
                         <el-button @click="closeFigure(form)">取消</el-button>
@@ -90,6 +85,12 @@
                 <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>
+                 <el-form-item label="流量类型：" v-if="componentForm.componentType=='流量'">
+                    <el-radio-group v-model="componentForm.flow" >
+                      <el-radio label="出流"></el-radio>
+                      <el-radio label="入流"></el-radio>
+                    </el-radio-group>
                 </el-form-item>
                 <el-form-item label="时间模式：">
                     <el-select v-model="componentForm.timeMode" placeholder="请选择时间模式">
@@ -104,7 +105,8 @@
                                     componentForm.componentType != '拥堵'&&
                                     componentForm.componentType != '流量'
                             "></el-option>
-                        <el-option label="周期统计" value="周期统计" v-if="componentForm.componentType != 'OD'"></el-option>
+                        <el-option label="周期统计" value="周期统计" v-if="componentForm.componentType != 'OD'">
+                        </el-option>
                     </el-select>
                 </el-form-item>
                 <!-- <el-form-item label="触发类型：" v-if="componentForm.timeModel=='touch'">
@@ -129,9 +131,7 @@
                         <el-slider v-model="componentForm.cycleInterval" :max="max"> </el-slider>
                     </div>
                 </el-form-item>
-                <!-- <el-form-item label="单位：" >
+                <!-- <el-form-item label="单位：" ></el-form-item> -->
-
-        </el-form-item> -->
                 <el-form-item label="起点：" v-if="componentForm.componentType == 'OD'">
                     <el-checkbox-group v-model="componentForm.startSection" @change="handleCheckedStartSection">
                         <el-checkbox v-for="item in sectionals" :label="item.graphicName" :key="item.graphicId">{{
@@ -191,9 +191,7 @@ import axios from 'axios';
 import mqttConfig from '@/utils/mqttConfig.js';
 var mqtt; //mqtt 处理对象（全局变量）
 var client;
-// var topicSends; //订阅的topic 例如：["Time1", "EngineMain1", "Console1", "Location1"]
 // //判断
-//  var number = 1
 export default {
     data() {
         return {
@@ -212,6 +210,7 @@ export default {
             areaComponent: false,
             indexModule: false,
             disabledTrafficAnalysis:true,
+            disabledVideoAnalysis:false,
             //判断模拟区，画布区
             numberNew: 1,
             speed: false,
@@ -278,26 +277,19 @@ export default {
                 endSection: [],
                 componentType: '',
                 typeFiltering: '',
-                typeData: []
+                typeData: [],
+                flow:'出流'
+
             },
             // typeData: ['小汽车', '公交车', '卡车', '非机动车', '行人'],
             typeData:['机动车','非机动车','行人'],
             //展现形式
             presentation: ['数值', '表格', '时间曲线图', '均值图'],
-
             trackForm: {
                 name: ''
             },
-            //   dateTime: this.$moment(new Date()).format("LL"),
             nowTime: '',
-            //   weekday: this.$moment().format("dddd"),
             ins: 0,
-            imgUrl: '',
-            imgUrl1: '',
-            imgUrl2: '',
-            imgUrl3: '',
-            imgUrl4: '',
-            imgUrl5: '',
             btnPic: [],
             Data: [
                 {
@@ -380,26 +372,21 @@ export default {
         if (this.$route.query.type == '实时视频') {
             this.videoAnalysisShow = false;
             this.trafficAnalysisShow = false;
-            document.getElementById('mapModule').contentWindow.lixianVideo("实时视频");
+            document.getElementById('mapModule').contentWindow.lixianVideo(JSON.stringify(this.analysis));
-        } else {
+            this.createMqtt();
+        } else if (this.$route.query.type == '离线视频'){
             this.videoAnalysisShow = true;
             this.trafficAnalysisShow = true;
+            this.getAnalysisStatus()
+            // if(this.$route.query.status=='未分析'){
+            // }
             // if(this.$route.query.status=='未分析'){
             //     // document.getElementById('mapModule').contentWindow.lixianVideo("实时视频");
-               
             // }else{
-
             // }   
-             this.getAnalysisStatus()
-             
         }
     },
     mounted() {
-        // this.testMqtt()
-
-        //   this.getSingleComponentIdN()
-        this.componentForm.company = this.timeSelect[0].value;
-        this.createMqtt();
        
     },
     methods: {
@@ -438,21 +425,32 @@ export default {
         getAnalysisStatus(){
             getVideoStatus(this.$route.query.id).then(res => {
                 console.log("res.data",res.data)
+                //视频分析状态
                 if(res.data.data.videoAnalysisStatus == '未分析'){
                      this.disabledTrafficAnalysis= true
                     //  this.videoUnityShow = false
                      this.videoUnityShow = true
                      this.analysisData()
                 }else if(res.data.data.videoAnalysisStatus == '分析中'){
-
+                    this.disabledVideoAnalysis= true
+                        this.videoUnityShow = false
+                        setTimeout(() => {
+                        this.getAnalysisStatus()
+                        }, 5000); 
                 }else if(res.data.data.videoAnalysisStatus == '已分析'){
                     this.videoUnityShow = true
                     this.videoAnalysisSta = res.data.data.videoAnalysisStatus
+                     this.disabledTrafficAnalysis= false
                     this.analysisData()
-                }else if(res.data.data.trafficAnalysisStatus==''){
+                     //交通分析状态
-
+                }else if(res.data.data.trafficAnalysisStatus=='未分析'){
-                }else if(res.data.data.trafficAnalysisStatus==''){
+                    this.disabledVideoAnalysis= true
-
+                }else if(res.data.data.trafficAnalysisStatus=='分析中'){
+                    this.disabledVideoAnalysis= true
+                     this.disabledTrafficAnalysis= true
+                }else if(res.data.data.videoAnalysisStatus == '已分析'||res.data.data.trafficAnalysisStatus == '已分析'){
+                     this.disabledVideoAnalysis= false
+                     this.disabledTrafficAnalysis= true
                 }
             });
         },
@@ -485,6 +483,17 @@ export default {
             startTrafficAnalysis(this.$route.query.id).then(res => {
                 //
                 console.log("res.data",res.data.data)
+                 if (res.data.code == 200) {
+                        this.$message({
+                            message: res.data.msg,
+                            type: 'success'
+                        });
+                 }else{
+                     this.$message({
+                            message: res.data.msg,
+                            type: 'warning'
+                        });
+                 }
             });
         },
         //获取视频分析结果
@@ -513,13 +522,6 @@ export default {
             switch (topic) {
                 // 接收托片
                 case 'img'+this.number:   
-                // case 'img1':
-                // case 'img2':
-                // case 'img3':
-                // case 'img4':
-                // case 'img5':
-                // case 'img6':
-                // case 'img7':    
                     try {
                         const utf8decoder = new TextDecoder();
                         const u8arr = new Uint8Array(message);
@@ -535,13 +537,6 @@ export default {
                     break;
                 // 树结构
                 case 'stream'+this.number:
-                // case 'stream1':
-                // case 'stream2':
-                // case 'stream3':
-                // case 'stream4':
-                // case 'stream5':
-                // case 'stream6':
-                // case 'stream7':
                     try {
                         const utf8decoder1 = new TextDecoder();
                         const u8arr = new Uint8Array(message);
@@ -552,52 +547,28 @@ export default {
                     break;
                 // 控制台输出
                 case 'trajectory'+this.number:    
-                // case 'trajectory1':
-                // case 'trajectory2':
-                // case 'trajectory3':
-                // case 'trajectory4':
-                // case 'trajectory5':
-                // case 'trajectory6':
-                // case 'trajectory7':    
                     try {
                         const utf8decoder = new TextDecoder();
                         const u8arr = new Uint8Array(message);
-                        //    console.log("message11",message)
                         const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串
-                        //   console.log("temp11",temp)
                         const msg = JSON.parse(temp);
-                        //  console.log("msg11",msg)
                         document.getElementById('mapModule').contentWindow.getGuiJi(JSON.stringify(msg));
                     } catch (error) {}
                     break;
                 // 触发
                 case 'detection'+this.number: 
-                // case 'detection1':
-                // case 'detection2':
-                // case 'detection3':
-                // case 'detection4':
-                // case 'detection5':
-                // case 'detection6':
-                // case 'detection7': 
                     try {
                         const utf8decoder = new TextDecoder();
                         const u8arr = new Uint8Array(message);
-                        //   console.log("message",message)
                         const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串
-                        //   console.log("temp",temp)
                         var detId = [];
                         const msgN = JSON.parse(temp);
-                        //  console.log("msgN",msgN)
                         this.triggerData = msgN;
                         if (temp.length != 0) {
                             for (let i = 0; i < msgN.length; i++) {
                                 detId.push(msgN[i].det_id);
                             }
-                            // console.log("detId",detId)
-                            //   const msg = detId
-                            //   console.log("msg",msg)
                             document.getElementById('mapModule').contentWindow.getChuFa(JSON.stringify(detId));
-                            // document.getElementById("mapModule").contentWindow.getChuFa(detId)
                         }
                         } catch (error) {}
                         break;
@@ -648,7 +619,6 @@ export default {
                     if (res.data.data.company != '') {
                         this.componentForm.company = res.data.data.company;
                     }
-                    
                     // this.componentForm.componentName = res.data.data.componentName+'-'+type
                     this.componentForm.componentName = res.data.data.componentName;
                     if (res.data.data.timeMode != '') {
@@ -669,6 +639,7 @@ export default {
                     this.componentForm.startSectionNames = res.data.data.startSectionNames;
                     this.componentForm.endSectionIds = res.data.data.endSectionIds;
                     this.componentForm.endSectionNames = res.data.data.endSectionNames;
+                    this.componentForm.company = res.data.data.company;
                     this.componentForm.endValue = res.data.data.endValue;
                     this.componentForm.startValue = res.data.data.startValue;
                     this.componentForm.presentationForm = res.data.data.presentationForm;
@@ -707,11 +678,6 @@ export default {
                             });
                         });
                     }
-                    // if(res.data.data.presentationForm!=''){
-                    //     var presentationN = []
-                    //     presentationN  = res.data.data.presentationForm.split(',')
-                    //     this.componentForm.presentation = presentationN
-                    // }
                     if (this.componentForm.presentationForm != '') {
                         var arr = [];
                         arr = this.componentForm.presentationForm.split(',');
@@ -767,7 +733,6 @@ export default {
                             this.componentForm.timeMode = '触发'
                         }
                         }
-                        // this.componentForm.componentName = res.data.data.componentName+'-'+type
                         this.componentForm.componentName = res.data.data.componentName;
                         this.componentForm.componentParameterId = res.data.data.componentParameterId;
                         this.componentForm.cycleInterval = res.data.data.cycleInterval;
@@ -927,7 +892,7 @@ export default {
                             showClose: true,
                             duration:0,
                             });
-                        }, 5000);
+                        }, 3000);
                        
                         document.getElementById('mapModule').contentWindow.postFigureId(JSON.stringify(res.data.data));
                         document
@@ -1107,7 +1072,6 @@ export default {
             console.log('form', form);
             if (form.id != '') {
                 this.dialogFormVisible = false;
-                // document.getElementById("mapModule").contentWindow.closeEdit(JSON.stringify(form.type+','+form.id))
                 document.getElementById('mapModule').contentWindow.closeEdit(JSON.stringify(form.type + ',' + form.id));
             } else {
                 this.dialogFormVisible = false;
@@ -1122,7 +1086,6 @@ export default {
             if (this.form.id != '') {
                 this.dialogFormVisible = false;
                 document.getElementById('mapModule').contentWindow.closeEdit(JSON.stringify(form.type + ',' + form.id));
-                //  document.getElementById("mapModule").contentWindow.closeEdit(form.type,form.id)
             } else {
                 this.dialogFormVisible = false;
                 document.getElementById('mapModule').contentWindow.delFigure();