我以我的项目根据月份查询每月新增会员的总数为例
Controller
@GetMapping("/getMemberReport.do")
public R getMemberReport() {
try {
// 获取日历对象
Calendar calendar = Calendar.getInstance();
//根据当前时间,获取前12个月的日历(当前日历2020-02,12个月前,日历时间2019-03)
//第一个参数,日历字段
//第二个参数,要添加到字段中的日期或时间
calendar.add(Calendar.MONTH, -12);
List<String> list = new ArrayList<String>();
for (int i = 0; i < 12; i++) {
//第一个参数是月份 2018-7
//第二个参数是月份+1个月
calendar.add(Calendar.MONTH, 1);
list.add(new SimpleDateFormat("yyyy-MM").format(calendar.getTime()));
}
Map<String, Object> map = new HashMap<String, Object>();
// 把过去12个月的日期存储到map里面
map.put("months", list);
// 查询所有的会员
List<Integer> memberCount = memberService.findMemberCountByMonth(list);
map.put("memberCount", memberCount);
// 查询所有会员
return R.setResult(ResultCodeEnum.GET_MEMBER_NUMBER_REPORT_SUCCESS).data(map);
} catch (Exception e) {
e.printStackTrace();
return R.setResult(ResultCodeEnum.GET_MEMBER_NUMBER_REPORT_FAIL);
}
}
Service
@Override
public List<Integer> findMemberCountByMonth(List<String> list) {
List<Integer> memberCountList = new ArrayList<>();
if (list != null || list.size() != 0) {
for (String mouths : list) {
//String regTime = months+"-31";
// 获取指定月份的最后一天
String regTime = DateUtils.getLastDayOfMonth(mouths);
Integer memberCount = memberMapper.findMemberCountByMouths(regTime);
memberCountList.add(memberCount);
}
}
return memberCountList;
}
Mapper
<select id="findMemberCountByMouths" resultType="java.lang.Integer">
select count(*) from t_member where regTime <=#{regTime}
</select>
前端页面axios
<body class="hold-transition">
<div id="app">
<div class="content-header">
<h1>统计分析<small>会员数量</small></h1>
<el-breadcrumb separator-class="el-icon-arrow-right" class="breadcrumb">
<el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
<el-breadcrumb-item>统计分析</el-breadcrumb-item>
<el-breadcrumb-item>会员数量</el-breadcrumb-item>
</el-breadcrumb>
</div>
<div class="app-container">
<div class="box">
<!-- 为 ECharts 准备一个具备大小(宽高)的 DOM -->
<div id="chart1" style="height:600px;"></div>
</div>
</div>
</div>
</body>
<script type="text/javascript">
// 基于准备好的dom,初始化echarts实例
var myChart1 = echarts.init(document.getElementById('chart1'));
// 使用刚指定的配置项和数据显示图表。
//myChart.setOption(option);
axios.get("/report/getMemberReport.do").then((res)=>{
console.log(res)
myChart1.setOption({
title: {
text: '会员数量'
},
tooltip: {},
legend: {
data:['会员数量']
},
xAxis: {
data: res.data.data.months
},
yAxis: {
type:'value'
},
series: [{
name: '会员数量',
type: 'line',
data: res.data.data.memberCount
}]
});
});
</script>
