cz_health_day08

项目一第8天

项目需求

  • 进行体检预约,预约需要展示套餐信息,手机号要进行验证,获取验证码需要实现倒计时绑定
  • 预约成功要展示体检套餐,预约时间,预约用户等

1、体检预约

  • 套餐详情页面点击预约按钮,进入预约页面,套餐页面显示套餐信息,以及用户需要填写 的信息
  • 发送验证码,后端接收信息,通过阿里云短信服务,向手机号发送验证码,并将信息存入redis中,进行失效时间设置
  • 提交预约信息,后端接收预约消息,进行判断 验证码与存入redis中的验证码是不是一致的,不一致返回预约失败
  • 检查预约日期是否已经提前进行了预约设置,如果没有则预约失败
  • 检查用户所选择的预约日期是否已经约满,如果约满则无法预约
  • 检查用户是否重复预约(同一用户一天只能预约同一个套餐),如果重复预约则无法预约
  • 检查当前用户是否为会员,如果是会员则直接完成预约,不是会员则进行会员注册(直接注册)
  • 预约成功后,更新当日的已预约人数

2、预约成功后跳转至预约成功

  • 通过传递的预约id,通过页面加载的狗仔函数,异步发送消息至后端,获取信息
  • 由于order的封装对象与页面要求的数据不一样,所以封装新的类 vo(用于数据传输)或者直接map对象接收
  • 通过内置连接查询获得需要的对象,返回至前端

前端代码

 1 <script>
 2     var vue = new Vue({
 3         el: '#app',
 4         data: {
 5             setmeal: {},//套餐信息
 6             orderInfo: {
 7                 setmealId: id,
 8                 sex: '1'
 9             }//预约信息
10         },
11         methods: {
12             //发送验证码
13             sendValidateCode() {
14                 //获取用户手机号
15                 let telephone = this.orderInfo.telephone;
16                 //手机号校验,成功
17                 if (checkTelephone(telephone)) {
18                     //获取按钮的dom对象
19                     validateCodeButton = $("#validateCodeButton")[0];
20                     clock = window.setInterval(doLoop, 300);//定时器方法,可以实现每隔指定的时间调用指定的方法
21 
22                     //发送ajax请求,发送验证码
23                     axios.get("/validateCode/send4Order.do?telephone=" + telephone).then((res) => {
24                         if (!res.data.flag) {
25                         this.$message.error(res.data.message)
26                     }
27                 })
28                 } else {//校验失败
29                     this.$message.error("请输入正确的手机号");
30                     return false;
31                 }
32             },
33             //提交预约
34             submitOrder() {
35                 //省份证校验。验证码不能为空校验
36                 let idCard = this.orderInfo.idCard;
37                 if (this.orderInfo.validateCode == null) {
38                     this.$message.error("验证码不能为空");
39                     return false;
40                 }
41                 if (!checkIdCard(idCard)) {
42                     this.$message.error("身份证号码输入错误,请重新输入");
43                     return false;
44                 }
45                 axios.post("/order/submit.do?",this.orderInfo).then((res)=>{
46                     if (res.data.flag){
47                         window.location.href="orderSuccess.html?orderId=" + res.data.data;
48                     }else {
49                         this.message.error(res.data.message)
50                     }
51                 })
52             }
53         },
54         mounted() {
55             //发送ajax请求,根据套餐ID查询套餐详细信息(包括套餐基本信息、套餐包含的检查组、检查组包含的检查项)
56             axios.post("/setmeal/findById.do?id=" + id).then((res) => {
57                 if (res.data.flag) {
58                     this.setmeal = res.data.data;
59                 }
60             });
61         }
62     });
63 </script>
64 <script>
65     //日期控件
66     var calendar = new datePicker();
67     calendar.init({
68         'trigger': '.picktime',/*按钮选择器,用于触发弹出插件*/
69         'type': 'date',/*模式:date日期;datetime日期时间;time时间;ym年月;*/
70         'minDate': getSpecifiedDate(new Date(), 1),/*最小日期*/
71         'maxDate': getSpecifiedDate(new Date(), 30),/*最大日期*/
72         'onSubmit': function () { /*确认时触发事件*/
73             //var theSelectData = calendar.value;
74         },
75         'onClose': function () { /*取消时触发事件*/
76         }
77     });
78 </script>

后端代码一

  1  @RequestMapping("/submit")
  2     public Result submit(@RequestBody Map map) {
  3         /*1. 从Redis中获取保存的验证码
  4          2. 将用户输入的验证码和Redis中保存的验证码进行比对
  5          3. 如果比对成功,调用服务完成预约业务处理
  6          3.1 预约成功,可以为用户发送短信
  7          3.2 如果比对不成功,返回结果给页面 */
  8 
  9         Jedis resource = jedisPool.getResource();
 10         String telephone = (String) map.get("telephone");
 11         //获取存储在redis中的验证码
 12         String validateCodeInRedis = resource.get(telephone + RedisMessageConstant.SENDTYPE_ORDER);
 13         //获取存储的验证码
 14         String validateCode = (String) map.get("validateCode");
 15 
 16         //判断验证码是否相等
 17         if (validateCodeInRedis != null && validateCodeInRedis.equals(validateCode)) {
 18 
 19             try {
 20                 //添加预约类型
 21                 map.put("orderType", Order.ORDERTYPE_WEIXIN);
 22                 Result result = orderService.order(map);
 23                 //预约成功发送短信给用户
 24                 if (result.isFlag()) {
 25                     SMSUtils.sendShortMessage(SMSUtils.ORDER_NOTICE, telephone, (String) map.get("orderDate"));
 26                 }
 27                 return result;
 28             } catch (Exception e) {
 29                 e.printStackTrace();
 30                 return new Result(false, MessageConstant.ORDERSETTING_FAIL);
 31             } finally {
 32                 resource.close();
 33             }
 34 
 35         } else {
 36             resource.close();
 37             return new Result(false, MessageConstant.VALIDATECODE_ERROR);
 38         }
 39 
 40     }
 41 
 42 
 43 
 44 //service
 45 /**
 46      * 进行预约设置
 47      *
 48      * @param map 存的是预约信息
 49      * @return 返回值是Result结果信息
 50      * @throws Exception 抛出异常
 51      */
 52     public Result order(Map map) throws Exception {
 53        /* 1、检查用户所选择的预约日期是否已经提前进行了预约设置,如果没有设置则无法进行预约
 54         2、检查用户所选择的预约日期是否已经约满,如果已经约满则无法预约
 55         3、检查用户是否重复预约(同一个用户在同一天预约了同一个套餐),如果是重复预约则无法完成再次预约
 56         4、检查当前用户是否为会员,如果是会员则直接完成预约,如果不是会员则自动完成注册并进行预约
 57         5、预约成功,更新当日的已预约人数*/
 58         //获取预约日期
 59         String orderDate = (String) map.get("orderDate");
 60         //获取date类型的预约日期
 61         Date date = DateUtils.parseString2Date(orderDate);
 62         //查询日期能否进行预约
 63         OrderSetting orderSetting = orderSettingDao.findByOrderDate(date);
 64         if (orderSetting == null) {
 65             return new Result(false, MessageConstant.SELECTED_DATE_CANNOT_ORDER);
 66         }
 67 
 68         //获取设置的预约人数
 69         int number = orderSetting.getNumber();
 70         //获取已经预约人数
 71         int reservations = orderSetting.getReservations();
 72         //如果预约人数等于预约设置的人数,预约失败
 73         if (number <= reservations) {
 74             return new Result(false, MessageConstant.ORDER_FULL);
 75         }
 76 
 77         String telephone = (String) map.get("telephone");
 78         //根据手机号查找会员
 79         Member member = memberDao.findByTelephone(telephone);
 80 
 81         if (member == null) {//如果用户没有,则注册用户并进行预约
 82             //注册会员
 83             member = new Member();
 84             member.setName((String) map.get("name"));
 85             member.setPhoneNumber(telephone);
 86             member.setIdCard((String) map.get("idCard"));
 87             member.setSex((String) map.get("sex"));
 88             member.setRegTime(new Date());
 89 
 90             memberDao.add(member);
 91 
 92         } else {//如果有会员
 93 
 94             Order order = new Order();
 95             order.setMemberId(member.getId());
 96             order.setOrderDate(date);
 97             order.setSetmealId(Integer.parseInt((String) map.get("setmealId")));
 98             //查询是否有相同的订单
 99             List<Order> list = orderDao.findByCondition(order);
100             if (list != null && list.size() > 0){//重复预约,预约失败
101                 return new Result(false,MessageConstant.HAS_ORDERED);
102             }
103         }

  //添加预约
Order order = new Order();
order.setMemberId(member.getId());
order.setOrderDate(date);
order.setOrderType((String) map.get("orderType"));
order.setOrderStatus(Order.ORDERSTATUS_NO);//到诊状态

orderDao.add(order);
//进行预约设置的人数+1
orderSetting.setReservations(orderSetting.getReservations() + 1);
orderSettingDao.editReservationsByOrderDate(orderSetting);
return new Result(true,MessageConstant.ORDER_SUCCESS,order.getId());
}

后端代码二

 1 /**
 2      * 查询预约信息
 3      * @param id 预约的id
 4      * @return 返回预约信息
 5      * @throws Exception 异常就抛,完事
 6      */
 7     public Map findById(Integer id) throws Exception {
 8 
 9         Map map = orderDao.findById4Detail(id);
10         if (map!=null){
11             Date orderDate = (Date) map.get("orderDate");
12             map.put("orderDate",DateUtils.parseDate2String(orderDate));
13         }
14         return map;
15     }
16 
17 
18  <select id="findById4Detail" parameterType="Integer" resultType="java.util.Map">
19             select m.name  member ,s.name  setmeal,o.orderDate  orderDate,o.orderType  orderType
20                 from
21                     t_order o,
22                     t_member m,
23                     t_setmeal s
24                 where o.member_id=m.id and o.setmeal_id=s.id and o.id=#{id}
25     </select>
原文地址:https://www.cnblogs.com/luckysupermarket/p/13693840.html