You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
gzf/WebRoot/admin/report.jsp

176 lines
5.4 KiB

5 years ago
<%@ page language="java" pageEncoding="UTF-8" %>
<%@ taglib uri="/struts-tags" prefix="s" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
5 years ago
<%
5 years ago
String path = request.getContextPath();
String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
5 years ago
5 years ago
String usertype = session.getAttribute("userType") + "";
5 years ago
%>
<!DOCTYPE html>
<html lang="en">
5 years ago
<head>
<c:import url="../head.jsp"/>
5 years ago
<link href="<%=basePath %>static/toastr-master/toastr.min.css" rel="stylesheet" type="text/css"/>
5 years ago
<script src="<%=basePath %>static/toastr-master/toastr.min.js"></script>
<script src="<%=basePath %>static/echarts.min.js"></script>
<script src="<%=basePath %>static/jquery.datetimepicker.full.min.js"></script>
<link href="<%=basePath %>static/jquery.datetimepicker.min.css" rel="stylesheet" type="text/css"/>
<link>
<style>
5 years ago
#count, #count_group {
5 years ago
width: 1000px;
height: 500px;
}
</style>
<script>
5 years ago
5 years ago
$(function () {
$("form").removeAttr("style")
$.datetimepicker.setLocale('zh');
5 years ago
const format = {
format: 'Y-m-d H:i:s'
5 years ago
}
5 years ago
let start = $('input[name=startTime]')
let end = $('input[name=endTime]')
$(start, end).datetimepicker(format);
5 years ago
start.val('${startTime}')
end.val('${endTime}')
<c:if test="${!empty state }">
5 years ago
toastr.${state}('${message}', '提示');
5 years ago
</c:if>
5 years ago
$(".bz").click(function () {
5 years ago
var txt = $(this).attr("txt");
5 years ago
toastr.success(txt, '提示');
5 years ago
});
5 years ago
5 years ago
let chart = echarts.init(count)
let publicOption = {
5 years ago
title: {
5 years ago
text: '数据统计',
subtext: '统计时间从' + start.val() + '到' + end.val(),
5 years ago
left: 'center'
},
yAxis: {
5 years ago
name: '个数'
5 years ago
}
}
5 years ago
let group = ['用户', '房源', '申请', '举报']
5 years ago
// 指定图表的配置项和数据
5 years ago
let option = {
...publicOption, ...{
xAxis: {
data: group
},
series: [{
type: 'bar',
data: [${userCount}, ${houseCount}, ${applyCount}, ${reportCount}],
label:{
show:true
}
}],
tooltip: {
show: true
}
}
}
5 years ago
// 使用刚指定的配置项和数据显示图表。
chart.setOption(option);
5 years ago
let groupChart = echarts.init(count_group)
5 years ago
5 years ago
let groupOption = {
...publicOption, ...{
5 years ago
xAxis: {
type: 'category',
5 years ago
data: [<c:forEach items="${userList.dateList}" var="item">
'${item}',
5 years ago
</c:forEach>]
},
dataZoom: [
{
show: true,
realtime: true,
start: 65,
end: 85
},
],
5 years ago
tooltip: {
trigger: 'axis'
},
legend: {
data: group,
left: 0
},
5 years ago
series: [{
5 years ago
name: group[0],
type: 'line',
5 years ago
data:${userList.countList}
5 years ago
}, {
name: group[1],
type: 'line',
data:${houseList.countList}
}, {
name: group[2],
type: 'line',
data:${applyList.countList}
}, {
name: group[3],
type: 'line',
data:${reportList.countList}
5 years ago
}]
}
}
5 years ago
5 years ago
groupChart.setOption(groupOption)
})
5 years ago
5 years ago
</script>
5 years ago
5 years ago
</head>
5 years ago
5 years ago
<body class="container_12">
<div class="box round first" style="margin:15px;">
5 years ago
5 years ago
<div class="block">
5 years ago
5 years ago
<form action="${pageContext.request.contextPath}/admin/apply/report.do" method="post">
<div class="input-group col-5 ml-auto mr-auto">
<div class="input-group-append">
<span class="input-group-text">开始时间</span>
</div>
<input class="form-control" name="startTime">
<div class="input-group-append">
<span class="input-group-text">结束时间</span>
</div>
<input class="form-control" name="endTime">
5 years ago
</div>
5 years ago
<button type="submit" class="mt-3 btn-block btn-info ml-auto mr-auto col-3">统计</button>
</form>
5 years ago
5 years ago
<div id="count" class="ml-auto mr-auto mt-3"></div>
5 years ago
5 years ago
<div id="count_group" class="ml-auto mr-auto mt-3"></div>
5 years ago
</div>
</div>
5 years ago
</body>
</html>