模块二 管理端-检查项管理

模块二管理端-检查项管理《JavaEE企业级应用开发项目教程（SSM）》知识目标/Target熟悉Zookeeper的基本操作，能够独立完成Zookeeper的下载、安装、启动熟悉Axios技术的使用，能够灵活使用Axios技术发送页面请求熟悉MyBatis分页插件PageHelper，能够使用PageHelper实现分页技能目标/Target掌握查询检查项功能的实现方法掌握编辑检查项功能的实现方法掌握删除检查项功能的实现方法掌握新增检查项功能的实现方法章节概述/

Summary人体是一个具有多层次结构的复杂体系，如果有器官或者组织存在问题，则会打破器官系统之间的协调和平衡。如果想要知道身体是否健康，可以对人体内部器官或组织进行检查。为了给体检用户提供丰富、完善的体检服务，健康管理机构会根据不同的体检需求，推出对应的检查项以提高体检用户的满意度，提升自身竞争力。为了满足体检用户的各项检查需求，传智健康管理端提供检查项管理功能，包括检查项的新增、查询、编辑和删除。接下来，本模块将针对管理端的检查项管理进行详细讲解。目录/Contents01020304新增检查项查询检查项编辑检查项删除检查项新增检查项2-1任务描述任务描述检查项指的是用户体检时要检查的项目，本任务要实现的是新增检查项功能。访问health_backend子模块中的检查项管理页面checkitem.html。任务描述单击检查项管理页面中的“新增”按钮，弹出新增检查项对话框。输入检查项的信息后，单击“确定”按钮完成新增检查项。任务分析弹出新增检查项对话框在checkitem.html页面中，为“新增”按钮绑定单击事件，单击事件触发后弹出新增检查项对话框。为对话框中的“确定”按钮绑定单击事件，在单击事件触发后，将新增检查项对话框中的数据提交到后台。由控制器类CheckItemController中的add()方法接收和处理新增检查项的请求。由CheckItemController类中的add()方法将新增检查项的结果响应回checkitem.html页面。CheckItemServiceImpl类中调用CheckItemDao接口中的add()方法新增检查项。提交新增检查项数据接收和处理新增检查项的请求提示新增检查项的结果保存新增检查项数据任务分析新增检查项的实现过程知识进阶传智健康服务消费方和服务提供方所在的子模块是不同的，不同子模块之间的远程调用，可以通过Dubbo实现，Dubbo在使用时需要引入注册中心，并将服务发布到注册中心中。目前Dubbo支持的注册中心有5个，分别是是Nacos、Multicast、ZooKeeper、Redis和Simple，其中，

Zookeeper是官方推荐的注册中心，而且Zookeeper数据模型简单、支持网络集群、事件监听、高可用、高性能，所以传智健康选择Zookeeper作为Dubbo的注册中心。Zookeeper知识进阶Zookeeper属于ApacheHadoop的一个子项目，是一个开放源代码的分布式应用程序协调服务，分布式应用程序可以基于它实现同步服务、配置维护和命名服务等功能。Zookeeper知识进阶访问ApacheZookeeper的官方网站首页，在页面中单击“Download”超链接，会跳转Zookeeper的版本列表页面。Zookeeper下载Zookeeper知识进阶ApacheZooKeeper3.6.3是当前最新的稳定版,，在此选择下载ApacheZooKeeper3.6.3。单击页面中的“ApacheZooKeeper3.6.3(asc,sha512)”超链接会进入ApacheZooKeeper3.6.3下载页面。Zookeeper下载Zookeeper知识进阶单击“https://dlcdn./zookeeper/zookeeper-3.6.3/apache-zookeeper-3.6.3-bin.tar.gz”超链接会下载一个名称为apache-zookeeper-3.6.3-bin.tar.gz的Zookeeper安装包。Zookeeper下载Zookeeper知识进阶bin目录：存放Zookeeper的命令。conf目录：存放配置文件。lib目录：存放Java客户端开发时需要依赖的JAR包。Zookeeper安装Zookeeper将apache-zookeeper-3.6.3-bin.tar.gz解压后文件夹下的目录结构如下图。知识进阶打开conf文件夹，复制zoo_sample.cfg文件并将其重命名为zoo.cfg。使用文本编辑工具打开zoo.cfg文件，配置存储数据、日志的目录地址。#thedirectorywherethesnapshotisstored.dataDir=D:\\zookeeper\\apache-zookeeper-3.6.3-bin\\datasdataLogDir=D:\\zookeeper\\apache-zookeeper-3.6.3-bin\\logs#theportatwhichtheclientswillconnectclientPort=2181Zookeeper启动Zookeeper服务指定存储数据的目录地址指定存储日志的目录地址知识进阶zkServer.cmd用于启动Zookeeper服务。zkCli.cmd用于连接Zookeeper。Zookeeper启动Zookeeper服务知识进阶Zookeeper启动Zookeeper服务双击“zkServer.cmd”，启动ZooKeeper服务。知识进阶Zookeeper启动Zookeeper服务双击“zkCli.cmd”查看ZooKeeper服务的启动情况知识进阶小提示：启动Zookeeper服务时闪退的处理方式双击zkServer.cmd或者zkCli.cmd时可能会出现闪退，如果发生此种情况，可以通过修改该脚本文件中命令行的内容进行解决。以zkServer.cmd脚本文件为例，通过文本编辑器打开zkServer.cmd。查找命令行语句call%JAVA%"-Dzookeeper.log.dir=%ZOO_LOG_DIR%"，将语句中%JAVA%段落两边的%去掉，保存文本后再次启动服务。知识进阶Axios是一个基于对象来传递异步操作信息的HTTP库，可以用在浏览器中。Axios通过对Ajax的封装实现页面和服务端的交互。Axios技术知识进阶post和get表示请求方式，URL表示请求地址，data表示请求参数。then()函数用于处理请求结果，参数response是控制器响应的结果。catch()函数用于用于捕获执行then()函数时发生的异常。finally()函数用于执行一段无论是请求成功还是失败都会被执行的代码。axios.post/get(URL,data)

.then((response)=>{

}).catch(()=>{

}).finally(()=>{});Axios技术任务实现<el-buttontype="primary"class="butT">新增</el-button><!--新增标签弹层--><divclass="add-form"><el-dialogtitle="新增检查项":visible.sync="dialogFormVisible">

</el-dialog></div><script>varvue=newVue({el:'#app',data:{formData:{},//表单数据dialogFormVisible:false,//新增表单弹层是否可见

},

})</script>（1）弹出新增检查项对话框通过设置dialogFormVisible的值，进而改变:visible的属性值，进而控制对话框在页面中显示或隐藏。查看checkitem.html页面中与“新增”按钮和新增检查项对话框相关的源代码。任务实现由于新增检查项对话框在页面初始化时已经存在，只是处于隐藏状态，故需要将属性dialogFormVisible的值修改为true；为了保证每次弹出的对话框内均没有数据，在每次显示对话框之前调用resetForm()方法将对话框中的数据清空。//清空对话框resetForm(){

this.formData={};},//弹出新增检查项对话框handleCreate(){

this.resetForm();//调用重置表单的方法

this.dialogFormVisible=true;//修改显示弹窗的属性为true}（1）弹出新增检查项对话框任务实现为checkitem.html页面的“新增”按钮绑定单击事件，并在单击时调用定义好的handleCreate()方法，弹出新增检查项对话框。<el-buttontype="primary"class="butT"

@click="handleCreate()">新增</el-button>（1）弹出新增检查项对话框任务实现为新增检查项对话框中的“取消”和“确定”按钮绑定单击事件，并设置单击时要执行的操作。<divslot="footer"class="dialog-footer"><el-button@click="dialogFormVisible=false">取消</el-button><el-buttontype="primary"@click="handleAdd()">确定</el-button></div>（2）提交新增检查项请求任务实现在checkitem.html页面中定义handleAdd()方法，用于提交新增检查项数据的请求。handleAdd(){

this.$refs['dataAddForm'].validate((valid)=>{

if(valid){axios.post("/checkitem/add.do",this.formData).then((res)=>{

if(res.data.flag){//请求处理成功 this.$message({type:'success',message:res.data.message });

this.dialogFormVisible=false;

//隐藏对话框

}else{//请求处理失败 this.$message.error(res.data.message);

}

});

}else{

this.$message.error("表单数据校验失败，请检查输入"+"是否正确！");

}

});}（2）提交新增检查项数据任务实现在health_common模块创建检查项类CheckItem，在类中声明检查项的属性，定义各个属性的getter/setter方法。（3）创建检查项类任务实现在health_backend子模块创建控制器类CheckItemController，在类中定义add()方法，用于处理新增检查项的请求。publicclassCheckItemController{@Reference//查找服务privateCheckItemServicecheckItemService;@RequestMapping("/add")publicResultadd(@RequestBodyCheckItemcheckItem){try{checkItemService.add(checkItem);//调用接口方法

returnnewResult(true,MessageConstant.ADD_CHECKITEM_SUCCESS);//成功}catch(Exceptione){e.printStackTrace();returnnewResult(false,MessageConstant.ADD_CHECKITEM_FAIL);//失败}}}（4）实现新增检查项控制器任务实现在health_interface子模块创建接口CheckItemService，在接口中定义新增检查项的add()方法。publicinterfaceCheckItemService{publicvoidadd(CheckItemcheckItem);//新增检查项}（5）创建检查项服务接口任务实现在health_service_provider子模块创建CheckItemService接口实现类CheckItemServiceImpl，并重写接口的add()方法，用于新增检查项。@Service(interfaceClass=CheckItemService.class)@TransactionalpublicclassCheckItemServiceImplimplementsCheckItemService{@AutowiredprivateCheckItemDaocheckItemDao;//新增检查项

@Overridepublicvoidadd(CheckItemcheckItem){checkItemDao.add(checkItem);//调用持久层接口add()}}（6）实现新增检查项服务任务实现在health_service_provider子模块创建持久层接口CheckItemDao。在类中定义add()方法，用于新增检查项。publicinterfaceCheckItemDao{publicvoidadd(CheckItemcheckItem);//新增检查项}（7）实现持久层新增检查项任务实现在health_service_provider子模块创建与CheckItemDao接口同名的映射文件CheckItemDao.xml，在文件中使用<insert>标签映射新增语句，将新增的检查项数据保存到数据库中。<mappernamespace="com.itheima.dao.CheckItemDao"><!--新增检查项--><insertid="add"parameterType="com.itheima.pojo.CheckItem">iINSERTINTOt_checkitem(code,name,sex,age,price,type,remark,attention)VALUES

(#{code},#{name},#{sex},#{age},#{price},#{type},#{remark},#{attention})</insert></mapper>（7）实现持久层新增检查项任务实现启动ZooKeeper服务，在IDEA中依次启动health_service_provider和health_backend。使用浏览器访问http://localhost:82/pages/checkitem.html。（8）测试新增检查项任务实现在检查项管理页面单击“新增”按钮，弹出新增检查项对话框。（8）测试新增检查项任务实现在新增检查项对话框按照要求填写检查项的各项信息。（8）测试新增检查项任务实现新增成功后，页面提示“新增检查项成功”。由于查询检查项的功能暂未开发完成，数据库中新增的检查项不会展示在检查项管理页面中。（8）测试新增检查项任务实现通过查询数据表t_checkitem的方式验证检查项数据是否新增成功。（8）测试新增检查项查询检查项2-2任务描述任务描述本任务需要实现既可以根据指定需求查询检查项，又可以查询所有检查项。考虑到页面可视化效果，本任务通过分页形式展示查询出的检查项。任务分析（1）提交分页查询检查项的请求。（2）接收和处理分页查询检查项的请求。（3）分页查询检查项。（4）展示分页查询结果。分页展示检查项在checkitem.html页面中，为分页条绑定单击事件，在单击事件触发后根据要跳转的页码进行分页查询。页码切换在checkitem.html页面中，为“查询”按钮绑定单击事件，在单击事件触发后执行按条件的分页查询。按条件查询检查项查询检查项任务分析分页展示检查项的实现过程知识进阶PageHelper是MyBatis提供的第三方开源分页插件，支持任何复杂的单表分页、多表分页以及12种常见数据库的使用，例如Oracle、Mysql、MariaDB、SQLite、Hsqldb和PostgreSQL等。MyBatis分页插件PageHelper知识进阶在health_parent父工程的POM文件中添加PageHelper依赖。<properties>

<pagehelper.version>4.1.4</pagehelper.version></properties><dependencyManagement>

<dependencies>

<dependency>

<groupId>com.github.pagehelper</groupId>

<artifactId>pagehelper</artifactId>

<version>${pagehelper.version}</version>

</dependency>

</dependencies></dependencyManagement>MyBatis分页插件PageHelper（1）引入PageHelper依赖知识进阶由于在<dependencyManagement>标签只是定义依赖的声明，并不实际引入JAR包，因此子模块health_common继承父工程health_parent时，需要在POM文件的<dependencies>标签中显式声明PageHelper的依赖。

<dependencies>

<dependency>

<groupId>com.github.pagehelper</groupId>

<artifactId>pagehelper</artifactId>

</dependency>

</dependencies>MyBatis分页插件PageHelper（1）引入PageHelper依赖知识进阶在health_service_provider子模块的resources目录下的SqlMapConfig.xml文件中添加PageHelper的相关配置。<?xmlversion="1.0"encoding="UTF-8"?><!DOCTYPEconfigurationPUBLIC"-////DTDConfig3.0//EN""/dtd/mybatis-3-config.dtd"><configuration><plugins><plugininterceptor="com.github.pagehelper.PageHelper"><propertyname="dialect"value="mysql"/></plugin></plugins></configuration>MyBatis分页插件PageHelper（2）配置PageHelper任务实现<el-tablesize="small"current-row-key="id":data="dataList"stripe>

</el-table><divclass="pagination-container"><el-paginationclass="pagiantion"></el-pagination></div><script>varvue=newVue({el:'#app',data:{pagination:{//分页属性 currentPage:1,//当前页码 pageSize:10,//每页显示的记录数 total:0,//总记录数 queryString:null//查询条件},dataList:[],//当前页要展示的分页列表数据

},created(){},

})</script>STEP01（1）提交分页查询检查项的请求:data="dataList"通过数据双向绑定的方式展示数据。el-pagination分页组件，用于实现数据分页。分页属性pagination，包括当前页码、每页显示的记录数、总记录数和查询条件。dataList表示当前页要展示的数据。created()函数在Vue对象初始化完成后自动执行。查看checkitem.html页面中用于展示检查项的源代码。STEP011.分页展示检查项任务实现本任务的查询操作分为按条件查询和查询所有。如果指定查询条件，则按照条件查询；如果没有查询条件，则查询所有。在checkitem.html页面中定义findPage()方法，用于实现分页查询检查项。findPage(){varparam={currentPage:this.pagination.currentPage,//当前页pageSize:this.pagination.pageSize,//每页显示记录数queryString:this.pagination.queryString//查询条件};axios.post("/checkitem/findPage.do",param).then((res)=>{this.pagination.total=res.data.total;//获取总记录数this.dataList=res.data.rows;//获取数据列表});}STEP01（1）提交分页查询检查项的请求STEP011.分页展示检查项任务实现在钩子函数created()中调用findPage()方法，created()函数在Vue对象初始化完成后自动执行，访问checkitem.html页面后即可实现查询检查项并分页显示。STEP01created(){

this.findPage();//调用分页查询方法完成分页查询}（1）提交分页查询检查项的请求STEP011.分页展示检查项任务实现在health_backend子模块的CheckItemController类中定义findPage()方法，用于处理分页查询检查项的请求。@RequestMapping("/findPage")publicPageResultfindPage(@RequestBodyQueryPageBeanqueryPageBean){//调用服务接口findPage()，返回分页结果封装对象returncheckItemService.findPage(queryPageBean);}STEP01（2）实现查询检查项控制器STEP011.分页展示检查项任务实现在health_interface子模块的CheckItemService接口中定义findPage()方法，用于分页查询检查项。//分页查询检查项接口publicPageResultfindPage(QueryPageBeanqueryPageBean);STEP01（3）创建查询检查项服务STEP011.分页展示检查项任务实现在health_service_provider子模块的CheckItemServiceImpl类重写接口的findPage()方法，用于分页查询检查项。@OverridepublicPageResultfindPage(QueryPageBeanqueryPageBean){IntegercurrentPage=queryPageBean.getCurrentPage();//获取当前页面IntegerpageSize=queryPageBean.getPageSize();//获取每页显示的记录数StringqueryString=queryPageBean.getQueryString();//获取查询条件//分页插件，会在执行sql之前将分页关键字追加到SQL后面

PageHelper.startPage(currentPage,pageSize);//调用持久层接口方法Page<CheckItem>page=checkItemDao.findByCondition(queryString);//返回分页结果对象returnnewPageResult(page.getTotal(),page.getResult());}注意：为了避免在SQL语句中添加分页关键字失败，必须在执行SQL语句前调用PageHelper的startPage()方法。STEP01(4)实现查询检查项服务STEP011.分页展示检查项任务实现在health_service_provider子模块的CheckItemDao接口中定义findByCondition()方法，用于分页查询检查项。//分页查询检查项publicPage<CheckItem>findByCondition(StringqueryString);STEP01(5)实现持久层查询检查项STEP011.分页展示检查项任务实现在health_service_provider子模块的CheckItemDao.xml映射文件中通过<select>标签映射查询语句，进行检查项的条件查询、分页查询。<!--根据条件查询、分页查询检查项--><selectid="findByCondition"parameterType="string" resultType="com.itheima.pojo.CheckItem">SELECT*FROMt_checkitem<iftest="value!=nullandvalue.length>0">WHERE

code=#{value}OR

name=#{value}</if></select>通过<if>标签判断是否进行条件查询如果参数value的值是null，表示没有查询条件，此时查询的是数据表t_checkitem中的所有数据。STEP01(5)实现持久层查询检查项STEP011.分页展示检查项任务实现依次启动ZooKeeper服务、health_service_provider和health_backend。使用浏览器访问http://localhost:82/pages/checkitem.html。STEP01(6)测试分页展示检查项STEP011.分页展示检查项任务实现STEP011.分页展示检查项(7)完善checkitem.html页面的handleAdd()方法优化handleAdd()方法，在新增检查项成功后调用findPage()方法。//添加检查项handleAdd(){

axios.post("/checkitem/add.do",this.formData).then((res)=>{//处理成功if(res.data.flag){

this.findPage();//分页查询检查项}

});

}任务实现在checkitem.html页面中定义handleCurrentChange()方法，该方法用于实现页码切换。//切换页码handleCurrentChange(currentPage){this.pagination.currentPage=currentPage;//指定最新的页码this.findPage();//调用分页方法}STEP012.页码切换(1)定义页码切换的方法任务实现checkitem.html页面中提供了分页组件el-pagination。接下来，为el-pagination组件设置与页码相关的属性值。<el-pagination

class="pagiantion"

@current-change="handleCurrentChange"

:current="pagination.currentPage"

:size="pagination.pageSize"

:total="pagination.total"

layout="total,prev,pager,next,jumper"></el-pagination>表示在页码发生改变时触发的方法表示当前页表示每页显示条数表示总条数STEP01(2)设置分页组件el-pagination2.页码切换任务实现导入测试数据。依次启动Zookeeper服务、health_service_provider和health_backend。访问检查项管理页面。在检查项管理页面单击“>”按钮跳转到下一页。STEP01(3)测试页码切换2.页码切换任务实现每次按条件查询时，都需要根据输入的关键字重新查询检查项信息。在此指定调用handleCurrentChange()方法的传递参数currentPage的值为1，这是为了每次按条件查询时都指定当前页的页码为1。<el-buttonclass="dalfBut"@click="handleCurrentChange(1)">查询</el-button>STEP013.按条件查询检查项（1）定义按条件查询方法任务实现STEP01（2）测试按条件查询检查项依次启动Zookeeper服务、health_service_provider和health_backend。在浏览器中访问http://localhost:82/pages/checkitem.html。在查询条件输入框中输入查询条件，单击“查询”按钮进行条件查询。3.按条件查询检查项编辑检查项2-3任务描述每个检查项右侧都有一个“编辑”按钮，单击“编辑”按钮弹出编辑检查项对话框。在编辑检查项对话框中修改检查项的信息后，单击“确定”按钮即可完成检查项的编辑操作。在检查项管理过程中，如果检查项的信息填写错误或者不完善时，可以通过编辑检查项的方式对检查项的内容进行变更或补充。编辑检查项可以分解成2个功能，分别是弹出带有检查项数据的编辑检查项对话框和完成检查项的编辑。任务分析任务分析（1）弹出编辑检查项对话框为checkitem.html页面的“编辑”按钮绑定单击事件，在单击事件触发后弹出编辑检查项对话框，然后提交查询检查项的请求。（2）接收和处理检查项查询请求客户端发起查询检查项的请求后，由CheckItemController类的findById()方法接收页面提交的请求，并调用CheckItemService接口的findById()方法查询检查项。（3）查询检查项数据在CheckItemServiceImpl类重写CheckItemService接口的findById()方法，并在方法中调用CheckItemDao接口的findById()方法从数据库中查询检查项数据。（4）展示查询检查项的结果由CheckItemController类中的findById()方法将查询检查项的结果响应回checkitem.html页面，checkitem.html页面根据响应结果在编辑检查项对话框中展示检查项信息。1.弹出带有检查项数据的编辑检查项对话框任务分析弹出带有检查项数据的对话框的实现过程1.弹出带有检查项数据的编辑检查项对话框任务分析（1）提交编辑检查项请求为checkitem.html页面编辑检查项对话框的“确定”按钮绑定单击事件，在单击事件触发后提交对话框中的数据。（2）接收和处理检查项编辑请求客户端发起编辑检查项的请求后，由CheckItemController类的edit()方法接收页面提交的请求，并调用CheckItemService接口的edit()方法编辑检查项。（3）编辑检查项数据在CheckItemServiceImpl类中重写CheckItemService接口的edit()方法，并在方法中调用CheckItemDao接口的edit()方法修改数据库中的检查项数据。（4）提示编辑检查项的结果由CheckItemController类中的edit()方法将编辑检查项的结果响应回checkitem.html页面，checkitem.html页面根据响应结果提示编辑成功或失败的信息。2.完成检查项的编辑任务分析2.完成检查项的编辑完成检查项编辑的实现过程任务实现<el-table-columnlabel="操作"align="center"><templateslot-scope="scope"><el-buttontype="primary"size="mini">编辑</el-button>

</template></el-table-column><!--编辑标签弹层--><divclass="edit-form"><el-dialogtitle="编辑检查项":visible.sync="dialogFormVisible4Edit">

</el-dialog></div><script>varvue=newVue({el:'#app',data:{

dialogFormVisible4Edit:false,//编辑表单是否可见},

})</script>STEP011.弹出带有检查项数据的编辑检查项对话框(1)弹出编辑检查项对话框

设置dialogFormVisible4Edit的值，进而改变:visible的属性值，进而控制对话框在页面中显示或隐藏查看checkitem.html页面中与“编辑”按钮和编辑检查项对话框相关的源代码。任务实现在checkitem.html页面中定义handleUpdate()方法，用于弹出带有检查项数据的编辑检查项对话框后回显数据。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);}});}STEP011.弹出带有检查项数据的编辑检查项对话框(1)弹出编辑检查项对话框任务实现为checkitem.html页面的“编辑”按钮绑定单击事件，并在单击时调用定义好的handleUpdate()方法，弹出编辑检查项对话框。<el-buttontype="primary"class="mini"@click="handleUpdate(scope.row)">编辑</el-button>STEP011.弹出带有检查项数据的编辑检查项对话框(1)弹出编辑检查项对话框任务实现在health_backend子模块的CheckItemController类中定义findById()方法，用于处理根据检查项id查询检查项的请求。@RequestMapping("/findById")publicResultfindById(Integerid){try{//调用服务接口findById()，返回检查项实体对象CheckItemcheckItem=checkItemService.findById(id);//调用服务接口成功，返回成功结果信息returnnewResult(true,MessageConstant.QUERY_CHECKITEM_SUCCESS,checkItem);}catch(Exceptione){e.printStackTrace();//调用服务接口失败，返回失败结果信息returnnewResult(false,MessageConstant.QUERY_CHECKITEM_FAIL);}}STEP01(2)实现查询检查项控制器1.弹出带有检查项数据的编辑检查项对话框任务实现在health_interface子模块的CheckItemService接口中定义findById()方法，用于根据检查项id查询检查项。//根据检查项id查询检查项publicCheckItemfindById(Integerid);STEP01(3)创建查询检查项服务1.弹出带有检查项数据的编辑检查项对话框任务实现在health_service_provider子模块的CheckItemServiceImpl类重写CheckItemService接口的findById()方法，用于根据检查项id查询检查项。//根据检查项id查询检查项@OverridepublicCheckItemfindById(Integerid){returncheckItemDao.findById(id);//调用持久层接口findById()}STEP01(4)实现查询检查项服务1.弹出带有检查项数据的编辑检查项对话框任务实现在health_service_provider子模块的CheckItemDao接口中定义findById()方法，用于根据检查项id查询检查项。//根据检查项id查询检查项publicCheckItemfindById(Integerid);STEP01(5)实现持久层查询检查项在health_service_provider子模块的CheckItemDao.xml映射文件中通过<select>标签映射查询语句，根据检查项id从数据库中查询检查项。<!--根据检查项id查询检查项--><selectid="findById"parameterType="int"resultType="com.itheima.pojo.CheckItem">SELECT*FROMt_checkitemWHERE

id=#{id}</select>1.弹出带有检查项数据的编辑检查项对话框任务实现依次启动ZooKeeper服务、health_service_provider和health_backend。在浏览器中访问http://localhost:82/pages/checkitem.html。STEP01(6)测试弹出带有检查项数据的对话框1.弹出带有检查项数据的编辑检查项对话框任务实现以项目编码为0004的检查项为例，测试编辑检查项。单击该检查项右侧的“编辑”按钮，弹出编辑检查项对话框。STEP01(6)测试弹出带有检查项数据的对话框1.弹出带有检查项数据的编辑检查项对话框任务实现为编辑检查项对话框中的“取消”和“确定”按钮绑定单击事件，并设置单击时要执行的操作。<divslot="footer"class="dialog-footer"><el-button@click="dialogFormVisible4Edit=false">取消</el-button><el-buttontype="primary"@click="handleEdit()">确定</el-button></div>STEP012.完成检查项的编辑(1)提交编辑检查项数据任务实现在页面中定义handleEdit()方法，用于提交编辑检查项数据。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});this.dialogFormVisible4Edit=false;//关闭编辑对话框

this.findPage();//分页查询}else{this.$message.error(res.data.message);//处理失败}});}else{this.$message.error("表单数据校验失败，请检查输入是否正确！");}});}STEP012.完成检查项的编辑(1)提交编辑检查项数据任务实现在health_backend子模块的CheckItemController类中定义edit()方法，用于处理编辑检查项的请求。@RequestMapping("/edit")publicResultedit(@RequestBodyCheckItemcheckItem){try{checkItemService.edit(checkItem);//调用服务接口edit()//调用服务接口成功，返回成功结果信息returnnewResult(true,MessageConstant.EDIT_CHECKITEM_SUCCESS);}catch(Exceptione){e.printStackTrace();//调用服务接口失败，返回失败结果信息returnnewResult(false,MessageConstant.EDIT_CHECKITEM_FAIL);}}STEP01(2)实现编辑检查项控制器2.完成检查项的编辑任务实现在health_interface子模块的CheckItemService接口中定义edit()方法，用于编辑检查项。//编辑检查项publicvoidedit(CheckItemcheckItem);STEP01(3)创建编辑检查项服务2.完成检查项的编辑任务实现在health_service_provider子模块的CheckItemServiceImpl类重写CheckItemService接口的edit()方法，用于编辑检查项。//编辑检查项@Overridepublicvoidedit(CheckItemcheckItem){checkItemDao.edit(checkItem);//调用持久层接口edit()}(4)实现编辑检查项服务2.完成检查项的编辑任务实现在health_service_provider子模块的CheckItemDao接口中定义edit()方法，用于编辑检查项。//编辑检查项publicvoidedit(CheckItemcheckItem);STEP01(5)实现持久层编辑检查项在CheckItemDao.xml映射文件中通过<update>标签映射更新语句以编辑检查项。<updateid="edit"parameterType="com.itheima.pojo.CheckItem">UPDATE

t_checkitem

<set><iftest="name!=null">name=#{name},</if>

省略t_checkitem表中的其他字段

</set>WHERE

id=#{id}</update>只有当<if>中传入的字段值不为空时，才会更新该字段，否则不更新。2.完成检查项的编辑任务实现依次启动Zookeeper服务、health_service_provider和health_backend。在浏览器中访问http://localhost:82/pages/checkitem.html。将“项目说明”的值修改为“测试收缩压”。STEP01(6)测试编辑检查项2.完成检查项的编辑任务实现提交编辑后的检查项数据，页面提示“编辑检查项成功”，并且项目编码为0004的数据中“项目说明”修改为了“测试收缩压”，这说明说明编辑检查项成功。STEP01(6)测试编辑检查项2.完成检查项的编辑删除检查项2-4任务描述每个检查项右侧都有一个“删除”按钮，单击“删除”按钮弹出确认删除提示对话框。单击提示对话框中的“确定”按钮即可提交删除检查项的请求。对于检查项列表中重复出现的、描述有误的检查项或者是过时的检查项，除了可以进行编辑外，还可以进行删除。任务分析（1）弹出提示对话框为checkitem.html页面的“删除”按钮绑定单击事件，在单击事件触发后弹出提示对话框。（2）提交删除检查项请求为提示对话框中的“确定”按钮绑定单击事件，在单击事件触发后提交要删除的检查项数据。（3）接收和处理检查项删除请求客户端发起删除检查项的请求后，由CheckItemController类的delete()方法接收页面提交的请求，并调用CheckItemService接口的delete()方法删除检查项。任务分析（4）删除检查项数据在CheckItemServiceImpl类重写CheckItemService接口的delete()方法，在方法中调用CheckItemDao接口的selectCountByCheckItemId()方法，用于从数据库中查询要删除的检查项是否被检查组引用，如果没有被引用，调用CheckItemDao接口的delete()方法用于从数据库中删除指定的检查项。（5）提示删除检查项的结果checkitem.html页面根据返回结果提示删除成功或失败的信息。任务分析删除检查项的实现过程任务实现在checkitem.html页面中定义handleDelete()方法，用于弹出提示对话框，提交删除检查项的请求。handleDelete(row){

this.$confirm('你确定要删除当前数据吗？','提示',{confirmButtonText:'确定',cancelButtonText:'取消',type:'warning'}).then(()=>{axios.get("/checkitem/delete.do?id="+row.id).then((res)=>{if(res.data.flag){//处理成功this.$message({type:'success',message:res.data.message});

this.findPage();}else{this.$message.error(res.data.messa