【郑州校区】传智健康项目讲义第三章 五

3.2 后台代码
3.2.1 Controller
在CheckGroupController中增加分页查询方法

[AppleScript] 纯文本查看 复制代码

//分页查询
@RequestMapping("/findPage")
public PageResult findPage(@RequestBody QueryPageBean queryPageBean){
PageResult pageResult = checkGroupService.pageQuery(
queryPageBean.getCurrentPage(),
queryPageBean.getPageSize(),
queryPageBean.getQueryString()
);
return pageResult;
} 

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

[AppleScript] 纯文本查看 复制代码

public PageResult pageQuery(Integer currentPage, Integer pageSize, String
queryString); 

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

[AppleScript] 纯文本查看 复制代码

public PageResult pageQuery(Integer currentPage, Integer pageSize, String
queryString) {
PageHelper.startPage(currentPage,pageSize);
Page<CheckItem> page = checkGroupDao.selectByCondition(queryString);
return new PageResult(page.getTotal(),page.getResult());
} 

3.2.4 Dao接口
在CheckGroupDao接口中扩展分页查询方法

[AppleScript] 纯文本查看 复制代码

public Page<CheckGroup> selectByCondition(String queryString); 

3.2.5 Mapper映射文件
在CheckGroupDao.xml文件中增加SQL定义

[AppleScript] 纯文本查看 复制代码

<select id="selectByCondition" parameterType="string"
resultType="com.itheima.pojo.CheckGroup">
select * from t_checkgroup
<if test="value != null and value.length > 0">
where code = #{value} or name = #{value} or helpCode = #{value}
</if>
</select> 

4. 编辑检查组
4.1 完善页面用户点击编辑按钮时，需要弹出编辑窗口并且将当前记录的数据进行回显，用户修改完成后点击确定按钮将修改后的数据提交到后台进行数据库操作。此处进行数据回显的时候，除了需要检查组基本信息的回显之外，还需要回显当前检查组包含的检查项（以复
选框勾选的形式回显）。
4.1.1 绑定单击事件
需要为编辑按钮绑定单击事件，并且将当前行数据作为参数传递给处理函数

[AppleScript] 纯文本查看 复制代码

<el‐button type="primary" size="mini" @click="handleUpdate(scope.row)">编
辑</el‐button>

[AppleScript] 纯文本查看 复制代码

handleUpdate(row) {
alert(row);
} 

4.1.2 弹出编辑窗口回显数据
当前页面的编辑窗口已经提供好了，默认处于隐藏状态。在handleUpdate方法中需要将编辑窗口展示出来，并且需要发送多个ajax请求分别查询当前检查组数据、所有检查项数据、当前检查组包含的检查项id用于基本数据回显

[AppleScript] 纯文本查看 复制代码

handleUpdate(row) {
//发送ajax请求根据id查询检查组信息，用于基本信息回显
axios.get("/checkgroup/findById.do?id=" + row.id).then((res)=>{
if(res.data.flag){
//弹出编辑窗口
this.dialogFormVisible4Edit = true;
//默认选中第一个标签页
this.activeName='first';
//为模型数据赋值，通过VUE数据双向绑定进行信息的回显
this.formData = res.data.data;
//发送ajax请求查询所有的检查项信息，用于检查项表格展示
axios.get("/checkitem/findAll.do").then((res)=> {
if(res.data.flag){
//为模型数据赋值，通过VUE数据双向绑定进行信息的回显
this.tableData = res.data.data;
//查询当前检查组包含的所有检查项id，用于页面回显
axios.get("/checkgroup/findCheckItemIdsByCheckGroupId.do?id=" +
row.id).then((res)=> {
//为模型数据赋值，通过VUE数据双向绑定进行信息的回显
if(res.data.flag){
this.checkitemIds = res.data.data;
}else{
this.$message.error(res.data.message);
}
});
}else{
this.$message.error(res.data.message);
}
});
}else{
this.$message.error("获取数据失败，请刷新当前页面");
}
});
} 

【郑州校区】传智健康项目讲义第三章 五

3.2 后台代码
3.2.1 Controller
在CheckGroupController中增加分页查询方法

[AppleScript] 纯文本查看 复制代码

//分页查询
@RequestMapping("/findPage")
public PageResult findPage(@RequestBody QueryPageBean queryPageBean){
PageResult pageResult = checkGroupService.pageQuery(
queryPageBean.getCurrentPage(),
queryPageBean.getPageSize(),
queryPageBean.getQueryString()
);
return pageResult;
} 

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

[AppleScript] 纯文本查看 复制代码

public PageResult pageQuery(Integer currentPage, Integer pageSize, String
queryString); 

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

[AppleScript] 纯文本查看 复制代码

public PageResult pageQuery(Integer currentPage, Integer pageSize, String
queryString) {
PageHelper.startPage(currentPage,pageSize);
Page<CheckItem> page = checkGroupDao.selectByCondition(queryString);
return new PageResult(page.getTotal(),page.getResult());
} 

3.2.4 Dao接口
在CheckGroupDao接口中扩展分页查询方法

[AppleScript] 纯文本查看 复制代码

public Page<CheckGroup> selectByCondition(String queryString); 

3.2.5 Mapper映射文件
在CheckGroupDao.xml文件中增加SQL定义

[AppleScript] 纯文本查看 复制代码

<select id="selectByCondition" parameterType="string"
resultType="com.itheima.pojo.CheckGroup">
select * from t_checkgroup
<if test="value != null and value.length > 0">
where code = #{value} or name = #{value} or helpCode = #{value}
</if>
</select> 

4. 编辑检查组
4.1 完善页面用户点击编辑按钮时，需要弹出编辑窗口并且将当前记录的数据进行回显，用户修改完成后点击确定按钮将修改后的数据提交到后台进行数据库操作。此处进行数据回显的时候，除了需要检查组基本信息的回显之外，还需要回显当前检查组包含的检查项（以复
选框勾选的形式回显）。
4.1.1 绑定单击事件
需要为编辑按钮绑定单击事件，并且将当前行数据作为参数传递给处理函数

[AppleScript] 纯文本查看 复制代码

<el‐button type="primary" size="mini" @click="handleUpdate(scope.row)">编
辑</el‐button>

[AppleScript] 纯文本查看 复制代码

handleUpdate(row) {
alert(row);
} 

4.1.2 弹出编辑窗口回显数据
当前页面的编辑窗口已经提供好了，默认处于隐藏状态。在handleUpdate方法中需要将编辑窗口展示出来，并且需要发送多个ajax请求分别查询当前检查组数据、所有检查项数据、当前检查组包含的检查项id用于基本数据回显

[AppleScript] 纯文本查看 复制代码

handleUpdate(row) {
//发送ajax请求根据id查询检查组信息，用于基本信息回显
axios.get("/checkgroup/findById.do?id=" + row.id).then((res)=>{
if(res.data.flag){
//弹出编辑窗口
this.dialogFormVisible4Edit = true;
//默认选中第一个标签页
this.activeName='first';
//为模型数据赋值，通过VUE数据双向绑定进行信息的回显
this.formData = res.data.data;
//发送ajax请求查询所有的检查项信息，用于检查项表格展示
axios.get("/checkitem/findAll.do").then((res)=> {
if(res.data.flag){
//为模型数据赋值，通过VUE数据双向绑定进行信息的回显
this.tableData = res.data.data;
//查询当前检查组包含的所有检查项id，用于页面回显
axios.get("/checkgroup/findCheckItemIdsByCheckGroupId.do?id=" +
row.id).then((res)=> {
//为模型数据赋值，通过VUE数据双向绑定进行信息的回显
if(res.data.flag){
this.checkitemIds = res.data.data;
}else{
this.$message.error(res.data.message);
}
});
}else{
this.$message.error(res.data.message);
}
});
}else{
this.$message.error("获取数据失败，请刷新当前页面");
}
});
}