Skip to content

卡
卡车调度系统
Commit 1e2bbd4d authored by xxx's avatar xxx
Browse files
Options

1

parent 0ec8ab8a
Hide whitespace changes
Inline Side-by-side
Showing with 421 additions and 641 deletions
src/components/ezuikit/EZUIKitJs.vue
View file @ 1e2bbd4d
......@@ -22,39 +22,88 @@
<iframe :src="iframeSrc" class="iframeSingle"></iframe>
</div>
<div class="aiAnalysisViews">
<div class="aiAnalysisViews_Title">智能AI分析</div>
<div style="margin:1vh 0px 0px 0vw;">
<el-radio-group v-model="aiTabPosition" @change="aiTabPositionFn">
<el-radio-button label="今天">今天</el-radio-button>
<el-radio-button label="近7天">近7天</el-radio-button>
<el-radio-button label="近30天">近30天</el-radio-button>
</el-radio-group>
<div class="aiAnalysisRightViews">
<div class="aiAnalysisRightViews_1">
<!-- 智能AI分析 -->
<div class="aiAnalysisRightViews_1_title">智能AI分析</div>
<div class="aiAnalysisRightViews_1_content">
<div class="aiAnalysisRightViews_1_content_top">
<div :class="aiTabPosition == '今天' ? 'aiAnalysisRightViews_1_content_topH' : 'aiAnalysisRightViews_1_content_topL'" @click="aiTabPositionFn('今天')">今天</div>
<div :class="aiTabPosition == '近7天' ? 'aiAnalysisRightViews_1_content_topH' : 'aiAnalysisRightViews_1_content_topL'" @click="aiTabPositionFn('近7天')">近7天</div>
<div :class="aiTabPosition == '近30天' ? 'aiAnalysisRightViews_1_content_topH' : 'aiAnalysisRightViews_1_content_topL'" @click="aiTabPositionFn('近30天')">近30天</div>
</div>
<div class="alarmViewsStyle1">
<div class="alarmViewsStyle1_left1">
<img src="../../assets/images/cutGraph/zhengzaijinxing1.png">
<div>
<div style="text-align: center;font-size:14px;">AI报警总数</div>
<div style="text-align: center;font-size:18px;">{{alarmData.total}}</div>
</div>
</div>
<div class="alarmViewsStyle1_right1">
<img src="../../assets/images/cutGraph/wanchengle1.png">
<div>
<div style="text-align: center;font-size:14px;">处理数</div>
<div style="text-align: center;font-size:18px;">{{alarmData.handle}}</div>
</div>
<div>
<div style="text-align: center;font-size:14px;">处理率</div>
<div style="text-align: center;font-size:18px;">{{alarmData.handle == 0 ? 0 : parseFloat(alarmData.handle / alarmData.total * 100).toFixed(2)}}%</div>
</div>
</div>
</div>
<div class="echarts1" id="echarts1"></div>
<div class="echarts1_neiquan">
<div style="color:white;">总数</div>
<div style="color:#FDBF46;font-size:24px;">{{alarmData.total}}</div>
</div>
</div>
</div>
<div class="aiAnalysisViews_1">
<span>AI报警总数：{{alarmData.total}}</span><span style="margin-left:30px;">处理数：{{alarmData.handle}}</span>
<div class="aiAnalysisRightViews_1">
<!-- 报警车辆排行榜 -->
<div class="aiAnalysisRightViews_1_title">报警车辆排行榜</div>
<div class="aiAnalysisRightViews_1_content">
<div id="echarts2" class="echarts2" style="margin-top:1vh"></div>
</div>
</div>
<div class="aiAnalysisViews_1">处理率：{{alarmData.handle == 0 ? 0 : parseFloat(alarmData.handle / alarmData.total * 100).toFixed(2)}}%</div>
<div id="echarts1" class="echarts1"></div>
<div class="aiAnalysisViews_1">报警车辆排行榜</div>
<div id="echarts2" class="echarts2" style="margin-top:1vh"></div>
<div class="aiAnalysisViews_1">报警车辆信息</div>
<div @mouseout='mouseoutTable' @mouseover='mouseoverTable'>
<el-table :data="aiAnalysisTableData" border style="width: 98%" height="24.5vh">
<el-table-column prop="vehiIdno" label="车牌号" align="center"></el-table-column>
<el-table-column prop="alarmTypeText" label="报警类型" align="center"></el-table-column>
<el-table-column prop="fileTimeStr" label="报警时间" align="center"></el-table-column>
<el-table-column label="查看" align="center">
<template slot-scope="scope">
<el-image style="width: 70px; height: 50px" :src="scope.row.downloadUrl" :preview-src-list="[scope.row.downloadUrl]"></el-image>
</template>
</el-table-column>
</el-table>
<div class="aiAnalysisRightViews_2">
<!-- 报警车辆信息 -->
<div class="aiAnalysisRightViews_2_title">报警车辆信息</div>
<div class="aiAnalysisRightViews_2_content">
<div class="aiAnalysisRightViews_2_content_rolling">
<dl>
<dt>
<div>车牌号</div>
<div>报警类型</div>
<div>报警时间</div>
<div>查看</div>
</dt>
<dd v-for="(item,index) in aiAnalysisTableData" :key="index">
<div>{{item.vehiIdno}}</div>
<div>{{item.name}}</div>
<div>{{item.fileTime}}</div>
<div style="text-decoration:underline;cursor: pointer;" @click="dianjichakan(item)">点击查看</div>
</dd>
</dl>
</div>
</div>
</div>
</div>
</el-container>
</el-container>
<div class="videoMengCeng" v-if="videoSrcShow">
<div class="closeVideoDiv" @click="closeVideo"><i class="el-icon-close"></i></div>
<video :src="videoSrc" autoplay controls height="800px" width="1450px"></video>
</div>
<div class="elimageMengCeng" v-if="elimageSrcShow">
<div class="closeElimageDiv" @click="closeElimage"><i class="el-icon-close"></i></div>
<el-image style="width: 80vw; height: 85vh" :src="elimageSrc"></el-image>
</div>
</div>
</template>
......@@ -92,39 +141,18 @@ export default {
handle:0,
},
//所有车的信息
allCarData:'',
allCarDataText:'',
searchCarText:'',
//会话号
jsession:'',
tableTimer:null,
//视频数据
videoSrc:'',
videoSrcShow:false,
//图片数据
elimageSrc:'',
elimageSrcShow:false,
};
},
mounted() {
let that = this;
this.getCode();
HttpReq.truckDispatching.carMonitoringCarsQuery({size: 9999}).then((res) => {
let arr1 = [];
let text1 = '';
res.content.forEach((item,index)=>{
text1 = text1 + item.carnumber + ',';
arr1.push(item.carnumber);
})
text1 = text1.substring(0, text1.length - 1);
this.allCarData = arr1;
this.allCarDataText = text1;
//获取会话号
axios.get('/jiankong/StandardApiAction_login.action', {
params: {
account:'admin',
password:'admin'
}
}).then(function (response) {
that.jsession = response.data.jsession;
that.aiTabPositionFn();
})
})
this.mouseoutTable();
this.aiTabPositionFn();
},
methods: {
getCode() {
......@@ -165,7 +193,12 @@ export default {
this.noPtz = true;
}
},
aiTabPositionFn(){
aiTabPositionFn(text){
if(text){
this.aiTabPosition = text;
}else{
this.aiTabPosition = '今天';
}
let that = this;
that.alarmData.total = 0;
that.alarmData.handle = 0;
......@@ -180,164 +213,18 @@ export default {
if(this.aiTabPosition == '今天'){
let start = this.currentTime1(new Date(new Date(new Date().toLocaleDateString()).getTime()));
let end = this.currentTime1(new Date(new Date(new Date().toLocaleDateString()).getTime() + 24 * 60 * 60 * 1000 - 1));
//报警列表
let allAlarmData1 = [];
this.allCarData.forEach((item1,index1)=>{
//获取每辆车的设备号
axios.get('/jiankong/StandardApiAction_getDeviceByVehicle.action', {
params: {
jsession:that.jsession,
vehiIdno:item1
}
}).then(function (response1) {
if(response1.data.devices.length != 0){
//有设备号的车获取报警列表
axios.get('/jiankong/StandardApiAction_queryPhoto.action', {
params: {
jsession:that.jsession,
devIdno:response1.data.devices[0].did,
alarmType:'620,621,624,625,400,172,190,430,431,432,433',
begintime:start,
endtime:end,
currentPage:0,
pageRecords:9999,
}
}).then(function (response2) {
if(response2.data.infos){
response2.data.infos.forEach((item2,index2)=>{
if(item2.alarmType == 620){
let obj1 = {...item2};
obj1.alarmTypeText = '接打电话';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 621){
let obj1 = {...item2};
obj1.alarmTypeText = '接打电话';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 624){
let obj1 = {...item2};
obj1.alarmTypeText = '分神驾驶';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 625){
let obj1 = {...item2};
obj1.alarmTypeText = '分神驾驶';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 600){
let obj1 = {...item2};
obj1.alarmTypeText = '前向碰撞';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 601){
let obj1 = {...item2};
obj1.alarmTypeText = '前向碰撞';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 172){
let obj1 = {...item2};
obj1.alarmTypeText = '疲劳驾驶';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 190){
let obj1 = {...item2};
obj1.alarmTypeText = '疲劳驾驶';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 430){
let obj1 = {...item2};
obj1.alarmTypeText = '接近报警';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 431){
let obj1 = {...item2};
obj1.alarmTypeText = '接近报警';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 432){
let obj1 = {...item2};
obj1.alarmTypeText = '接近报警';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 433){
let obj1 = {...item2};
obj1.alarmTypeText = '接近报警';
allAlarmData1.push(obj1);
}
})
that.aiAnalysisTableData = allAlarmData1;
}
})
}
})
})
//报警echarts
axios.get('/jiankong/StandardApiAction_queryAlarmDetail.action', {
params: {
jsession:that.jsession,
vehiIdno:that.allCarDataText,
begintime:start,
endtime:end,
armType:'620,621,624,625,400,172,190,430,431,432,433',
currentPage:0,
pageRecords:9999,
}
}).then(function (response1) {
if(response1.data.alarms){
let arr1 = [];
let echartsName1 = [];
//报警数量
let alarmHandleNum = 0;
response1.data.alarms.forEach((item1,index1)=>{
if(item1.atp == 620){
let obj1 = {...item1};
obj1.alarmTypeText = '接打电话';
arr1.push(obj1);
}else if(item1.atp == 621){
let obj1 = {...item1};
obj1.alarmTypeText = '接打电话';
arr1.push(obj1);
}else if(item1.atp == 624){
let obj1 = {...item1};
obj1.alarmTypeText = '分神驾驶';
arr1.push(obj1);
}else if(item1.atp == 625){
let obj1 = {...item1};
obj1.alarmTypeText = '分神驾驶';
arr1.push(obj1);
}else if(item1.atp == 600){
let obj1 = {...item1};
obj1.alarmTypeText = '前向碰撞';
arr1.push(obj1);
}else if(item1.atp == 601){
let obj1 = {...item1};
obj1.alarmTypeText = '前向碰撞';
arr1.push(obj1);
}else if(item1.atp == 172){
let obj1 = {...item1};
obj1.alarmTypeText = '疲劳驾驶';
arr1.push(obj1);
}else if(item1.atp == 190){
let obj1 = {...item1};
obj1.alarmTypeText = '疲劳驾驶';
arr1.push(obj1);
}else if(item1.atp == 430){
let obj1 = {...item1};
obj1.alarmTypeText = '接近报警';
arr1.push(obj1);
}else if(item1.atp == 430){
let obj1 = {...item1};
obj1.alarmTypeText = '接近报警';
arr1.push(obj1);
}else if(item1.atp == 430){
let obj1 = {...item1};
obj1.alarmTypeText = '接近报警';
arr1.push(obj1);
}else if(item1.atp == 430){
let obj1 = {...item1};
obj1.alarmTypeText = '接近报警';
arr1.push(obj1);
}
})
that.alarmData.total = arr1.length;
arr1.forEach((item2,index2)=>{
echartsName1.push(item2.vid);
if(item2.hd != 0){
alarmHandleNum++;
//获取报警信息列表
HttpReq.truckDispatching.apiCameraUrllistQuery({page:0,size:99999,startTime:start,endTime:end}).then((res1) => {
if(res1.code == 200){
this.aiAnalysisTableData = res1.data;
this.alarmData.total = res1.data.length;
let handleNum = 0;
res1.data.forEach((item1,index1)=>{
if(item1.status == 1){
handleNum++;
}
})
that.alarmData.handle = alarmHandleNum;
this.alarmData.handle = handleNum;
//圆角环形图
let echarts1Data1 = [{ value: 0, name: '接打电话' }, { value: 0, name: '分神驾驶' }, { value: 0, name: '前向碰撞' }, { value: 0, name: '疲劳驾驶' }, { value: 0, name: '接近报警' }];
let num1 = 0;
......@@ -345,16 +232,16 @@ export default {
let num3 = 0;
let num4 = 0;
let num5 = 0;
arr1.forEach((item3,index3)=>{
if(item3.alarmTypeText == '接打电话'){
res1.data.forEach((item3,index3)=>{
if(item3.name == '接打电话'){
num1++;
}else if(item3.alarmTypeText == '分神驾驶'){
}else if(item3.name == '分神驾驶'){
num2++;
}else if(item3.alarmTypeText == '前向碰撞'){
}else if(item3.name == '前向碰撞'){
num3++;
}else if(item3.alarmTypeText == '疲劳驾驶'){
}else if(item3.name == '疲劳驾驶'){
num4++;
}else if(item3.alarmTypeText == '接近报警'){
}else if(item3.name == '接近报警'){
num5++;
}
})
......@@ -366,6 +253,10 @@ export default {
that.echarts1Data = echarts1Data1;
that.echarts1Fn();
//报警车辆排行榜
let echartsName1 = [];
res1.data.forEach((item2,index2)=>{
echartsName1.push(item2.vehiIdno);
})
let set1 = new Set();
echartsName1.forEach((item)=>set1.add(item))
let a1 = Array.from(set1);
......@@ -382,17 +273,17 @@ export default {
aa4.push(0);
aa5.push(0);
})
arr1.forEach((item4,index4)=>{
res1.data.forEach((item4,index4)=>{
a1.forEach((item5,index5)=>{
if(item4.vid == item5 && item4.alarmTypeText == '接打电话'){
if(item4.vehiIdno == item5 && item4.name == '接打电话'){
aa1[index5] = aa1[index5] + 1;
}else if(item4.vid == item5 && item4.alarmTypeText == '分神驾驶'){
}else if(item4.vehiIdno == item5 && item4.name == '分神驾驶'){
aa2[index5] = aa2[index5] + 1;
}else if(item4.vid == item5 && item4.alarmTypeText == '前向碰撞'){
}else if(item4.vehiIdno == item5 && item4.name == '前向碰撞'){
aa3[index5] = aa3[index5] + 1;
}else if(item4.vid == item5 && item4.alarmTypeText == '疲劳驾驶'){
}else if(item4.vehiIdno == item5 && item4.name == '疲劳驾驶'){
aa4[index5] = aa4[index5] + 1;
}else if(item4.vid == item5 && item4.alarmTypeText == '接近报警'){
}else if(item4.vehiIdno == item5 && item4.name == '接近报警'){
aa5[index5] = aa5[index5] + 1;
}
})
......@@ -403,174 +294,28 @@ export default {
that.echarts2Data.pilao = aa4;
that.echarts2Data.jiejin = aa5;
that.echarts2Fn();
}else{
}else{
that.echarts1Fn();
that.echarts2Fn();
}
})
})
}else if(this.aiTabPosition == '近7天'){
let fmt = moment().subtract(7, 'days').format('YYYY-MM-DD');
let start = this.currentTime1(new Date(new Date(new Date(fmt).toLocaleDateString()).getTime()));
let end = this.currentTime1(new Date(new Date(new Date().toLocaleDateString()).getTime() + 24 * 60 * 60 * 1000 - 1));
//报警列表
let allAlarmData1 = [];
this.allCarData.forEach((item1,index1)=>{
//获取每辆车的设备号
axios.get('/jiankong/StandardApiAction_getDeviceByVehicle.action', {
params: {
jsession:that.jsession,
vehiIdno:item1
}
}).then(function (response1) {
if(response1.data.devices.length != 0){
//有设备号的车获取报警列表
axios.get('/jiankong/StandardApiAction_queryPhoto.action', {
params: {
jsession:that.jsession,
devIdno:response1.data.devices[0].did,
alarmType:'620,621,624,625,400,172,190,430,431,432,433',
begintime:start,
endtime:end,
currentPage:0,
pageRecords:9999,
}
}).then(function (response2) {
if(response2.data.infos){
response2.data.infos.forEach((item2,index2)=>{
if(item2.alarmType == 620){
let obj1 = {...item2};
obj1.alarmTypeText = '接打电话';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 621){
let obj1 = {...item2};
obj1.alarmTypeText = '接打电话';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 624){
let obj1 = {...item2};
obj1.alarmTypeText = '分神驾驶';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 625){
let obj1 = {...item2};
obj1.alarmTypeText = '分神驾驶';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 600){
let obj1 = {...item2};
obj1.alarmTypeText = '前向碰撞';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 601){
let obj1 = {...item2};
obj1.alarmTypeText = '前向碰撞';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 172){
let obj1 = {...item2};
obj1.alarmTypeText = '疲劳驾驶';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 190){
let obj1 = {...item2};
obj1.alarmTypeText = '疲劳驾驶';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 430){
let obj1 = {...item2};
obj1.alarmTypeText = '接近报警';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 431){
let obj1 = {...item2};
obj1.alarmTypeText = '接近报警';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 432){
let obj1 = {...item2};
obj1.alarmTypeText = '接近报警';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 433){
let obj1 = {...item2};
obj1.alarmTypeText = '接近报警';
allAlarmData1.push(obj1);
}
})
that.aiAnalysisTableData = allAlarmData1;
}
})
}
})
})
//报警echarts
axios.get('/jiankong/StandardApiAction_queryAlarmDetail.action', {
params: {
jsession:that.jsession,
vehiIdno:that.allCarDataText,
begintime:start,
endtime:end,
armType:'620,621,624,625,400,172,190,430,431,432,433',
currentPage:0,
pageRecords:9999,
}
}).then(function (response1) {
if(response1.data.alarms){
let arr1 = [];
let echartsName1 = [];
//报警数量
let alarmHandleNum = 0;
response1.data.alarms.forEach((item1,index1)=>{
if(item1.atp == 620){
let obj1 = {...item1};
obj1.alarmTypeText = '接打电话';
arr1.push(obj1);
}else if(item1.atp == 621){
let obj1 = {...item1};
obj1.alarmTypeText = '接打电话';
arr1.push(obj1);
}else if(item1.atp == 624){
let obj1 = {...item1};
obj1.alarmTypeText = '分神驾驶';
arr1.push(obj1);
}else if(item1.atp == 625){
let obj1 = {...item1};
obj1.alarmTypeText = '分神驾驶';
arr1.push(obj1);
}else if(item1.atp == 600){
let obj1 = {...item1};
obj1.alarmTypeText = '前向碰撞';
arr1.push(obj1);
}else if(item1.atp == 601){
let obj1 = {...item1};
obj1.alarmTypeText = '前向碰撞';
arr1.push(obj1);
}else if(item1.atp == 172){
let obj1 = {...item1};
obj1.alarmTypeText = '疲劳驾驶';
arr1.push(obj1);
}else if(item1.atp == 190){
let obj1 = {...item1};
obj1.alarmTypeText = '疲劳驾驶';
arr1.push(obj1);
}else if(item1.atp == 430){
let obj1 = {...item1};
obj1.alarmTypeText = '接近报警';
arr1.push(obj1);
}else if(item1.atp == 430){
let obj1 = {...item1};
obj1.alarmTypeText = '接近报警';
arr1.push(obj1);
}else if(item1.atp == 430){
let obj1 = {...item1};
obj1.alarmTypeText = '接近报警';
arr1.push(obj1);
}else if(item1.atp == 430){
let obj1 = {...item1};
obj1.alarmTypeText = '接近报警';
arr1.push(obj1);
//获取报警信息列表
HttpReq.truckDispatching.apiCameraUrllistQuery({page:0,size:99999,startTime:start,endTime:end}).then((res1) => {
if(res1.code == 200){
this.aiAnalysisTableData = res1.data;
this.alarmData.total = res1.data.length;
let handleNum = 0;
res1.data.forEach((item1,index1)=>{
if(item1.status == 1){
handleNum++;
}
})
that.alarmData.total = arr1.length;
arr1.forEach((item2,index2)=>{
echartsName1.push(item2.vid);
if(item2.hd != 0){
alarmHandleNum++;
}
})
that.alarmData.handle = alarmHandleNum;
this.alarmData.handle = handleNum;
//圆角环形图
let echarts1Data1 = [{ value: 0, name: '接打电话' }, { value: 0, name: '分神驾驶' }, { value: 0, name: '前向碰撞' }, { value: 0, name: '疲劳驾驶' }, { value: 0, name: '接近报警' }];
let num1 = 0;
......@@ -578,16 +323,16 @@ export default {
let num3 = 0;
let num4 = 0;
let num5 = 0;
arr1.forEach((item3,index3)=>{
if(item3.alarmTypeText == '接打电话'){
res1.data.forEach((item3,index3)=>{
if(item3.name == '接打电话'){
num1++;
}else if(item3.alarmTypeText == '分神驾驶'){
}else if(item3.name == '分神驾驶'){
num2++;
}else if(item3.alarmTypeText == '前向碰撞'){
}else if(item3.name == '前向碰撞'){
num3++;
}else if(item3.alarmTypeText == '疲劳驾驶'){
}else if(item3.name == '疲劳驾驶'){
num4++;
}else if(item3.alarmTypeText == '接近报警'){
}else if(item3.name == '接近报警'){
num5++;
}
})
......@@ -599,6 +344,10 @@ export default {
that.echarts1Data = echarts1Data1;
that.echarts1Fn();
//报警车辆排行榜
let echartsName1 = [];
res1.data.forEach((item2,index2)=>{
echartsName1.push(item2.vehiIdno);
})
let set1 = new Set();
echartsName1.forEach((item)=>set1.add(item))
let a1 = Array.from(set1);
......@@ -615,17 +364,17 @@ export default {
aa4.push(0);
aa5.push(0);
})
arr1.forEach((item4,index4)=>{
res1.data.forEach((item4,index4)=>{
a1.forEach((item5,index5)=>{
if(item4.vid == item5 && item4.alarmTypeText == '接打电话'){
if(item4.vehiIdno == item5 && item4.name == '接打电话'){
aa1[index5] = aa1[index5] + 1;
}else if(item4.vid == item5 && item4.alarmTypeText == '分神驾驶'){
}else if(item4.vehiIdno == item5 && item4.name == '分神驾驶'){
aa2[index5] = aa2[index5] + 1;
}else if(item4.vid == item5 && item4.alarmTypeText == '前向碰撞'){
}else if(item4.vehiIdno == item5 && item4.name == '前向碰撞'){
aa3[index5] = aa3[index5] + 1;
}else if(item4.vid == item5 && item4.alarmTypeText == '疲劳驾驶'){
}else if(item4.vehiIdno == item5 && item4.name == '疲劳驾驶'){
aa4[index5] = aa4[index5] + 1;
}else if(item4.vid == item5 && item4.alarmTypeText == '接近报警'){
}else if(item4.vehiIdno == item5 && item4.name == '接近报警'){
aa5[index5] = aa5[index5] + 1;
}
})
......@@ -636,174 +385,28 @@ export default {
that.echarts2Data.pilao = aa4;
that.echarts2Data.jiejin = aa5;
that.echarts2Fn();
}else{
}else{
that.echarts1Fn();
that.echarts2Fn();
}
})
})
}else if(this.aiTabPosition == '近30天'){
let fmt = moment().subtract(30, 'days').format('YYYY-MM-DD');
let start = this.currentTime1(new Date(new Date(new Date(fmt).toLocaleDateString()).getTime()));
let end = this.currentTime1(new Date(new Date(new Date().toLocaleDateString()).getTime() + 24 * 60 * 60 * 1000 - 1));
//报警列表
let allAlarmData1 = [];
this.allCarData.forEach((item1,index1)=>{
//获取每辆车的设备号
axios.get('/jiankong/StandardApiAction_getDeviceByVehicle.action', {
params: {
jsession:that.jsession,
vehiIdno:item1
}
}).then(function (response1) {
if(response1.data.devices.length != 0){
//有设备号的车获取报警列表
axios.get('/jiankong/StandardApiAction_queryPhoto.action', {
params: {
jsession:that.jsession,
devIdno:response1.data.devices[0].did,
alarmType:'620,621,624,625,400,172,190,430,431,432,433',
begintime:start,
endtime:end,
currentPage:0,
pageRecords:9999,
}
}).then(function (response2) {
if(response2.data.infos){
response2.data.infos.forEach((item2,index2)=>{
if(item2.alarmType == 620){
let obj1 = {...item2};
obj1.alarmTypeText = '接打电话';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 621){
let obj1 = {...item2};
obj1.alarmTypeText = '接打电话';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 624){
let obj1 = {...item2};
obj1.alarmTypeText = '分神驾驶';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 625){
let obj1 = {...item2};
obj1.alarmTypeText = '分神驾驶';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 600){
let obj1 = {...item2};
obj1.alarmTypeText = '前向碰撞';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 601){
let obj1 = {...item2};
obj1.alarmTypeText = '前向碰撞';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 172){
let obj1 = {...item2};
obj1.alarmTypeText = '疲劳驾驶';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 190){
let obj1 = {...item2};
obj1.alarmTypeText = '疲劳驾驶';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 430){
let obj1 = {...item2};
obj1.alarmTypeText = '接近报警';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 431){
let obj1 = {...item2};
obj1.alarmTypeText = '接近报警';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 432){
let obj1 = {...item2};
obj1.alarmTypeText = '接近报警';
allAlarmData1.push(obj1);
}else if(item2.alarmType == 433){
let obj1 = {...item2};
obj1.alarmTypeText = '接近报警';
allAlarmData1.push(obj1);
}
})
that.aiAnalysisTableData = allAlarmData1;
}
})
}
})
})
//报警echarts
axios.get('/jiankong/StandardApiAction_queryAlarmDetail.action', {
params: {
jsession:that.jsession,
vehiIdno:that.allCarDataText,
begintime:start,
endtime:end,
armType:'620,621,624,625,400,172,190,430,431,432,433',
currentPage:0,
pageRecords:9999,
}
}).then(function (response1) {
if(response1.data.alarms){
let arr1 = [];
let echartsName1 = [];
//报警数量
let alarmHandleNum = 0;
response1.data.alarms.forEach((item1,index1)=>{
if(item1.atp == 620){
let obj1 = {...item1};
obj1.alarmTypeText = '接打电话';
arr1.push(obj1);
}else if(item1.atp == 621){
let obj1 = {...item1};
obj1.alarmTypeText = '接打电话';
arr1.push(obj1);
}else if(item1.atp == 624){
let obj1 = {...item1};
obj1.alarmTypeText = '分神驾驶';
arr1.push(obj1);
}else if(item1.atp == 625){
let obj1 = {...item1};
obj1.alarmTypeText = '分神驾驶';
arr1.push(obj1);
}else if(item1.atp == 600){
let obj1 = {...item1};
obj1.alarmTypeText = '前向碰撞';
arr1.push(obj1);
}else if(item1.atp == 601){
let obj1 = {...item1};
obj1.alarmTypeText = '前向碰撞';
arr1.push(obj1);
}else if(item1.atp == 172){
let obj1 = {...item1};
obj1.alarmTypeText = '疲劳驾驶';
arr1.push(obj1);
}else if(item1.atp == 190){
let obj1 = {...item1};
obj1.alarmTypeText = '疲劳驾驶';
arr1.push(obj1);
}else if(item1.atp == 430){
let obj1 = {...item1};
obj1.alarmTypeText = '接近报警';
arr1.push(obj1);
}else if(item1.atp == 430){
let obj1 = {...item1};
obj1.alarmTypeText = '接近报警';
arr1.push(obj1);
}else if(item1.atp == 430){
let obj1 = {...item1};
obj1.alarmTypeText = '接近报警';
arr1.push(obj1);
}else if(item1.atp == 430){
let obj1 = {...item1};
obj1.alarmTypeText = '接近报警';
arr1.push(obj1);
//获取报警信息列表
HttpReq.truckDispatching.apiCameraUrllistQuery({page:0,size:99999,startTime:start,endTime:end}).then((res1) => {
if(res1.code == 200){
this.aiAnalysisTableData = res1.data;
this.alarmData.total = res1.data.length;
let handleNum = 0;
res1.data.forEach((item1,index1)=>{
if(item1.status == 1){
handleNum++;
}
})
that.alarmData.total = arr1.length;
arr1.forEach((item2,index2)=>{
echartsName1.push(item2.vid);
if(item2.hd != 0){
alarmHandleNum++;
}
})
that.alarmData.handle = alarmHandleNum;
this.alarmData.handle = handleNum;
//圆角环形图
let echarts1Data1 = [{ value: 0, name: '接打电话' }, { value: 0, name: '分神驾驶' }, { value: 0, name: '前向碰撞' }, { value: 0, name: '疲劳驾驶' }, { value: 0, name: '接近报警' }];
let num1 = 0;
......@@ -811,16 +414,16 @@ export default {
let num3 = 0;
let num4 = 0;
let num5 = 0;
arr1.forEach((item3,index3)=>{
if(item3.alarmTypeText == '接打电话'){
res1.data.forEach((item3,index3)=>{
if(item3.name == '接打电话'){
num1++;
}else if(item3.alarmTypeText == '分神驾驶'){
}else if(item3.name == '分神驾驶'){
num2++;
}else if(item3.alarmTypeText == '前向碰撞'){
}else if(item3.name == '前向碰撞'){
num3++;
}else if(item3.alarmTypeText == '疲劳驾驶'){
}else if(item3.name == '疲劳驾驶'){
num4++;
}else if(item3.alarmTypeText == '接近报警'){
}else if(item3.name == '接近报警'){
num5++;
}
})
......@@ -832,6 +435,10 @@ export default {
that.echarts1Data = echarts1Data1;
that.echarts1Fn();
//报警车辆排行榜
let echartsName1 = [];
res1.data.forEach((item2,index2)=>{
echartsName1.push(item2.vehiIdno);
})
let set1 = new Set();
echartsName1.forEach((item)=>set1.add(item))
let a1 = Array.from(set1);
......@@ -848,17 +455,17 @@ export default {
aa4.push(0);
aa5.push(0);
})
arr1.forEach((item4,index4)=>{
res1.data.forEach((item4,index4)=>{
a1.forEach((item5,index5)=>{
if(item4.vid == item5 && item4.alarmTypeText == '接打电话'){
if(item4.vehiIdno == item5 && item4.name == '接打电话'){
aa1[index5] = aa1[index5] + 1;
}else if(item4.vid == item5 && item4.alarmTypeText == '分神驾驶'){
}else if(item4.vehiIdno == item5 && item4.name == '分神驾驶'){
aa2[index5] = aa2[index5] + 1;
}else if(item4.vid == item5 && item4.alarmTypeText == '前向碰撞'){
}else if(item4.vehiIdno == item5 && item4.name == '前向碰撞'){
aa3[index5] = aa3[index5] + 1;
}else if(item4.vid == item5 && item4.alarmTypeText == '疲劳驾驶'){
}else if(item4.vehiIdno == item5 && item4.name == '疲劳驾驶'){
aa4[index5] = aa4[index5] + 1;
}else if(item4.vid == item5 && item4.alarmTypeText == '接近报警'){
}else if(item4.vehiIdno == item5 && item4.name == '接近报警'){
aa5[index5] = aa5[index5] + 1;
}
})
......@@ -869,13 +476,13 @@ export default {
that.echarts2Data.pilao = aa4;
that.echarts2Data.jiejin = aa5;
that.echarts2Fn();
}else{
}else{
that.echarts1Fn();
that.echarts2Fn();
}
})
})
}
},
//饼图1
echarts1Fn(){
......@@ -885,36 +492,17 @@ export default {
tooltip: {
trigger: 'item'
},
legend: {
top: '1%',
left: 'center'
},
color:['rgb(84,112,198)', 'rgb(145,204,117)','rgb(250,200,88)','rgb(255,150,195)', 'rgb(146,119,255)','rgb(250,200,88)','rgb(84,112,198)', 'rgb(145,204,117)','rgb(250,200,88)','rgb(84,112,198)', 'rgb(145,204,117)','rgb(250,200,88)','rgb(84,112,198)', 'rgb(145,204,117)','rgb(250,200,88)',],
color:['rgb(225,226,58)', 'rgb(44,195,253)','rgb(249,82,43)','rgb(255,150,195)', 'rgb(146,119,255)','rgb(250,200,88)','rgb(84,112,198)', 'rgb(145,204,117)','rgb(250,200,88)','rgb(84,112,198)', 'rgb(145,204,117)','rgb(250,200,88)','rgb(84,112,198)', 'rgb(145,204,117)','rgb(250,200,88)',],
series: [
{
type: 'pie',
radius: ['40%', '70%'],
radius: ['65%', '75%'],
avoidLabelOverlap: false,
itemStyle: {
borderRadius:20,
borderColor: '#fff',
borderColor: 'rgba(32,42,67,0.95)',
borderWidth: 2,
},
label: {
show: false,
position: 'center'
},
emphasis: {
label: {
show: true,
fontSize: '35',
fontWeight: 'bold',
color:'black',
}
},
labelLine: {
show: false
},
data: this.echarts1Data,
}
]
......@@ -934,7 +522,7 @@ export default {
},
legend: {
textStyle:{
color: 'black',
color: 'white',
fontSize:12,
},
},
......@@ -951,13 +539,13 @@ export default {
axisLabel: {
show: true,
textStyle: {
color: 'black',
color: 'white',
fontSize:14,
}
},
axisLine: {
lineStyle: {
color: 'black',
color: 'white',
width: 1
}
},
......@@ -967,13 +555,13 @@ export default {
axisLabel: {
show: true,
textStyle: {
color: 'black',
color: 'white',
fontSize:14,
}
},
axisLine: {
lineStyle: {
color: 'black',
color: 'white',
width: 0
}
},
......@@ -989,7 +577,7 @@ export default {
data: this.echarts2Data.dianhua,
barWidth: 20,
itemStyle: {
color: 'rgb(84,112,198)'
color: '#19D9BE'
},
},
{
......@@ -1002,7 +590,7 @@ export default {
data: this.echarts2Data.jiashi,
barWidth: 20,
itemStyle: {
color: 'rgb(145,204,117)'
color: '#E5AB49'
},
},
{
......@@ -1015,7 +603,7 @@ export default {
data: this.echarts2Data.pengzhuang,
barWidth: 20,
itemStyle: {
color: 'rgb(250,200,88)'
color: '#2597FD'
},
},
{
......@@ -1051,6 +639,16 @@ export default {
noPtzCloseFn(){
this.noPtz = false;
},
//点击查看
dianjichakan(item){
if(item.type == 1){
this.videoSrcShow = true;
this.videoSrc = item.downloadUrl;
}else{
this.elimageSrcShow = true;
this.elimageSrc = item.downloadUrl;
}
},
//转换时间格式(yyyy-mm-dd hh:mm:ss)
currentTime1(time){
var date = new Date(time);
......@@ -1086,38 +684,25 @@ export default {
changeTime1(row){
return this.currentTime1(row.stm);
},
//表格自滚动
mouseoverTable() {
clearInterval(this.tableTimer)
},
mouseoutTable() {
this.autoScrollTable(false)
},
autoScrollTable(init) {
this.$nextTick(() => {
const t = 50
const box = this.$el.querySelector('.el-table__body-wrapper')
const content = this.$el.querySelector('.el-table__body')
if (init) box.scrollTop = 0
this.tableTimer = setInterval(() => {
this.rollStartTable(box, content)
}, t)
})
},
rollStartTable(box, content) {
if (box.scrollTop >= (content.scrollHeight - box.offsetHeight)) {
box.scrollTop = 0
} else {
box.scrollTop++
}
},
//关闭视频
closeVideo(){
this.videoSrcShow = false;
this.videoSrc = '';
},
//关闭图片
closeElimage(){
this.elimageSrcShow = false;
this.elimageSrc = '';
},
},
//销毁
beforeDestroy() {
this.iframeSrc = '';
this.noPtz = false;
clearInterval(this.tableTimer);
this.tableTimer = null;
this.videoSrcShow = false;
this.videoSrc = '';
this.elimageSrcShow = false;
this.elimageSrc = '';
}
};
......@@ -1179,32 +764,226 @@ export default {
width: 68vw;
height: 94.5vh;
}
.aiAnalysisViews{
.video111 .echarts1{
width: 99%;
height: 22vh;
overflow: hidden;
}
.video111 .echarts2{
width: 99%;
height: 30vh;
overflow: hidden;
}
.video111 .aiAnalysisRightViews{
width: 20vw;
height: 94.5vh;
background-color: white;
padding: 1vh 0px 0px 1vh;
box-sizing: border-box;
border-left: 1px solid gainsboro;
overflow: hidden;
z-index: 3;
}
.aiAnalysisViews_Title{
font-size: 24px;
font-weight: 600;
.video111 .aiAnalysisRightViews_1{
width: 20vw;
height: 35vh;
background-color: rgba(32,42,67,0.95);
padding: 5px 7px;
box-sizing: border-box;
overflow: hidden;
}
.aiAnalysisViews_1{
margin-top: 1vh;
.video111 .aiAnalysisRightViews_1_title{
margin-bottom: 5px;
width: 100%;
height: 3.5vh;
background:no-repeat center center url('~@/assets/images/cutGraph/biaoti1.png');
background-size:100% 100%;
padding-left: 10px;
box-sizing: border-box;
font-size: 18px;
line-height: 3.5vh;
color: #FAFAFB;
letter-spacing: 1px;
text-shadow: 1px 1px 1px #92CBFF;
}
.video111 .aiAnalysisRightViews_1_content{
width: 100%;
height: 31.5vh;
position: relative;
}
.video111 .aiAnalysisRightViews_1_content_top{
display: flex;
justify-content: space-evenly;
}
.video111 .aiAnalysisRightViews_1_content_topL{
width: 30%;
height: 2.5vh;
line-height: 2.5vh;
color: #01EDF7;
font-size: 15px;
text-align: center;
border:1px solid #01A6FC;
border-radius: 5px;
opacity: 0.5;
cursor: pointer;
font-weight: 600;
}
.echarts1{
width: 99%;
height: 20vh;
overflow: hidden;
.video111 .aiAnalysisRightViews_1_content_topH{
width: 30%;
height: 2.5vh;
line-height: 2.5vh;
color: #01EDF7;
font-size: 15px;
border-radius: 5px;
text-align: center;
border:1px solid #01A6FC;
opacity: 1;
cursor: pointer;
font-weight: 600;
}
.echarts2{
width: 99%;
height: 27vh;
.video111 .alarmViewsStyle1{
width: 100%;
display: flex;
justify-content: space-evenly;
margin-top: 0.5vh;
}
.video111 .alarmViewsStyle1_left1{
padding-top: 0.5vh;
box-sizing: border-box;
width: 40%;
height: 4.5vh;
background:no-repeat center center url('~@/assets/images/cutGraph/sijirenshu1.png');
background-size:100% 100%;
display: flex;
align-items: center;
justify-content: space-evenly;
color: #F8D909;
}
.video111 .alarmViewsStyle1_right1{
padding-top: 0.5vh;
box-sizing: border-box;
width: 55%;
height: 4.5vh;
background:no-repeat center center url('~@/assets/images/cutGraph/dangqianrenshu1.png');
background-size:100% 100%;
display: flex;
align-items: center;
justify-content: space-evenly;
color: #01EDF7;
}
.video111 .aiAnalysisRightViews_2{
width: 20vw;
height: 24.5vh;
background-color: rgba(32,42,67,0.95);
padding: 5px 7px;
box-sizing: border-box;
overflow: hidden;
}
.video111 .aiAnalysisRightViews_2_title{
margin-bottom: 5px;
width: 100%;
height: 3.5vh;
background:no-repeat center center url('~@/assets/images/cutGraph/biaoti1.png');
background-size:100% 100%;
padding-left: 10px;
box-sizing: border-box;
font-size: 18px;
line-height: 3.5vh;
color: #FAFAFB;
letter-spacing: 1px;
text-shadow: 1px 1px 1px #92CBFF;
}
.video111 .aiAnalysisRightViews_2_content{
width: 100%;
height: 20vh;
}
.video111 .aiAnalysisRightViews_2_content_rolling{
width: 100%;
height: 20vh;
text-align: center;
overflow-y:auto;
scrollbar-width: none;
}
.video111 .aiAnalysisRightViews_2_content_rolling::-webkit-scrollbar {
display: none;
}
.video111 dl{
display:table;
width:100%;
}
.video111 dt{
margin-top: 20px;
display:table-row;
background-color: #274088;
}
.video111 dt>div{
display:table-cell;
padding:5px 3px;
font-size: 16px;
font-weight: 500;
color: rgb(24,228,240);
}
.video111 dd{
display:table-row;
}
.video111 dd>div{
display:table-cell;
padding:7px 1px;
font-size: 14px;
color: #A6F6F9;
}
.video111 .echarts1_neiquan{
position: absolute;
height: 12.5vh;
width: 6vw;
top: 12.3vh;
right: 6.7vw;
border: 5px solid rgb(43,178,203);
border-radius: 50%;
background-color: rgb(23,52,90);
padding-top: 3vh;
box-sizing: border-box;
text-align: center;
font-size: 20px;
}
.video111 .videoMengCeng{
width: 100%;
height: 100%;
padding: 2vh 0px 0px 12vw;
box-sizing: border-box;
background-color: rgba(0,0,0,0.8);
z-index: 50;
position: absolute;
top: 0px;
left: 0px;
}
.video111 .closeVideoDiv{
position: absolute;
right: 2vw;
top: 2vh;
color: white;
z-index: 51;
font-size: 50px;
font-weight: 600;
cursor: pointer;
}
.video111 .elimageMengCeng{
width: 100%;
height: 100%;
padding: 4vh 0px 0px 10vw;
box-sizing: border-box;
background-color: rgba(0,0,0,0.8);
z-index: 50;
position: absolute;
top: 0px;
left: 0px;
}
.video111 .closeElimageDiv{
position: absolute;
right: 2vw;
top: 2vh;
color: white;
z-index: 51;
font-size: 50px;
font-weight: 600;
cursor: pointer;
}
</style>
src/components/ezuikit/carsEZUIKitJs.vue
View file @ 1e2bbd4d
......@@ -153,6 +153,7 @@ export default {
},
mounted() {
this.getCode();
this.aiTabPositionFn();
},
methods: {
getCode() {
......@@ -707,7 +708,7 @@ export default {
closeElimage(){
this.elimageSrcShow = false;
this.elimageSrc = '';
}
},
},
//销毁
beforeDestroy() {
......
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