商品分类目录数据结构分析

商品分类目录数据结构分析
说明:一般电商网站的商品分类信息,都是3级标题.
划分: 1级标题-2级标题-3级标题 标题是有所属关系的

/1.查询一级商品分类信息/
SELECT * FROM tb_item_cat WHERE parent_id = 0
/2.查询二级商品分类信息/
SELECT * FROM tb_item_cat WHERE parent_id = 1
/3.查询三级商品分类信息/
SELECT * FROM tb_item_cat WHERE parent_id = 24

EasyUI中树形结构说明
树形结构页面JS

$("#tree").tree({
			url:"tree.json",		//加载远程JSON数据
			method:"get",			//请求方式  POST
			animate:true,			//表示显示折叠端口动画效果
			checkbox:true,			//表述复选框
			lines:false,				//表示显示连接线
			dnd:true,				//是否拖拽
			onClick:function(node){	//添加点击事件
				
				//控制台
				console.info(node);
			}
		});

树形JSON串数据结构类型
[{“id”:“3”,“text”:“吃鸡游戏”,“state”:“closed/open”}]

树形结构的VO对象-EasyUITree

@Data
@Accessors(chain = true)
@NoArgsConstructor
@AllArgsConstructor
public class EasyUITree implements Serializable{

private static final long serialVersionUID = 1L;
//如果对象涉及到网络传输   就必须序列号和反序列化.

//{"id":"3","text":"吃鸡游戏","state":"closed/open"}
private Long id;		//数据库中的类型是Long 
private String text;	//定义节点名称
private String state;	//控制节点打开/关闭

}

编辑ItemCatController

/**
* 业务需求: 查询一级商品分类信息
* Sql语句: SELECT * FROM tb_item_cat WHERE parent_id = 0
* url地址: /item/cat/list
* 返回值: List
*/
@RequestMapping("/list")
public List findItemCatList(){

	Long parentId = 0L;  //根据parentId=0 查询一级商品分类信息
	return itemCatService.findItemCatListByParentId(parentId);
}

编辑ItemCatService

/**
* 据接口添加实现类的方法
* 业务思路:
* 1.用户传递的数据parentId
* 2.可以查询List数据库对象信息.
* 3.动态的将ItemCat对象转化为EasyUITree对象
* 3.但是返回值要求 返回List
*/

public List<EasyUITree> findItemCatListByParentId(Long parentId){
	QueryWrapper<ItemCat> queryWrapper = new QueryWrapper<>();
	queryWrapper.eq("parent_id",parentId);
	List<ItemCat> itemCatList = itemCatMapper.selectList(queryWrapper);
	List<EasyUITree> treeList = new ArrayList<>();  //先准备一个空集合.
	//需要将数据一个一个的格式转化.
	for(ItemCat itemcat :itemCatList){
		Long id = itemcat.getId();	//获取ID
		String text = itemcat.getName();	//获取文本
		//如果是父级,则默认应该处于关闭状态 closed, 如果不是父级 则应该处于打开状态. open
		String state = itemcat.getIsParent()?"closed":"open";
		//利用构造方法 为VO对象赋值  至此已经实现了数据的转化
		EasyUITree tree = new EasyUITree(id,text,state);
		treeList.add(tree);
	}

	//用户需要返回List<EasyUITree>
	return treeList;
}

树形控件的加载规则
树控件读取URL。子节点的加载依赖于父节点的状态。当展开一个封闭的节点,如果节点没有加载子节点,它将会把节点id的值作为http请求参数并命名为’id’,通过URL发送到服务器上面检索子节点。

前提条件: 1.这棵树必须初始化完成.
2.当点击节点按钮时,才会发起id的请求

当点击查询子级目录时,会传递当前节点的ID.

动态获取商品分类的ID
/**
* 业务需求: 查询一级商品分类信息
* Sql语句: SELECT * FROM tb_item_cat WHERE parent_id = 0
* url地址: /item/cat/list
* 返回值: List
*
* 实现异步树加载: id: xxxx
* 说明: 当展开一个封闭的节点,才会发起id的参数请求.前提条件是树必须先初始化.
* 应该先展现一级商品分类信息.
* 判断依据: id是否为null.如果为null则表示第一次查询 需要初始化ID 查询一级商品分类目录
*/
@RequestMapping("/list")
public List findItemCatList(Long id){

	Long parentId = (id==null?0L:id);  //根据parentId=0 查询一级商品分类信息
	return itemCatService.findItemCatListByParentId(parentId);
}
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值