From 531ec703529b6d096bb271bfecff4f5910f62afe Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Fri, 09 Apr 2021 09:05:08 +0800
Subject: [PATCH] Merge branch 'master' of http://s16s652780.51mypc.cn:49896/r/jfpt-Vue
---
src/views/healthcode/healthcode.vue | 4
src/styles/alarmAnalysis/alarmAnalysis.scss | 68 ++++++++
src/views/alarmManagement/alarmAnalysis.vue | 395 +++++++++++++++++++++++++++++++++++++------------
3 files changed, 363 insertions(+), 104 deletions(-)
diff --git a/src/styles/alarmAnalysis/alarmAnalysis.scss b/src/styles/alarmAnalysis/alarmAnalysis.scss
index 73208fd..dfa27c8 100644
--- a/src/styles/alarmAnalysis/alarmAnalysis.scss
+++ b/src/styles/alarmAnalysis/alarmAnalysis.scss
@@ -25,7 +25,7 @@
.timeSearchBtn .timeSearch {
position: relative;
left: 1.2%;
- top: 40.6%;
+ top: 42.6%;
}
//预警总数统计
@@ -121,6 +121,37 @@
left: 1%;
}
+.alarmTypeTotal {
+ //background-color: antiquewhite;
+ width: 10%;
+ height: 100px;
+ position: relative;
+ left: 9.37%;
+ top: -58%;
+}
+
+.numAlarmType {
+ text-align: center;
+ position: relative;
+ top: 15%;
+}
+
+.numAlarmType span {
+ font-size: 28px;
+ color: #4B4B4B;
+}
+
+.textAlarmType {
+ text-align: center;
+ position: relative;
+ top: 20%;
+}
+
+.textAlarmType span {
+ font-size: 14px;
+ color: #757575;
+}
+
.alarmTypeProStatis {
//background-color: aqua;
width: 50%;
@@ -132,7 +163,7 @@
.alarmTypeProStatis .el-row {
position: relative;
- top: 120px;
+ top: 24px;
}
//预警设备类型占比
@@ -187,6 +218,37 @@
left: 1%;
}
+.confirmTimeTotal {
+ //background-color: antiquewhite;
+ width: 12%;
+ height: 100px;
+ position: relative;
+ left: 12.87%;
+ top: -58%;
+}
+
+.numConfirmTime {
+ text-align: center;
+ position: relative;
+ top: 15%;
+}
+
+.numConfirmTime span {
+ font-size: 28px;
+ color: #4B4B4B;
+}
+
+.textConfirmTime {
+ text-align: center;
+ position: relative;
+ top: 20%;
+}
+
+.textConfirmTime span {
+ font-size: 14px;
+ color: #757575;
+}
+
.confirmTimeProStatis {
//background-color: aqua;
width: 60%;
@@ -198,7 +260,7 @@
.confirmTimeProStatis .el-row {
position: relative;
- top: 120px;
+ top: 24px;
}
//预警平均速度排行
diff --git a/src/views/alarmManagement/alarmAnalysis.vue b/src/views/alarmManagement/alarmAnalysis.vue
index ccc4a70..c3adaae 100644
--- a/src/views/alarmManagement/alarmAnalysis.vue
+++ b/src/views/alarmManagement/alarmAnalysis.vue
@@ -7,28 +7,28 @@
<el-button-group class="timeBtn">
<el-button
v-bind:class="activeClass == 1 ? 'btn-color' : ''"
- size="mini"
+ size="small"
@click="getData(1)">
本周
</el-button>
-
+
<el-button
v-bind:class="activeClass == 2 ? 'btn-color' : ''"
- size="mini"
+ size="small"
@click="getData(2)">
月初至今
</el-button>
-
+
<el-button
v-bind:class="activeClass == 3 ? 'btn-color' : ''"
- size="mini"
+ size="small"
@click="getData(3)">
季度至今
</el-button>
</el-button-group>
<el-date-picker
class="timeSearch"
- size="mini"
+ size="small"
v-model="dateTime"
type="daterange"
@change="timeChange"
@@ -50,6 +50,10 @@
<!-- 预警类型占比 -->
<div class="alarmTypePro">
<div id="alarmTypeProEcharts"></div>
+ <div class="alarmTypeTotal">
+ <div class="numAlarmType"><span>{{alarmTypeTotal}}</span></div>
+ <div class="textAlarmType"><span>总预警数</span></div>
+ </div>
<div class="alarmTypeProStatis">
<avue-data-cardtext :option="alarmTypeProStatis"></avue-data-cardtext>
</div>
@@ -64,6 +68,10 @@
<!-- 确认时间占比 -->
<div class="confirmTimePro">
<div id="confirmTimeProEcharts"></div>
+ <div class="confirmTimeTotal">
+ <div class="numConfirmTime"><span>{{confirmTimeTotal}}</span></div>
+ <div class="textConfirmTime"><span>确认预警数</span></div>
+ </div>
<div class="confirmTimeProStatis">
<avue-data-cardtext :option="confirmTimeProStatis"></avue-data-cardtext>
</div>
@@ -76,21 +84,23 @@
<div class="alarmTimeDis">
<div id="alarmTimeDisEchars"></div>
</div>
-
+
<!-- 底部 -->
<div class="low"></div>
</div>
</template>
-
+
<script>
import echarts from 'echarts'
import {selectIndexCount,selectAlertScount,selAlarmDayAveragePro,selConfirmTimePro,selAlarmTimeDis} from "@/api/statis/statis";
import alarmVue from '../alarm/alarm.vue';
-
+
export default {
data(){
return {
activeClass:2,
+ alarmTypeTotal:0,
+ confirmTimeTotal:0,
statisToTalData: {
span:6,
data: []
@@ -116,7 +126,7 @@
confirmAverageSpeedOption:{}
};
},
-
+
mounted() {
//默认是查询当月的数据
this.getData(2);
@@ -125,8 +135,10 @@
window.handleStartParcelKind=this.handleStartParcelKind;
window.handleStartEquipment=this.handleStartEquipment;
window.handleStartSuser=this.handleStartSuser;
+ window.handleStartAnimalHeat=this.handleStartAnimalHeat;
+ window.handleStartHealthcode=this.handleStartHealthcode;
},
-
+
methods: {
//日期选好后触发
timeChange(){
@@ -140,7 +152,7 @@
}
this.getStatisData(data);
},
-
+
//中国区时间格式转换
timeFormat(date){
let y = date.getFullYear()
@@ -157,18 +169,20 @@
let time= y + '-' + m + '-' + d + ' ' + h + ':' + M + ':' + s;
return time;
},
-
+
//警情统计总数
getStatisTotalData(data){
selectIndexCount(data).then(res => {
var that = this;
+ var time = this.dateTime;
that.statisToTalData.data = [
{
click: function (item) {
- var data =[];
+ var data = [];
data.push({
+ startTime:time[0],
+ endTime:time[1],
waringType:'紧急求救',
- status:0
})
window.parent.handleStartAlarm(data);
},
@@ -180,20 +194,20 @@
{
click: function (item) {
var data =[];
- // 当前时间
- var date = new Date();
- //年
- var Y = date.getFullYear();
- //月
- var M = date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
- //日
- var D = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
-
+ // // 当前时间
+ // var date = new Date();
+ // //年
+ // var Y = date.getFullYear();
+ // //月
+ // var M = date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
+ // //日
+ // var D = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
+ console.log(this.dateTime,111);
data.push({
- startTime:Y + "-" + M + "-" + D + " 00:00:00",
- endTime: Y +"-" +M +"-" + D + " 23:59:59",
- decisioDiagramResult:"contraband"
- });
+ startTime:time[0],
+ endTime: time[1],
+ decisioDiagramResult:"contraband"
+ });
window.parent.handleStartParcel(data);
},
title: '违禁包裹数',
@@ -205,19 +219,19 @@
click: function (item) {
var data = [];
// 当前时间
- var date = new Date();
- //年
- var Y = date.getFullYear();
- //月
- var M = date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
- //日
- var D = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
-
+ // var date = new Date();
+ // //年
+ // var Y = date.getFullYear();
+ // //月
+ // var M = date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
+ // //日
+ // var D = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
+
data.push({
- startTime:Y + "-" + M + "-" + D + " 00:00:00",
- endTime: Y +"-" +M +"-" + D + " 23:59:59",
- decisioDiagramResult:"contraband"
- });
+ startTime:time[0],
+ endTime: time[1],
+ decisioDiagramResult:"contraband"
+ });
window.parent.handleStartParcelKind(data);
},
title: '违禁物品数',
@@ -251,7 +265,7 @@
];
});
},
-
+
//主动报警(一键求助,电话报警)分页数据
handleStartAlarm(data) {
this.$router.push({
@@ -259,16 +273,15 @@
query: data[0],
});
},
-
+
//包裹分页数据
handleStartParcel(data) {
- debugger;
this.$router.push({
path: `/parcel/index`,
query: data[0],
});
},
-
+
//违禁品分页数据
handleStartParcelKind(data) {
this.$router.push({
@@ -276,7 +289,7 @@
query: data[0],
});
},
-
+
//在线设备分页数据
handleStartEquipment(data) {
this.$router.push({
@@ -284,14 +297,30 @@
query: data[0],
});
},
-
+
//客户管理分页数据
handleStartSuser() {
this.$router.push({
path: `/suser/index`,
});
},
-
+
+ //体温监测分页数据
+ handleStartAnimalHeat(data) {
+ this.$router.push({
+ path: `/animalHeat/animalHeatPage`,
+ query: data[0],
+ });
+ },
+
+ //健康码分页数据
+ handleStartHealthcode(data) {
+ this.$router.push({
+ path: `/healthcode/healthcodePage`,
+ query: data[0],
+ });
+ },
+
//预警数量分布
getAlarmNumberStatis(data){
//调接口,获取数据
@@ -334,6 +363,45 @@
})
let echarts = require('echarts');
let myChart = echarts.init(document.getElementById('alarmNumberStatis'));
+ myChart.on('click', function (params) {
+ var data = [];
+
+ if(params.seriesName=='一键求助'){
+ data.push({
+ startTime:params.name+" 00:00:00",
+ endTime:params.name+" 23:59:59",
+ waringType:'紧急求救',
+ })
+ window.parent.handleStartAlarm(data);
+ }
+
+ if(params.seriesName=='违禁品'){
+ data.push({
+ startTime:params.name+" 00:00:00",
+ endTime:params.name+" 23:59:59",
+ decisioDiagramResult:"contraband"
+ });
+ window.parent.handleStartParcelKind(data);
+ }
+
+ if(params.seriesName=='红色健康码'){
+ data.push({
+ startTime:params.name+" 00:00:00",
+ endTime:params.name+" 23:59:59",
+ type:3
+ });
+ window.parent.handleStartHealthcode(data);
+ }
+
+ if(params.seriesName=='体温异常'){
+ data.push({
+ startTime:params.name+" 00:00:00",
+ endTime:params.name+" 23:59:59",
+ status:1
+ });
+ window.parent.handleStartAnimalHeat(data);
+ }
+ })
var colors = ['#FF9836', '#1E90FF', '#F34A4A', '#8058A5'];
let option = {
color:colors,
@@ -374,14 +442,14 @@
},
series: data
};
-
+
myChart.setOption(option);
//建议加上以下这一行代码,不加的效果图如下(当浏览器窗口缩小的时候)。超过了div的界限(红色边框)
window.addEventListener('resize',function() {myChart.resize()});
})
},
-
+
//警情类别统计总数
getAlarmClassifyStatis(data){
selAlarmDayAveragePro(data).then(res =>{
@@ -391,6 +459,13 @@
that.alarmClassifyStatis.data = [
{
click: function (item) {
+ var data = [];
+ data.push({
+ startTime:time[0],
+ endTime:time[1],
+ waringType:'紧急求救',
+ })
+ window.parent.handleStartAlarm(data);
},
title:'一键求助',
color:'#FF9836',
@@ -400,6 +475,13 @@
},
{
click: function (item) {
+ var data = [];
+ data.push({
+ startTime:time[0],
+ endTime:time[1],
+ decisioDiagramResult:"contraband"
+ });
+ window.parent.handleStartParcelKind(data);
},
title:'违禁品',
color:'#1E90FF',
@@ -408,6 +490,13 @@
},
{
click: function (item) {
+ var data = [];
+ data.push({
+ startTime:time[0],
+ endTime:time[1],
+ type:3
+ });
+ window.parent.handleStartHealthcode(data);
},
title:'红色健康码',
color:'#F34A4A',
@@ -416,6 +505,13 @@
},
{
click: function (item) {
+ var data = [];
+ data.push({
+ startTime:time[0],
+ endTime:time[1],
+ status:1
+ });
+ window.parent.handleStartAnimalHeat(data);
},
title:'体温异常',
color:'#8058A5',
@@ -425,12 +521,17 @@
];
})
},
-
-
+
+
//预警类型占比统计
getAlarmTypeProEcharts(data){
selAlarmDayAveragePro(data).then(res =>{
+ var that = this;
+ //计算总和
+ that.alarmTypeTotal = res.data.data[0]+res.data.data[1]+res.data.data[2]+res.data.data[3];
var data = [];
+ var startDate = this.dateTime[0];
+ var endDate = this.dateTime[1];
data.push(
{value: res.data.data[0], name: '一键求助'},
{value: res.data.data[1], name: '违禁品'},
@@ -439,6 +540,46 @@
)
let echarts = require('echarts');
let myChart = echarts.init(document.getElementById('alarmTypeProEcharts'));
+ myChart.on('click', function (params) {
+ var data = [];
+
+ if(params.name=='一键求助'){
+ data.push({
+ startTime:startDate,
+ endTime:endDate,
+ waringType:'紧急求救',
+ })
+ window.parent.handleStartAlarm(data);
+ }
+
+ if(params.name=='违禁品'){
+ data.push({
+ startTime:startDate,
+ endTime:endDate,
+ decisioDiagramResult:"contraband"
+ });
+ window.parent.handleStartParcelKind(data);
+ }
+
+ if(params.name=='红色健康码'){
+ data.push({
+ startTime:startDate,
+ endTime:endDate,
+ type:3
+ });
+ window.parent.handleStartHealthcode(data);
+ }
+
+ if(params.name=='体温异常'){
+ data.push({
+ startTime:startDate,
+ endTime:endDate,
+ status:1
+ });
+ window.parent.handleStartAnimalHeat(data);
+ }
+
+ })
var colors = ['#FF9836', '#3fa1ff', '#F34A4A', '#8058A5'];
let option = {
color:colors,
@@ -473,13 +614,6 @@
show: false,
position: 'center'
},
- emphasis: {
- label: {
- show: true,
- fontSize: '18',
- fontWeight: 'bold'
- }
- },
labelLine: {
show: false
},
@@ -494,16 +628,24 @@
})
},
-
-
+
+
//警情类别统计总数(分类占比)
getAlarmTypeProStatis(data){
selAlarmDayAveragePro(data).then(res =>{
var that = this;
+ var time = this.dateTime;
var count = res.data.data[0]+res.data.data[1]+res.data.data[2]+res.data.data[3];
that.alarmTypeProStatis.data = [
{
click: function (item) {
+ var data = [];
+ data.push({
+ startTime:time[0],
+ endTime:time[1],
+ waringType:'紧急求救',
+ })
+ window.parent.handleStartAlarm(data);
},
title:'一键求助',
color:'#FF9836',
@@ -513,6 +655,13 @@
},
{
click: function (item) {
+ var data = [];
+ data.push({
+ startTime:time[0],
+ endTime:time[1],
+ decisioDiagramResult:"contraband"
+ });
+ window.parent.handleStartParcelKind(data);
},
title:'违禁品',
color:'#3fa1ff',
@@ -521,6 +670,13 @@
},
{
click: function (item) {
+ var data = [];
+ data.push({
+ startTime:time[0],
+ endTime:time[1],
+ type:3
+ });
+ window.parent.handleStartHealthcode(data);
},
title:'红色健康码',
color:'#F34A4A',
@@ -529,6 +685,13 @@
},
{
click: function (item) {
+ var data = [];
+ data.push({
+ startTime:time[0],
+ endTime:time[1],
+ status:1
+ });
+ window.parent.handleStartAnimalHeat(data);
},
title:'体温异常',
color:'#8058A5',
@@ -538,7 +701,7 @@
];
})
},
-
+
//预警设备类型占比统计
getAlarmEquipmentProEcharts(data){
let echarts = require('echarts');
@@ -575,13 +738,6 @@
show: false,
position: 'center'
},
- emphasis: {
- label: {
- show: true,
- fontSize: '18',
- fontWeight: 'bold'
- }
- },
labelLine: {
show: false
},
@@ -600,7 +756,7 @@
//建议加上以下这一行代码,不加的效果图如下(当浏览器窗口缩小的时候)。超过了div的界限(红色边框)
window.addEventListener('resize',function() {myChart.resize()});
},
-
+
//预警设备类型占比统计(分类表格)
getAlarmEquipmentProStatis(data){
var that = this;
@@ -631,17 +787,32 @@
}
]
}
-
-
+
+
},
-
-
+
+
//确认时间占比统计
getConfirmTimeProEcharts(data){
selConfirmTimePro(data).then(res =>{
var data = res.data.data;
+ var that =this;
+ //计算总数
+ that.confirmTimeTotal = data[0]+data[1]+data[2]+data[3];
+ var time = this.dateTime;
let echarts = require('echarts');
let myChart = echarts.init(document.getElementById('confirmTimeProEcharts'));
+ //饼图点击事件
+ myChart.on('click',function(params){
+ var data = [];
+ data.push({
+ startTime:time[0],
+ endTime:time[1],
+ waringType:'紧急求救',
+ timeDesc: params.name
+ })
+ window.parent.handleStartAlarm(data);
+ })
var colors = ['green','#3fa1ff','yellow','#F34A4A']
let option = {
color:colors,
@@ -676,13 +847,6 @@
show: false,
position: 'center'
},
- emphasis: {
- label: {
- show: true,
- fontSize: '18',
- fontWeight: 'bold'
- }
- },
labelLine: {
show: false
},
@@ -700,15 +864,24 @@
window.addEventListener('resize',function() {myChart.resize()});
})
},
-
+
//确认时间占比(分类)
getConfirmTimeProStatis(data){
selConfirmTimePro(data).then(res =>{
var data = res.data.data;
+ var time = this.dateTime;
var that = this;
that.confirmTimeProStatis.data = [
{
click: function (item) {
+ var data = [];
+ data.push({
+ startTime:time[0],
+ endTime:time[1],
+ waringType:'紧急求救',
+ timeDesc: '小于5分钟'
+ })
+ window.parent.handleStartAlarm(data);
},
title:'小于5分钟',
color:'green',
@@ -717,6 +890,14 @@
},
{
click: function (item) {
+ var data = [];
+ data.push({
+ startTime:time[0],
+ endTime:time[1],
+ waringType:'紧急求救',
+ timeDesc: '5-10分钟'
+ })
+ window.parent.handleStartAlarm(data);
},
title:'5-10分钟',
color:'#3fa1ff',
@@ -724,6 +905,14 @@
},
{
click: function (item) {
+ var data = [];
+ data.push({
+ startTime:time[0],
+ endTime:time[1],
+ waringType:'紧急求救',
+ timeDesc: '10-30分钟'
+ })
+ window.parent.handleStartAlarm(data);
},
title:'10-30分钟',
color:'yellow',
@@ -731,6 +920,14 @@
},
{
click: function (item) {
+ var data = [];
+ data.push({
+ startTime:time[0],
+ endTime:time[1],
+ waringType:'紧急求救',
+ timeDesc: '30分钟以上'
+ })
+ window.parent.handleStartAlarm(data);
},
title:'30分钟以上',
color:'#F34A4A',
@@ -739,7 +936,7 @@
];
})
},
-
+
//预警平均速度排行(table)
confirmAverageSpeedStatis(data){
var that = this;
@@ -771,7 +968,7 @@
]
}
},
-
+
//预警时间分布
getAlarmTimeDisEchars(data){
selAlarmTimeDis(data).then(res =>{
@@ -861,7 +1058,7 @@
window.addEventListener('resize',function() {myChart.resize()});
})
},
-
+
//点击按钮获取不同时间段的数据
getData(date){
var that = this;
@@ -870,7 +1067,7 @@
//调用方法获取数据
this.getStatisData(data);
},
-
+
getStatisData(data){
//统计预警总数
this.getStatisTotalData(data);
@@ -891,8 +1088,8 @@
//预警时间分布统计
this.getAlarmTimeDisEchars(data);
},
-
-
+
+
//计算两个日期之间的天数
getDaysBetween(startTime,endTime){
var startDate = Date.parse(startTime);
@@ -906,8 +1103,8 @@
var days=(endDate - startDate)/(1*24*60*60*1000);
return days;
},
-
-
+
+
getDate(date){
var that = this;
var today = new Date();
@@ -938,8 +1135,8 @@
endTime:this.dateTime[1]
}
},
-
-
+
+
//本日
showToDay(Nowdate){
var M=Number(Nowdate.getMonth())+1;
@@ -952,7 +1149,7 @@
}
return Nowdate.getFullYear()+"-"+M+"-"+day;
},
-
+
//本周第一天
showWeekFirstDay(Nowdate){
var WeekFirstDay=new Date(Nowdate-(Nowdate.getDay()-1)*86400000);
@@ -966,7 +1163,7 @@
}
return WeekFirstDay.getFullYear()+"-"+M+"-"+day;
},
-
+
//本月第一天
showMonthFirstDay(Nowdate){
var MonthFirstDay=new Date(Nowdate.getFullYear(),Nowdate.getMonth(),1);
@@ -976,14 +1173,14 @@
}
return MonthFirstDay.getFullYear()+"-"+M+"-"+"0"+MonthFirstDay.getDate();
},
-
+
//本季度的第一天
getQuarterStartDate(Nowdate){
var quarterStartDate = this.getQuarterStartMonth(Nowdate);
return Nowdate.getFullYear()+"-"+quarterStartDate+"-"+"01";
},
-
-
+
+
//本季度的第一个月份
getQuarterStartMonth(Nowdate){
var nowMonth = Nowdate.getMonth()+1;
@@ -1003,9 +1200,9 @@
}
return quarterStartMonth;
}
-
+
},
-
+
}
@@ -1013,5 +1210,5 @@
<style lang="scss">
@import '@/styles/alarmAnalysis/alarmAnalysis.scss'
-
+
</style>
\ No newline at end of file
diff --git a/src/views/healthcode/healthcode.vue b/src/views/healthcode/healthcode.vue
index 343e725..0689cdd 100644
--- a/src/views/healthcode/healthcode.vue
+++ b/src/views/healthcode/healthcode.vue
@@ -191,7 +191,7 @@
recorder: null,
};
},
- mounted:{
+ mounted(){
},
computed: {
@@ -251,7 +251,7 @@
getHealthcodeType(){
if (this.$route.query.type != undefined) {
var type = this.$route.query.type+"";
- this.$route.query = {};
+ //this.$route.query = {};
return type;
}
},
--
Gitblit v1.9.3