sxyanzhu
/
jhbigscreen
4
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

提交代码

prv
姜玉琦 2023-10-14 18:28:58 +08:00
parent bdd14f39ea
commit 24f1893157
3 changed files with 163 additions and 94 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/api/video/aiBoxVideo.js
View File

@ -14,9 +14,17 @@ const getVideoPassage=(deptId,projectId,passageType,importance)=> {
}) })
} }
const groupCountByAlarmType=(deptId,projectId)=> { const groupCountByAlarmType=(deptId,projectId,now)=> {
return request({ return request({
url: `/bgscreen/aiBoxVideo/groupCountByAlarmType?deptId=${deptId||0}&projectId=${projectId||0}`, url: `/bgscreen/aiBoxVideo/groupCountByAlarmType?deptId=${deptId||0}&projectId=${projectId||0}&now=${now}`,
method: 'get'
})
}
// 查询视频分布汇总
const selectGroupCountVideoConfig=(deptId,projectId)=> {
return request({
url: `/bgscreen/aiBoxVideo/selectGroupCountVideoConfig?deptId=${deptId||0}&projectId=${projectId||0}`,
method: 'get' method: 'get'
}) })
} }
@ -24,5 +32,7 @@ const groupCountByAlarmType=(deptId,projectId)=> {
export default{ export default{
listView, listView,
getVideoPassage getVideoPassage,
groupCountByAlarmType,
selectGroupCountVideoConfig
} }

1
src/pages/index.vue
View File

@ -801,6 +801,7 @@ export default {
sum += it.value; sum += it.value;
}) })
this.overviewTotal = sum; this.overviewTotal = sum;
console.log(tmps);
this.typeDistributionData = tmps; this.typeDistributionData = tmps;
this.elKey++; this.elKey++;
}) })

240
src/pages/toAIVideoProject.vue
View File

@ -3,66 +3,36 @@
<div class="screen-content"> <div class="screen-content">
<el-row> <el-row>
<el-col :span="6"> <el-col :span="6">
<module-one-1-1 label="预警概况" :amplify="true" name="amplify-spjk"> <module-one-2-1 label="预警概况">
<div class="equipment-list-max"> <div class="labour-warning-title">
<el-row> <div class="labour-warning-img">
<el-col :span="12"> <div class="labour-warning-bgd">
<div class="equipment-list-min"> <img src="/images/labour_warning_icon.png">
<div class="equipment-list-gif"> </div>
<img src="images/video_1.png"> </div>
</div> <div class="labour-warning-data">
<div class="equipment-list-data"> <p>今日预警</p>
<p>项目监控</p> <div class="labour-warning-number">
<div><span v-cloak>{{ 0 }}</span>个</div> <span>{{overviewTotalDay}}</span> 次
</div> </div>
</div> </div>
</el-col> <div class="labour-warning-data">
<el-col :span="12"> <p>累计预警</p></p></p>
<div class="equipment-list-min"> <div class="labour-warning-number">
<div class="equipment-list-gif"> <span>{{overviewTotal}}</span> 次
<img src="images/video_2.png"> </div>
</div> </div></div>
<div class="equipment-list-data"> <project-overview-chart :key="overviewDay" :sp="''"
<p>吊钩监控</p> :maintitle="overviewTotalDay" :legend-opt="legendOpt2" :typedata="typeDistributionDataDay"
<div><span v-cloak>{{ 0 }}</span>个</div> :text="overviewTextDay" :height="250"></project-overview-chart>
</div>
</div>
</el-col>
<el-col :span="12">
<div class="equipment-list-min">
<div class="equipment-list-gif">
<img src="images/video_3.png">
</div>
<div class="equipment-list-data">
<p>AI识别监控</p>
<div><span v-cloak>{{ 0 }}</span>个</div>
</div>
</div>
</el-col>
<el-col :span="12">
<div class="equipment-list-min">
<div class="equipment-list-gif">
<img src="images/video_4.png">
</div>
<div class="equipment-list-data">
<p>离线视频</p>
<div><span v-cloak>{{ 0 }}</span>个</div>
</div>
</div>
</el-col>
</el-row>
</div>
</module-one-1-1>
<module-one-2-1 label="预警分布">
<div class="video-field-layout">
<project-overview-chart :key="overview" :sp="''"
:maintitle="overviewTotal" :legend-opt="legendOpt1" :typedata="typeDistributionData"
:text="overviewText" :height="230"></project-overview-chart>
<rank-chart :data="availabilityData" :showval="true" :height="300" <project-overview-chart :key="overview" :sp="''"
:width="projectCategoryWidth"></rank-chart> :maintitle="overviewTotal" :legend-opt="legendOpt1" :typedata="typeDistributionData"
</div> :text="overviewText" :height="250"></project-overview-chart>
</module-one-2-1> </module-one-2-1>
<module-one-1-1 label="预警分布">
<rank-chart :data="availabilityData" :showval="true" :height="300"></rank-chart>
</module-one-1-1>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<div class="ai-video-info"> <div class="ai-video-info">
@ -191,7 +161,7 @@ export default {
//预警概况 //预警概况
overview: 0, overview: 0,
overviewInterval: '', overviewInterval: '',
overviewTotal: 100, overviewTotal: 0,
legendOpt1: { legendOpt1: {
icon: "rect", icon: "rect",
textStyle: { textStyle: {
@ -208,15 +178,39 @@ export default {
}, },
}, },
}, },
overviewText: '预警数量', overviewText: '累计预警',
//原因类型分析 //原因类型分析
availabilityData: [], availabilityData: [],
projectCategoryWidth: 200, projectCategoryWidth: 200,
//预警概况 //预警概况
typeDistributionData: [ typeDistributionData: [
{ name: '在建项目', value: '15' }, { name: '未戴安全帽', value: '0' },
{ name: '项目总投资', value: '515.97' }, { name: '未穿工服', value: '0' },
{ name: '项目年投资', value: '134.86' } { name: '反光衣/带检测', value: '0' }
],
overviewTextDay: '今日预警',
overviewTotalDay: 0,
overviewDay: 999,
legendOpt2: {
icon: "rect",
textStyle: {
fontSize: 14,
rich: {
name: {
color: "#c3dbfd",
padding: [10, 5, 20, 5],
},
percent: {
color: "#f73647",
padding: [10, 5, 20, 5],
},
},
},
},
typeDistributionDataDay: [
{ name: '未戴安全帽', value: '0' },
{ name: '未穿工服', value: '0' },
{ name: '反光衣/带检测', value: '0' }
], ],
} }
}, },
@ -349,11 +343,8 @@ export default {
this.getAiVideoInfoList("",""); this.getAiVideoInfoList("","");
this.getMajorAiVideoInfoList(); this.getMajorAiVideoInfoList();
this.getAnalysisDetailList(); this.getAnalysisDetailList();
// this.getAiVideoAlertorTypeCount();
// this.getAiVideoAlertorTypeCount(); this.initAiVideoAlertorTypeDistribution();
// this.getAiVideoAlertorTypeWarningCount();
}, },
//head选择项目返回值 //head选择项目返回值
onItemData(e){ onItemData(e){
@ -486,32 +477,66 @@ export default {
this.$api.aiBoxVideo.listView(this.dept?.id||0,this.projectInfo?.projectId).then((response) => { this.$api.aiBoxVideo.listView(this.dept?.id||0,this.projectInfo?.projectId).then((response) => {
this.warningList = response.data||[]; this.warningList = response.data||[];
}); });
this.$api.aiBoxVideo.groupCountByAlarmType(this.dept?.id||0,this.projectInfo?.projectId).then((response) => {
this.typeDistributionData=[];
if(response.data){
response.data.forEach(datum => {
this.typeDistributionData.push({name:datum.alarmTypeName,value:sumValue})
})
}
});
}, },
getAiVideoAlertorTypeCount(){ getAiVideoAlertorTypeCount(){
axios.post(Host + "/api/video/getAiVideoAlertorTypeCount", { // axios.post(Host + "/api/video/getAiVideoAlertorTypeCount", {
projectId: JSON.parse(localStorage.getItem("data")).aqzg // projectId: JSON.parse(localStorage.getItem("data")).aqzg
}).then(res => { // }).then(res => {
var data = res.data; // var data = res.data;
var num = 0; // var num = 0;
data.forEach(item =>{ // data.forEach(item =>{
num += item.value; // num += item.value;
}) // })
data.forEach(item =>{ // data.forEach(item =>{
item.percent = (item.value/num*100).toFixed(2) // item.percent = (item.value/num*100)
}) // })
this.scaleData = data; // this.scaleData = data;
}).catch(err => { // }).catch(err => {
}) // })
//今日视图
this.$api.aiBoxVideo.groupCountByAlarmType(this.dept?.id||0,this.projectInfo?.projectId,"Y").then((response) => {
if(response.data){
let sum = 0;
response.data.forEach(datum => {
sum+=datum.value;
})
this.overviewTotalDay = sum;
this.typeDistributionDataDay = response.data;
this.overviewDay++;
}
});
//累计视图
this.$api.aiBoxVideo.groupCountByAlarmType(this.dept?.id||0,this.projectInfo?.projectId,"N").then((response) => {
if(response.data){
let sum = 0;
response.data.forEach(datum => {
sum+=datum.value;
})
this.overviewTotal = sum;
this.typeDistributionData = response.data;
this.overview++;
}
});
},
initAiVideoAlertorTypeDistribution(){
this.$api.aiBoxVideo.selectGroupCountVideoConfig(this.dept?.id||0,this.projectInfo?.projectId).then((response) => {
let list=[];
if(response.data){
let sum = 0;
response.data.forEach(datum => {
sum += datum.value;
})
response.data.forEach(datum => {
datum.text = datum.name;
datum.prop = (datum.value/sum*100).toFixed(2)
list.push(datum);
})
this.availabilityData = list;
}
});
}, },
getAiVideoAlertorTypeWarningCount(){ getAiVideoAlertorTypeWarningCount(){
axios.post(Host + "/api/video/getAiVideoAlertorTypeWarningCount", { axios.post(Host + "/api/video/getAiVideoAlertorTypeWarningCount", {
@ -699,4 +724,37 @@ export default {
text-align: center; text-align: center;
line-height: 420px; line-height: 420px;
} }
.my-svg-icon {
width: 40px;
height: 40px;
margin-bottom: 20px;
}
.my-svg-icon * {
fill: #389DE3;
}
.people-number-con div.is-split {
background: none;
}
.labour-education .number-unit {
position: relative;
bottom: -8px;
}
.number-unit {
word-break: keep-all;
}
.cost-out {
.labour-education {
height: 70px;
.people-number-con {
padding: 0px;
}
}
}
</style> </style>