2-传智健康02章-预约管理-检查项管理

啊六六六

已于 2022-02-07 10:37:57 修改

阅读量510

点赞数

分类专栏： java 文章标签： java

于 2022-01-26 01:29:20 首次发布

本文链接：https://blog.csdn.net/m0_48941160/article/details/122679090

版权

java 专栏收录该内容

21 篇文章 0 订阅

订阅专栏

01-需求分析-day02__1【海量资源尽在】

检查项管理

02-基础环境搭建（导入数据表）__1【海量资源尽在】

03-基础环境搭建（导入实体类）

将资料中提供的POJO实体类复制到health_common工程中。

04-基础环境搭建（导入公共资源）

（1）返回消息常量类MessageConstant，放到health_common工程中

（2）返回结果Result和PageResult类，放到health_common工程中

（3）封装查询条件的QueryPageBean类，放到health_common工程中

（4）html、js、css、图片等静态资源，放到health_backend工程中

05-分析页面结构__1【海量资源尽在】

zookeeper启动cmd版，

maven中clean，install，

启动Tomcat7，

06-新增检查项-完善页面（弹出新增窗口）

由隐藏转为显示新增窗口，

清空表单

07-新增检查项-完善页面（输入校验）

校验规则，

08-新增检查项-完善页面（提交表单数据）

//添加
                handleAdd () {
                    //进行表单校验
                    this.$refs['dataAddForm'].validate((valid)=> {
                        if(valid){
                            //表单校验通过，发生ajax请求，将录入的数据提交到后台进行处理
                            console.log(this.formData);
                            axios.post("/checkitem/add.do",this.formData).then((res)=>{
                                //关闭新增窗口
                                this.dialogFormVisible=false;
                                if(res.data.flag){
                                    //执行成功
                                    //新增成功后，重新调用分页查询方法，查询最新的数据
                                    this.findPage();
                                    //弹出提示信息
                                    this.$message({
                                        message:res.data.message,
                                        type:'success'
                                    });

                                }else{
                                    //执行失败
                                    //弹出提示
                                    this.$message.error(res.data.message);
                                }
                            });
                        }else{
                            //校验不通过
                            this.$message.error("数据校验失败，请检查你的输入信息是否正确！");
                            return false;
                        }
                    });
                },

09-新增检查项-后台代码（Controller）__1【海量资源尽在】

在health_backend工程中创建CheckItemController

package com.itheima.controller;
import com.alibaba.dubbo.config.annotation.Reference;
import com.itheima.constant.MessageConstant;
import com.itheima.entity.PageResult;
import com.itheima.entity.QueryPageBean;
import com.itheima.entity.Result;
import com.itheima.pojo.CheckItem;
import com.itheima.service.CheckItemService;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;
import java.util.List;
/**
 * 体检检查项管理
 */
@RestController
@RequestMapping("/checkitem")
public class CheckItemController {
    @Reference
    private CheckItemService checkItemService;

    //新增
    @RequestMapping("/add")
    public Result add(@RequestBody CheckItem checkItem){
        try {
            checkItemService.add(checkItem);
        }catch (Exception e){
            return new Result(false,MessageConstant.ADD_CHECKITEM_FAIL);
        }
        return new Result(true,MessageConstant.ADD_CHECKITEM_SUCCESS);
    }
}

10-新增检查项-后台代码（Service、DAO）

在health_interface工程中创建CheckItemService接口

在health_service_provider工程中创建CheckItemServiceImpl实现类

在health_service_provider工程中创建CheckItemDao接口，本项目是基于Mybatis的Mapper代理技术实现持久层操作，故只需要提供接口和Mapper映射文件，无须提供实现类

11-新增检查项-测试_

数据库显示乱码

12-检查项分页-分析__1【海量资源尽在】

本项目所有分页功能都是基于ajax的异步请求来完成的，请求参数和后台响应数据格式都使用json数据格式。

请求参数包括页码、每页显示记录数、查询条件。

请求参数的json格式为：{currentPage:1,pageSize:10,queryString:''itcast''}

后台响应数据包括总记录数、当前页需要展示的数据集合。

响应数据的json格式为：{total:1000,rows:[]}

13-检查项分页-完善页面（定义模型数据和分页方法）

在页面中提供了findPage方法用于分页查询，为了能够在checkitem.html页面加载后直接可以展示分页数据，可以在VUE提供的钩子函数created中调用findPage方法

//钩子函数，VUE对象初始化完成后自动执行
created() {
  this.findPage();
}

//分页查询
findPage() {
  //分页参数
  var param = {
    currentPage:this.pagination.currentPage,//页码
    pageSize:this.pagination.pageSize,//每页显示的记录数
    queryString:this.pagination.queryString//查询条件
  };
  //请求后台
  axios.post("/checkitem/findPage.do",param).then((response)=> {
    //为模型数据赋值，基于VUE的双向绑定展示到页面
    this.dataList = response.data.rows;
    this.pagination.total = response.data.total;
  });
}

14-检查项分页-完善页面（完善分页方法执行时机）

为查询按钮绑定单击事件，调用findPage方法

为分页条组件绑定current-change事件，此事件是分页条组件自己定义的事件，当页码改变时触发，对应的处理函数为handleCurrentChange

 //切换页码
                handleCurrentChange(currentPage) {
                    //设置最新的页面
                    this.pagination.currentPage=currentPage;
                    //重新调用findPage方法进行分页查询
                    this.findPage();
                },

15-检查项分页-后台代码（Controller、服务接口）

//服务接口
public PageResult pageQuery(QueryPageBean queryPageBean);

//检查项分页查询
@RequestMapping("/findPage")
public PageResult findPage(@RequestBody QueryPageBean queryPageBean){
    PageResult pageResult=checkItemService.pageQuery(queryPageBean);
    return pageResult;
}

16-检查项分页-后台代码（服务实现类、DAO）__1【海量资源尽在】

在CheckItemService服务接口中扩展分页查询方法

在CheckItemServiceImpl服务实现类中实现分页查询方法，基于Mybatis分页助手插件实现分页

在CheckItemDao接口中扩展分页查询方法

在CheckItemDao.xml文件中增加SQL定义

17-检查项分页-测试__1【海量资源尽在】

创建和添加sql数据， t_checkitem

分页助手，查询分页，

18-删除检查项-完善页面（为删除按钮绑定事件）

19-删除检查项-完善页面（弹出确认框）

then确定，catch取消，

20-删除检查项-完善页面（发送请求）

5.1.1 绑定单击事件

需要为删除按钮绑定单击事件，并且将当前行数据作为参数传递给处理函数

<el-button size="mini" type="danger" @click="handleDelete(scope.row)">删除</el-button>

// 删除
handleDelete(row) {
  alert(row.id);
}

5.1.2 弹出确认操作提示

用户点击删除按钮会执行handleDelete方法，此处需要完善handleDelete方法，弹出确认提示信息。ElementUI提供了$confirm方法来实现确认提示信息弹框效果

// 删除
handleDelete(row) {
  //alert(row.id);
  this.$confirm("确认删除当前选中记录吗？","提示",{type:'warning'}).then(()=>{
    //点击确定按钮时只需此处代码
    alert('用户点击的是确定按钮');
  });
}

5.1.3 发送请求

如果用户点击确定按钮就需要发送ajax请求，并且将当前检查项的id作为参数提交到后台进行删除操作

// 删除
handleDelete(row) {
  //alert(row.id);
  this.$confirm("确认删除吗？","提示",{type:'warning'}).then(()=>{
    //点击确定按钮时只需此处代码
    //alert('用户点击的是确定按钮');
    axios.get("/checkitem/delete.do?id=" + row.id).then((res)=> {
      if(!res.data.flag){
        //删除失败
        this.$message.error(res.data.message);
      }else{
        //删除成功
        this.$message({
          message: res.data.message,
          type: 'success'
        });
        //调用分页，获取最新分页数据
        this.findPage();
      }
    });
  });
}

21-删除检查项-后台代码

在CheckItemController中增加删除方法

//删除
@RequestMapping("/delete")
public Result delete(Integer id){
  try {
    checkItemService.delete(id);
  }catch (RuntimeException e){
    return new Result(false,e.getMessage());
  }catch (Exception e){
    return new Result(false, MessageConstant.DELETE_CHECKITEM_FAIL);
  }
  return new Result(true,MessageConstant.DELETE_CHECKITEM_SUCCESS);
}

在CheckItemService服务接口中扩展删除方法

public void delete(Integer id);

注意：不能直接删除，需要判断当前检查项是否和检查组关联，如果已经和检查组进行了关联则不允许删除

//删除
public void delete(Integer id) throws RuntimeException{
  //查询当前检查项是否和检查组关联
  long count = checkItemDao.findCountByCheckItemId(id);
  if(count > 0){
    //当前检查项被引用，不能删除
    throw new RuntimeException("当前检查项被引用，不能删除");
  }
  checkItemDao.deleteById(id);
}

在CheckItemDao接口中扩展方法findCountByCheckItemId和deleteById

public void deleteById(Integer id);

public long findCountByCheckItemId(Integer checkItemId);

在CheckItemDao.xml中扩展SQL语句

<!--删除-->
<delete id="deleteById" parameterType="int">
  delete from t_checkitem where id = #{id}
</delete>
<!--根据检查项id查询中间关系表-->
<select id="findCountByCheckItemId" resultType="long" parameterType="int">
  select count(*) from t_checkgroup_checkitem where checkitem_id = #{checkitem_id}
</select>

23-编辑检查项-完善页面（弹出编辑窗口并回显数据）

handleUpdate(row) {
                    //弹出编辑窗口
                    this.dialogFormVisible4Edit=true;
                    //回显数据，发送ajax请求根据ID查询当前检查项数据
                    axios.get("/checkitem/findById.do?id="+row.id).then((res)=>{
                        if(res.data.flag){
                            //进行回显，基于VUE的数据绑定实现
                            this.formData=res.data.data();
                        }else{
                            //查询失败，弹出提示
                            this.$message.error(res.data.message);
                        }

                    })

                },

24-编辑检查项-完善页面（发送请求）

//编辑
                handleEdit() {
                    //进行表单校验
                    this.$refs['dataEditForm'].validate((valid)=>{
                        if(valid){
                            //表单校验通过，可以提交数据
                            axios.post("/checkitem/edit.do",this.formData).then((res)=>{
                                if(res.data.flag){
                                    //弹出成功提示信息
                                    this.$message({
                                        type:'success',
                                        message:res.data.message
                                    });
                                }else{
                                    //执行失败
                                    this.$message.error(res.data.message);
                                    
                                }
                            }).finally(()=>{
                                //不管成功还是失败，都调用分页查询方法
                                this.findPage();
                            })
                        }
                    })
                    this.$refs['dataEditForm'].validate((valid)=>{
                        if(valid){
                            //表单校验通过，可以提交数据
                        }else{
                            //表单校验不通过
                            this.$message.error("表单数据校验失败！");
                            return false;
                        }
                    });
                },

25-编辑检查项-后台代码（根据ID编辑数据）

（类似参考！！）

在CheckItemController中增加删除方法

在CheckItemService服务接口中扩展删除方法

在CheckItemDao接口中扩展方法findCountByCheckItemId和deleteById

在CheckItemDao.xml中扩展SQL语句

26-编辑检查项-后台代码（根据ID查询用于数据回显）

27-编辑检查项-测试__

已看完：：：