1.在pyg_parent下创建了3个新的模块:pyg_portal_web、pyg_content_interface、pyg_content_service
pyg_content_interface(jar)的pom文件:
<dependencies>
<dependency>
<groupId>com.fighting</groupId>
<artifactId>pyg_pojo</artifactId>
<version>1.0-SNAPSHOT</version>
</dependency>
</dependencies>
pyg_content_service(war)的pom文件:
<dependencies>
<dependency>
<groupId>com.fighting</groupId>
<artifactId>pyg_dao</artifactId>
<version>1.0-SNAPSHOT</version>
</dependency>
<dependency>
<groupId>com.fighting</groupId>
<artifactId>pyg_content_interface</artifactId>
<version>1.0-SNAPSHOT</version>
</dependency>
<dependency>
<groupId>com.fighting</groupId>
<artifactId>pyg_common</artifactId>
<version>1.0-SNAPSHOT</version>
</dependency>
</dependencies>
<build>
<plugins>
<plugin>
<groupId>org.apache.tomcat.maven</groupId>
<artifactId>tomcat7-maven-plugin</artifactId>
<version>2.2</version>
<configuration>
<!-- 指定端口 -->
<port>9003</port>
<!-- 请求路径 -->
<path>/</path>
</configuration>
</plugin>
</plugins>
</build>
pyg_portal_web(war)的pom文件:
<dependencies>
<dependency>
<groupId>com.fighting</groupId>
<artifactId>pyg_content_interface</artifactId>
<version>1.0-SNAPSHOT</version>
</dependency>
</dependencies>
<build>
<plugins>
<plugin>
<groupId>org.apache.tomcat.maven</groupId>
<artifactId>tomcat7-maven-plugin</artifactId>
<version>2.2</version>
<configuration>
<!-- 指定端口 -->
<port>9103</port>
<!-- 请求路径 -->
<path>/</path>
</configuration>
</plugin>
</plugins>
</build>
2.完成了运营商部分对广告的增删改查:
查(显示):
在pyg_manager_web模块的pom文件中加入依赖
<dependency>
<groupId>com.fighting</groupId>
<artifactId>pyg_content_interface</artifactId>
<version>1.0-SNAPSHOT</version>
</dependency>
content.html页面:
导入js文件
<script type="text/javascript" src="../plugins/angularjs/angular.min.js"></script>
<script type="text/javascript" src="../plugins/angularjs/pagination.js"></script>
<link rel="stylesheet" href="../plugins/angularjs/pagination.css">
<script type="text/javascript" src="../js/base_pagination.js"></script>
<script type="text/javascript" src="../js/service/contentService.js"></script>
<script type="text/javascript" src="../js/service/contentCategoryService.js"></script>
<script type="text/javascript" src="../js/service/uploadService.js"></script>
<script type="text/javascript" src="../js/controller/baseController.js"></script>
<script type="text/javascript" src="../js/controller/contentController.js"></script>
body标签
<body class="hold-transition skin-red sidebar-mini" ng-app="pinyougou" ng-controller="contentController" ng-init="selectAllContentCategory()">
页面下方加入分页控件
<!--在页面上加上分页控件-->
<tm-pagination conf="paginationConf"></tm-pagination>
页面显示数据位置的绑定
<tbody>
<tr ng-repeat="content in list">
<td><input ng-click="updateSelection($event,content.id)" type="checkbox"></td>
<td>{{content.id}}</td>
<td>{{content.categoryId}}</td>
<td>{{content.title}}</td>
<td>{{content.url}}</td>
<td>
<img alt="" src="{{content.pic}}" width="100px" height="50px">
</td>
<td>{{content.sortOrder}}</td>
<td>{{status[content.status]}}</td>
<td class="text-center">
<button ng-click="findOne(content.id)" type="button" class="btn bg-olive btn-xs" data-toggle="modal" data-target="#editModal">修改</button>
</td>
</tr>
</tbody>
处理页面是否有效显示的数字变成中文:
contentController.js中:
//将广告状态设置成中文
$scope.status=['关闭','开启'];
增:
content.html页面:
body标签中初始化selectAllContentCategory()方法
<body class="hold-transition skin-red sidebar-mini" ng-app="pinyougou" ng-controller="contentController" ng-init="selectAllContentCategory()">
弹框页面模型绑定
<table class="table table-bordered table-striped" width="800px">
<tr>
<td>广告分类</td>
<td>
<select class="form-control" ng-model="entity.categoryId" ng-options="contextCategory.id as contextCategory.name for contextCategory in contentCategoryList">
</select>
</td>
</tr>
<tr>
<td>标题</td>
<td><input ng-model="entity.title" class="form-control" placeholder="标题" > </td>
</tr>
<tr>
<td>URL</td>
<td><input ng-model="entity.url" class="form-control" placeholder="URL" > </td>
</tr>
<tr>
<td>排序</td>
<td><input ng-model="entity.sortOrder" class="form-control" placeholder="排序" > </td>
</tr>
<tr>
<td>广告图片</td>
<td>
<table>
<tr>
<td>
<input type="file" id="file" />
<button ng-click="uploadFile()" class="btn btn-primary" type="button" >
上传
</button>
</td>
<td>
<img src="{{entity.pic}}" width="200px" height="100px">
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>是否有效</td>
<td>
<input ng-model="entity.status" ng-true-value="1" ng-false-value="0" type="checkbox" class="icheckbox_square-blue" >
</td>
</tr>
</table>
保存按钮绑定save()
<div class="modal-footer">
<button ng-click="save()" class="btn btn-success" data-dismiss="modal" aria-hidden="true">保存</button>
<button class="btn btn-default" data-dismiss="modal" aria-hidden="true">关闭</button>
</div>
contentController.js中:
参数部分引入contentCategoryService,为了下面方法的调用,同时,content.html页面部分也要引入相关contentCategoryService.js文件
//查询所有广告分类
$scope.selectAllContentCategory=function () {
contentCategoryService.findAll().success(
function (response) {
$scope.contentCategoryList=response;
}
)
}
后端代码不用改
改:
content.html:
只需在每个广告后面的修改按钮绑定findOne方法并传入id,后端代码都不用改
<td class="text-center">
<button ng-click="findOne(content.id)" type="button" class="btn bg-olive btn-xs" data-toggle="modal" data-target="#editModal">修改</button>
</td>
删:
content.html:
在每个广告前面的复选框上绑定点击方法updateSelection($event,content.id)
<td><input ng-click="updateSelection($event,content.id)" type="checkbox"></td>
给删除按钮绑定点击方法dele()
<button ng-click="dele()" type="button" class="btn btn-default" title="删除" ><i class="fa fa-trash-o"></i> 删除</button>
3.实现了门户网站首页轮播图的展示(pyg_portal_web模块)
index.html页面:
导入js文件
<!--引入js文件-->
<script src="plugins/angularjs/angular.min.js"></script>
<script src="js/base.js" ></script>
<script src="js/service/contentService.js" ></script>
<script src="js/controller/baseController.js"></script>
<script src="js/controller/contentController.js" ></script>
body标签
<body ng-app="pinyougou" ng-controller="contentController" ng-init="selectByCategoryId(1)">
轮播图位置
<div class="yui3-u Center banerArea">
<!--banner轮播-->
<div id="myCarousel" data-ride="carousel" data-interval="4000" class="sui-carousel slide">
<ol class="carousel-indicators"><!--这个代表轮播图下方每一个点 class=active 属性是第一张显示-->
<li ng-repeat="content in contentList" data-target="#myCarousel" data-slide-to="{{$index}}" class="{{$index==0?'active':''}}"></li>
</ol>
<div class="carousel-inner"><!--这个代表的是每一张卢波图 class=active 属性是第一张显示-->
<div ng-repeat="content in contentList" class="{{$index==0?'active':''}} item">
<a href="{{content.url}}">
<img src="{{content.pic}}" />
</a>
</div>
</div><a href="#myCarousel" data-slide="prev" class="carousel-control left">‹</a><a href="#myCarousel" data-slide="next" class="carousel-control right">›</a>
</div>
</div>
contentController.js中(注意一下操作都是在pyg_portal_web门户模块中进行的):
//根据分类id去查该分类所有的广告
$scope.selectByCategoryId=function (id) {
contentService.selectByCategoryId(id).success(
function (response) {
$scope.contentList=response;
}
)
}
contentService.js中:
//根据分类id去查该分类所有的广告
this.selectByCategoryId=function (id) {
return $http.get('content/selectByCategoryId.do?id='+id);
}
ContentController.java中:
一定要注意Reference注解的包一定要导alibaba的
@RequestMapping("/content")
@RestController
public class ContentController {
@Reference//一定要注意Reference注解的包一定要导alibaba的
private ContentService contentService;
//根据分类id去查该分类所有的广告
@RequestMapping("/selectByCategoryId")
public List<TbContent> selectByCategoryId(Long id){
return contentService.selectByCategoryId(id);
}
}
ContentServiceImpl.java中:
//根据分类id去查该分类所有的广告
@Override
public List<TbContent> selectByCategoryId(Long id) {
//一刷新页面先从去查redis缓存中对应广告分类下所有的广告
List<TbContent> contentList = (List<TbContent>) redisTemplate.boundHashOps("content").get(id);
if (contentList == null) {
//如果缓存里没有,就去MySql数据库中查
TbContentExample example = new TbContentExample();
Criteria criteria = example.createCriteria();
//查找该广告分类下所有的广告
criteria.andCategoryIdEqualTo(id);
//只显示广告状态为开启的(也就是"1"的)
criteria.andStatusEqualTo("1");
//按广告的排序的顺序排列,默认是升序,如果想找降序的话 在参数后面加上DESC
//example.setOrderByClause("sort_order DESC");
example.setOrderByClause("sort_order");
contentList = contentMapper.selectByExample(example);
//存入redis数据库中
redisTemplate.boundHashOps("content").put(id,contentList);
System.out.println("=====去Mysql数据库中取");
}else {
//如果缓存里有,就直接从缓存里拿
System.out.println("=====直接从Redis缓存里拿");
}
return contentList;
}
4.实现了将广告列表保存到Redis中
首先在虚拟机的Linux系统上安装redis-3.0.0数据库,将redis-3.0.0.tar.gz压缩包拖到soft目录下,并在这个目录下完成解压,然后在解压后的文件中打开命令框进行安装
安装成功后去安装到的目录下开启服务
导入相关与redis相关的坐标(pyg_parent父模块的pom文件中已经导入)
在pyg_common模块的resources目录下导入两个与redis相关的配置文件
redis-config.properties中:
applicationContext-redis.xml中:
<!--jedis连接工厂-->
<bean id="JedisConnectionFactory" class="org.springframework.data.redis.connection.jedis.JedisConnectionFactory"
p:host-name="${redis.host}" p:port="${redis.port}" p:password="${redis.pass}" p:pool-config-ref="poolConfig"/>
<!--创建操作redis数据库的redisTemplate类-->
<bean id="redisTemplate" class="org.springframework.data.redis.core.RedisTemplate">
<property name="connectionFactory" ref="JedisConnectionFactory" />
</bean>
contentServiceImpl.java中:
//根据分类id去查该分类所有的广告
@Override
public List<TbContent> selectByCategoryId(Long id) {
//一刷新页面先从去查redis缓存中对应广告分类下所有的广告
List<TbContent> contentList = (List<TbContent>) redisTemplate.boundHashOps("content").get(id);
if (contentList == null) {
//如果缓存里没有,就去MySql数据库中查
TbContentExample example = new TbContentExample();
Criteria criteria = example.createCriteria();
//查找该广告分类下所有的广告
criteria.andCategoryIdEqualTo(id);
//只显示广告状态为开启的(也就是"1"的)
criteria.andStatusEqualTo("1");
//按广告的排序的顺序排列,默认是升序,如果想找降序的话 在参数后面加上DESC
//example.setOrderByClause("sort_order DESC");
example.setOrderByClause("sort_order");
contentList = contentMapper.selectByExample(example);
//存入redis数据库中
redisTemplate.boundHashOps("content").put(id,contentList);
System.out.println("=====去Mysql数据库中取");
}else {
//如果缓存里有,就直接从缓存里拿
System.out.println("=====直接从Redis缓存里拿");
}
return contentList;
}
5.处理数据同步问题,因为每做一次增删改就会修改数据库中的数据,所以每一次做增删改的处理后就要清除缓存
修改contentServiceImpl.java中的增删改方法
add:
@Override
public void add(TbContent content) {
contentMapper.insert(content);
//运营商每增加一条广告,就要清空一次对应的广告分类的缓存
redisTemplate.boundHashOps("content").delete(content.getCategoryId());
}
delete:
@Override
public void delete(Long[] ids) {
for (Long id : ids) {
//每次删除之前做清缓存的处理,必须是删除之前,否则删除之后就没办法根据广告分类清除对应的缓存了
TbContent content = contentMapper.selectByPrimaryKey(id);
redisTemplate.boundHashOps("content").delete(content.getCategoryId());
contentMapper.deleteByPrimaryKey(id);
}
}
update:
@Override
public void update(TbContent content) {
//修改这里需要加强注意:因为运营商做更新的操作可能更新的是广告的分类,这个原来分类的数据也会减少,新的分类中的数据会增加,
//所以同时又两种广告分类的数据发生变化,所以在更新之前先去数据库中查广告的分类是否发生了变化
//该广告的id
Long id = content.getId();
//更新之前广告的分类
Long categoryId = contentMapper.selectByPrimaryKey(id).getCategoryId();
if(categoryId==content.getCategoryId()){
//如果广告的分类没有发生变化,直接根据商品分类清redis缓存
redisTemplate.boundHashOps("content").delete(content.getCategoryId());
}else {
//如果广告的分类发生变化,需要清楚原来的分类和现在的分类
redisTemplate.boundHashOps("content").delete(categoryId);
redisTemplate.boundHashOps("content").delete(content.getCategoryId());
}
//更新数据
contentMapper.updateByPrimaryKey(content);
}