完成商品添加功能
1、商品类目选择
2、图片上传
3、图片服务器搭建
4、kindEditor富文本编辑器的使用
5、商品添加功能
2. 实现商品类目选择功能
2.1. 需求
在商品添加页面，点击“选择类目”显示商品类目列表：
使用easyUI的异步tree控件来完成。
异步tree的行为：
树控件读取URL。子节点的加载依赖于父节点的状态。当展开一个封闭的节点，如果节点没有加载子节点，它将会把节点id的值作为http请求参数并命名为‘id’，通过URL发送到服务器上面检索子节点。
异步tree的数据结构：
- id：节点id
- text：节点名称
- state：如果不是叶子节点就是closed，叶子节点就是open。close的节点点击后会在此发送请求查询子项目。
{
"id":1,
"text":"Node1",
"state":"closed" //如果节点为父节点则状态为“closed”，如果是叶子节点“open”
}
2.2.数据库
表中的数据为树形结构，可以满足要求
2.3 功能分析
index.jsp：新增商品--->item-add.jsp
item-add.jsp: 选择类目--->selectItemCat
selectItemCat在common.js中实现 请求初始化树形控件的url：/item/cast/list
点击父节点，请求初始化子节点动作是tree空间封装好的，每打开一个父节点做一次ajax请求。
请求参数：id：当前节点的id。根据此id查询子节点
返回结果：一个json数据，是一个列表：
[
{
"id":1,
"text":"Node1",
"state":"closed" //如果节点为父节点则状态为“closed”，如果是叶子节点“open”
}，
{
"id":2,
"text":"Node2",
"state":"closed" //如果节点为父节点则状态为“closed”，如果是叶子节点“open”
}
]
2.4. DAO层
select * from tb_item_cat where parent_id=2
使用逆向工程生成的mapper文件：TbItemCatMapper.java、TbItemCatMapper.xml
2.5. Service层
功能：接收parentid参数，根据parentid查询子类目类别。返回一个分类列表。可以创建一个pojo来描述一个节点的格式，返回一个pojo列表。
创建一个pojo：
包含id，text，state属性。因为其他工程也可能用到此pojo，所以应放在taotao-common中：
public class EasyUITreeNode implements Serializable { private Long id; //节点id private String text; //节点名称 private String state; //如果不是叶子节点就是close，叶子节点就是open set/get。。。。。 }
：
public interface ItemCatService { public List<TbItemCat> getItemCatList(Long parentId); }
：
@Service public class ItemCatServiceImpl implements ItemCatService { @Autowired private TbItemCatMapper itemCatMapper; @Override public List<EasyUITreeNode> getItemCatList(Long parentId) { //创建查询条件 TbItemCatExample example = new TbItemCatExample(); Criteria criteria = example.createCriteria(); //根据parentid查询子节点 criteria.andParentIdEqualTo(parentId); List<TbItemCat> list = itemCatMapper.selectByExample(example); //把列表转换成treeNodeList List<EasyUITreeNode> resultList = new ArrayList<EasyUITreeNode>(); for(TbItemCat tbItemCat:list){ EasyUITreeNode node = new EasyUITreeNode(); node.setId(tbItemCat.getId()); node.setText(tbItemCat.getName()); node.setState(tbItemCat.getIsParent()?"closed":"open"); resultList.add(node); } //返回结果 return resultList; } }
2.6 Controller层
功能：接收页面请求的参数，名为id。调用service查询分类列表。返回json格式是列表。需要使用@ResponseBody注解。
：
@Controller @RequestMapping("/item/cat") public class ItemCatController { @Autowired private ItemCatService itemCatService; @RequestMapping("/list") @ResponseBody public List<EasyUITreeNode> getItemCatList(@RequestParam(value="id",defaultValue="0")Long parentId){ List<EasyUITreeNode> list = itemCatService.getItemCatList(parentId); return list; } }
3.实现上传图片功能
首先安装nginx来提供http服务。过程略。
FastDFS只是解决了图片保存问题，要通过http访问图片 必须安装nginx。
3.1 分布式文件服务器FastDFS
3.1.1 什么是FastDFS
FastDFS 是用 c 语言编写的一款开源的分布式文件系统。FastDFS 为互联网量身定制，充分考虑了冗余备份、负载均衡、线性扩容等机制，并注重高可用、高性能等指标，使用 FastDFS很容易搭建一套高性能的文件服务器集群提供文件上传、下载等服务。
FastDFS 架构包括 Tracker server 和 Storage server。客户端请求 Tracker server 进行文件上传、下载，通过 Tracker server 调度最终由 Storage server 完成文件上传和下载。
Tracker server 作用是负载均衡和调度，通过 Tracker server 在文件上传时可以根据一些策略找到 Storage server 提供文件上传服务。可以将 tracker 称为追踪服务器或调度服务器。
Storage server 作用是文件存储，客户端上传的文件最终存储在 Storage 服务器上，Storageserver 没有实现自己的文件系统而是利用操作系统 的文件系统来管理文件。可以将storage称为存储服务器。
服务端两个角色：
Tracker：管理集群，tracker 也可以实现集群。每个 tracker 节点地位平等。收集 Storage 集群的状态。
Storage：实际保存文件 Storage 分为多个组，每个组之间保存的文件是不同的。每个组内部可以有多个成员，组成员内部保存的内容是一样的，组成员的地位是一致的，没有主从的概念。
3.1.2 文件上传及下载的流程
（1） 文件上传流程
客户端上传文件后存储服务器将文件 ID 返回给客户端，此文件 ID 用于以后访问该文件的索引信息。文件索引信息包括：组名，虚拟磁盘路径，数据两级目录，文件名。
组名：文件上传后所在的 storage 组名称，在文件上传成功后有 storage 服务器返回，需要客户端自行保存。
虚拟磁盘路径：storage 配置的虚拟路径，与磁盘选项 store_path*对应。如果配置了store_path0 则是 M00，如果配置了 store_path1 则是 M01，以此类推。
数据两级目录：storage 服务器在每个虚拟磁盘路径下创建的两级目录，用于存储数据文件。
文件名：与文件上传时不同。是由存储服务器根据特定信息生成，文件名包含：源存储服务器 IP 地址、文件创建时间戳、文件大小、随机数和文件拓展名等信息。
（2） 文件下载流程
3.1.3 最简单的 FastDFS 架构
3.1.4 FastDFS安装
略，自己安装的FastDFS的IP地址固定为192.168.25.133
3.1.5 FastDFS实现图片上传小测试
这里我们在taotao-manager-web工程下做测试，在其下的的 src/test/java 下建一个测试类FastDfsTest。
（1）首先在pom.xml引入fastdfs的依赖：
<dependency> <groupId>org.csource.fastdfs</groupId> <artifactId>fastdfs</artifactId> <version>1.2</version> </dependency>