模块九 管理端-统计分析_第1页
模块九 管理端-统计分析_第2页
模块九 管理端-统计分析_第3页
模块九 管理端-统计分析_第4页
模块九 管理端-统计分析_第5页
已阅读5页，还剩48页未读， 继续免费阅读

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

模块九

管理端-统计分析《JavaEE企业级应用开发项目教程（SSM）》知识目标/Target了解ECharts，能够说出ECharts的作用技能目标/Target掌握会员数量统计的实现，能够使用Echarts绘制会员数量统计图形报表掌握套餐预约占比统计的实现，能够使用Echarts绘制套餐预约占比统计图形报表掌握运营数据报表的实现章节概述/

Summary通过对数据进行统计分析，可以更直观地反映出健康管理机构的运营情况，有利于管理者了解用户需求，完善体检产品，从而提高服务质量。传智健康管理端的统计分析包括会员数量统计、套餐预约占比统计和运营数据统计。接下来，本模块将对管理端的统计分析进行详细讲解。目录/Contents010203会员数量统计套餐预约占比统计运营数据统计会员数量统计9-1任务描述会员信息是传智健康的核心数据之一，其中会员数量的变化趋势能够反映出传智健康的部分运营情况。本任务需要在report_member.html页面通过折线图展示最近一年内每月的会员数量。任务分析访问report_member.html页面，提交查询会员数量的请求。（3）查询会员数量在MemberServiceImpl类中重写MemberService接口的findMemberCountByMonths()方法查询指定日期范围的会员数量。（2）接收和处理查询会员数量的请求由控制器类ReportController的getMemberReport()方法接收页面提交的请求。（4）展示查询结果report_member.html页面根据返回结果绘制折线图图表并展示。（1）提交查询会员数量的请求4.跳转预约成功页面任务分析4.跳转预约成功页面会员数量统计的实现过程知识进阶ECharts（EnterpriseCharts，商业级数据图表）是一个基于JavaScript的开源可视化图表库，它最初由百度团队开发，于2018年初捐赠给Apache基金会，成为ASF孵化级项目。ECharts可以流畅地运行在PC和移动设备上，兼容当前绝大部分浏览器，例如Chrome、Firefox、Safari等，它的底层依赖轻量级的矢量图形库ZRender，可提供直观、交互丰富、可高度个性化定制的数据可视化图表。1.ECharts下载知识进阶1.ECharts下载知识进阶在ECharts官网首页，单击菜单栏“下载”下拉列表框中的“下载”按钮，进入ECharts下载页面。1.ECharts下载知识进阶从GitHub下载ECharts时，ECharts提供了多个扩展名为.js的文件。其中，mon.js包含常见的图表和组件；echarts.min.js包含最常用的图表和组件；echarts.js包含所有的图表和组件，是最完整的，建议初学者选择echarts.js文件下载。1.ECharts下载知识进阶将下载的echarts.js添加到health_backend子模块的src/main/webapp/plugins/echarts目录下。1.ECharts下载知识进阶在ECharts官网中提供了很多的示例，可以通过这些官方示例查看图表的使用方法和图表效果。在ECharts官网首页，单击“示例”按钮，进入ECharts图表示例页面。2.ECharts官方示例知识进阶ECharts图表示例页面左侧导航栏展示了多种图表分类，用户可以根据类型进行查看，每种类型的图表有多种展示方式，如果想查看某一图表的JavaScript代码，直接单击对应图表即可查看。2.ECharts官方示例知识进阶可以通过编辑代码中的数据，测试折线图的图表效果。例如，将series中data数组的值全部修改为100，效果如下。源代码展示区源代码展示区折线图展示区折线图展示区修改前的页面修改后的页面2.ECharts官方示例知识进阶创建一个名称为echarts_example的HTML文件，在文件中引入echarts.js，并定义一个DOM容器。<!DOCTYPEhtml><html><head><metacharset="utf-8"/><!--引入刚刚下载的ECharts文件--><scriptsrc="D:/echarts/echarts.js"></script></head><body><!--为ECharts准备一个定义了宽高的DOM--><divid="main"style="width:600px;height:400px;"></div></body></html>3.ECharts快速上手（1）引入ECharts知识进阶<scripttype="text/javascript">varmyChart=echarts.init(document.getElementById('main'));varoption={title:{text:'ECharts入门示例'},tooltip:{},legend:{data:['一周内的温度变化']},xAxis:{//横轴data:['周一','周二','周三','周四','周五','周六','周日'],name:'星期'},yAxis:{name:'摄氏度'},//纵轴series:[{name:'一周内的温度变化',type:'line',data:[10,5,11,17,1,8,9]}]};myChart.setOption(option);</script>3.ECharts快速上手（2）绘制图表使用折线图展示最近一周内最高气温的变化情况。在echarts_example.html页面中绘制折线图图表，基于DOM使用echarts.init()方法初始化echarts实例，并通过setOption()方法生成简单的折线图。知识进阶3.ECharts快速上手（3）测试效果任务实现在report_member.html页面中，可以通过echarts.js中的echarts.init()方法初始化容器chart1，然后使用Axios发送异步请求获取图表需要的会员数量，最后调用setOption()方法生成折线图。<scriptsrc="../js/axios-0.18.0.js"></script><scriptsrc="../plugins/echarts/echarts.js"></script><scripttype="text/javascript">//基于准备好的DOM，初始化echarts实例varmyChart1=echarts.init(document.getElementById('chart1'));axios.get("/report/getMemberReport.do").then((res)=>{myChart1.setOption({

省略title、tooltip、legend

xAxis:{

data:res.data.data.months

},

yAxis:{

type:'value'

},

series:[{name:'会员数量',type:'line',data:res.data.data.memberCount}]});});</script>（1）提交查询会员数量的请求任务实现在health_backend子模块的com.itheima.controller包下创建控制器类ReportController，在类中定义getMemberReport()方法，用于接收和处理获取会员数量的请求。（1）动态获取当前日期之前12个月的年份和月份，并封装到集合中；（2）根据月份查询对应的会员数量；（3）返回查询提示信息和会员数据。（2）实现查询会员数量控制器任务实现在health_interface子模块的MemberService接口中定义findMemberCountByMonths()方法，用于查询会员数量。//获取会员数量publicList<Integer>findMemberCountByMonths(List<String>months);（3）创建查询会员数量服务任务实现在health_service_provider子模块的MemberServiceImpl类中重写MemberService接口的findMemberCountByMonths()方法，用于查询会员数量。publicList<Integer>findMemberCountByMonths(List<String>months){List<Integer>memberCounts=newArrayList<>();if(months!=null&&months.size()>0){for(Stringmonth:months){省略

获取准确的时间，每个月具体的天数Map<String,String>map=newHashMap<>();//封装查询参数map.put("begin",beginTime);map.put("end",endTime);IntegermemberCount=memberDao.findMemberCountBeforeDate(map);memberCounts.add(memberCount);}}returnmemberCounts;}（4）实现查询会员数量服务任务实现在health_service_provider子模块的MemberDao接口中定义findMemberCountBeforeDate()方法，用于根据指定日期范围查询会员数量。//根据月份查找会员publicIntegerfindMemberCountBeforeDate(Map<String,String>map);（5）实现持久层查询会员数量在health_service_provider子模块的MemberDao.xml映射文件中使用<select>元素映射查询语句，根据指定日期范围查询会员数量。<!--根据日期统计会员数，统计指定日期之前的会员数--><selectid="findMemberCountBeforeDate"parameterType="map"resultType="int">SELECTcount(id)FROMt_memberWHEREregTimeBETWEEN#{begin}AND#{end}</select>任务实现启动ZooKeeper服务，在IDEA中依次启动health_service_provider和health_backend，在浏览器中访问http://localhost:82/pages/report_member.html。（6）测试会员数量统计套餐预约占比统计9-2任务描述体检套餐是健康管理机构的重要产品，通过分析各个套餐的预约占比，可以了解不同群体的体检需求，进而可优化套餐结构。图形报表中的饼图可以对各项数据的大小和其占比情况进行直观展示，因此我们可以通过饼图展示套餐预约占比。任务分析访问report_member.html页面，提交查询套餐预约数量的请求。（3）查询套餐预约数量在MemberServiceImpl类中重写MemberService接口的getSetmealReport()方法查询套餐预约数量。（2）接收和处理查询套餐预约数量的请求由ReportController类中的getSetmealReport()方法接收页面提交的请求。（4）展示查询结果eport_setmeal.html页面根据返回结果绘制饼图并展示。（1）提交查询套餐预约数量请求4.跳转预约成功页面任务分析套餐预约占比统计的实现过程任务实现可以通过echarts.js中的echarts.init()方法初始化在report_setmeal.html页面的DOM容器chart1，然后使用Axios发送异步请求获取套餐预约数量，最后调用setOption()方法生成饼图。（1）提交查询套餐预约数量的请求任务实现在health_backend子模块的ReportController类中定义getSetmealReport()方法，用于接收和处理获取套餐预约数量的请求。publicResultgetSetmealReport(){try{List<String>setmealNames=newArrayList<>();//封装套餐名称集合List<Map>setmealCount=setmealService.getSetmealReport();//套餐名称和预约数量集合if(setmealCount!=null&&setmealCount.size()>0){for(Mapmap:setmealCount){Stringname=(String)map.get("name");//套餐名称

setmealNames.add(name);}}Map<String,Object>map=newHashMap<>();//封装返回结果map.put("setmealNames",setmealNames);

map.put("setmealCount",setmealCount);returnnewResult(true,MessageConstant.GET_SETMEAL_COUNT_REPORT_SUCCESS,map);}}（2）实现查询套餐预约数量控制器任务实现在health_interface子模块的SetmealService接口中定义getSetmealReport()方法，用于查询套餐预约数量。//套餐预约信息publicList<Map>getSetmealReport();（3）创建查询套餐预约数量服务任务实现在health_service_provider子模块的SetmealServiceImpl类中重写SetmealService接口的getSetmealReport()方法，用于查询套餐预约数量。//套餐预约信息publicList<Map>getSetmealReport(){returnsetmealDao.getSetmealReport();//调用查询套餐预约信息的方法}（4）实现查询套餐预约数量服务任务实现在health_service_provider子模块的SetmealDao接口中定义getSetmealReport()方法，用于查询套餐预约数量。//查询套餐预约信息publicList<Map>getSetmealReport();（5）实现持久层查询套餐预约数量任务实现在health_service_provider子模块的SetmealDao.xml映射文件中使用<select>元素映射查询语句，根据套餐id查询套餐预约数量。<!--查询套餐预约占比数据--><selectid="getSetmealReport"resultType="map">

SELECT,count(o.setmeal_id)ASvalue

FROMt_ordero,t_setmeals

WHEREo.setmeal_id=s.idGROUPBY</select>通过关键字groupby进行分组查询。（5）实现持久层查询套餐预约数量任务实现启动Zookeeper服务，在IDEA依次启动health_service_provider和health_backend之后，在浏览器中访http://localhost:82/pages/report_setmeal.html。（6）测试套餐预约占比统计运营数据统计9-3任务描述在浏览器中访问report_business.html页面。传智健康的运营数据包括会员数据、预约到诊数据和热门套餐三部分内容，通过对运营数据进行统计与分析，能够及时发现运营过程中存在的问题，从而更好地完善体检产品和服务。任务分析访问运营数据统计页面report_business.html时，提交查询运营数据的请求。（3）查询运营数据在ReportServiceImpl类中重写ReportService接口的getBusinessReportData()方法查询运营数据，运营数据中包括会员数据、预约到诊数据和热门套餐。（2）接收和处理查询运营数据请求由ReportController类中的getBusinessReportData()方法接收页面提交的请求。（4）展示查询结果report_business.html页面根据返回结果在页面的表格中展示运营数据。（1）提交查询运营数据的请求任务分析运营数据统计报表的实现过程任务实现要实现访问report_business.html页面时展示运营数据，可以将查询操作定义在钩子函数

created()中，created()函数在Vue对象初始化完成后自动执行。<scriptsrc="../js/axios-0.18.0.js"></script><script>varvue=newVue({

created(){

axios.get("/report/getBusinessReportData.do").then((res)=>{

this.reportData=res.data.data;})}})</script>（1）提交查询运营数据的请求任务实现在health_backend子模块的ReportController类中定义getBusinessReportData()方法，用于接收和处理查询运营数据的请求。@Reference//注入服务privateReportServicereportService;//获取运营统计数据@RequestMapping("/getBusinessReportData")publicResultgetBusinessReportData(){try{Map<String,Object>map=reportService.getBusinessReportData();returnnewResult(true,MessageConstant.GET_BUSINESS_REPORT_SUCCESS,map);}catch(Exceptione){e.printStackTrace();returnnewResult(false,MessageConstant.GET_BUSINESS_REPORT_FAIL);}}（2）实现查询运营数据控制器任务实现在health_interface子模块的com.itheima.service包下创建服务接口ReportService，在接口中定义getBusinessReportData()方法，用于查询运营数据。publicinterfaceReportService{//获取运营数据publicMap<String,Object>getBusinessReportData()throwsException;}（3）创建查询运营数据服务任务实现在health_service_provider子模块的com.itheima.service.impl包下创建ReportService接口的实现类ReportServiceImpl，重写ReportService接口的getBusinessReportData()方法，用于查询运营数据。首先动态获取系统当前时间、本周一的时间、本月第一天的时间，用于查询数据；调用接口MemberDao、OrderDao中的方法查询表格中需要的数据；将查询返回的结果封装到Map集合中返回。（4）实现查询运营数据服务任务实现在health_service_provider子模块的MemberDao接口中定义查询会员数量的相关方法。//新增会员数publicIntegerfindMemberCountByDate(Stringdate);//总会员数publicIntegerfindMemberTotalCount();//根据日期统计会员数，统计指定日期之后的会员数publicIntegerfindMemberCountAfterDate(StringthisWeekMonday);（5）实现持久层查询会员数量任务实现在health_service_provider子模块的MemberDao.xml映射文件中使用<select>元素映射查询语句，分别根据日期查询新增会员数、查询总会员数、根据指定日期范围查询会员数。<!--根据日期统计会员数--><selectid="findMemberCountByDate"parameterType="string"resultType="int">SELECTcount(id)FROMt_memberWHEREregTime=#{value}</select><!--总会员数--><selectid="findMemberTotalCount"resultType="java.lang.Integer">SELECTcount(id)FROMt_member</select><!--根据指定日期的范围查询会员数--><selectid="findMemberCountAfterDate"parameterType="string"resultType="int">SELECTcount(id)FROMt_memberWHEREregTime>=#{value}</select>（5）实现持久层查询会员数量任务实现在health_service_provider子模块的OrderDao接口中定义查询预约数和到诊数的相关方法。//今日预约数publicIntegerfindOrderCountByDate(Stringtoday);//今日到诊数publicIntegerfindVisitsCountByDate(Stringtoday);//本周、本月预约数publicIntegerfindOrderCountAfterDate(StringthisWeekMonday);//本周、本月到诊数publicIntegerfindVisitsCountAfterDate(StringthisWeekMonday);//热门套餐publicList<Map>findHotSetmeal();（6）实现持久层查询体检预约数任务实现在health_service_provider子模块的OrderDao.xml映射文件中使用<select>元素映射查询语句，查询运营数据。<!--根据日期统计预约数--><selectid="findOrderCountByDate"parameterType="string"resultType="int">SELECTcount(id)FROMt_orderWHEREorderDate

人人文库> 全部分类> 教育资料 > 课件下载

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论