From c8cf161d6bd6c77f3e326c3be6c6854ec93a8fbd Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Fri, 26 Nov 2021 17:28:47 +0800
Subject: [PATCH] 更新
---
src/views/map/carGps.vue | 227 +++++++-------------------------------------------------
1 files changed, 28 insertions(+), 199 deletions(-)
diff --git a/src/views/map/carGps.vue b/src/views/map/carGps.vue
index 73a1371..f34b320 100644
--- a/src/views/map/carGps.vue
+++ b/src/views/map/carGps.vue
@@ -2,7 +2,7 @@
* @Author: Morpheus
* @Date: 2021-07-05 16:31:54
* @Last Modified by: Morpheus
- * @Last Modified time: 2021-11-25 15:24:53
+ * @Last Modified time: 2021-11-17 09:20:19
* menu-name 押运人员定位
*/
<template>
@@ -122,38 +122,24 @@
</div>
</el-card>
- <el-dialog title="视频监控"
+ <el-dialog title=""
:modal='false'
:visible.sync="dialogVisible"
:before-close="dialogBeforeClose"
:close-on-click-modal='false'
- @closed="videoClose"
class="car-video-box">
- <div class="container"
- v-loading="videoLoading">
- <video id="videoElementOne"
- controls="controls"></video>
- <video id="videoElementTwo"
- controls="controls"></video>
- <video id="videoElementThree"
- controls="controls"></video>
- <video id="videoElementFour"
- controls="controls"></video>
- </div>
+ <iframe src="/carVideo/parent.html"
+ ref="videoIframe"
+ frameborder="0"></iframe>
</el-dialog>
</el-col>
</el-row>
</template>
<script>
-import { getCarList, getPosition, getNewPosition, getTrack, getVideoSrc, getNewCarTark } from "@/api/map/car";
-import axios from 'axios';
+import { getCarList, getPosition, getTrack } from "@/api/map/car";
import carPng from "@/assets/img/car.png";
-
-import flvjs from 'flv.js/dist/flv.min.js';
-
-const d3 = require('d3-dsv');
export default {
data () {
@@ -170,13 +156,16 @@
detailObj: {},
dialogVisible: false,
map: null,
- videoLoading: true
};
},
created () {
this.getList();
},
mounted () {
+
+
+
+
},
methods: {
@@ -203,17 +192,14 @@
},
positionClick (val) {
- // console.log(val)
-
- getNewPosition({ imei: "861636056082414" }).then((result) => {
+ getPosition({ type: 2, workerId: val.id }).then((result) => {
var res = result.data.data;
-
if (JSON.stringify(res) != "{}") {
this.$refs.modalForm.addEntitys(
{
- LGTD: res.x,
- LTTD: res.y,
- name: "车辆位置",
+ LGTD: 115.86,
+ LTTD: 28.71,
+ name: "枪支位置",
},
carPng,
0.8,
@@ -253,12 +239,6 @@
this.disposeTime(startTime.getMinutes()) +
":" +
this.disposeTime(startTime.getSeconds());
-
- const startTWO =
- startTime.getFullYear() + '' +
- this.disposeTime(startTime.getMonth() + 1) + '' +
- this.disposeTime(startTime.getDate());
-
if (this.trackTime.length == 1) {
this.$message({ message: "请选择结束时间", duration: 2000 });
return;
@@ -277,48 +257,22 @@
":" +
this.disposeTime(endTime.getSeconds());
- const endTWO =
- endTime.getFullYear() + '' +
- this.disposeTime(endTime.getMonth() + 1) + '' +
- this.disposeTime(endTime.getDate());
-
getTrack({
workerId: this.detailObj.id,
type: 2,
startTime: start,
endTime: end,
}).then((res) => {
+ var result = res.data.data;
+ if (result.length > 1) {
+ let arr = [];
- getNewCarTark({
- beginTime: startTWO,
- endTime: endTWO,
- rectify: 0,
- callbackId: 123
- }).then(res => {
- axios.get('http://s16s652780.51mypc.cn/car/' + res.data.data).then(result => {
- var ret = d3.csvParse(result.data)
+ result.forEach((item) => {
+ arr.push([Number(item.longitude), Number(item.latitude)]);
+ });
- let arr = [];
- ret.forEach((item, index) => {
- if (index < ret.length - 1) {
- arr.push([Number(item.x), Number(item.y)]);
- }
-
- })
-
- this.$refs.modalForm.addLines(arr);
- })
- })
- // var result = res.data.data;
- // if (result.length > 1) {
- // let arr = [];
-
- // result.forEach((item) => {
- // arr.push([Number(item.longitude), Number(item.latitude)]);
- // });
-
- // this.$refs.modalForm.addLines(arr);
- // }
+ this.$refs.modalForm.addLines(arr);
+ }
});
},
// 处理时间补零操作
@@ -351,101 +305,20 @@
if (cont != undefined) {
that.dialogVisible = true
- var oneflag = false, twoflag = false, threefalse = false, fourfalse = false;
- getVideoSrc({ camera: 0, action: 'start' }).then(res => {
- oneflag = true;
- if (twoflag == true && threefalse == true && fourfalse == true) {
- that.videoLoading = false;
- }
- if (flvjs.isSupported()) {
- var videoElement = document.getElementById('videoElementOne')
- var flvPlayer = flvjs.createPlayer({
- // isLive: true,
- // hasAudio: false,
- type: 'flv',
- url: res.data.data.live_url
- })
- flvPlayer.attachMediaElement(videoElement)
- flvPlayer.load()
- flvPlayer.play()
- }
- })
- getVideoSrc({ camera: 1, action: 'start' }).then(res => {
- twoflag = true;
- if (oneflag == true && threefalse == true && fourfalse == true) {
- that.videoLoading = false;
- }
- if (flvjs.isSupported()) {
- var videoElement = document.getElementById('videoElementTwo')
- var flvPlayer = flvjs.createPlayer({
- // isLive: true,
- // hasAudio: false,
- type: 'flv',
- url: res.data.data.live_url
- })
- flvPlayer.attachMediaElement(videoElement)
- flvPlayer.load()
- flvPlayer.play()
- }
- })
-
- getVideoSrc({ camera: 2, action: 'start' }).then(res => {
- threefalse = true;
- if (oneflag == true && twoflag == true && fourfalse == true) {
- that.videoLoading = false;
- }
- if (flvjs.isSupported()) {
- var videoElement = document.getElementById('videoElementThree')
- var flvPlayer = flvjs.createPlayer({
- // isLive: true,
- // hasAudio: false,
- type: 'flv',
- url: res.data.data.live_url
- })
- flvPlayer.attachMediaElement(videoElement)
- flvPlayer.load()
- flvPlayer.play()
- }
- })
-
- getVideoSrc({ camera: 4, action: 'start' }).then(res => {
- fourfalse = true;
- if (oneflag == true && twoflag == true && threefalse == true) {
- that.videoLoading = false;
- }
- if (flvjs.isSupported()) {
- var videoElement = document.getElementById('videoElementFour')
- var flvPlayer = flvjs.createPlayer({
- // isLive: true,
- // hasAudio: false,
- type: 'flv',
- url: res.data.data.live_url
- })
- flvPlayer.attachMediaElement(videoElement)
- flvPlayer.load()
- flvPlayer.play()
- }
- })
-
+ setTimeout(() =>{
+ that.$refs.videoIframe.contentWindow.startVideo()
+ },3000);
}
})
},
- videoClose () {
- this.dialogVisible = false;
- getVideoSrc({ camera: 0, action: 'stop' })
+ dialogBeforeClose() {
+ this.dialogVisible = false
- getVideoSrc({ camera: 1, action: 'stop' })
+ this.$refs.videoIframe.contentWindow.closeVideo()
- getVideoSrc({ camera: 2, action: 'stop' })
-
- getVideoSrc({ camera: 4, action: 'stop' })
- },
-
- dialogBeforeClose () {
- this.dialogVisible = false
}
},
@@ -544,50 +417,6 @@
}
}
}
- }
-}
-
-.car-video-box {
- .container {
- position: relative;
- width: 100%;
- height: 100%;
- display: flex;
- flex-wrap: wrap;
- video {
- flex: 1;
- width: 50%;
- height: 50%;
- object-fit: fill;
- }
- // #videoElementOne {
- // position: absolute;
- // top: 0;
- // left: 0;
- // width: 50%;
- // height: 50%;
- // }
- // #videoElementTwo {
- // position: absolute;
- // top: 0;
- // right: 0;
- // width: 50%;
- // height: 50%;
- // }
- // #videoElementThree {
- // position: absolute;
- // bottom: 0;
- // left: 0;
- // width: 50%;
- // height: 50%;
- // }
- // #videoElementFour {
- // position: absolute;
- // bottom: 0;
- // right: 0;
- // width: 50%;
- // height: 50%;
- // }
}
}
</style>
--
Gitblit v1.9.3