springmvc 之 easyUI开发商城管理系统

1.分页

 

　　url:controller的路径

　　pageSize:每页显示的行数 ---后台参数名(rows)

　　会向后台传递一个 page参数,表示当前页.---后台参数名(page)

　　controller中:

　　

	@RequestMapping("/list")
	@ResponseBody
	public EasyUIPageItem itemPage(int page,int rows) {
		 
		EasyUIPageItem myEasyUIPageItem = itemService.listByPage(page,rows);
		return myEasyUIPageItem;
	}

　　

　　后台接收两个参数 返回一个实体类为(变量名必须为total,和rows)

　　class EasyUIPageItem{

　　　　long total;

　　　　list<?> rows;

 　　　　get...

　　　　set...

　　　　}

　　的json对象

　　前端table代码如下

<thead>
        <tr>
        	<th data-options="field:'ck',checkbox:true"></th>
        	<th data-options="field:'id',width:60">商品ID</th>
            <th data-options="field:'title',width:200">商品标题</th>
            <th data-options="field:'cid',width:100">叶子类目</th>
            <th data-options="field:'sellPoint',width:100">卖点</th>
            <th data-options="field:'price',width:70,align:'right',formatter:TAOTAO.formatPrice">价格</th>
            <th data-options="field:'num',width:70,align:'right'">库存数量</th>
            <th data-options="field:'barcode',width:100">条形码</th>
            <th data-options="field:'status',width:60,align:'center',formatter:TAOTAO.formatItemStatus">状态</th>
            <th data-options="field:'created',width:130,align:'center',formatter:TAOTAO.formatDateTime">创建日期</th>
            <th data-options="field:'updated',width:130,align:'center',formatter:TAOTAO.formatDateTime">更新日期</th>
        </tr>
    </thead>

　2.树状类别显示

 

　　在js中找selectItemCat的jQuery方法如下:

　　

 initItemCat : function(data){
        $(".selectItemCat").each(function(i,e){
            var _ele = $(e);
            if(data && data.cid){
                _ele.after("<span style='margin-left:10px;'>"+data.cid+"</span>");
            }else{
                _ele.after("<span style='margin-left:10px;'></span>");
            }
            _ele.unbind('click').click(function(){
                $("<div>").css({padding:"5px"}).html("<ul>")
                .window({
                    width:'500',
                    height:"450",
                    modal:true,
                    closed:true,
                    iconCls:'icon-save',
                    title:'选择类目',
                    onOpen : function(){
                        var _win = this;
                        $("ul",_win).tree({
                            url:'/item/cat/list',//请求的参数名为 id 
                            animate:true, //      text id   isLeaf的值为state:判断节点状态 分别为open或closed
                            onClick : function(node){
                                if($(this).tree("isLeaf",node.target)){
                                    // 填写到cid中
                                    _ele.parent().find("[name=cid]").val(node.id);
                                    _ele.next().text(node.text).attr("cid",node.id);
                                    $(_win).window('close');
                                    if(data && data.fun){
                                        data.fun.call(this,node);
                                    }
                                }
                            }
                        });
                    },
                    onClose : function(){
                        $(this).window("destroy");
                    }
                }).window('open');
            });
        });
    },
    

　　此方法会请求一个url:/item/cat/list

　　请求的参数为:id

　　后台接收一个参数 返回一个实体类为(变量名必须为id,text.state且state必须为"closed"或"open")

　　class EasyUIPageItem{　　

　　　private long id;
　　　private String text;
　　　private String state;

 　　   get...

　　　set...

　　　　}

　　的list集合并使用@ResponsBody转换为json对象

　　controller为:

        @RequestMapping("item/cat/list")
	@ResponseBody
	public List<EasyUIItemCat> catlist(@RequestParam(value="id",defaultValue="0")Long itemCatId) {
		return 	itemCatService.findItemCat(itemCatId);
	} 

　　zookeeper中上传的服务为:

　　

        @Override
	public List<EasyUIItemCat> findItemCat(Long itemCatId) {
		// TODO Auto-generated method stub
		List<EasyUIItemCat> list = new ArrayList<>();
		TbItemCatExample example = new TbItemCatExample();
		Criteria criteria = example.createCriteria();
		criteria.andParentIdEqualTo(itemCatId);
		List<TbItemCat> itemCats = itemCatMapper.selectByExample(example);
		
		for(TbItemCat itemCat:itemCats)
		{
			EasyUIItemCat easycat = new EasyUIItemCat();
			easycat.setId(itemCat.getId());
			easycat.setText(itemCat.getName());
			easycat.setState(itemCat.getIsParent()?"closed":"open");
			
			list.add(easycat);
		}
		
		return list;
	}