目录 🌻🌻
一、运营商后台-商品管理【商品审核】
1.1 待审核商品列表
需求：参照商家后台商品列表。代码：
（1）修改youlexuan_manager_web 下的 goods.html 和 goodsController.js，注入itemCatService，添加代码
- 将 youlexuan_manager_web 下的goods.html备份重命名如：goods_backs.html
copy上节 youlexuan_shop_web下的 goods.html 到 youlexuan_manager_web 下面
上节 goods.html- 添加上节 代码 到 goodsController.js 中如下：
① 👇🏾
② 👇🏾
$scope.status=['未审核','已审核','审核未通过','关闭'];//商品状态
$scope.itemCatList=[];//商品分类列表
//加载商品分类列表
$scope.findItemCatList=function(){
itemCatService.findAll().success(
function(response){
for(var i=0;i<response.length;i++){
$scope.itemCatList[response[i].id]=response[i].name;
}
}
);
};
完整 👉🏾👉🏾 goods.html
<!DOCTYPE html>
<html>
<head>
<!-- 页面meta -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>商品管理</title>
<!-- Tell the browser to be responsive to screen width -->
<meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" name="viewport">
<link rel="stylesheet" href="../plugins/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="../plugins/adminLTE/css/AdminLTE.css">
<link rel="stylesheet" href="../plugins/adminLTE/css/skins/_all-skins.min.css">
<link rel="stylesheet" href="../css/style.css">
<script src="../plugins/jQuery/jquery-2.2.3.min.js"></script>
<script src="../plugins/bootstrap/js/bootstrap.min.js"></script>
<!--引入-->
<script type="text/javascript" src="../plugins/angularjs/angular.min.js"></script>
<!-- 分页组件开始 -->
<script 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/goodsService.js"></script>
<script type="text/javascript" src="../js/service/itemCatService.js"></script>
<script type="text/javascript" src="../js/service/uploadService.js"></script>
<script type="text/javascript" src="../js/service/typeTemplateService.js"></script>
<script type="text/javascript" src="../js/controller/baseController.js"></script>
<script type="text/javascript" src="../js/controller/goodsController.js"></script>
</head>
<body class="hold-transition skin-red sidebar-mini" ng-app="youlexuan" ng-controller="goodsController"
ng-init="findItemCatList()">
<!-- .box-body -->
<div class="box-header with-border">
<h3 class="box-title">商品管理</h3>
</div>
<div class="box-body">
<!-- 数据表格 -->
<div class="table-box">
<!--工具栏-->
<div class="pull-left">
<div class="form-group form-inline">
<div class="btn-group">
<button type="button" class="btn btn-default" title="审核通过"><i class="fa fa-file-o"></i> 审核通过
</button>
<button type="button" class="btn btn-default" title="审核未通过"><i class="fa fa-file-o"></i> 审核未通过
</button>
<button type="button" class="btn btn-default" title="删除"><i class="fa fa-file-o"></i> 删除</button>
<button type="button" class="btn btn-default" title="关闭"><i class="fa fa-file-o"></i>关闭</button>
<button type="button" class="btn btn-default" title="刷新" onclick="window.location.reload();"><i
class="fa fa-refresh"></i> 刷新
</button>
</div>
</div>
</div>
<div class="box-tools pull-right">
<div class="has-feedback">
状态：<select ng-model="searchEntity.auditStatus">
<option value="">全部</option>
<option value="0">未审核</option>
<option value="1">已审核</option>
<option value="2">审核未通过</option>
<option value="3">关闭</option>
</select>
商品名称：<input ng-model="searchEntity.goodsName">
<button class="btn btn-default" ng-click="reloadList()">查询</button>
</div>
</div>
<!--工具栏/-->
<!--数据列表-->
<table id="dataList" class="table table-bordered table-striped table-hover dataTable">
<thead>
<tr>
<th class="" style="padding-right:0px">
<input id="selall" type="checkbox" class="icheckbox_square-blue">
</th>
<th class="sorting_asc">商品ID</th>
<th class="sorting">商品名称</th>
<th class="sorting">商品价格</th>
<th class="sorting">一级分类</th>
<th class="sorting">二级分类</th>
<th class="sorting">三级分类</th>
<th class="sorting">状态</th>
<th class="text-center">操作</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="entity in list">
<td><input type="checkbox" ng-click="updateSelection($event,entity.id)"></td>
<td>{{entity.id}}</td>
<td>{{entity.goodsName}}</td>
<td>{{entity.price}}</td>
<td>{{itemCatList[entity.category1Id]}}</td>
<td>{{itemCatList[entity.category2Id]}}</td>
<td>{{itemCatList[entity.category3Id]}}</td>
<td>
<span>
{{status[entity.auditStatus]}}
</span>
</td>
<td class="text-center">
<a href="goods_edit.html#?id={{entity.id}}" type="button" class="btn bg-olive btn-xs">修改</a>
</td>
</tr>
</tbody>
</table>
<!--数据列表/-->
{{selectIds}}
</div>
<!-- 数据表格 /-->
<tm-pagination conf="paginationConf"></tm-pagination>
</div>
<!-- /.box-body -->
</body>
</html>
1.2 商品审核与驳回
需求：商品审核的状态值为1，驳回的状态值为2 。用户在列表中选中ID后，点击审核或驳回，修改商品状态，并刷新列表。
1.2.1 后端代码
（1）在 youlexuan_sellergoods_interface 的 GoodsService.java 新增方法定义
/**
* 批量修改状态
*/
public void updateStatus(Long [] ids,String status);
（2）在youlexuan_sellergoods_service的GoodsServiceImpl.java实现该方法
/**
* 更新状态
* @param ids
* @param status
*/
public void updateStatus(Long [] ids,String status){
if(ids != null && ids.length > 0){
for (Long id : ids) {
//根据商品id获取商品信息
TbGoods tbGoods = goodsMapper.selectByPrimaryKey(id);
//修改商品状态
tbGoods.setAuditStatus(status);
//更新商品信息到数据库
goodsMapper.updateByPrimaryKey(tbGoods);
//修改sku的状态
TbItemExample tbItemExample = new TbItemExample();
TbItemExample.Criteria criteria = tbItemExample.createCriteria();
criteria.andIdEqualTo(id);
List<TbItem> tbItems = itemMapper.selectByExample(tbItemExample);
//遍历sku集合
for (TbItem tbItem : tbItems) {
//修改状态
tbItem.setStatus(status);
itemMapper.updateByPrimaryKey(tbItem);
}
}
}
}
（3）在youlexuan_manager_web 的 GoodsController.java新增方法
/**
* 更新状态
*
*/
@RequestMapping("/updateStatus")
public Result updateStatus(Long[] ids,String status){
try{
goodsService.updateStatus(ids,status);
return new Result(true,"商品更新成功");
}catch (Exception e){
e.printStackTrace();
return new Result(false,"商品更新失败");
}
}
1.2.2 前端代码
（1）修改youlexuan_manager_web的 goodsService.js ，增加方法
//更新商品状态
this.updateStatus = function(ids,status){
return $http.get('../goods/updateStatus.do?ids='+ids+"&status="+status);
}
（2）修改youlexuan_manager_web的goodsController.js ，增加方法
//更新商品状态
$scope.updateStatus = function (status) {
goodsService.updateStatus($scope.selectIds,status).success(function (response) {
if(response.success){
$scope.reloadList();
}else{
alert(response.message);
}
});
}
（3）修改youlexuan-manager-web的goods.html 页面，为复选框绑定事件指令(应该前面已经绑定喽)
<input type="checkbox" ng-click="updateSelection($event,entity.id)" >
（4）修改页面上的审核通过和驳回按钮
<button type="button" class="btn btn-default" ng-click="updateStatus('1')" title="审核通过"><i class="fa fa-file-o"></i> 审核通过
</button>
<button type="button" class="btn btn-default" ng-click="updateStatus('2')" title="审核未通过"><i class="fa fa-file-o"></i> 审核未通过
</button>
测试效果：
测试前：
测试后：
1.3 商品详情展示
需求：点击列表右侧的“详情”按钮，弹出窗口显示商品信息。代码略。
二、运营商后台-商品管理【商品删除】
2.1 需求分析
我们为商品管理提供商品删除功能，用户选中部分商品，点击删除按钮即可实现商品删除。注意，这里的删除并非是物理（真）删除，而是修改tb_goods表的is_delete字段为1 ，我们可以称之为“逻辑删除（假删除）”
2.2 逻辑删除的实现
2.2.1 后端代码
修改youlexuan_sellergoods_service工程的GoodsServiceImpl.java的delete方法
/**
* 批量删除
*/
@Override
public void delete(Long[] ids) {
for(Long id:ids){
TbGoods tbGoods = goodsMapper.selectByPrimaryKey(id);
tbGoods.setIsDelete("1");
goodsMapper.updateByPrimaryKey(tbGoods);
}
}
criteria.andIsDeleteIsNull();//非删除状态
criteria.andIsDeleteIsNull();
2.2.2 前端代码
修改youlexuan_manager_web的goods.html上的删除按钮 ng-click="dele(selectIds)""
测试效果：
删除前 ：
删除后：
拓展系统漏洞(如前几年发生的拼多多事件)：
/**
* 修改
* @param goods
* @return
*/
@RequestMapping("/update")
public Result update(@RequestBody Goods goods){
String currnetSellerId = SecurityContextHolder.getContext().getAuthentication().getName();
String sellerId = goods.getGoods().getSellerId();
Goods goods1 = goodsService.findOne(goods.getGoods().getId());
if(!sellerId.equals(goods1.getGoods().getSellerId()) || !currnetSellerId.equals(sellerId)){
return new Result(false,"您的攻行已经被记录，正在上传到公安系统中！");
}
三 、商家后台-【商品上下架】
3.1 需求分析
什么是商品上下架？其实上下架也是商品的一个状态，但是不同于审核状态。审核状态的控制权在运营商手中，而上下架的控制权在商户手中。商户可以随时将一个已审核状态的商品上架或下架。上架表示正常销售，而下架则表示暂停销售。
3.2 实现思路提示
其实商品的上下架就是对上下架状态的修改。字段为tb_goods表的is_marketable字段。1表示上架、0表示下架。
四、注解式事务配置
4.1 事务异常测试
我们修改youlexuan_sellergoods_service工程GoodsServiceImpl.java的add方法
在插入商品表后，人为制造一个异常。我们运行程序，新增商品数据，观察运行结果。
通过观察，我们发现，程序发生异常 ，商品表仍然会存储记录，这是不符合我们要求的。这是因为我们目前的系统还没有配置事务。
4.2 注解式事务解决方案
4.2.1 配置文件
在youlexuan_sellergoods_service工程的spring目录下创建applicationContext_tx.xml
<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:tx="http://www.springframework.org/schema/tx"
xmlns:jdbc="http://www.springframework.org/schema/jdbc"
xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd
http://www.springframework.org/schema/tx http://www.springframework.org/schema/tx/spring-tx.xsd
http://www.springframework.org/schema/jdbc http://www.springframework.org/schema/jdbc/spring-jdbc.xsd">
<!-- 事务管理器 -->
<bean id="transactionManager" class="org.springframework.jdbc.datasource.DataSourceTransactionManager">
<property name="dataSource" ref="dataSource" />
</bean>
<!-- 开启事务控制的注解支持 -->
<tx:annotation-driven transaction-manager="transactionManager"/>
<jdbc:embedded-database id="dataSource"/>
</beans>
4.2.2 在方法上添加注解
经过测试，我们发现，系统发生异常，商品表不会新增记录，事务配置成功。
删除掉测试代码int x=1/0
我们需要将所有涉及多表操作的服务类添加事务注解，例如SpecificationServiceImpl类
端口占用无法启动解决 👉🏾👉🏾 六、端口占用
当前 youlexuan 所有完整代码
扫一扫
1246
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
