【淘淘】---选择类目

左手的ㄟ右手 2022-06-13 08:44 176阅读 0赞

【淘淘】---选择类目

# 1 需求分析： #

分析“选择类目”按钮，接下来结果，要达到的目的是显示出类目清单，选择之后商品类目确定。  
   
![Center][]  
  
  
![Center 1][]

# 2 设计分析 #

商品类目使用的表：tb\_item\_cat  
初始化类目选择：  
 ![Center 2][]

**扫盲**：什么是模态？就是一个窗口弹出来，你不解决或关闭，这窗口后面的东西你不能再点击。

modal:true

Easyui的异步tree控件：  
 ![Center 3][]  
  
  
（1）请求的url：/item/cat/list

（2）请求的参数：id（当前节点的id）

（3）响应的结果：json数据。  
\[\{      
    "id": 1,      
    "text": "Node 1",      
"state": "closed"  
 \}  
\{      
    "id": 2,      
    "text": "Node 2",      
"state": "closed"  
 \}  
\]

如果当前节点为父节点，state应为“closed”、如果是叶子节点“open”

# 3 代码实现 #

## 3.1 Dao层 ##

查询tb\_item\_cat表，根据id查询商品分类列表，可以使用逆向工程。

## 3.2 Service层 ##

### 3.2.1 分析 ###

接收参数parentId，根据parentId查询分类列表，返回pojo实体列表。  
Pojo应该包含三个属性：id、text、state

建立实体：应该放到taotao-common工程中。  
 ![Center 4][]

public class EasyUITreeNode {
    
    
    	private long id;
    	private String text;
    	private String state;
    
    	 public long getId() {
    		return id;
    	}
    	public void setId(long id) {
    		this.id = id;
    	}
    	public String getText() {
    		return text;
    	}
    	public void setText(String text) {
    		this.text = text;
    	}
    	public String getState() {
    		return state;
    	}
    	public void setState(String state) {
    		this.state = state;
    	}	
    }

### 3.2.2 service实现 ###

新建接口：ItemCatService

package com.taotao.service;
    import java.util.List;
    import com.taotao.common.pojo.EasyUITreeNode;
    
    
    public interface ItemCatService {
    	List<EasyUITreeNode> getItemCatList(long parentId);
    }

## 3.3 Controller ##

接收参数，parentId。调用Service查询分类类别，返回列表（json数据），需要使用@ResponseBody。  
请求的url：/item/cat/list  
新建一个ItemCatController

package com.taotao.controller;
    import java.util.List;
    
    
    import org.springframework.beans.factory.annotation.Autowired;
    import org.springframework.stereotype.Controller;
    import org.springframework.web.bind.annotation.RequestMapping;
    import org.springframework.web.bind.annotation.RequestParam;
    import org.springframework.web.bind.annotation.ResponseBody;
    
    
    import com.taotao.common.pojo.EasyUITreeNode;
    import com.taotao.service.ItemCatService;
    /**
     * 商品分类管理---选择类目
     *@author Daniel
     *@date: 2017年6月29日下午3:19:33
     */
    @Controller
    @RequestMapping("/item/cat")
    public class ItemCatController {
    
    
    	@Autowired
    	private ItemCatService itemCatService;
    
    
    	// 商品类目选择。2017-6-28 16:24:32
    	@RequestMapping("/list") 
    	@ResponseBody
    	public List<EasyUITreeNode> getItemCatList(//参数是一个长整型，id没有值就给一个默认值0
    			@RequestParam(value = "id", defaultValue = "0") Long parentId) {
    		
    		List<EasyUITreeNode> list = itemCatService.getItemCatList(parentId);
    		
    		return list;
    	}
    }

# 4 显示效果： #

![Center 5][]

![Image 1][]

# 5，小结 #

分析出所需要的响应数据、属性，接下来就非常快了，Dao 层直接用mybatis逆向工程生成；在显示层要进行分页处理，id、text,state就新创建一个实体pojo，必须包含id、text,state三个属性，后面一条线service、serviceImpl和controller就非常的顺利了。  
  
     要注意的是，商品选择类目这里的参数是一个长整型，id没有知道就应该给一个默认的值0.

[Center]: /images/20220613/81e942ba45044cfbb0f98dbfffec854f.png
[Center 1]: /images/20220613/58f2203b211d4c7fb77f8386ab027b03.png
[Center 2]: /images/20220613/425afc7502024a1ca0321327849acfbe.png
[Center 3]: /images/20220613/43b0fe89f88d4d1f884f48c2dc8bfdc8.png
[Center 4]: /images/20220613/6bc254e8584e42dca647ce2491da6171.png
[Center 5]: /images/20220613/3e443757164b4067a8af132ce5ecf54e.png
[Image 1]: