（转）淘淘商城系列——内容分类管理
http://blog.csdn.net/yerenyuan_pku/article/details/72837691
通过上文的学习，我们已经学会搭建内容管理系统这个工程，本文我们就来学习如何进行内容分类管理。
展示内容分类
我们到后台管理页面看看关于内容管理的内容，如下图所示。 
我们再来看下content-category.jsp页面，这个页面就是内容分类页面，页面中的<ul id="contentCategory" class="easyui-tree">是用来展示内容分类树的，$(function(){...})是在页面加载完后要调用的js代码，下面这段代码是用来获取分类列表数据的，发起的url请求是/content/category/list。 
animate:true的意思是设置动画，如果设置为true，展开树形结构时是慢慢展开的效果；如果设置为false，展开树形结构就一下子展开了。method:"GET"指定发起的是GET请求。
接下来，我们来编写Service层的代码。首先在taotao-content-interface工程下的com.taotao.content.service包中新建一个接口——ContentCategoryService.java，并在接口中添加一个getContentCatList方法，如下图所示。
从中可以看出方法的返回值是EasyUITreeNode的集合，EasyUITreeNode类的内容如下所示。 
- id是树节点的id。
- text是节点的名称。
- state是指树形是闭合的还是打开的，如果当前节点还有子节点，那么state的值是”closed”，如果当前节点已经是叶子节点了，那么state的值是”open”。
下面我们来实现上面的接口，我们在taotao-content-service工程的com.taotao.content.service.impl包下新建一个ContentCategoryServiceImpl实现类，该类实现ContentCategoryService接口，如下图所示。 
为方便大家复制，将该实现类代码贴出，如下：
/**
* 内容分类管理服务
* <p>Title: ContentCategoryServiceImpl</p>
* <p>Description: </p>
* <p>Company: www.itcast.cn</p>
* @version 1.0
*/
@Service
public class ContentCategoryServiceImpl implements ContentCategoryService {
@Autowired
private TbContentCategoryMapper contentCategoryMapper;
@Override
public List<EasyUITreeNode> getContentCatList(long parentId) {
// 根据parentId查询子节点列表
TbContentCategoryExample example = new TbContentCategoryExample();
// 设置查询条件
Criteria criteria = example.createCriteria();
criteria.andParentIdEqualTo(parentId);
// 执行查询
List<TbContentCategory> list = contentCategoryMapper.selectByExample(example);
// 返回结果为List
List<EasyUITreeNode> resultList = new ArrayList<EasyUITreeNode>();
for (TbContentCategory tbContentCategory : list) {
EasyUITreeNode node = new EasyUITreeNode();
node.setId(tbContentCategory.getId());
node.setText(tbContentCategory.getName());
node.setState(tbContentCategory.getIsParent() ? "closed" : "open");
// 添加到列表
resultList.add(node);
}
return resultList;
}
}- 1
下面我们发布一下该服务的这个接口，我们在taotao-content-service工程的spring目录下的applicationContext-service.xml配置文件中添加如下配置：
<!-- 声明需要暴露的服务接口 -->
<dubbo:service interface="com.taotao.content.service.ContentCategoryService" ref="contentCategoryServiceImpl" timeout="300000" />
注意：dubbo服务向外暴露的端口应该由20880改为20881（每发布一个服务就要更改一个端口）。因为taotao-manager服务绑定的端口号是20880，现在我们又起了一个服务(taotao-content)，但是它们在同一台服务器上，同一台服务器上的一个端口只能被一个服务绑定。
然后我们再来编写表现层的代码。我们需要在taotao-manager-web工程中添加Controller类来实现内容分类展示，前提是我们需要先添加对taotao-content-interface的依赖，如下图所示。 
接着我们需要在taotao-manager-web工程的springmvc.xml配置文件中添加对ContentCategoryService的引用，即要向springmvc.xml配置文件中添加如下配置：
<dubbo:reference interface="com.taotao.content.service.ContentCategoryService" id="contentCategoryService" />- 1
- 1
下面我们在ContentCategoryController类中调用服务接口。@RequestMapping("/content/category/list")注解中的url是从content-category.jsp页面当中粘贴过来的。 
ContentCategoryController类的代码如下，这里需要注意的是，第一次查询内容分类的时候是没有参数的，因此需要指定一个默认值0，后续点击要展开某个节点的话，就会把该节点的id传过来了。
/**
* 内容分类管理Controller
* <p>Title: ContentCategoryController</p>
* <p>Description: </p>
* <p>Company: www.itcast.cn</p>
* @version 1.0
*/
@Controller
public class ContentCategoryController {
@Autowired
private ContentCategoryService contentCategoryService;
@RequestMapping("/content/category/list")
@ResponseBody
public List<EasyUITreeNode> getContentCatList(@RequestParam(defaultValue="0") Long id) {
return contentCategoryService.getContentCatList(id);
}
}- 1
在启动测试之前，我们需要先打包taotao-content到本地maven仓库。由于查询内容分类列表涉及到了taotao-manager和taotao-content这两个服务和taotao-manager-web，所以我们依次启动taotao-manager和taotao-content，然后是taotao-manager-web，启动好之后我们访问后台，如下图所示，发现可以正常显示内容分类列表了。 
新增节点
内容分类列表展示出来之后，我们下面要做的便是管理内容分类，比如增加、重命名、删除等操作，这些操作可以在某个节点上右键，在右键菜单中操作（当然，现在还没有实现这三个功能），如下图所示。 
右键菜单是在content-category.jsp页面的一个<div>中定义的，如下图所示。 
onContextMenu: function(e,node){：这行代码的意思是当我们鼠标点击右键的时候触发该js方法，方法的参数中e代表事件，node代表鼠标在当前哪个节点上。e.preventDefault();：代表事件传递。$(this).tree('select',node.target);：$(this)将指定鼠标所在的节点转变为jQuery对象，继而调用tree('select',node.target);方法，意思是选中这个节点（node这行会添加背景颜色）。整句代码的意思是当你点击右键菜单的时候，把当前节点变成可选择状态。$('#contentCategoryMenu').menu('show',{：这行代码的意思是让右键菜单显示出来，下面的left和top是指坐标。
接着我们分析一下对节点操作的流程。当我们点击右键菜单中的任何一个操作的时候，从下图中的data-options="onClick:menuHandler"可以得知会触发一个menuHandler方法。 
编写的menuHandler方法如下图所示。 
function menuHandler(item){：这行代码的意思是定义一个menuHandler方法，参数item是指右键菜单这个对象，下面通过item.name来判断用户选择的是哪个操作。var tree = $("#contentCategory");：这行代码的意思就是获取分类树。var node = tree.tree("getSelected");：这行代码是获取选中的节点。tree.tree('append', {：这行代码的意思是我们点击”添加”菜单项的时候将在这个节点下面追加一个节点，其中
parent: (node?node.target:null),：是为新节点指定父节点。- data里面的text是指新建的节点名称叫”新建分类”；
id:0表示新建的节点暂时定义节点的id为0；parentId:node.id是指新建节点的parentId是我们操作的节点的id。
var _node = tree.tree('find',0);：意思是在树中找到id为0的节点（由于新建的节点暂时定义id为0，因此会找到刚添加的节点）。tree.tree("select",_node.target).tree('beginEdit',_node.target);：这行代码的意思是让新建的节点处于可编辑状态。
我们从menuHandler方法中可以看到实际添加节点的操作不在这个方法中，这个方法真正执行的操作是删除节点，如下图所示。 
以上这段代码的意思便是去发起url为”/content/category/delete/”的请求，传递的参数是父级id和要删除的节点的id。function(){...}指代回调函数，其中tree.tree("remove",node.target);的意思就是从树形结构中删掉这个节点。
既然添加节点的操作不在menuHandler这个方法中，那么实际进行添加节点到数据库表中的操作是在哪儿控制的呢？如下图所示的onAfterEdit事件。 
onAfterEdit : function(node){：其意思很明显了，就是我们编辑完之后鼠标离开编辑节点后触发的事件，参数node是指新建的节点。var _tree = $(this);：是指得到tree控件。if(node.id == 0){：意思是如果node的id是0（我们新建的节点id就暂时定义为0），就会进入这个if判断逻辑当中。$.post("/content/category/create"：意思是添加节点会去请求”/content/category/create”这个url。{parentId:node.parentId,name:node.text}：指传递的参数有两个，分别是父级id和节点的名称。function(data)是回调函数，data是返回的对象，其中if(data.status == 200){很显然是指添加节点这个操作成功了；_tree.tree("update",{target : node.target,id : data.data.id});的意思就是如果添加节点这个操作成功了，那么就要去更新一下新添加的节点的id，即将id从0更新为添加到数据库中的节点的id，data.data.id就是指添加到数据库中的节点的id。if(node.id == 0)条件不成立，则说明不是添加新节点操作，而是更新节点操作，其中$.post("/content/category/update",{id:node.id,name:node.text});的意思是请求”/content/category/update”的url，传递的参数有节点id、节点名称。
以上js代码要是让我自己写，我肯定是写不出来的，本人对jQuery仍然比较陌生，这确实是一个致命伤。我勉强分析完了以上那些js代码，下面我们便来一一实现内容分类的添加、修改、删除功能。
我们首先实现新增节点这个功能，由于都是单表操作，因此使用逆向工程生成的代码足以满足要求了，直接修改服务层即可，我们到taotao-content-interface工程添加一个方法，如下图所示。 
从insertContentCat方法中可以看出其接收两个参数：parentId、name，这与content-category.jsp页面传递过来的参数是一致的，分别是父级id和节点的名称。我们还可以看出该方法返回TaotaoResult对象，它里面包装了TbContentCategory对象。
下面我们到taotao-content-service工程中去实现这个接口，不过在此之前，由于逆向工程自动生成的insert方法不会自动帮我们给主键的值赋值，所以我们需要添加主键返回，即需要在TbContentCategoryMapper.xml文件中新增一段sql片段，如下： 
之所以这样做是因为我们需要用到这个id给树形结构中新增加的节点id赋值，而在TbContentCategoryMapper.xml文件中新增的sql片段就是给新添加的对象的主键赋值的。
注意：修改完TbContentCategoryMapper.xml映射文件后，需要向本地仓库安装taotao-manager-dao包。
做好以上准备后，我们到ContentCategoryServiceImpl类中实现添加内容分类的方法了，如下所示。 
为方便大家复制，现把ContentCategoryServiceImpl实现类中的insertContentCat方法贴出。
@Override
public TaotaoResult insertContentCat(long parentId, String name) {
// 创建一个内容分类对象
TbContentCategory contentCategory = new TbContentCategory();
contentCategory.setName(name);
contentCategory.setParentId(parentId);
// 新添加的节点都是叶子节点
contentCategory.setIsParent(false);
// 排序方法默认设置为1
contentCategory.setSortOrder(1);
// 分类状态：1(正常)，2(删除)
contentCategory.setStatus(1);
contentCategory.setCreated(new Date());
contentCategory.setUpdated(new Date());
// 插入节点
contentCategoryMapper.insert(contentCategory);
// 判断父节点是否为叶子节点，为何要判断？
TbContentCategory parentNode = contentCategoryMapper.selectByPrimaryKey(parentId);
if (!parentNode.getIsParent()) {
parentNode.setIsParent(true);
// 更新父节点
contentCategoryMapper.updateByPrimaryKey(parentNode);
}
return TaotaoResult.ok(contentCategory); // contentCategory对象里面是包含id属性的
}
服务层写完后，我们再写表现层的代码，我们到taotao-manager-web工程的ContentCategoryController类当中添加一个insertContentCat方法，如下图所示。 
由于taotao-manager-dao工程和taotao-content工程都做了修改，因此我们重新打包taotao-manager-dao(上面修改完TbContentCategoryMapper.xml映射文件就已打包了)和taotao-content工程，然后重启taotao-manager、taotao-content和taotao-manager-web工程。重启成功后，我们到后台管理系统去增加两个分类，如下图所示。 
至此，新增节点这个功能就已实现！真是不容易啊！
重命名节点
由于时间紧张，在此并不实现该功能，留待以后开发。未完，待续。。。敬请期待。
删除节点
由于时间紧张，在此并不实现该功能，留待以后开发。未完，待续。。。敬请期待。
