品牌管理(增删改查)
1. 分页查询
关于分页查询,我们主要用到了两个插件,一个是后台的pageHepler,一个是前台的pagination;对于pageHepler来说很好理解,就是一个封装了一些分页方法的工具类,我们在使用时,在执行dao层的方法之前,new一个pageHepler对象,用它里面的一个startPage方法,里面传入的是当前页码和每页显示的记录数(这两个数据是前台传给后台的),然后我们就执行dao层的方法,需要注意的是我们需要一个强转:把查询结果强转成Page<TbBrand>对象,这样一来后台的分页代码就完成了;
接着是前台使用的pagination插件,之前我们在前台处理分页都是用异步请求来获取一个对象,然后在对象中获取我们想要的数据,来完成分页的展示;而现在我们有了这个插件所有的活都交给它了,我们只需要在js代码中引入它,然后给它需要的参数,它就会帮我们完成分页.所以我们在前台首先要做的就是引入pagination组件,注意还要引入样式;接着就需要配paginationConf分页控件,在这之前我们要在表格后面引入paginationConf:<tm-pagination conf="paginationConf"></tm-pagination>,在配置分页控件时,特别注意的就是onChage这个属性,这个就是我们能通过perPageOptions属性来控制每页显示多少条记录,所以当我们修改时就要重新加载页面,由于我们在开始配置的当前页数和总记录数(开始是随便定义的,所以一定要传入)是可能改变的(每页显示的条数,控件能自己获取控制),所以重新加载时,我们要用findByPage的方法:传入前页码和总记录数(当然我们可以把这个重新加载的方法提取出来,方便以后使用);然后就是定义分页方法了,定义分页方法也没什么可说的,唯一要注意的就是,我们在获取到响应数据后,这个数据是map集合形式存在的,里面是记录数据的集合和总的记录数(int类型),所以在取数据时,$scope.list取的是数据对象中的记录数据集合,$scope.paginationConf.totalItems取得是总记录数(这里就是重新给totalItems赋值);还有一点:如果我们之前做了查询所有的操作,记得把初始化方法去掉;这样我们就完成了分页查询展示
2. 新建品牌
关于新增数据,后台代码很容易,这里就不做过多的陈述,唯一注意的就是我们在controller中在接收参数时要用 @Requestbody把json转成对象;我们在前台需要做的就是定义一个保存数据的方法(就是把前台的新建的数据发送给后台),然后就是把这个方法通过ng-click绑定给新建按钮,通过ng-model把编辑窗口的属性值传递给$scope,还有就是为了下一次新建不会显示上一次的数据,我们在新建按钮上绑定了一个ng-click='entity={}',这样就完成了新增品牌
为了不让添加的数据重复,我们可以增加一个findByName的方法,再执行添加方法之前,进行判断:判断根据这个对象的名字查询的品牌对象是不是为null,为null可以添加,不为null提示用户已经存在了(再这之前最好再加上非空判断,看看传进来的对象是不是有name和firstChar值,没有就提示用户)
3. 修改
修改相对于麻烦一点,麻烦就在于它是要发起两次请求:一次是我们点击修改按钮,需要后台查询数据,把数据展示在编辑窗口;还有一次就是我们修改结束,点击保存会把修改数据保存起来.所以我们后台应该有两个方法,一个是根据id(唯一主键)查询品修改数据;另一个就是修改的方法
前台首先需要在修改按钮上绑定一个findOne的方法(这个方法需要传入id),这样点击修改就会把数据展示在编辑窗口;
最后就是把数据把存在保存起来了,这里用了一个投巧的方法,就是我们的新建也是要用保存方法(前台的保存),也是因为保存按钮只能绑定一个方法.所以我们在保存方法中,先判断传入的对象的id是不是空的(因为id自增的,新建不用传id),如果不是空的就用后台的update方法,是空的就用后台的save方法;这样修改就完成了
4. 删除
删除后台的代码是很简单的,就不说了;
前台麻烦的就在于处理input选择框:定义updateSelection方法,这个方法倒是好写,但是要处理input的选中和取消选中.我们要的效果是选中时id会被传入,取消时就会把对应的id取出来;所以我们首先定义了一个数组,然后通过$event(input复选框的源)的target(就是获取的input)可以获取整个input的属性,然后把checked(是否选中)判断一下,如果选中就把id(复选框绑定方法时需要传入)通过push加载数组中;没有选中或者是取消了选中,我们能确定的是这个id是在数组中的,所以首先用indexOf确定它的索引位置,再用splice(有两个参数,一个是要删除的元素位置,第二个是从这个元素起要删除几个,我们只需要删除一个就设置为1)方法把这个id移除,这样就达到了我们想要的效果;然后就定义删除方法就OK了
出于代码的严谨性,我们想在用户选中品牌,点击删除按钮时,弹出提示框,提示用户要删除品牌的名字,询问是不是要删除,点击确定删除,取消不删除:这个功能的实行首先需要我们在input框绑定updateSelection方法时把品牌的名字一起穿过来,注意要在updateSelection方法里面加上,name的数组的赋值与删除取消的name;然后就是在删除方法里面,逻辑还没执行就用confirm提示用户是不是删除name数组里面的品牌,confirm返回的是一个boolean值.所以我们就可以根据这个boolean值做判断,是true表示确定删除,执行删除方法,是false就什么都不做就行了
5. 根据条件查询
根据条件查询就是在分页查询的基础上加上了查询条件,需要注意的就是我们在后台用到了代码生成器中的Example,它的使用要注意一下;还有就是在添加条件之前先判断一下name和first是不是空的,这样可以防止空指针,是空的就还不用添加这个条件了
前台唯一注意的就是要修改我们提取的刷新页面的方法,把它调用的findOne方法换成search方法
