Commit 6f7ca70a authored by zhanglw's avatar zhanglw

矿山视频监控

parent b54e4b13
This source diff could not be displayed because it is too large. You can view the blob instead.
......@@ -15,9 +15,15 @@
<DPcomputer17 class="DPcomputer17Class"></DPcomputer17>
<div v-if="noPtz" class="noPtzVideo1">
<div v-show="noPtz" class="noPtzVideo1">
<!-- <video id="videoRealtime" class="video-js vjs-default-skin vjs-big-play-centered" controls preload="auto" data-setup="{}" style="width: 100%;height: 100%;" autoplay>-->
<video id="videoRealtime" class="video-js vjs-default-skin vjs-big-play-centered" controls preload="auto" data-setup="{}" style="width: 100%;height: 100%;">
您的浏览器不支持:HTML5 video.
</video>
<!-- <el-select v-model="cameraSrc" class="noPtzCameraList" @change="videoPlay()" :popper-append-to-body="false">-->
<!-- <el-option v-for="item in cameraList" :key="item.id" :label="item.monitorName" :value="item.monitorUrl" style="font-size:16px;font-weight:400"></el-option>-->
<!-- </el-select>-->
<el-button class="noPtzCloseStyle" type="danger" icon="el-icon-close" @click="noPtzCloseFn()" size="mini">关闭</el-button>
<iframe :src="iframeSrc" class="iframeSingle"></iframe>
</div>
<div class="aiAnalysisRightViews">
......@@ -110,6 +116,7 @@ import * as echarts from 'echarts';
import axios from 'axios'
import moment from 'moment';
import DPcomputer17 from '../../views/MLargeScreen/components/smallComponents/DPcomputer17.vue'
import {flvjs} from '@/assets/js/flv.js';
export default {
components:{
......@@ -127,7 +134,7 @@ export default {
children: "children",
label: "label",
},
noPtz:false,
noPtz: false,
aiTabPosition:'今天',
echarts1Data:[{ value: 0, name: '接打电话' }, { value: 0, name: '分神驾驶' }, { value: 0, name: '前向碰撞' }, { value: 0, name: '疲劳驾驶' }, { value: 0, name: '接近报警' }],
echarts2Data:{
......@@ -150,6 +157,7 @@ export default {
//图片数据
elimageSrc:'',
elimageSrcShow:false,
flvPlayer: null,
};
},
mounted() {
......@@ -160,6 +168,15 @@ export default {
},10000)
},
methods: {
stopPlay(flvPlayer){
if(flvPlayer && flvPlayer._msectl && flvPlayer.e){
flvPlayer.pause();
flvPlayer.unload();
flvPlayer.detachMediaElement();
flvPlayer.destroy();
flvPlayer = null
};
},
getCode() {
//分区数据
HttpReq.truckDispatching.mineMonitoringPartitionQuery({size: 999}).then((res) => {
......@@ -192,10 +209,22 @@ export default {
},
handleNodeClick(data) {
if (data.children) {
return
return;
}
// this.iframeSrc = this.defaultIframeSrc + data.cameraName;
this.noPtz = true;
if (flvjs.isSupported()) {
this.flvPlayer && this.stopPlay(this.flvPlayer);
this.flvPlayer = flvjs.createPlayer({
type: "flv",
isLive: true,
hasAudio: false,
url: 'http://39.164.225.220:5008/live?port=1935&app=live&stream='+data.streamName,
});
this.flvPlayer.attachMediaElement(document.getElementById("videoRealtime"));
this.flvPlayer.load();
} else {
this.iframeSrc = this.defaultIframeSrc + data.cameraName;
this.noPtz = true;
console.log("不支持的格式");
}
},
aiTabPositionFn(text){
......@@ -522,7 +551,7 @@ export default {
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
type: 'shadow'
}
},
legend: {
......@@ -662,7 +691,7 @@ export default {
var day = date.getDate(); //日 ,从 Date 对象返回一个月中的某一天 (1 ~ 31)
var hours = date.getHours(); //小时 ,返回 Date 对象的小时 (0 ~ 23)
var minutes = date.getMinutes(); //分钟 ,返回 Date 对象的分钟 (0 ~ 59)
var seconds = date.getSeconds(); //秒 ,返回 Date 对象的秒数 (0 ~ 59)
var seconds = date.getSeconds(); //秒 ,返回 Date 对象的秒数 (0 ~ 59)
//修改月份格式
if (month >= 1 && month <= 9) {
month = "0" + month;
......@@ -713,7 +742,7 @@ export default {
this.elimageSrcShow = false;
this.elimageSrc = '';
}
};
</script>
<style>
......@@ -906,7 +935,7 @@ export default {
display: flex;
justify-content: space-evenly;
margin-top: 0.5vh;
}
.video111 .alarmViewsStyle1_left1{
padding-top: 0.5vh;
......
......@@ -53,8 +53,9 @@
<div class="text item">
<el-table :data="cameraDetail" border style="width: 100%" height="710">
<el-table-column prop="id" label="NO." align="center" width="60"></el-table-column>
<el-table-column prop="cameraName" label="区域名称" align="left"></el-table-column>
<el-table-column prop="cameraIp" label="区域IP" align="left"></el-table-column>
<el-table-column prop="cameraName" label="摄像头名称" align="left"></el-table-column>
<el-table-column prop="streamName" label="视频流名称" align="left"></el-table-column>
<el-table-column prop="cameraIp" label="IP地址" align="left"></el-table-column>
<el-table-column label="操作" width="150" align="center">
<template slot-scope="scope">
<el-button size="mini" round type="danger" @click="cameraDetaileDelete(scope.row)">删除</el-button>
......@@ -63,12 +64,15 @@
</el-table>
</div>
</el-card>
<el-dialog :title="cameraDetailTitle" :visible.sync="cameraDetailVisible" width="30%">
<el-form ref="cameraDetailData" :rules="rulesDetai" :model="cameraDetailData" label-width="80px">
<el-form-item label="名称" style="margin-bottom:15px;" prop="cameraName">
<el-dialog :title="cameraDetailTitle" :visible.sync="cameraDetailVisible" width="500px">
<el-form ref="cameraDetailData" :rules="rulesDetai" :model="cameraDetailData" label-width="100px">
<el-form-item label="摄像头名称" style="margin-bottom:15px;" prop="cameraName">
<el-input v-model="cameraDetailData.cameraName"></el-input>
</el-form-item>
<el-form-item label="IP" style="margin-bottom:15px;" prop="cameraIp">
<el-form-item label="视频流名称" style="margin-bottom:15px;" prop="streamName">
<el-input v-model="cameraDetailData.streamName"></el-input>
</el-form-item>
<el-form-item label="IP地址" style="margin-bottom:15px;" prop="cameraIp">
<el-input v-model="cameraDetailData.cameraIp"></el-input>
</el-form-item>
<!-- <el-form-item label="端口" style="margin-bottom:15px;">
......@@ -123,7 +127,8 @@ export default {
name: [ { required: true, message: '请输入分区名称', trigger: 'blur' },]
},
rulesDetai:{
cameraName: [ { required: true, message: '请输入名称', trigger: 'blur' },],
cameraName: [ { required: true, message: '请输入摄像头名称', trigger: 'blur' },],
streamName: [ { required: true, message: '请输入视频流名称', trigger: 'blur' },],
cameraIp: [ { required: true, message: '请输入IP', trigger: 'blur' },],
}
}
......@@ -206,7 +211,7 @@ export default {
return false;
}
});
},
zoneCancel(){
this.zoneVisible = false;
......@@ -219,8 +224,8 @@ export default {
}).then( () => {
HttpReq.truckDispatching.mineMonitoringPartitionDel([row.id]).then((res) => {
this.$message({
message: "删除成功",
type: 'success'
message: res,
type: 'info'
});
let param = {};
HttpReq.truckDispatching.mineMonitoringPartitionQuery(param).then((res) => {
......@@ -290,13 +295,13 @@ export default {
})
this.cameraDetail = newData;
this.cameraDetailVisible = false;
this.cameraDetailData = {id:"",cameraId:"",cameraName:"",cameraIp:"",cameraPort:"",cameraWay:""};
this.cameraDetailData = {id:"",cameraId:"",cameraName:"",streamName:"",cameraIp:"",cameraPort:"",cameraWay:""};
}
} else {
console.log('error submit!!');
return false;
}
});
});
},
cameraDetaileCancel(){
this.cameraDetailVisible = false;
......@@ -345,7 +350,7 @@ export default {
<style scoped>
*{
margin: 0;
padding: 0;
}
......@@ -395,4 +400,4 @@ export default {
width: 380px;
height: 100%;
}
</style>
\ No newline at end of file
</style>
......@@ -247,7 +247,7 @@
</el-form-item>
</div></el-col>
<el-col :span="8"><div class="grid-content">
<el-form-item label="矿产资源储量:" class="form-cell">
<el-form-item label="矿产资源储量(万吨):" class="form-cell">
<div :class="readonly?'cell-box':''">
<el-input v-model="formData.mineralresources" :readonly="readonly" class="cell-input"></el-input>
</div>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment