<!doctype html>
|
<html class="no-js">
|
<head>
|
<meta charset="utf-8">
|
<title>运维月报</title>
|
[#include "/business/pages/include/static.html" /]
|
<script type="text/javascript">
|
initSplineStyle();
|
var statisType = 'quarter';
|
$(function() {
|
initMonChart();
|
initEffectChart();
|
initSourceChart();
|
initCloseChart();
|
});
|
|
//无数据显示
|
function showNoData(containerId) {
|
var strHrml = '<div id="noDailyReport" style="position:relative;width:100%;height:400px">';
|
strHrml = strHrml + '<span class="nodata"></span>';
|
strHrml = strHrml + '</div>';
|
$('#'+containerId).html(strHrml);
|
}
|
|
//初始化同比图表
|
function initMonChart(){
|
var selDate = '${RequestParameters.selDate}';
|
var cusId = '${RequestParameters.cusId}';
|
var param = {'selDate':selDate,'statisType':statisType,'cusId':cusId};
|
$.post("${base}/business/pages/workReport/getQuestionMomChart.html",param,function(data){
|
if(data.nodata){
|
showNoData('mom_container')
|
}else{
|
createMonChart(data);
|
}
|
|
},'json');
|
}
|
|
function createMonChart(data){
|
$('#mom_container').highcharts({
|
chart: {
|
type: 'column',
|
height:400,
|
},
|
title: {
|
text: ''
|
},
|
xAxis: {
|
categories: data.categories
|
},
|
tooltip: {
|
formatter: function() {
|
return '<b>'+ this.x +'</b><br>'+this.series.name +': '+ this.y ;
|
}
|
},
|
plotOptions: {
|
column: {
|
pointWidth: 40
|
}
|
},
|
series: data.series
|
});
|
}
|
|
|
//影响度图表
|
function initEffectChart(){
|
var selDate = '${RequestParameters.selDate}';
|
var cusId = '${RequestParameters.cusId}';
|
var param = {'selDate':selDate,'statisType':statisType,'cusId':cusId};
|
$.post("${base}/business/pages/workReport/getQuestionEffectChart.html",param,function(data){
|
if(data.nodata){
|
showNoData('effect_container')
|
}else{
|
createEffectChart(data);
|
}
|
|
},'json');
|
}
|
|
function createEffectChart(data){
|
$('#effect_container').highcharts({
|
chart: {
|
renderTo: 'container',
|
type: 'pie'
|
},
|
title :{
|
text:''
|
},
|
plotOptions: {
|
pie: {
|
startAngle: -90,
|
endAngle:90,
|
center: ['50%', '70%']
|
}
|
},
|
tooltip: {
|
valueSuffix:' ({point.percentage:.1f}%)'
|
},
|
series: [{
|
name:'数量',
|
data: data.seriesData
|
}]
|
});
|
}
|
|
//初始化来源图表
|
function initSourceChart(){
|
var selDate = '${RequestParameters.selDate}';
|
var cusId = '${RequestParameters.cusId}';
|
var param = {'selDate':selDate,'statisType':statisType,'cusId':cusId};
|
$.post("${base}/business/pages/workReport/getQuestionSourceChart.html",param,function(data){
|
if(data.nodata){
|
showNoData('source_container')
|
}else{
|
createSourceChart(data);
|
}
|
},'json');
|
}
|
|
function createSourceChart(data){
|
$('#source_container').highcharts({
|
chart: {
|
type: 'pie',
|
options3d: {
|
enabled: true,
|
alpha: 45,
|
beta: 0
|
}
|
},
|
title: {
|
text: ''
|
},
|
tooltip: {
|
valueSuffix:' ({point.percentage:.1f}%)'
|
},
|
plotOptions: {
|
pie: {
|
allowPointSelect: true,
|
cursor: 'pointer',
|
depth: 35,
|
dataLabels: {
|
enabled: true,
|
formatter: function() {
|
// return this.point.name +'：'+ this.point.y;
|
return this.point.name;
|
}
|
},
|
showInLegend: true
|
}
|
},
|
series: [{
|
type: 'pie',
|
name: '数量',
|
data: data.seriesData,
|
showInLegend:true
|
}]
|
});
|
}
|
|
|
//初始化关闭方式图表
|
function initCloseChart(){
|
var selDate = '${RequestParameters.selDate}';
|
var cusId = '${RequestParameters.cusId}';
|
var param = {'selDate':selDate,'statisType':statisType,'cusId':cusId};
|
$.post("${base}/business/pages/workReport/getQuestionCloseChart.html",param,function(data){
|
if(data.nodata){
|
showNoData('close_container')
|
}else{
|
createCloseChart(data);
|
}
|
|
},'json');
|
}
|
|
function createCloseChart(data){
|
$('#close_container').highcharts({
|
chart: {
|
type: 'column',
|
height:400,
|
},
|
title: {
|
text: ''
|
},
|
xAxis: {
|
categories: data.categories
|
},
|
tooltip: {
|
formatter: function() {
|
return '<b>'+ this.x +'</b><br>'+this.series.name +': '+ this.y ;
|
}
|
},
|
plotOptions: {
|
column: {
|
pointWidth: 40
|
}
|
},
|
series: data.series
|
});
|
}
|
|
</script>
|
</head>
|
|
<body class="fullscreen">
|
<div class="monitor_report clearfix">
|
<div class="monitoring">
|
<table class="monitor_flow" style="margin-top: 0px;">
|
<tr>
|
<td class="monitor_sysinfocon">
|
<div class="edit_title">
|
<h3>问题同比统计</h3>
|
</div>
|
<div class="dbserver_sga" id="mom_container" style="height: 400px;"></div>
|
</td>
|
<td>
|
<div class="edit_title">
|
<h3>问题来源</h3>
|
</div>
|
<div class="dbserver_sga" id="source_container" style="height: 400px;"></div>
|
</td>
|
</tr>
|
</table>
|
</div>
|
|
<div class="monitoring">
|
<table class="monitor_flow" style="margin-top: 0px;">
|
<tr>
|
<td class="monitor_sysinfocon">
|
<div class="edit_title">
|
<h3>问题影响程度</h3>
|
</div>
|
<div class="dbserver_sga" id="effect_container" style="height: 400px;"></div>
|
</td>
|
<td>
|
<div class="edit_title">
|
<h3>问题关闭方式</h3>
|
</div>
|
<div class="dbserver_sga" id="close_container" style="height: 400px;"></div>
|
</td>
|
</tr>
|
</table>
|
</div>
|
|
<div class="monitoring">
|
<table class="monitor_flow" style="margin-top: 0px;">
|
<tr>
|
<td >
|
<div class="edit_title">
|
<h3>问题处理情况统计</h3>
|
</div>
|
</td>
|
</tr>
|
</table>
|
<br/>
|
<div>
|
<table border="0" class="reportTable tablew" id="reportTable" style="width:98%;">
|
[#if report.lebalList??&&report.lebalList?size>0]
|
<tr>
|
[#list report.lebalList as item]
|
[#if item_index==0]
|
<td width="11%" class="tdbg">${item}</td>
|
[#else]
|
<td width="6%" class="tdbg">${item}</td>
|
[/#if]
|
[/#list]
|
</tr>
|
[/#if]
|
|
[#if report.dataList??&&report.dataList?size>0]
|
[#list report.dataList as dataList]
|
<tr>
|
[#list dataList as item]
|
<td>${item}</td>
|
[/#list]
|
</tr>
|
[/#list]
|
[#else]
|
<tr>
|
<td colspan="${report.lebalList?size}">暂无数据</td>
|
</tr>
|
[/#if]
|
</table>
|
</div>
|
</div>
|
|
</div>
|
</body>
|
|
</html>
|
