EasyUI实现带搜索框的列表页面(二)——后台实现

此篇接上一篇,继续完成后台功能的实现,后台是基于SSM框架进行功能实现的:

基本思路

  1. 引入EasyUI资源
  2. Datagrid组件实现初始化列表分页数据加载
  3. 用form将搜索条件收集后转成json对象,向后台发送请求重新加载数据
  4. 后台Controller层:定义搜索条件pojo类对请求数据进行封装接收
  5. 后台Service层:调用mapper查询数据和总数,封装成结果对象返回
  6. 后台Mapper层:根据查询条件对象进行数据查询、查询数据总数

具体实现

后台实现:

1 定义搜索条件pojo类和结果集

根据前端搜索的条件表单,定义对应的搜索条件pojo类:
此处我用了Lombok来编译pojo类,避免手工敲getter、setter和构造器

@Data
@NoArgsConstructor
@AllArgsConstructor
public class HostSearchCondition {
    // page 和 rows 是easyUI默认带的参数
    private Integer page;
    private Integer rows;
    // 搜索条件
    private String hname;
    private String status;
    private String strong;
    private String hpstart;
    private Integer hpdiscount;
}

结果集:EasyUI的分页要求后台回传的json数据必须有rows和total两个字段

@Data
@AllArgsConstructor
@NoArgsConstructor
public class PageResult<T> {
    private List<T> rows;
    private Integer total;

}

2 Controller层

比较简单,就是利用条件搜索实体类进行数据的接收,并调用service层对象进行查找返回

@Controller
@RequestMapping("hostController")
public class HostController {

    @Autowired
    private HostService hostService;
    
    @RequestMapping("findHostPage")
    @ResponseBody
    public PageResult<Host> findHostPage(HostSearchCondition condition){
        return hostService.selectHosts(condition);
    }
    
}

3 Service层

service层:接收Controller层传来的数据后,调用mapper层对象查询数据并封装结果集回传
Service接口:

public interface HostService {
    public PageResult<Host> selectHosts(HostSearchCondition condition);
}

实现类:

@Service
public class HostServiceImpl implements HostService {
    @Autowired
    private HostMapper hostMapper;
    @Override
    public PageResult<Host> selectHosts(HostSearchCondition condition) {
        // 设置limit 起始数据
        int page = condition.getPage();
        int rows = condition.getRows();
        page = page*rows-rows;
        condition.setPage(page);
        // 调用mapper 进行数据查询
        List<Host> hosts = hostMapper.selectHosts(condition);
        Integer total = hostMapper.selectCountHosts(condition);
        PageResult<Host> pageResult = new PageResult<>();
        pageResult.setRows(hosts);
        pageResult.setTotal(total);
        return pageResult;
    }
}

4 Mapper层:

Mapper 接口:

public interface HostMapper {
    // 查询分页数据
    public List<Host> selectHosts(HostSearchCondition condition);
    // 查询统一条件下,数据总量
    public Integer selectCountHosts(HostSearchCondition condition);

}

由于涉及多表联查,不方便使用注解,需要使用xml配置文件:

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE mapper
        PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
        "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.gcp.mapper.HostMapper">
    <resultMap id="hostMap" type="com.gcp.pojo.Host">
        <result property="hid" column="hid" ></result>
        <result property="hname" column="hname" ></result>
        <result property="hpwd" column="hpwd" ></result>
        <result property="hphone" column="hphone" ></result>
        <result property="starttime" column="starttime" ></result>
        <result property="status" column="status" ></result>
        <result property="strong" column="strong" ></result>
        <result property="num" column="num" ></result>
        <association property="hostPower" javaType="com.gcp.pojo.HostPower">
            <result property="hpid" column="hpid"></result>
            <result property="hpstart" column="hpstart"></result>
            <result property="hpstartBeigindate" column="hpstart_beigindate"></result>
            <result property="hpstartEnddate" column="hpstart_enddate"></result>
            <result property="hpOrderPower" column="hp_order_power"></result>
            <result property="hpstartBegintime" column="hpstart_begintime"></result>
            <result property="hpstartEndtime" column="hpstart_endtime"></result>
            <result property="hpdiscount" column="hpdiscount"></result>
            <result property="hpDisStarttime" column="hp_dis_starttime"></result>
            <result property="hpDisEndtime" column="hp_dis_endtime"></result>
            <result property="hpprice" column="hpprice"></result>
            <result property="hcosts" column="hcosts"></result>
            <result property="hostid" column="hostid"></result>
        </association>
    </resultMap>
    <select id="selectHosts" resultMap="hostMap">
        select * from t_host h
        left join t_host_power p on h.hid = p.hostid

        <where>
            <if test="hname!='' and hname!=null">
                and h.hname like concat('%',#{hname},'%')
            </if>
            <if test="status!='' and status!=null">
                and h.status = #{status}
            </if>

            <if test="hpstart!='' and hpstart!=null">
                and p.hpstart = #{hpstart}
            </if>
            <if test="hpdiscount!='' and hpdiscount!=null">
                and p.hpdiscount = #{hpdiscount}
            </if>
        </where>
        <if test="strong!='' and strong!=null">
            order by h.strong ${strong}
        </if>
        limit #{page},#{rows}
    </select>
    <select id="selectCountHosts" resultType="int">
        select count(*) from t_host h
        left join t_host_power p on h.hid = p.hostid

        <where>
            <if test="hname!='' and hname!=null">
                and h.hname like concat('%',#{hname},'%')
            </if>
            <if test="status!='' and status!=null">
                and h.status = #{status}
            </if>

            <if test="hpstart!='' and hpstart!=null">
                and p.hpstart = #{hpstart}
            </if>
            <if test="hpdiscount!='' and hpdiscount!=null">
                and p.hpdiscount = #{hpdiscount}
            </if>
        </where>
    </select>
</mapper>

至此,EasyUI实现带搜索框的列表页面的前后端功能即已全部实现,主要代码也列出。

阅读 53

推荐阅读