预约成功页面展示

前面已经完成了体检预约，预约成功后页面会跳转到成功提示页面（orderSuccess.html）并展示预约的相关信息（体检人、体检套餐、体检时间等）。

页面调整

提供orderSuccess.html页面，展示预约成功后相关信息

<div class="info-title">
  <span class="name">体检预约成功</span>
</div>
<div class="notice-item">
  <div class="item-title">预约信息</div>
  <div class="item-content">
    <p>体检人：{{orderInfo.member}}</p>
    <p>体检套餐：{{orderInfo.setmeal}}</p>
    <p>体检日期：{{orderInfo.orderDate}}</p>
    <p>预约类型：{{orderInfo.orderType}}</p>
  </div>
</div>

<script>
  //从请求URL根据参数名获取对应值，orderId为预约id
  var id = getUrlParam("orderId");
</script>
<script>
  var vue = new Vue({
    el:'#app',
    data:{
      orderInfo:{}
    },
    mounted(){
      axios.post("/order/findById.do?id=" + id).then((response) => {
        this.orderInfo = response.data.data;
      });
    }
  });
</script>

后台代码

Controller

在OrderController中提供findById方法，根据预约id查询预约相关信息

/**
 * 根据id查询预约信息，包括套餐信息和会员信息
 * @param id
 * @return
*/
@RequestMapping("/findById")
public Result findById(Integer id){
  try{
    Map map = orderService.findById(id);
    //查询预约信息成功
    return new Result(true,MessageConstant.QUERY_ORDER_SUCCESS,map);
  }catch (Exception e){
    e.printStackTrace();
    //查询预约信息失败
    return new Result(false,MessageConstant.QUERY_ORDER_FAIL);
  }
}

服务接口

在OrderService服务接口中扩展findById方法

//根据id查询预约信息，包括体检人信息、套餐信息
public Map findById(Integer id) throws Exception;

服务实现类

在OrderServiceImpl服务实现类中实现findById方法

//根据id查询预约信息，包括体检人信息、套餐信息
public Map findById(Integer id) throws Exception {
  Map map = orderDao.findById4Detail(id);
  if(map != null){
    //处理日期格式
    Date orderDate = (Date) map.get("orderDate");
    map.put("orderDate",DateUtils.parseDate2String(orderDate));
  }
  return map;
}

Dao接口

在OrderDao接口中扩展findById4Detail方法

public Map findById4Detail(Integer id);

Mapper映射文件

在OrderDao.xml映射文件中提供SQL语句

<!--根据预约id查询预约信息，包括体检人信息、套餐信息-->
<select id="findById4Detail" parameterType="int" resultType="map">
  select m.name member ,s.name setmeal,o.orderDate orderDate,o.orderType orderType
  from
  t_order o,
  t_member m,
  t_setmeal s
  where o.member_id=m.id and o.setmeal_id=s.id and o.id=#{id}
</select>