212 lines
8.3 KiB
Plaintext
212 lines
8.3 KiB
Plaintext
<%@ page contentType="text/html;charset=UTF-8" %>
|
||
<%@ include file="/webpage/include/taglib.jsp"%>
|
||
<html lang="en">
|
||
<head>
|
||
<title>投诉统计</title>
|
||
<meta name="decorator" content="default"/>
|
||
|
||
</head>
|
||
<body class="gray-bg">
|
||
<div class="wrapper wrapper-list-content">
|
||
<div class="ibox-content ibox-content-list">
|
||
<div class="pane-query-circle">
|
||
<!--查询条件-->
|
||
<div class="row">
|
||
<div class="col-sm-12">
|
||
<div class="row pane-query-anying" style="position: absolute;">
|
||
|
||
<input type="hidden" id="checkParam" value="${checkParam}">
|
||
<script type="text/javascript">
|
||
window.onload=function (){
|
||
var checkParam=$("#checkParam").val();
|
||
if(checkParam!=null&&checkParam!=""&&checkParam!=undefined){
|
||
$("#check").each(function(){
|
||
$("select option[value="+checkParam+"]").attr("selected", true);
|
||
});
|
||
};
|
||
}
|
||
</script>
|
||
<%-- <div class="row pane-query-anying">
|
||
<div class="col-sm-6 col-md-4 col-lg-3 pane-query-anying-div">
|
||
<div class="pane-query-anying-div-text">查询力度：</div>
|
||
<div class="pane-query-anying-div-input">
|
||
<select class="form-control m-b input-sm" id="check" style="position: relative;top: 6px;">
|
||
<option value="0" label="按年份"/>
|
||
<option value="1" label="按月份"/>
|
||
<option value="2" label="按日"/>
|
||
</select>
|
||
</div>
|
||
</div>
|
||
<div class="col-sm-6 col-md-4 col-lg-3 pane-query-anying-div">
|
||
<div class="pane-query-anying-div-text">开始时间：</div>
|
||
<div class="pane-query-anying-div-input" style="position: relative;top: -6px;">
|
||
<input id="start" name="start" type="text" maxlength="20" class="laydate-icon form-control layer-date input-sm"
|
||
value="${startTime}"/>
|
||
</div>
|
||
</div>
|
||
<div class="col-sm-6 col-md-4 col-lg-3 pane-query-anying-div">
|
||
<div class="pane-query-anying-div-text">结束时间：</div>
|
||
<div class="pane-query-anying-div-input" style="position: relative;top: -6px;">
|
||
<input id="end" name="end" type="text" maxlength="20" class="laydate-icon form-control layer-date input-sm"
|
||
value="${endTime}"/>
|
||
</div>
|
||
</div>
|
||
<!-- 按钮开始 -->
|
||
|
||
<div class="col-sm-6 col-md-4 col-lg-3 pane-query-anying-div pane-query-anying-div-button" style="float: right">
|
||
<div class="pull-right pane-query-anying-div-input">
|
||
<button class="btn btn-primary btn-rounded btn-outline btn-sm " onclick="search()" ><i class="fa fa-search"></i> 查询</button>
|
||
<button class="btn btn-primary btn-rounded btn-outline btn-sm " onclick="resetAll()" ><i class="fa fa-refresh"></i> 重置</button>
|
||
</div>
|
||
</div>
|
||
|
||
</div> --%>
|
||
|
||
|
||
|
||
|
||
<div class="pane-query-circle-list" style="position: relative;width: 101%;top: -65px;left: -22px;">
|
||
<!-- s数据 -->
|
||
<div style="display: none;" class="navbar navbar-default navbar-fixed-top" role="navigation" id="head"></div>
|
||
<div class="container-fluid" >
|
||
<div class="row-fluid example">
|
||
<div id="graphic" class="col-md-12">
|
||
<div id="main" class="main" ></div>
|
||
<div>
|
||
<span id='wrong-message' style="color:red"></span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div></div></div></div></div></div>
|
||
<script type="text/javascript" src="${ctxStatic}/echarts-2.2.7/doc/asset/js/echartsHome.js"></script>
|
||
<script src="${ctxStatic}/echarts-2.2.7/doc/asset/js/echartsExample.js"></script><link href="${ctxStatic}/echarts-2.2.7/doc/asset/ico/favicon.png">
|
||
<link href="${ctxStatic}/echarts-2.2.7/doc/asset/css/font-awesome.min.css" rel="stylesheet">
|
||
<link href="${ctxStatic}/echarts-2.2.7/doc/asset/css/bootstrap.css" rel="stylesheet">
|
||
<link href="${ctxStatic}/echarts-2.2.7/doc/asset/css/carousel.css" rel="stylesheet">
|
||
<link href="${ctxStatic}/echarts-2.2.7/doc/asset/css/echartsHome.css" rel="stylesheet">
|
||
<script src="${ctxStatic}/echarts-2.2.7/doc/example/www/js/echarts.js"></script>
|
||
<script src="${ctxStatic}/echarts-2.2.7/doc/asset/js/codemirror.js"></script>
|
||
<script src="${ctxStatic}/echarts-2.2.7/doc/asset/js/javascript.js"></script>
|
||
<link href="${ctxStatic}/echarts-2.2.7/doc/asset/css/codemirror.css" rel="stylesheet">
|
||
<link href="${ctxStatic}/echarts-2.2.7/doc/asset/css/monokai.css" rel="stylesheet">
|
||
<script type="text/javascript">
|
||
$(document).ready(function() {
|
||
var s={
|
||
format: 'YYYY-MM-DD', // 分隔符可以任意定义，该例子表示只显示年月
|
||
elem: '#start', //目标元素。由于laydate.js封装了一个轻量级的选择器引擎，因此elem还允许你传入class、tag但必须按照这种方式 '#id .class'
|
||
event: 'focus',//响应事件。如果没有传入event，则按照默认的click
|
||
max: $("#end").val(),
|
||
choose: function(datas){
|
||
e.min = datas; //开始日选好后，重置结束日的最小日期
|
||
e.start = datas; //将结束日的初始值设定为开始日
|
||
}
|
||
};
|
||
var e={
|
||
|
||
format: 'YYYY-MM-DD', // 分隔符可以任意定义，该例子表示只显示年月
|
||
/* festival: true, //显示节日 */
|
||
elem: '#end', //目标元素。由于laydate.js封装了一个轻量级的选择器引擎，因此elem还允许你传入class、tag但必须按照这种方式 '#id .class'
|
||
event: 'focus',//响应事件。如果没有传入event，则按照默认的click
|
||
min: $("#start").val(),
|
||
choose: function(datas){
|
||
s.max = datas; //结束日选好后，重置开始日的最大日期
|
||
}
|
||
};
|
||
laydate(s);
|
||
laydate(e);
|
||
});
|
||
</script>
|
||
<script type="text/javascript">
|
||
|
||
require.config({
|
||
paths: {
|
||
echarts: '${ctxStatic}/echarts-2.2.7/build/dist'
|
||
}
|
||
});
|
||
|
||
// 使用
|
||
require(
|
||
[
|
||
'echarts',
|
||
'echarts/chart/bar' , // 使用柱状图就加载bar模块，按需加载
|
||
'echarts/chart/line'
|
||
],
|
||
function (ec) {
|
||
// 基于准备好的dom，初始化echarts图表
|
||
var myChart = ec.init(document.getElementById('main'));
|
||
|
||
var option = {
|
||
|
||
title : {
|
||
text:'投诉统计',
|
||
subtext:'${year}'
|
||
},
|
||
tooltip : {
|
||
trigger: 'axis'
|
||
},
|
||
legend: {
|
||
data:['投诉数量']
|
||
},
|
||
toolbox: {
|
||
show : true,
|
||
feature : {
|
||
mark : {show: true},
|
||
dataView : {show: true, readOnly: false},
|
||
magicType : {show: true, type: ['line', 'bar']},
|
||
restore : {show: true},
|
||
saveAsImage : {show: true}
|
||
}
|
||
},
|
||
calculable : true,
|
||
xAxis : [
|
||
{
|
||
type : 'category',
|
||
data : ['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月']
|
||
}
|
||
],
|
||
yAxis : [
|
||
{
|
||
type : 'value'
|
||
}
|
||
],
|
||
series : [
|
||
{
|
||
name:'投诉数量',
|
||
type:'bar',
|
||
data:[${list1},${list2}, ${list3}, ${list4}, ${list5}, ${list6}, ${list7}, ${list8}, ${list9}, ${list10}, ${list11}, ${list12}],
|
||
markPoint : {
|
||
data : [
|
||
{type : 'max', name: '最大值'},
|
||
{type : 'min', name: '最小值'}
|
||
]
|
||
},
|
||
markLine : {
|
||
data : [
|
||
{type : 'average', name: '平均值'}
|
||
]
|
||
}
|
||
},
|
||
]
|
||
};
|
||
|
||
// 为echarts对象加载数据
|
||
myChart.setOption(option);
|
||
}
|
||
);
|
||
|
||
/* //重置
|
||
function resetAll(){
|
||
location.href="${ctx}/benchmarkstatistics/gathers/list?viewId="+${param.viewId};
|
||
} */
|
||
//查询
|
||
/* function search(){
|
||
var check=$("#check").val();
|
||
var start=$("#start").val();
|
||
var end=$("#end").val();
|
||
location.href="${ctx}/benchmarkstatistics/gathers/view?check="+check+"&start="+start+"&end="+end+"&viewId="+${param.viewId};
|
||
} */
|
||
</script>
|
||
</body>
|
||
</html> |