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>
|