预约管理_Java

文章目录

第四章. 日历展示预约设置信息
- 4.1. 前台代码
- 4.1.1. 使用静态数据调试
- 4.1.2. 发送ajax获取动态数据
- 4.2. 后台代码
- 4.2.1. Controller
- 4.2.2. 服务接口
- 4.2.3. 服务实现类
- 4.2.4. Dao接口
- 4.2.5. Mapper映射文件
- 4.3. 初始化下个月，上个月数据
- 第五章. 基于日历实现预约设置
- 【讲解】
- 5.1. 前台代码
- 5.1.1. 为设置按钮绑定事件
- 5.1.2. 弹出预约设置窗口并发送ajax请求
- 5.2. 后台代码
- 5.2.1. Controller
- 5.2.2. 服务接口
- 5.2.3. 服务实现类
- 5.2.4. Dao接口
- 5.2.5. Mapper映射文件

第四章. 日历展示预约设置信息

1.预约设置需求分析
前面我们已经完成了自由行管理、跟团游管理、套餐管理等。接下来我们需要进行预约设置，其实就是设置每一天的旅游预约最大数量。客户可以通过微信端在线预约，在线预约时需要选择旅游的时间，使得选择旅游时间的已预约人数加1，如果客户选择的时间已经预约满则无法进行预约。
2.t_ordersetting表结构：
1：前台代码
（1）使用静态数据调试
（2）发送ajax获取动态数据
2：后台代码
• 在页面上，使用日历展示预约设置信息
（1）OrderSettingController.java（Controller）
（2）OrderSettingService.java（服务接口）
（3）OrderSettingServiceImpl.java（服务实现类）
（4）OrderSettingDao.java（Dao接口）
（5）OrderSettingDao.xml（Mapper映射文件）
3：初始化下个月，上个月数据

【需求】
前面已经完成了预约设置功能，现在就需要通过日历的方式展示出来每天设置的预约人数。
在页面中已经完成了日历的动态展示，我们只需要查询当前月份的预约设置信息并展示到日历中即可，同时在日历中还需要展示已经预约的人数，效果如下：

4.1. 前台代码 4.1.1. 使用静态数据调试

为了能够快速看到效果，我们可以先使用静态数据模拟，然后再改为发送ajax请求查询数据库。
实现步骤：
（1）预约设置数据对应的模型数据为leftobj，在initData方法最后为leftobj模型数据赋值：

this.leftobj = [
    { date: 1, number: 120, reservations: 1 },
    { date: 3, number: 120, reservations: 1 },
    { date: 4, number: 120, reservations: 120 },
    { date: 6, number: 120, reservations: 1 },
    { date: 8, number: 120, reservations: 1 }
];

其中date表示日期，number表示可预约人数，reservations表示已预约人数
（2）使用VUE的v-for标签遍历上面的leftobj模型数据，展示到日历上：

4.1.2. 发送ajax获取动态数据

将上面的静态模拟数据去掉，改为发送ajax请求，根据当前页面对应的月份查询数据库获取预约设置信息，将查询结果赋值给leftobj模型数据
（1）在钩子函数created中添加：

created: function () {//在vue初始化时调用
    this.initData(null);
    this.createdData();
},

（2）创建函数createData()
组织this.leftobj的数据，返回 List

//发送ajax请求，根据当前页面对应的月份查询预约设置信息
methods: {
    createdData(){
        axios.get("/ordersetting/getOrderSettingByMonth.do?date="+this.currentYear+"-"+this.currentMonth).then((response)=>{
            if(response.data.flag){
                this.leftobj = response.data.data;
                this.$message({
                    message:response.data.message,
                    type:"success"
                })
            }else{
                this.$message.error(response.data.message);
            }
        })
    },
    ...
}

4.2. 后台代码

【路径】
1.OrderSettingController.java
2.OrderSettingServiceImpl.java

// 1.组织查询Map，dateBegin表示月份开始时间，dateEnd月份结束时间
// 2.查询当前月份的预约设置
// 3.将List，组织成List

3.OrderSettingDao.java
查询当前月份的预约设置
4.OrderSettingDao.xml
查询当前月份的预约设置（使用between and）

4.2.1. Controller

在OrderSettingController中提供getOrderSettingByMonth方法，根据月份查询预约设置信息

package com.atguigu.controller;

import com.alibaba.dubbo.config.annotation.Reference;
import com.atguigu.constant.MessageConstant;
import com.atguigu.entity.Result;
import com.atguigu.pojo.OrderSetting;
import com.atguigu.service.OrdersettingService;
import com.atguigu.utils.POIUtils;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.multipart.MultipartFile;
import java.io.IOException;
import java.util.ArrayList;
import java.util.Date;
import java.util.List;
import java.util.Map;

@RestController
@RequestMapping("/ordersetting")
public class OrdersettingController {

	@Reference
	OrderSettingService orderSettingService;

    
    @RequestMapping("/getOrderSettingByMonth")
    public Result getOrderSettingByMonth(String date){//参数格式为：2019-03
        try{//返回的是一个list集合 
            List list = orderSettingService.getOrderSettingByMonth(date);
            //获取预约设置数据成功
            return new Result(true,MessageConstant.GET_ORDERSETTING_SUCCESS,list);
        }catch (Exception e){
            e.printStackTrace();
            //获取预约设置数据失败
            return new Result(false,MessageConstant.GET_ORDERSETTING_FAIL);
        }
    }

4.2.2. 服务接口

在OrderSettingService服务接口中扩展方法getOrderSettingByMonth

List getOrderSettingByMonth(String date); //参数格式为：2019-03

4.2.3. 服务实现类

在OrderSettingServiceImpl服务实现类中实现方法getOrderSettingByMonth

package com.atguigu.service.impl;

import com.alibaba.dubbo.config.annotation.Service;
import com.atguigu.dao.OrdersettingDao;
import com.atguigu.pojo.OrderSetting;
import com.atguigu.service.OrdersettingService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.transaction.annotation.Transactional;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

@Service(interfaceClass = OrdersettingService.class)
@Transactional
public class OrdersettingServiceImpl implements OrdersettingService {

    @Autowired
    private OrdersettingDao ordersettingDao;
    
//根据日期查询预约设置数据
public List getOrderSettingByMonth(String date) {//2019-3
    // 1.组织查询Map，dateBegin表示月份开始时间，dateEnd月份结束时间
    String dateBegin = date + "-1";//2019-3-1
    String dateEnd = date + "-31";//2019-3-31
    Map  map = new HashMap();
    //传入多个参数可以用map
    map.put("dateBegin",dateBegin);
    map.put("dateEnd",dateEnd);
    // 2.查询当前月份的预约设置
    List list = orderSettingDao.getOrderSettingByMonth(map);
    List data = new ArrayList<>();
			//原来的时间带有时分秒 需要格式化 否则前端显示不了
        //SimpleDateFormat simpleDateFormat = new SimpleDateFormat();
    // 3.将List，组织成List
    for (OrderSetting orderSetting : list) {
        Map orderSettingMap = new HashMap();
   //orderSettingMap.put("date",simpleDateFormat.format(orderSetting.getOrderDate()));//获得日期 年月日
   orderSettingMap.put("date",orderSetting.getOrderDate().getDate());//获得日期（几号）
   
        orderSettingMap.put("number",orderSetting.getNumber());//可预约人数
        orderSettingMap.put("reservations",orderSetting.getReservations());//已预约人数
        data.add(orderSettingMap);
    }
    return data;
}

4.2.4. Dao接口

在OrderSettingDao接口中扩展方法getOrderSettingByMonth

List getOrderSettingByMonth(Map map);

4.2.5. Mapper映射文件

在OrderSettingDao.xml文件中扩展SQL



    select * from t_ordersetting where orderDate between #{dateBegin} and #{dateEnd}

4.3. 初始化下个月，上个月数据

（1）点击事件


    今天
    ❮
    ❯

（2）初始化日期数据（今天、上个月、下个月）：

//切换到当前月份
goCurrentMonth: function (year, month) {
  	var d = new Date();
  	this.initData(this.formatDate(d.getFullYear(), d.getMonth() + 1, 1));
  	this.createdDate();
},
//向前一个月
pickPre: function (year, month) {
    // setDate(0); 上月最后一天
    // setDate(-1); 上月倒数第二天
    // setDate(dx) 参数dx为 上月最后一天的前后dx天
    var d = new Date(this.formatDate(year, month, 1));
    d.setDate(0);
    this.initData(this.formatDate(d.getFullYear(), d.getMonth() + 1, 1));
    this.createdDate();
},
//向后一个月
pickNext: function (year, month) {
    var d = new Date(this.formatDate(year, month, 1));
    d.setDate(35);获取指定天之后的日期
    this.initData(this.formatDate(d.getFullYear(), d.getMonth() + 1, 1));
    this.createDate();
},

分别执行this.createDate();表示初始化数据。

第五章. 基于日历实现预约设置

1：前台代码
（1）为设置按钮绑定事件
（2）弹出预约设置窗口，并发送ajax请求
2：后台代码
业务：
• 在页面上，基于日历实现预约设置
（1）OrderSettingController.java（Controller）
（2）OrderSettingService.java（服务接口）
（3）OrderSettingServiceImpl.java（服务实现类）
（4）OrderSettingDao.java（Dao接口）
（5）OrderSettingDao.xml（Mapper映射文件）

【讲解】

【需求】
本章节要完成的功能为通过点击日历中的设置按钮来设置对应日期的可预约人数。效果如下：

5.1. 前台代码 5.1.1. 为设置按钮绑定事件

（1）为日历中的设置按钮绑定单击事件，当前日期作为参数

（2）handleOrderset()方法

//预约设置
handleOrderSet(day){
    alert(day);
},

5.1.2. 弹出预约设置窗口并发送ajax请求

完善handleOrderSet方法，弹出预约设置窗口，用户点击确定按钮则发送ajax请求
参考：$prompt 提交内容

//预约设置
handleOrderSet(day){
    //alert(day); //day表示日期类型
    //alert(day.getFullYear()); // 2019
    //alert(day.getMonth()+1); // 8
    //alert(day.getDate()); // 26
    //alert(this.formatDate(day.getFullYear(),day.getMonth()+1,day.getDate()));
    
    this.$prompt('请输入可预约人数', '预约设置', {
         /confirm/iButtonText: '确定',
         cancelButtonText: '取消',
         inputPattern: /^[0-9]*[1-9][0-9]*$/,
         inputErrorMessage: '只能输入正整数'
    }).then(({ value }) => {//固定写法
         //发送ajax请求根据日期修改可预约人数
         axios.post("/ordersetting/editNumberByDate.do",{
                            orderDate:this.formatDate(day.getFullYear(),day.getMonth()+1,day.getDate()), //日期
                            number:value   //可预约人数
         }).then((response)=>{
             if(response.data.flag){
                  this.createdData();
                  this.$message({
                       type: 'success',
                       message: response.data.message
                  });
             }else{
                  this.$message.error(response.data.message);
             }
        });
    }).catch(() => {
        this.$message({
             type: 'info',
             message: '已取消'
        });
    });
},


也可以这样写//


    var str = day.getFullYear()+"-"+(day.getMonth()+1)+"-"+day.getDate()
                        var param = {
                            number:value,
                            //orderDate:this.formatDate(day.getFullYear(),day.getMonth()+1,day.getDate())
                            orderDate:str
                        }



传参时这样传

axios.post("/ordersetting/editNumberByDate.do",param).then((response)=>{})

5.2. 后台代码 5.2.1. Controller

在OrderSettingController中提供方法editNumberByDate

package com.atguigu.controller;

import com.alibaba.dubbo.config.annotation.Reference;
import com.atguigu.constant.MessageConstant;
import com.atguigu.entity.Result;
import com.atguigu.pojo.OrderSetting;
import com.atguigu.service.OrdersettingService;
import com.atguigu.utils.POIUtils;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.multipart.MultipartFile;
import java.io.IOException;
import java.util.ArrayList;
import java.util.Date;
import java.util.List;
import java.util.Map;

@RestController
@RequestMapping("/ordersetting")
public class OrdersettingController {

    @Reference
    private OrdersettingService ordersettingService;

    
    @RequestMapping("/editNumberByDate")
    public Result editNumberByDate(@RequestBody OrderSetting orderSetting){
        try{
            orderSettingService.editNumberByDate(orderSetting);
            //预约设置成功
            return new Result(true,MessageConstant.ORDERSETTING_SUCCESS);
        }catch (Exception e){
            e.printStackTrace();
            //预约设置失败
            return new Result(false,MessageConstant.ORDERSETTING_FAIL);
        }
}

5.2.2. 服务接口

在OrderSettingService服务接口中提供方法editNumberByDate

void editNumberByDate(OrderSetting orderSetting);

5.2.3. 服务实现类

在OrderSettingServiceImpl服务实现类中实现editNumberByDate

package com.atguigu.service.impl;

import com.alibaba.dubbo.config.annotation.Service;
import com.atguigu.dao.OrdersettingDao;
import com.atguigu.pojo.OrderSetting;
import com.atguigu.service.OrdersettingService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.transaction.annotation.Transactional;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

@Service(interfaceClass = OrdersettingService.class)
@Transactional
public class OrdersettingServiceImpl implements OrdersettingService {

    @Autowired
    private OrdersettingDao orderSettingDao;

    //根据日期修改可预约人数
    public void editNumberByDate(OrderSetting orderSetting) {
        long count = orderSettingDao.findCountByOrderDate(orderSetting.getOrderDate());
        if(count > 0){
            //当前日期已经进行了预约设置，需要进行修改操作
            orderSettingDao.editNumberByOrderDate(orderSetting);
        }else{
            //当前日期没有进行预约设置，进行添加操作
            orderSettingDao.add(orderSetting);
        }
    }

5.2.4. Dao接口

在OrderSettingDao接口中提供方法

long findCountByOrderDate(Date orderDate);

void editNumberByOrderDate(OrderSetting orderSetting);

5.2.5. Mapper映射文件

在OrderSettingDao.xml映射文件中提供SQL



    update t_ordersetting set number = #{number} where orderDate = #{orderDate}

预约管理

Java相关栏目本月热门文章