【SSM分布式架构电商项目-14】后台CMS内容管理系统管理前台首页广告

首页的大广告

JS效果：
1、点击下面的序号选择查询哪个广告
2、自动切换
3、点击图片查询具体的页面

以上是由前端团队来开发。

数据结构

说明：必须提供6条数据，才能显示效果。

如何实现？
方案一：
1、在后台系统中创建一张表，存储大广告位的广告数据
2、在后台系统中对该表进行CRUD
3、后台系统对外提供接口服务
4、前台系统调用后台系统的提供的接口服务，即可获取到数据
5、前台系统获取到数据后，封装成前端所需要的数据结构，功能即可实现

方案二：
1、将首页显示的广告都抽象的看作是内容
2、在后台系统中创建一张内容表
3、创建一个内容分类表用于区分内容的分类
4、后台系统对内容表以及分类表进行CRUD
5、对外提供接口服务
6、前端系统通过接口获取数据，进行封装，即可实现

内容管理系统（CMS）

内容分类管理

内容分类表

内容表

应该有的字段：
1、图片
2、连接
3、标题
4、子标题

表结构中字段是否添加索引判断依据是什么？ – 字段是否是查询条件或者是排序条件。

是否将所有的字段都添加索引，来加快查询？ – 不行的

1、索引会占用存储空间，索引越多，使用的存储空间越多
2、插入数据，存储索引也会消耗时间，索引越多，插入数据的速度越慢

实现

创建pojo

package com.taotao.manage.pojo;import javax.persistence.Column;
import javax.persistence.GeneratedValue;
import javax.persistence.GenerationType;
import javax.persistence.Id;
import javax.persistence.Table;@Table(name = "tb_content")
public class Content extends BasePojo {@Id@GeneratedValue(strategy = GenerationType.IDENTITY)private Long id;@Column(name = "category_id")private Long categoryId;private String title;@Column(name = "sub_title")private String subTitle;@Column(name = "title_desc")private String titleDesc;private String url;private String pic;private String pic2;private String content;public Long getId() {return id;}public void setId(Long id) {this.id = id;}public Long getCategoryId() {return categoryId;}public void setCategoryId(Long categoryId) {this.categoryId = categoryId;}public String getTitle() {return title;}public void setTitle(String title) {this.title = title;}public String getSubTitle() {return subTitle;}public void setSubTitle(String subTitle) {this.subTitle = subTitle;}public String getTitleDesc() {return titleDesc;}public void setTitleDesc(String titleDesc) {this.titleDesc = titleDesc;}public String getUrl() {return url;}public void setUrl(String url) {this.url = url;}public String getPic() {return pic;}public void setPic(String pic) {this.pic = pic;}public String getPic2() {return pic2;}public void setPic2(String pic2) {this.pic2 = pic2;}public String getContent() {return content;}public void setContent(String content) {this.content = content;}}

package com.taotao.manage.pojo;import javax.persistence.Column;
import javax.persistence.GeneratedValue;
import javax.persistence.GenerationType;
import javax.persistence.Id;
import javax.persistence.Table;@Table(name = "tb_content_category")
public class ContentCategory extends BasePojo {@Id@GeneratedValue(strategy = GenerationType.IDENTITY)private Long id;@Column(name = "parent_id")private Long parentId;private String name;private Integer status;@Column(name = "sort_order")private Integer sortOrder;@Column(name = "is_parent")private Boolean isParent;public Long getId() {return id;}public void setId(Long id) {this.id = id;}public Long getParentId() {return parentId;}public void setParentId(Long parentId) {this.parentId = parentId;}public String getName() {return name;}public void setName(String name) {this.name = name;}public Integer getStatus() {return status;}public void setStatus(Integer status) {this.status = status;}public Integer getSortOrder() {return sortOrder;}public void setSortOrder(Integer sortOrder) {this.sortOrder = sortOrder;}public Boolean getIsParent() {return isParent;}public void setIsParent(Boolean isParent) {this.isParent = isParent;}// 扩展字段，用于EasyUI中tree结构public String getText() {return getName();}public String getState() {return getIsParent() ? "closed" : "open";}}

创建mapper

package com.taotao.manage.mapper;import com.github.abel533.mapper.Mapper;
import com.taotao.manage.pojo.Content;public interface ContentMapper extends Mapper<Content> {}

package com.taotao.manage.mapper;import com.github.abel533.mapper.Mapper;
import com.taotao.manage.pojo.ContentCategory;public interface ContentCategoryMapper extends Mapper<ContentCategory> {}

创建service

创建controller

内容分类管理

创建根节点：

分类列表查询

package com.taotao.manage.controller;import java.util.List;import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.HttpStatus;
import org.springframework.http.ResponseEntity;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RequestParam;import com.taotao.manage.pojo.ContentCategory;
import com.taotao.manage.service.ContentCategoryService;@RequestMapping("content/category")
@Controller
public class ContentCategoryController {@Autowiredprivate ContentCategoryService contentCategoryService;/*** 根据父节点id查询内容分类列表* * @param pid* @return*/@RequestMapping(method = RequestMethod.GET)public ResponseEntity<List<ContentCategory>> queryListByParentId(@RequestParam(value = "id", defaultValue = "0") Long pid) {try {ContentCategory record = new ContentCategory();record.setParentId(pid);List<ContentCategory> list = this.contentCategoryService.queryListByWhere(record);if (null == list || list.isEmpty()) {return ResponseEntity.status(HttpStatus.NOT_FOUND).body(null);}return ResponseEntity.ok(list);} catch (Exception e) {e.printStackTrace();}return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR).body(null);}
}

效果：

节点的右键菜单

定义菜单：

右键触发菜单显示:

具体的菜单事件：

新增事件

JS实现：

按下回车，编辑完成事件：

后台实现：
Controller：

 /*** 新增节点* * @param contentCategory* @return*/@RequestMapping(method = RequestMethod.POST)public ResponseEntity<ContentCategory> saveContentCategory(ContentCategory contentCategory) {try {this.contentCategoryService.saveContentCategory(contentCategory);return ResponseEntity.status(HttpStatus.CREATED).body(contentCategory);} catch (Exception e) {e.printStackTrace();}return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR).body(null);}

Service：

 public void saveContentCategory(ContentCategory contentCategory) {contentCategory.setId(null);contentCategory.setIsParent(false);contentCategory.setSortOrder(1);contentCategory.setStatus(1);super.save(contentCategory);// 判断该节点的父节点的isParent是否为true，不是，需要修改为trueContentCategory parent = super.queryById(contentCategory.getParentId());if (!parent.getIsParent()) {parent.setIsParent(true);super.update(parent);}}

测试：

重命名

JS实现：

后端实现：

 /*** 重命名* * @param id* @param name* @return*/@RequestMapping(method = RequestMethod.PUT)public ResponseEntity<Void> rename(@RequestParam("id") Long id, @RequestParam("name") String name) {try {ContentCategory category = new ContentCategory();category.setId(id);category.setName(name);this.contentCategoryService.updateSelective(category);return ResponseEntity.status(HttpStatus.NO_CONTENT).build();} catch (Exception e) {e.printStackTrace();}return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR).build();}

测试：

删除

JS实现：

过滤器：

后端实现：
Controller：

/*** 删除节点，包含它的所有子节点都被删除* * @param contentCategory* @return*/@RequestMapping(method = RequestMethod.DELETE)public ResponseEntity<Void> delete(ContentCategory contentCategory) {try {this.contentCategoryService.deleteAll(contentCategory);return ResponseEntity.status(HttpStatus.NO_CONTENT).build();} catch (Exception e) {e.printStackTrace();}return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR).build();}

Service：

 public void deleteAll(ContentCategory contentCategory) {List<Object> ids = new ArrayList<Object>();ids.add(contentCategory.getId());// 递归查找该节点下的所有子节点idthis.findAllSubNode(ids, contentCategory.getId());//批量删除super.deleteByIds(ContentCategory.class, "id",ids);// 判断该节点是否还有兄弟节点，如果没有，修改父节点的isParent为falseContentCategory record = new ContentCategory();record.setParentId(contentCategory.getParentId());List<ContentCategory> list = super.queryListByWhere(record);if (null == list || list.isEmpty()) {ContentCategory parent = new ContentCategory();parent.setId(contentCategory.getParentId());parent.setIsParent(false);super.updateSelective(parent);}}private void findAllSubNode(List<Object> ids, Long pid) {ContentCategory record = new ContentCategory();record.setParentId(pid);List<ContentCategory> list = super.queryListByWhere(record);for (ContentCategory contentCategory : list) {ids.add(contentCategory.getId());// 判断该节点是否为父节点，如果是，继续调用该方法查找子节点if (contentCategory.getIsParent()) {// 开始递归findAllSubNode(ids, contentCategory.getId());}}}

测试：

内容管理

选择内容分类加载数据

新增内容

校验，必须选中内容分类才能创建内容数据：

新增内容页面：

点击提交事件

后端实现

@RequestMapping("content")
@Controller
public class ContentController {@Autowiredprivate ContentService contentService;/*** 新增内容* * @param content* @return*/@RequestMapping(method = RequestMethod.POST)public ResponseEntity<Void> saveContent(Content content) {try {content.setId(null);this.contentService.save(content);return ResponseEntity.status(HttpStatus.CREATED).build();} catch (Exception e) {e.printStackTrace();}return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR).build();}}

测试：

查询内容列表

JS实现

Controller实现

 /***  根据内容分类id查询分类列表*  * @param categoryId* @param page* @param rows* @return*/@RequestMapping(method = RequestMethod.GET)public ResponseEntity<EasyUIResult> queryListByCategoryId(@RequestParam("categoryId") Long categoryId,@RequestParam(value = "page", defaultValue = "1") Integer page,@RequestParam(value = "rows", defaultValue = "10") Integer rows) {try {EasyUIResult easyUIResult = this.contentService.queryListByCategoryId(categoryId, page, rows);return ResponseEntity.ok(easyUIResult);} catch (Exception e) {e.printStackTrace();}return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR).body(null);}

Service

package com.taotao.manage.service;import java.util.List;import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;import com.github.pagehelper.PageHelper;
import com.github.pagehelper.PageInfo;
import com.taotao.common.bean.EasyUIResult;
import com.taotao.manage.mapper.ContentMapper;
import com.taotao.manage.pojo.Content;@Service
public class ContentService extends BaseService<Content> {@Autowiredprivate ContentMapper contentMapper;public EasyUIResult queryListByCategoryId(Long categoryId, Integer page, Integer rows) {PageHelper.startPage(page, rows);List<Content> list = this.contentMapper.queryContentList(categoryId);PageInfo<Content> pageInfo = new PageInfo<Content>(list);return new EasyUIResult(pageInfo.getTotal(), pageInfo.getList());}
}

Mapper

package com.taotao.manage.mapper;import java.util.List;import com.github.abel533.mapper.Mapper;
import com.taotao.manage.pojo.Content;public interface ContentMapper extends Mapper<Content> {/*** 根据categoryId查询内容列表，并且按照更新时间倒序排序* * @return*/public List<Content> queryContentList(Long categoryId);}

Mapper.xml

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
"http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.taotao.manage.mapper.ContentMapper"><select id="queryContentList" resultType="Content">SELECT * FROM tb_content WHERE category_id = #{categoryId} ORDER BY updated DESC</select></mapper>

在Spring和Mybatis的整合文件中读取Mapper.xml

测试：