尚医通day13【预约挂号】（内附源码）|观天下

页面预览预约挂号根据预约周期，展示可预约日期，根据有号、无号、约满等状态展示不同颜色，以示区分可预约最后一个日期为即将放号日期选择一个日期展示当天可预约列表预约确认第01章-预约挂号

接口分析

（1）根据预约周期，展示可预约日期数据

（2）选择日期展示当天可预约列表

(资料图片)

1、获取可预约日期接口1.1、Controller

service-hosp微服务创建FrontScheduleController

package com.atguigu.syt.hosp.controller.front;@Api(tags = "排班")@RestController@RequestMapping("/front/hosp/schedule")public class FrontScheduleController {    @Resource    private ScheduleService scheduleService;    @ApiOperation(value = "获取可预约排班日期数据")    @ApiImplicitParams({            @ApiImplicitParam(name = "hoscode",value = "医院编码", required = true),            @ApiImplicitParam(name = "depcode",value = "科室编码", required = true)})    @GetMapping("getBookingScheduleRule/{hoscode}/{depcode}")    public Result> getBookingSchedule(            @PathVariable String hoscode,            @PathVariable String depcode) {        Map result = scheduleService.getBookingScheduleRule(hoscode, depcode);        return Result.ok(result);    }}

1.2、辅助方法

在ScheduleServiceImpl中添加两个辅助方法

/**     * 根据日期对象和时间字符串获取一个日期时间对象     * @param dateTime     * @param timeString     * @return     */private DateTime getDateTime(DateTime dateTime, String timeString) {    String dateTimeString = dateTime.toString("yyyy-MM-dd") + " " + timeString;    return DateTimeFormat.forPattern("yyyy-MM-dd HH:mm").parseDateTime(dateTimeString);}

/**     * 根据预约规则获取可预约日期列表     */private List getDateList(BookingRule bookingRule) {    //预约周期    int cycle = bookingRule.getCycle();    //当天放号时间    DateTime releaseTime = this.getDateTime(new DateTime(), bookingRule.getReleaseTime());    //如果当天放号时间已过，则预约周期后一天显示即将放号，周期加1    if (releaseTime.isBeforeNow()) {        cycle += 1;    }    //计算当前可显示的预约日期，并且最后一天显示即将放号倒计时    List dateList = new ArrayList<>();    for (int i = 0; i < cycle; i++) {        //计算当前可显示的预约日期        DateTime curDateTime = new DateTime().plusDays(i);        String dateString = curDateTime.toString("yyyy-MM-dd");        dateList.add(new DateTime(dateString).toDate());    }    return dateList;}

1.3、Service

接口：ScheduleService

/**     * 根据医院编码和科室编码查询医院排班日期列表     * @param hoscode     * @param depcode     * @return     */Map getBookingScheduleRule(String hoscode, String depcode);

实现：ScheduleServiceImpl

@Resourceprivate HospitalRepository hospitalRepository;@Resourceprivate DepartmentRepository departmentRepository;

@Overridepublic Map getBookingScheduleRule(String hoscode, String depcode) {    //获取医院    Hospital hospital = hospitalRepository.findByHoscode(hoscode);    //获取预约规则    BookingRule bookingRule = hospital.getBookingRule();    //根据预约规则获取可预约日期列表    List dateList = this.getDateList(bookingRule);    //查询条件：根据医院编号、科室编号以及预约日期查询    Criteria criteria = Criteria.where("hoscode").is(hoscode).and("depcode").is(depcode).and("workDate").in(dateList);    //根据工作日workDate期进行分组    Aggregation agg = Aggregation.newAggregation(        //查询条件        Aggregation.match(criteria),        Aggregation        //按照日期分组 select workDate as workDate from schedule group by workDate        .group("workDate").first("workDate").as("workDate")        //剩余预约数        .sum("availableNumber").as("availableNumber")    );    //执行查询    AggregationResults aggResults = mongoTemplate.aggregate(agg, Schedule.class, BookingScheduleRuleVo.class);    //获取查询结果    List list = aggResults.getMappedResults();    //将list转换成Map，日期为key，BookingScheduleRuleVo对象为value    Map scheduleVoMap = new HashMap<>();    if (!CollectionUtils.isEmpty(list)) {        scheduleVoMap = list.stream().collect(            Collectors.toMap(bookingScheduleRuleVo -> bookingScheduleRuleVo.getWorkDate(), bookingScheduleRuleVo -> bookingScheduleRuleVo)        );    }    //获取可预约排班规则    List bookingScheduleRuleVoList = new ArrayList<>();    int size = dateList.size();    for (int i = 0; i < size; i++) {        Date date = dateList.get(i);        BookingScheduleRuleVo bookingScheduleRuleVo = scheduleVoMap.get(date);        if (bookingScheduleRuleVo == null) { // 说明当天没有排班数据            bookingScheduleRuleVo = new BookingScheduleRuleVo();            bookingScheduleRuleVo.setWorkDate(date);            //科室剩余预约数  -1表示无号            bookingScheduleRuleVo.setAvailableNumber(-1);        }        bookingScheduleRuleVo.setWorkDateMd(date);        //计算当前预约日期为周几        String dayOfWeek = DateUtil.getDayOfWeek(new DateTime(date));        bookingScheduleRuleVo.setDayOfWeek(dayOfWeek);        if (i == size - 1) { //最后一条记录为即将放号            bookingScheduleRuleVo.setStatus(1);        } else {            bookingScheduleRuleVo.setStatus(0);        }        //设置预约状态： 0正常； 1即将放号； -1当天已停止挂号        if (i == 0) { //当天如果过了停挂时间， 则不能挂号            DateTime stopTime = this.getDateTime(new DateTime(), bookingRule.getStopTime());            if (stopTime.isBeforeNow()) {                bookingScheduleRuleVo.setStatus(-1);//停止挂号            }        }        bookingScheduleRuleVoList.add(bookingScheduleRuleVo);    }    //医院基本信息    Map info = new HashMap<>();    //医院名称    info.put("hosname", hospitalRepository.findByHoscode(hoscode).getHosname());    //科室    Department department = departmentRepository.findByHoscodeAndDepcode(hoscode, depcode);    //大科室名称    info.put("bigname", department.getBigname());    //科室名称    info.put("depname", department.getDepname());    //当前月份    info.put("workDateString", new DateTime().toString("yyyy年MM月"));    //放号时间    info.put("releaseTime", bookingRule.getReleaseTime());    Map result = new HashMap<>();    //可预约日期数据    result.put("bookingScheduleList", bookingScheduleRuleVoList);//排班日期列表    result.put("info", info);//医院基本信息    return result;}

2、获取排班数据接口2.1、Controller

在FrontScheduleController添加方法

@ApiOperation("获取排班数据")@ApiImplicitParams({            @ApiImplicitParam(name = "hoscode",value = "医院编码", required = true),            @ApiImplicitParam(name = "depcode",value = "科室编码", required = true),            @ApiImplicitParam(name = "workDate",value = "排班日期", required = true)})@GetMapping("getScheduleList/{hoscode}/{depcode}/{workDate}")public Result> getScheduleList(    @PathVariable String hoscode,    @PathVariable String depcode,    @PathVariable String workDate) {    List scheduleList = scheduleService.getScheduleList(hoscode, depcode, workDate);    return Result.ok(scheduleList);}

2.2、Service

之前已经实现的业务

注意：如果我们在MongoDB集合的实体中使用了ObjectId作为唯一标识，那么需要对数据进行如下转换，以便将字符串形式的id传到前端

@Overridepublic List getScheduleList(String hoscode, String depcode, String workDate) {    //注意：最后一个参数需要进行数据类型的转换    List scheduleList = scheduleRepository.findByHoscodeAndDepcodeAndWorkDate(            hoscode,            depcode,            new DateTime(workDate).toDate());//数据类型的转换    //id为ObjectId类型时需要进行转换    scheduleList.forEach(schedule -> {        schedule.getParam().put("id", schedule.getId().toString());    });    return scheduleList;}

3、前端整合3.1、预约挂号页面跳转

修改/pages/hospital/_hoscode.vue组件的schedule方法

添加模块引用：

import cookie from "js-cookie"import userInfoApi from "~/api/userInfo"

methods中添加如下方法：

schedule(depcode) {  //window.location.href = "/hospital/schedule?hoscode=" + this.$route.params.hoscode + "&depcode="+ depcode  // 登录判断  let token = cookie.get("refreshToken")  if (!token) {    this.$alert("请先进行用户登录", { type: "warning" })    return  }  //判断认证  userInfoApi.getUserInfo().then((response) => {    let authStatus = response.data.authStatus    // 状态为2认证通过    if (authStatus != 2) {      this.$alert("请先进行用户认证", {        type: "warning",        callback: () => {          window.location.href = "/user"        },      })      return    }    window.location.href =      "/hospital/schedule?hoscode=" +      this.$route.params.hoscode +      "&depcode=" +      depcode  })}

3.2、api

在api/hosp.js添加方法

//获取可预约排班日期列表getBookingScheduleRule(hoscode, depcode) {  return request({    url: `/front/hosp/schedule/getBookingScheduleRule/${hoscode}/${depcode}`,    method: "get"  })},//获取排班数据getScheduleList(hoscode, depcode, workDate) {  return request({    url: `/front/hosp/schedule/getScheduleList/${hoscode}/${depcode}/${workDate}`,    method: "get"  })},

3.3、页面渲染

/pages/hospital/schedule.vue

第02章-预约确认1、后端接口1.1、Controller

在FrontScheduleController中添加方法

@ApiOperation("获取预约详情")@ApiImplicitParam(name = "id",value = "排班id", required = true)@GetMapping("getScheduleDetail/{id}")public Result getScheduleDetail(@PathVariable String id) {    Schedule schedule = scheduleService.getDetailById(id);    return Result.ok(schedule);}

1.2、Service

接口：ScheduleService

/**     * 排班记录详情     * @param id     * @return     */Schedule getDetailById(String id);

实现：ScheduleServiceImpl

@Overridepublic Schedule getDetailById(String id) {    Schedule schedule = scheduleRepository.findById(new ObjectId(id)).get();    return this.packSchedule(schedule);}

辅助方法

/**     * 封装医院名称，科室名称和周几     * @param schedule     * @return     */private Schedule packSchedule(Schedule schedule) {    //医院名称    String hosname = hospitalRepository.findByHoscode(schedule.getHoscode()).getHosname();    //科室名称    String depname = departmentRepository.findByHoscodeAndDepcode(schedule.getHoscode(),schedule.getDepcode()).getDepname();    //周几    String dayOfWeek = DateUtil.getDayOfWeek(new DateTime(schedule.getWorkDate()));        Integer workTime = schedule.getWorkTime();    String workTimeString = workTime.intValue() == 0 ? "上午" : "下午";        schedule.getParam().put("hosname",hosname);    schedule.getParam().put("depname",depname);    schedule.getParam().put("dayOfWeek",dayOfWeek);    schedule.getParam().put("workTimeString", workTimeString);      //id为ObjectId类型时需要进行转换    schedule.getParam().put("id",schedule.getId().toString());    return schedule;}

2、前端整合2.1、api

在api/hosp.js添加方法

//获取预约详情getScheduleDetail(id) {    return request({        url: `/front/hosp/schedule/getScheduleDetail/${id}`,        method: "get"    })}

2.2、页面渲染

pages/hospital/booking.vue

源码：https://gitee.com/dengyaojava/guigu-syt-parent