暑假实训美年健康-检查组增删改查开发日志

任务概述

不想写了，直接看图

检查项的新增功能

这是我第二个开发的功能，说实话还是有一点难度的，表格的弹出很容易就写出来了，在弹出框里展示所有的检查项信息只需要使用axios get后端的数据，具体的实现则交给controller类中的findAll函数，获取到数据后还需要将前端定义的checkitemIds和checkitemId双向绑定，以便后续获取数据。

• 遇到的第一个问题：如何将参数传入后端
  前面都很顺利，直到我开始写提交的函数时，我困惑了，formData里面的数据并不包含选中的ItemIds，而是存储在checkitemIds里面，我一开始想这不简单，分别用axios传到后端不就好了，（寻找接受checkitemIds的数据类型也花了好多时间，List，Array，最后发现使用int数组就可以接受我真的是服了自己）然而事实并非如此简单，分别传开的话没有办法将数据存储在中间表，因为缺少联系，itemIds无法与groupid绑定，但是我一开始却没有发现这个问题，把重点放在了怎么在这种情况下把两个axios请求的参数共享，这里也花了非常多的时间，而且是无用功。最后再同学的提醒下，才知道在前端创建一个对象包括两个请求的参数（我甚至连代码都不知道怎么写，太菜了）最后还是创建了这样一个对象，成功传入后台，使用一个新创建的实体类接受。

var param = {
    code:this.formData.code,
    checkItemId:this.checkitemIds
};

• 问题二：在Mapper层写入中间表的数据时出错
  报错信息为getGroupIdByCode返回值为null，那就是sql语句返回的结果是null，说明查询不到对应的groupId，最后确定导致的原因是查询时还没有添加完成，但是我的写的axios请求明明是新增Group表在前，新增中间表的请求在后面，按理说新增中间表数据时，group表的新增应该完成了。于是我分析可能的原因两种：
  1.axios的请求是同时发送的
  2.表的插入操作比查询操作慢许多
  不论哪种原因导致的，只要使中间表的查询操作比group表的插入操作慢就行了，所以我直接在中间表插入的执行过程中加入sleep函数，就完美解决了（可能有点不正经，但总归是解决了hhh）

至此新增checkgroup的功能总算是开发完了，感觉还是对vue和js不够熟悉，很多时间都浪费了，这也导致开发这个功能花费了最多的时间。

检查项的分页功能

这个功能还是挺简单的，毕竟之前和老师一起做过检查项的分页，所以说这个和之前的大同小异，把代码拷过来，稍微改动一下就行了。

检查项的删除功能

做完新增就开始做这个删除了（此时已经是第二天了）删除功能的话参考前面检查项的删除也是可以很快就写完的，当然第一次写的还是有问题的

• 问题一： 删除group表的sql语句执行失败
  报错信息如下：
  annot delete or update a parent row: a foreign key constraint fails (health.t_checkgroup_checkitem, CONSTRAINT group_id FOREIGN KEY (checkgroup_id) REFERENCES t_checkgroup (id) ON DELETE RESTRICT ON UPDATE RESTRICT)
  具体原因是group表和中间表有关联关系，不允许删除。既然如此，那么我先把你们两个的关系解除了，再删除group表数据，最后再把你们俩关联起来不就好了吗，然而并没有这么简单，如果仅仅删除group表，会导致中间表外键的取值范围与group表主键取值范围不同，无法重新建立关系，因此必须将两个表的对应数据都删除。

删除功能的开发过程中遇到的问题还好，看得懂报错信息，也很快解决了。

检查项的编辑功能

最后开发的是编辑功能（因为我觉得它很难，就放最后了hh），首先要实现的是点击编辑按钮后实现数据的回显，group的其他数据很容易回显，只需要向后台发送axios请求获取对应id的group信息就行。下面是开发过程中的问题：

• 问题一：检查项没有显示
  将数据从后台获取之后检查组信息显示了，但是右侧的检查项check列表却没有显示，再请求的内容中也将itemIds赋给了checkitemIds，那究竟是为什么没有显示，看了看add方法突然恍然大雾，原来是没有导入完整的检查项列表，在这个axios请求之前再加一个findAll请求即可。
• 问题二：如何提交表单数据
  一开始我直接提交formData，用checkgroup实体类接受，但是有一个问题是itemIds并没有被影响，还是编辑之前的数据，其他的信息都可以被修改。
  通过浏览器控制台输出checkitemIds，发现这个是编辑后的数据，于是我仿照增加的方法，创建一个对象，同时包括checkitemIds和formData还是用checkgroup实体类接受。然而出现了新的问题，接收到的数据均为null。
  猜测可能是接收数据的实体类有问题，要创建一个新的实体类，但是我太懒了，能不能直接用这个实体类接受呢？既然formdata里面的itemIds没更新，那我用checkitemIds代替不就行了，再创建一个对象，将fromData里面需要的数据取出来，将itemIds替换为checkitemIds，封装后传到后台。

var param = {
                        attention:this.formData.attention,
                        remark:this.formData.remark,
                        name:this.formData.name,
                        sex:this.formData.sex,
                        code:this.formData.code,
                        helpCode:this.formData.helpCode,
                        id:this.formData.id,
                        itemIds:this.checkitemIds
                    };

至此所有功能开发完毕，从这里回看开发过程，却感觉遇到的问题都是小问题，然而若非自己亲身经历过又怎知这其中解决问题的艰辛。还是需要多多练习，代码量上去了，解决的问题多了，实力也就慢慢提升了。

这也是我的第一篇博客，主要还是记录自己的开发过程，写的有一点随意还请不要介意。