monitor_v3 / hg-monitor-web · Commits

Go to a project

Authored by 王涛
Commit e6ce7b646523f341011ca6d332f279efecb25c94 2 parents 06761712 0a8385f1

Merge branch 'master-v32-xwx' into 'master' 

【1401】通知统计功能 点击全部结果与实际数据不符



See merge request !715
Inline Side-by-side
Showing 4 changed files with 85 additions and 17 deletions
... ... @@ -34,9 +34,25 @@ layui.define(['common', 'admin', 'echarts', 'common', 'table', 'sessions'], func
});
//导出
$('#exportNoticeCountBtn').on("click", function () {
var url=common.domainName + '/api-web/bAlarm/noticeExport?access_token=' + accessToken + '&type=' + tablePeriod;
var url = common.domainName + '/api-web/bAlarm/noticeExport?access_token=' + accessToken + '&type=' + tablePeriod;
window.open(url);
});
var alarmSendTips ;
$(".detail_base_info").hover(function() {
openMsg();
}, function() {
layer.close(alarmSendTips);
});
function openMsg() {
alarmSendTips = layer.tips("<span style='color:#585858;'>" +
"人员告警发送统计规则：<br>" +
"&nbsp;&nbsp;&nbsp;&nbsp;• 一条告警可能存在多个通知人<br>" +
"&nbsp;&nbsp;&nbsp;&nbsp;• 按照通知人统计告警发送数量<br>" +
"</span>",
'.detail_base_info',{tips:[2,'#F0F0F0'], time:0,area: ['auto', 'auto']});
}
//初始化柱状图页面
function initNoticeCount() {
$.ajax({
... ... @@ -48,11 +64,36 @@ layui.define(['common', 'admin', 'echarts', 'common', 'table', 'sessions'], func
histogramECharts(res.map.business, 'count_notice_send_business', '业务子系统告警发送统计');
//初始化人员告警发送告警统计
histogramECharts(res.map.user, 'count_notice_send_user', '人员告警发送统计');
$("#businessMore").unbind('click').on('click', function () {
queryData('业务子系统告警发送统计', res.map.business)
})
$("#userMore").unbind('click').on('click', function () {
queryData('人员告警发送统计', res.map.user)
})
}
}
})
}
//lsq 弹框打开更多 2022-06-21
function queryData(title, data) {
let html = `
<div class="pie-chart pie-chart-custom" id="more_notice" style="height: 60vh"></div>
`
layer.open({
type: 1
, title: title //不显示标题栏
, area: ["91%", "800px"]
, id: 'moreData' //设定一个id，防止重复弹出
, btn: ['取消']
, content: html
, success: function (layero, index) {
histogramECharts(data, 'more_notice', title)
}
})
}
//初始化表格
function initTable() {
businessTable = table.render({
... ... @@ -65,7 +106,7 @@ layui.define(['common', 'admin', 'echarts', 'common', 'table', 'sessions'], func
, page: {
layout: ['count', 'prev', 'page', 'next', 'limit', 'skip']
, theme: '#1E9FFF'//自定义分页主题颜色
,limits:[5,10,15,20]
, limits: [5, 10, 15, 20]
}
, limit: '5'
, even: true
... ... @@ -97,7 +138,7 @@ layui.define(['common', 'admin', 'echarts', 'common', 'table', 'sessions'], func
, page: {
layout: ['count', 'prev', 'page', 'next', 'limit', 'skip']
, theme: '#1E9FFF'//自定义分页主题颜色
,limits:[5,10,15,20]
, limits: [5, 10, 15, 20]
}
, limit: '5'
, even: true
... ... @@ -149,7 +190,8 @@ layui.define(['common', 'admin', 'echarts', 'common', 'table', 'sessions'], func
var row = data.row;
//列
var line = data.line;
var myChart = echarts.init(document.getElementById(id));
let el = document.getElementById(id);
var myChart = echarts.init(el);
var option;
option = {
tooltip: {
... ... @@ -169,7 +211,7 @@ layui.define(['common', 'admin', 'echarts', 'common', 'table', 'sessions'], func
grid: {
left: '3%',
right: '4%',
bottom: '3%',
bottom: '12%',
top: '20',
containLabel: true
},
... ... @@ -184,7 +226,7 @@ layui.define(['common', 'admin', 'echarts', 'common', 'table', 'sessions'], func
color: '#000000',
show: true,
interval: 0,
rotate: 30,
rotate: 10,
fontSize: '10',
},
}
... ... @@ -197,7 +239,7 @@ layui.define(['common', 'admin', 'echarts', 'common', 'table', 'sessions'], func
series: [
{
type: 'bar',
barWidth: '40%',
barWidth: '20',
data: line,
itemStyle: {
normal: {
... ... @@ -218,10 +260,21 @@ layui.define(['common', 'admin', 'echarts', 'common', 'table', 'sessions'], func
}
}
}
]
],
//x轴拖动
dataZoom: [
{
show: id == 'more_notice' ? true : false,
type: "slider",
realtime: true, //拖动滚动条时是否动态的更新图表数据
height: 25, //滚动条高度
start: 0, //滚动条开始位置（共100等份）
end: 12 //结束位置（共100等份）//lsq x轴缩放距离调整 2022-05-25
}
],
};
myChart.setOption(option)
}
});
});
\ No newline at end of file
});
... ...
... ... @@ -449,6 +449,12 @@ layui.define(['table', 'form', 'admin', 'layer', 'common', 'sessions', 'treeTabl
$('#details_tags').append(details_tags);
$('#details_tags span').on('click',function (){
$('[name="templates"]').val($('[name="templates"]').val() + '#{'+$(this).text() + '}');
if (noticeTimely.templates){
noticeTimely.templates += '#{'+$(this).text() + '}';
}else {
noticeTimely.templates = '#{'+$(this).text() + '}';
}
});
}
... ...
... ... @@ -86,9 +86,9 @@
<select name="type" id="noticeTimely_type" lay-filter="noticeTimely_type">
<option value="SQL">监控数据库</option>
<option value="TEXT">文本</option>
<!-- <option value="es">es</option>
<option value="influxdb">时序</option>
<option value="tdEngine">tdEngine</option>-->
<option value="ES">es</option>
<option value="INFLUXDB">时序</option>
<!-- <option value="tdEngine">tdEngine</option>-->
</select>
<div style="padding: 3px">
文本支持：#{now} 当前时间格式：yyyy-MM-dd HH:mm:ss
... ...
... ... @@ -18,12 +18,21 @@
<div class="layui-card-body noticeCount-ECharts" id="count_notice_send">
<div class="layui-noticeCount-ECharts">
<div>
<h5 class="lay-row-title" style="color: #666;">业务子系统告警发送统计</h5>
<div class="pie-chart pie-chart-custom" id="count_notice_send_business" style="height: 30vh"></div>
<h5 class="lay-row-title">
业务子系统告警发送统计
<span id="businessMore">查看更多</span>
</h5>
<div class="pie-chart pie-chart-custom" id="count_notice_send_business"
style="height: 30vh"></div>
</div>
<div>
<h5 class="lay-row-title" style="color: #666;">人员告警发送统计</h5>
<div class="pie-chart pie-chart-custom" id="count_notice_send_user" style="height: 30vh"></div>
<h5 class="lay-row-title">人员告警发送统计
<i class="iconfont detail_base_info" style="color:rgb(30,159,255);">&#xe61e;</i>
<span id="userMore">查看更多</span>
</h5>
<div class="pie-chart pie-chart-custom" id="count_notice_send_user"
style="height: 30vh"></div>
</div>
</div>
</div>
... ... @@ -51,4 +60,4 @@
layui.use('noticeCountIndex', function (fn) {
fn();
});
</script>
\ No newline at end of file
</script>
... ...