EasyUI實現帶搜索框的列表頁面(二)——後臺實現

此篇接上一篇,繼續完成後臺功能的實現,後臺是基於SSM框架進行功能實現的:前端

基本思路

  1. 引入EasyUI資源
  2. Datagrid組件實現初始化列表分頁數據加載
  3. 用form將搜索條件收集後轉成json對象,向後臺發送請求從新加載數據
  4. 後臺Controller層:定義搜索條件pojo類對請求數據進行封裝接收
  5. 後臺Service層:調用mapper查詢數據和總數,封裝成結果對象返回
  6. 後臺Mapper層:根據查詢條件對象進行數據查詢、查詢數據總數

具體實現

後臺實現:

1 定義搜索條件pojo類和結果集

根據前端搜索的條件表單,定義對應的搜索條件pojo類:
此處我用了Lombok來編譯pojo類,避免手工敲getter、setter和構造器java

@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兩個字段json

@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接口:mybatis

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

實現類:app

@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配置文件:ide

<?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實現帶搜索框的列表頁面的先後端功能即已所有實現,主要代碼也列出。spa

相關文章
相關標籤/搜索