品优购:条件查询后分页显示

开发环境:idea,ssm,maven,angularjs

需求:实现品牌条件查询功能，输入品牌名称、首字母后查询，并分页。

先自定义pojo类 PageResult

package entity;

import java.io.Serializable;
import java.util.List;

/**
 * 分页结果封装对象
 */
public class PageResult implements Serializable {
    private Long total;//总记录数
    private List rows;//当前页结果

    public PageResult(Long total, List rows) {
        this.total = total;
        this.rows = rows;
    }

    public Long getTotal() {
        return total;
    }

    public void setTotal(Long total) {
        this.total = total;
    }

    public List getRows() {
        return rows;
    }

    public void setRows(List rows) {
        this.rows = rows;
    }
}

后端代码 服务接口层

在pinyougou-sellergoods-interface工程的BrandService.java方法增加方法定义

/**
     * 品牌分页
     * @param pageNum 当前页面
     * @param pageSize 每页记录数
     * @return
     */
    public PageResult findPage(TbBrand brand, int pageNum, int pageSize );
}

服务实现层

在pinyougou-sellergoods-service工程BrandServiceImpl.java实现该方法

 //查询
    @Override
    public PageResult findPage(TbBrand brand, int pageNum, int pageSize) {

        PageHelper.startPage(pageNum,pageSize);
        TbBrandExample example = new TbBrandExample();
        TbBrandExample.Criteria criteria = example.createCriteria();
        if(brand!=null){
            if(brand.getName()!=null&&brand.getName().length()>0){
                criteria.andNameLike("%"+brand.getName()+"%");
            }
            if(brand.getFirstChar()!=null&&brand.getFirstChar().length()>0){
                criteria.andFirstCharLike("%"+brand.getFirstChar()+"%");
            }
        }

        Page<TbBrand> page = (Page<TbBrand>) tbBrandMapper.selectByExample(example);

        return new PageResult(page.getTotal(),page.getResult());
    }

控制层

在pinyougou-manager-web的BrandController.java增加方法

 //查询
    @RequestMapping("/search")
    public PageResult search(@RequestBody TbBrand brand,int page, int size){
        return brandService.findPage(brand,page,size);
    }

前端代码

修改pinyougou-manager-web的 添加查询按钮,定义ng-click=”reloadLIst()”

<div class="has-feedback">
       品牌名称:<input ng-model="searchEntity.name">
       品牌首字母:<input ng-model="searchEntity.firstChar">
       <button class="btn btn-default" ng-click="reloadList()">查询</button>
</div>

在javascript定义search方法,通过reloadlist()达到搜索刷新页面的效果

<script type="text/javascript">

        var app = angular.module("pinyougou", ['pagination']);//定义品优购模块

        app.controller("brandController", function ($scope, $http) { 
//重新加载列表数据
            $scope.reloadList = function () {
                //切换页码
                $scope.search($scope.paginationConf.currentPage, $scope.paginationConf.itemsPerPage);
            }

$scope.searchEntity = {};//定义搜索对象
            //条件查询
            $scope.search = function (page, size) {
                $http.post('../brand/search.do?page=' + page + '&size=' + size, $scope.searchEntity).success(
                    function (response) {
                        $scope.list = response.rows;//显示当前页数据
                        $scope.paginationConf.totalItems = response.total;//更新总记录数
                    });
                }
            });
</script>