医疗管理系统-图形报表、POI报表
目录
- 1. 套餐预约占比饼形图
- 1.1 需求分析
- 1.2 完善页面
- 1.2.1 导入ECharts库
- 1.2.2 参照官方实例导入饼形图
- 1.3 后台代码
- 1.3.1 Controller
- 1.3.2 服务接口
- 1.3.3 服务实现类
- 1.3.4 Dao接口
- 1.3.5 Mapper映射文件
- 小结
- 2. 运营数据统计
- 2.1 需求分析
- 2.2 完善页面
- 2.2.1 定义模型数据
- 2.2.2 发送请求获取动态数据
- 2.3 后台代码
- 2.3.1 Controller
- 2.3.2 服务接口
- 2.3.3 服务实现类
- 2.3.4 Dao接口
- 2.3.5 Mapper映射文件
1. 套餐预约占比饼形图
1.1 需求分析
会员可以通过移动端自助进行体检预约,在预约时需要选择预约的体检套餐。本章节我们需要通过饼形图直观的展示出会员预约的各个套餐占比情况。展示效果如下图:
1.2 完善页面
套餐预约占比饼形图对应的页面为/pages/report_setmeal.html。
1.2.1 导入ECharts库
<script src="../plugins/echarts/echarts.js"></script>
1.2.2 参照官方实例导入饼形图
<div class="box"><!-- 为 ECharts 准备一个具备大小(宽高)的 DOM --><div id="chart1" style="height:600px;"></div>
</div>
<script type="text/javascript">// 基于准备好的dom,初始化echarts实例var myChart1 = echarts.init(document.getElementById('chart1'));//发送ajax请求获取动态数据axios.get("/report/getSetmealReport.do").then((res)=>{myChart1.setOption({title : {text: '套餐预约占比',subtext: '',x:'center'},tooltip : {//提示框组件trigger: 'item',//触发类型,在饼形图中为itemformatter: "{a} <br/>{b} : {c} ({d}%)"//提示内容格式},legend: {orient: 'vertical',left: 'left',data: res.data.data.setmealNames},series : [{name: '套餐预约占比',type: 'pie',radius : '55%',center: ['50%', '60%'],data:res.data.data.setmealCount,itemStyle: {emphasis: {shadowBlur: 10,shadowOffsetX: 0,shadowColor: 'rgba(0, 0, 0, 0.5)'}}}]});});
</script>
根据饼形图对数据格式的要求,我们发送ajax请求,服务端需要返回如下格式的数据:
{"data":{"setmealNames":["套餐1","套餐2","套餐3"],"setmealCount":[{"name":"套餐1","value":10},{"name":"套餐2","value":30},{"name":"套餐3","value":25}]},"flag":true,"message":"获取套餐统计数据成功"
}
1.3 后台代码
1.3.1 Controller
在health_backend工程的ReportController中提供getSetmealReport方法
@Reference
private SetmealService setmealService;
/*** 套餐占比统计* @return*/
@RequestMapping("/getSetmealReport")
public Result getSetmealReport(){List<Map<String, Object>> list = setmealService.findSetmealCount();Map<String,Object> map = new HashMap<>();map.put("setmealCount",list);List<String> setmealNames = new ArrayList<>();for(Map<String,Object> m : list){String name = (String) m.get("name");setmealNames.add(name);}map.put("setmealNames",setmealNames);return new Result(true, MessageConstant.GET_SETMEAL_COUNT_REPORT_SUCCESS,map);
}
1.3.2 服务接口
在SetmealService服务接口中扩展方法findSetmealCount
public List<Map<String,Object>> findSetmealCount();
1.3.3 服务实现类
在SetmealServiceImpl服务实现类中实现findSetmealCount方法
public List<Map<String, Object>> findSetmealCount() {return setmealDao.findSetmealCount();
}
1.3.4 Dao接口
在SetmealDao接口中扩展方法findSetmealCount
public List<Map<String,Object>> findSetmealCount();
1.3.5 Mapper映射文件
在SetmealDao.xml映射文件中提供SQL语句
<select id="findSetmealCount" resultType="map">select s.name,count(o.id) as value from t_order o ,t_setmeal s where o.setmeal_id = s.id group by s.name
</select>
小结
- 官方实例,copy Option的配置
- 构造数据模型,测试
- 后台代码,返回经过测试的数据模型
2. 运营数据统计
—1---
2.1 需求分析
通过运营数据统计可以展示出体检机构的运营情况,包括会员数据、预约到诊数据、热门套餐等信息。本章节就是要通过一个表格的形式来展示这些运营数据。效果如下图:
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-UBtH2axt-1609428362625)(img/2.png)]
-----1----
2.2 完善页面
运营数据统计对应的页面为/pages/report_business.html。
2.2.1 定义模型数据
定义数据模型,通过VUE的数据绑定展示数据
<script>var vue = new Vue({el: '#app',data:{reportData:{reportDate:null,todayNewMember :0,totalMember :0,thisWeekNewMember :0,thisMonthNewMember :0,todayOrderNumber :0,todayVisitsNumber :0,thisWeekOrderNumber :0,thisWeekVisitsNumber :0,thisMonthOrderNumber :0,thisMonthVisitsNumber :0,hotSetmeal :[]}}})
</script>
<div class="box" style="height: 900px"><div class="excelTitle" ><el-button @click="exportExcel">导出Excel</el-button>运营数据统计</div><div class="excelTime">日期:{{reportData.reportDate}}</div><table class="exceTable" cellspacing="0" cellpadding="0"><tr><td colspan="4" class="headBody">会员数据统计</td></tr><tr><td width='20%' class="tabletrBg">新增会员数</td><td width='30%'>{{reportData.todayNewMember}}</td><td width='20%' class="tabletrBg">总会员数</td><td width='30%'>{{reportData.totalMember}}</td></tr><tr><td class="tabletrBg">本周新增会员数</td><td>{{reportData.thisWeekNewMember}}</td><td class="tabletrBg">本月新增会员数</td><td>{{reportData.thisMonthNewMember}}</td></tr><tr><td colspan="4" class="headBody">预约到诊数据统计</td></tr><tr><td class="tabletrBg">今日预约数</td><td>{{reportData.todayOrderNumber}}</td><td class="tabletrBg">今日到诊数</td><td>{{reportData.todayVisitsNumber}}</td></tr><tr><td class="tabletrBg">本周预约数</td><td>{{reportData.thisWeekOrderNumber}}</td><td class="tabletrBg">本周到诊数</td><td>{{reportData.thisWeekVisitsNumber}}</td></tr><tr><td class="tabletrBg">本月预约数</td><td>{{reportData.thisMonthOrderNumber}}</td><td class="tabletrBg">本月到诊数</td><td>{{reportData.thisMonthVisitsNumber}}</td></tr><tr><td colspan="4" class="headBody">热门套餐</td></tr><tr class="tabletrBg textCenter"><td>套餐名称</td><td>预约数量</td><td>占比</td><td>备注</td></tr><tr v-for="s in reportData.hotSetmeal"><td>{{s.name}}</td><td>{{s.setmeal_count}}</td><td>{{s.proportion}}</td><td></td></tr></table>
</div>
2.2.2 发送请求获取动态数据
在VUE的钩子函数中发送ajax请求获取动态数据,通过VUE的数据绑定将数据展示到页面
<script>var vue = new Vue({el: '#app',data:{reportData:{reportDate:null,todayNewMember :0,totalMember :0,thisWeekNewMember :0,thisMonthNewMember :0,todayOrderNumber :0,todayVisitsNumber :0,thisWeekOrderNumber :0,thisWeekVisitsNumber :0,thisMonthOrderNumber :0,thisMonthVisitsNumber :0,hotSetmeal :[]}},created() {//发送ajax请求获取动态数据axios.get("/report/getBusinessReportData.do").then((res)=>{this.reportData = res.data.data;});}})
</script>
根据页面对数据格式的要求,我们发送ajax请求,服务端需要返回如下格式的数据:
{"data":{"todayVisitsNumber":0,"reportDate":"2019-04-25","todayNewMember":0,"thisWeekVisitsNumber":0,"thisMonthNewMember":2,"thisWeekNewMember":0,"totalMember":10,"thisMonthOrderNumber":2,"thisMonthVisitsNumber":0,"todayOrderNumber":0,"thisWeekOrderNumber":0,"hotSetmeal":[{"proportion":0.4545,"name":"粉红珍爱(女)升级TM12项筛查体检套餐","setmeal_count":5},{"proportion":0.1818,"name":"阳光爸妈升级肿瘤12项筛查体检套餐","setmeal_count":2},{"proportion":0.1818,"name":"珍爱高端升级肿瘤12项筛查","setmeal_count":2},{"proportion":0.0909,"name":"孕前检查套餐","setmeal_count":1}],},"flag":true,"message":"获取运营统计数据成功"
}
----2—
2.3 后台代码
2.3.1 Controller
在ReportController中提供getBusinessReportData方法
@Reference
private ReportService reportService;/*** 获取运营统计数据* @return
*/
@RequestMapping("/getBusinessReportData")
public Result getBusinessReportData(){try {Map<String, Object> result = reportService.getBusinessReport();return new Result(true,MessageConstant.GET_BUSINESS_REPORT_SUCCESS,result);} catch (Exception e) {e.printStackTrace();return new Result(true,MessageConstant.GET_BUSINESS_REPORT_FAIL);}
}
–1—
2.3.2 服务接口
在health_interface工程中创建ReportService服务接口并声明getBusinessReport方法
package com.itheima.service;import java.util.Map;public interface ReportService {/*** 获得运营统计数据* Map数据格式:* todayNewMember -> number* totalMember -> number* thisWeekNewMember -> number* thisMonthNewMember -> number* todayOrderNumber -> number* todayVisitsNumber -> number* thisWeekOrderNumber -> number* thisWeekVisitsNumber -> number* thisMonthOrderNumber -> number* thisMonthVisitsNumber -> number* hotSetmeals -> List<Setmeal>*/public Map<String,Object> getBusinessReport() throws Exception;
}
2.3.3 服务实现类
在health_service_provider工程中创建服务实现类ReportServiceImpl并实现ReportService接口
package com.itheima.service;import com.alibaba.dubbo.config.annotation.Service;
import com.itheima.dao.MemberDao;
import com.itheima.dao.OrderDao;
import com.itheima.utils.DateUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.transaction.annotation.Transactional;
import java.util.Date;
import java.util.HashMap;
import java.util.List;
import java.util.Map;/*** 统计报表服务*/
@Service(interfaceClass = ReportService.class)
@Transactional
public class ReportServiceImpl implements ReportService {@Autowiredprivate MemberDao memberDao;@Autowiredprivate OrderDao orderDao;/*** 获得运营统计数据* Map数据格式:* todayNewMember -> number* totalMember -> number* thisWeekNewMember -> number* thisMonthNewMember -> number* todayOrderNumber -> number* todayVisitsNumber -> number* thisWeekOrderNumber -> number* thisWeekVisitsNumber -> number* thisMonthOrderNumber -> number* thisMonthVisitsNumber -> number* hotSetmeal -> List<Setmeal>*/public Map<String, Object> getBusinessReport() throws Exception{//获得当前日期String today = DateUtils.parseDate2String(DateUtils.getToday());//获得本周一的日期String thisWeekMonday = DateUtils.parseDate2String(DateUtils.getThisWeekMonday());//获得本月第一天的日期 String firstDay4ThisMonth = DateUtils.parseDate2String(DateUtils.getFirstDay4ThisMonth());//今日新增会员数Integer todayNewMember = memberDao.findMemberCountByDate(today);//总会员数Integer totalMember = memberDao.findMemberTotalCount();//本周新增会员数Integer thisWeekNewMember = memberDao.findMemberCountAfterDate(thisWeekMonday);//本月新增会员数Integer thisMonthNewMember = memberDao.findMemberCountAfterDate(firstDay4ThisMonth);//今日预约数Integer todayOrderNumber = orderDao.findOrderCountByDate(today);//本周预约数Integer thisWeekOrderNumber = orderDao.findOrderCountAfterDate(thisWeekMonday);//本月预约数Integer thisMonthOrderNumber = orderDao.findOrderCountAfterDate(firstDay4ThisMonth);//今日到诊数Integer todayVisitsNumber = orderDao.findVisitsCountByDate(today);//本周到诊数Integer thisWeekVisitsNumber = orderDao.findVisitsCountAfterDate(thisWeekMonday);//本月到诊数Integer thisMonthVisitsNumber = orderDao.findVisitsCountAfterDate(firstDay4ThisMonth);//热门套餐(取前4)List<Map> hotSetmeal = orderDao.findHotSetmeal();Map<String,Object> result = new HashMap<>();result.put("reportDate",today);result.put("todayNewMember",todayNewMember);result.put("totalMember",totalMember);result.put("thisWeekNewMember",thisWeekNewMember);result.put("thisMonthNewMember",thisMonthNewMember);result.put("todayOrderNumber",todayOrderNumber);result.put("thisWeekOrderNumber",thisWeekOrderNumber);result.put("thisMonthOrderNumber",thisMonthOrderNumber);result.put("todayVisitsNumber",todayVisitsNumber);result.put("thisWeekVisitsNumber",thisWeekVisitsNumber);result.put("thisMonthVisitsNumber",thisMonthVisitsNumber);result.put("hotSetmeal",hotSetmeal);return result;}
}
2.3.4 Dao接口
在OrderDao和MemberDao中声明相关统计查询方法
package com.itheima.dao;import com.itheima.pojo.Order;
import java.util.List;
import java.util.Map;public interface OrderDao {public void add(Order order);public List<Order> findByCondition(Order order);public Map findById4Detail(Integer id);public Integer findOrderCountByDate(String date);public Integer findOrderCountAfterDate(String date);public Integer findVisitsCountByDate(String date);public Integer findVisitsCountAfterDate(String date);public List<Map> findHotSetmeal();
}
package com.itheima.dao;import com.github.pagehelper.Page;
import com.itheima.pojo.Member;
import java.util.List;public interface MemberDao {public List<Member> findAll();public Page<Member> selectByCondition(String queryString);public void add(Member member);public void deleteById(Integer id);public Member findById(Integer id);public Member findByTelephone(String telephone);public void edit(Member member);public Integer findMemberCountBeforeDate(String date);public Integer findMemberCountByDate(String date);public Integer findMemberCountAfterDate(String date);public Integer findMemberTotalCount();
}
- count(1)比count(*) 效率高
2.3.5 Mapper映射文件
在OrderDao.xml和MemberDao.xml中定义SQL语句
OrderDao.xml:
<!--根据日期统计预约数-->
<select id="findOrderCountByDate" parameterType="string" resultType="int">select count(id) from t_order where orderDate = #{value}
</select><!--根据日期统计预约数,统计指定日期之后的预约数-->
<select id="findOrderCountAfterDate" parameterType="string" resultType="int">select count(id) from t_order where orderDate >= #{value}
</select><!--根据日期统计到诊数-->
<select id="findVisitsCountByDate" parameterType="string" resultType="int">select count(id) from t_order where orderDate = #{value} and orderStatus = '已到诊'
</select><!--根据日期统计到诊数,统计指定日期之后的到诊数-->
<select id="findVisitsCountAfterDate" parameterType="string" resultType="int">select count(id) from t_order where orderDate >= #{value} and orderStatus = '已到诊'
</select><!--热门套餐,查询前4条-->
<select id="findHotSetmeal" resultType="map">select s.name, count(o.id) setmeal_count ,count(o.id)/(select count(id) from t_order) proportionfrom t_order o inner join t_setmeal s on s.id = o.setmeal_idgroup by o.setmeal_idorder by setmeal_count desc limit 0,4
</select>
MemberDao.xml:
<!--根据日期统计会员数,统计指定日期之前的会员数-->
<select id="findMemberCountBeforeDate" parameterType="string" resultType="int">select count(id) from t_member where regTime <= #{value}
</select><!--根据日期统计会员数-->
<select id="findMemberCountByDate" parameterType="string" resultType="int">select count(id) from t_member where regTime = #{value}
</select><!--根据日期统计会员数,统计指定日期之后的会员数-->
<select id="findMemberCountAfterDate" parameterType="string" resultType="int">select count(id) from t_member where regTime >= #{value}
</select><!--总会员数-->
<select id="findMemberTotalCount" resultType="int">select count(id) from t_member
</select>
SELECT a.name,count(b.id) as setmeal_count, (count(b.id)/(select count(1) from t_order)) as proportion,a.remark FROMt_setmeal a ,t_order b where a.id = b.setmeal_id group by a.idorder by setmeal_count DESClimit 2SELECT a.name,count(b.id) as setmeal_count, (count(b.id)/(select count(1) from t_order)) as proportion,a.remark FROMt_order b right join t_setmeal a on a.id = b.setmeal_id group by a.idorder by setmeal_count DESC
医疗管理系统-图形报表、POI报表相关推荐
- iHRM 人力资源管理系统_第7章 POI报表的入门
iHRM 人力资源管理系统_第7章 POI报表的入门 文章目录 iHRM 人力资源管理系统_第7章 POI报表的入门 1 员工管理 1.1 需求分析 1.2 数据库表概述 1.3 **代码实现** 1 ...
- iHRM 人力资源管理系统_第8章POI报表高级应用
iHRM 人力资源管理系统_第8章POI报表高级应用 文章目录 iHRM 人力资源管理系统_第8章POI报表高级应用 八.POI报表高级应用 1.模板打印 <1>.概述 <2> ...
- Day_11 传智健康项目-图形报表、POI报表
第11章 图形报表.POI报表 1. 套餐预约占比饼形图 1.1 需求分析 会员可以通过移动端自助进行体检预约,在预约时需要选择预约的体检套餐.本章节我们需要通过饼形图直观的展示出会员预约的各个套餐占 ...
- POI报表及百万数据导入导出方案
1.POI报表的概述 1.1 需求说明 在企业级应用开发中,Excel报表是一种最常见的报表需求.Excel报表开发一般分为两种形式:为了方便操作,基于Excel的报表批量上传数据:通过java代码生 ...
- POI报表入门及百万数据报表导出和读取
POI报表概述 需求说明 在企业级应用开发中,Excel报表是一种最常见的报表需求.Excel报表开发一般分为两种形式: 为了 方便操作,基于Excel的报表批量上传数据 通过java代码生成Exce ...
- POI报表入门,excel,使用事件模型解析百万数据excel报表
POI报表入门,excel 1.pom依赖: <?xml version="1.0" encoding="UTF-8"?> <project ...
- POI报表——模板打印 AND 海量数据导出
准备工作 导入POI的Jar包: maven工程需要在:Pom.xml文件中的xml配置 <dependency> <groupId>org.apache.poi</gr ...
- POI报表之生成excel
POI报表 Apache专门操作excel api 主流操作excel api 1.Jxl 只能操作excel 2003 2.Poi 可以操作整个office(excel.doc.ppt.viso): ...
- POI报表下载与上传 日历展示预约设置信息
POI报表下载与上传 日历展示预约设置信息 第5章 预约管理-预约设置 1. 需求分析 2. Apache POI 2.1 POI介绍 2.2 入门案例 2.2.1 从Excel文件读取数据 2.2. ...
- LIS医疗管理系统源码
LIS医疗管理系统源码 产品特点: 1.打造数字化.高标准的LIS系统. 自动化.标准化和符合ISO15189高质量医疗标准 电子化验单并最终逐步现实无纸化 2.实现互联互通.资源共享 与其他系统 ...
最新文章
- kotlin开发经验谈3
- vue 全局排序_搞定VUE [ 一 ]
- mysqlbinlog 恢复mysql数据
- 8年,永洪科技凭什么跑出中国BI领军速度?
- python降序排列说true不存在_Python数据类型串讲(中)
- JavaScript-变量的作用域 、const、let
- Flask 中的数据库迁移
- 怎样区分现代艺术和幼儿涂鸦
- 用于企业服务总线的类 USB 通用端口类型,第 1 部分: 当前 ESB 存在的问题
- VS的QT插件下载与qt版本下载
- python安装第三方库出现问题怎么办_关于Python第三方库安装失败问题的解决方案...
- 软件工程项目学生管理系统
- linux查看日志的几种方法
- 龙格库塔格式的计算精度推导
- 210714 cypress
- HTML背景及边距设置
- 2022年版中国共享单车市场现状调研及投资前景预测报告
- jy-12-SPRINGMYBATIS02——云笔记01-刘苍松
- Windows 10配置阿里云DNS
- IP(Internet Protocol)网际协议
热门文章
- Applese涂颜色-欧拉降幂公式
- 在购买太阳眼镜时怎样辨别好坏
- 2021李林精讲精练880题 【数学二 解析分册】
- Android Studio 编译 UVCCamera
- 坚果云和微云哪个好?谈谈我的使用感受
- [置顶] 增强型的FLEA_Db_TableDataGateway,提供按字段名称操作的功能
- 虎牙直播怎么换html5,虎牙直播助手怎么改名字 昵称更换方法
- 自动化运维工具inception+archer
- 科室管理系统中,运用百度编辑器(ueditor1_4_3-utf8-jsp)出现的一系列问题!
- 平板做笔记本电脑的副屏教程