商品列表展现

一、商品列表展现的页面分析

<table class="easyui-datagrid" id="itemList" title="商品列表" 
       data-options="singleSelect:false,fitColumns:true,collapsible:true,pagination:true,url:'/item/query',
method:'get',pageSize:20,toolbar:toolbar">
    <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,align:'center',formatter:KindEditorUtil.findItemCatName">叶子类目</th>
            <th data-options="field:'sellPoint',width:100">卖点</th>
            <th data-options="field:'price',width:70,align:'right',formatter:KindEditorUtil.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:KindEditorUtil.formatItemStatus">状态</th>
            <th data-options="field:'created',width:130,align:'center',formatter:KindEditorUtil.formatDateTime">创建日期</th>
            <th data-options="field:'updated',width:130,align:'center',formatter:KindEditorUtil.formatDateTime">更新日期</th>
        </tr>
    </thead>
</table>

二、URL检查

        当EasyUI中添加分页插件之后,可以自动的实现参数的拼接.

 

 三、编辑ItemController

/**
 * 实现商品的业务逻辑
 */
@RestController
@RequestMapping("/item")
public class ItemController {
	
	@Autowired
	private ItemService itemService;
	
	/**
	 * 关于SpringMVC页面取值复习.
	 * 1.页面标签
	 * 	 <input  name="page" value="1"  />
	 * 	 <input  name="rows" value="20"  />  提交request对象
	 * 2.SpringMVC底层DispatcherServlet.底层实现依然采用servlet的方式动态的获取
	 * 	 数据.可以利用request对象的方式获取数据.
	 * 	request.getParameter("xxx");
	 *  传参说明: 用户传递参数之后,服务器取数据时,按照指定的要求获取数据.如果key不同,
	 *  那么获取到的数据为null.而不报错.
	 *  规则:SpringMVC中参数的名字,必然和页面中的name属性相同.
	 * 3.SpringMVC将上述操作简化. 并且可以自动的实现数据类型的切换
	 * @param page
	 * @param rows
	 * @return
	 */
	@RequestMapping("/query")   //?page=1&rows=20 get请求
	public EasyUITable findItemByPage(Integer page,Integer rows) {
		return itemService.findItemByPage(page,rows);
	}		
}

四、编辑ItemService

@Service
public class ItemServiceImpl implements ItemService {
	
	@Autowired
	private ItemMapper itemMapper;

	/**
	 * 分页查询数据
	 */
	@Override
	public EasyUITable findItemByPage(Integer page, Integer rows) {
		
		//1.手写分页
		int total = itemMapper.selectCount(null);	//查询总记录数
		
		/**
		 * sql:
		 * 		select * from tb_item limit 起始位置,查询记录数     每页20条
		 * 	第一页:
		 * 		select * from tb_item limit 0,20;   index:0-19 第21条没有取
		 *      第二页:
		 *      select * from tb_item limit 20,20;   
		 *      第三页  
		 *      select * from tb_item limit 40,20;
		 *      第N页
		 *      select * from tb_item limit (page-1)rows,rows;
		 */
		int start = (page - 1) * rows;	//定义起始位置
		List<Item> itemList = itemMapper.findItemByPage(start,rows);
		return new EasyUITable(total, itemList);
	}
}

五、编辑ItemMapper接口

public interface ItemMapper extends BaseMapper<Item>{	
	/**
	 * 高版本中可以省略@Param注解,参数名称必须一致.
	 * @param start
	 * @param rows
	 * @return
	 */
	List<Item> findItemByPage(int start,Integer rows);
}

六、编辑ItemMapper.xml

    <select id="findItemByPage" resultType="com.jd.pojo.Item">
		select * from tb_item order by updated desc limit #{start},#{rows}
	</select>