商品录入【规格选择】
4.1 需求分析
显示规格及选项列表（复选框）如下图，并保存用户选择的结果
4.1 代码实现
4.1.1 显示规格选项列表
由于我们的模板中只记录了规格名称，而我们除了显示规格名称还是显示规格下的规格选项，所以我们需要在后端扩充方法。
（1）在 pinyougou-sellergoods-interface 的 TypeTemplateService.java 新增方法定义
/**
*返回规格列表
*@return
*/
public List<Map> findSpecList(Long id);
（2）在 pinyougou-sellergoods-service 的 TypeTemplateServiceImpl.java 新增方法
@Autowired
private TbSpecificationOptionMapper specificationOptionMapper;
@Override
public List<Map> findSpecList(Long id) {
//查询模板
TbTypeTemplate typeTemplate = typeTemplateMapper.selectByPrimaryKey(id);
List<Map> list = JSON.parseArray(typeTemplate.getSpecIds(), Map.class) ;
for(Map map:list){
//查询规格选项列表
TbSpecificationOptionExample example=new TbSpecificationOptionExample(); com.pinyougou.pojo.TbSpecificationOptionExample.Criteria criteria =
example.createCriteria();
criteria.andSpecIdEqualTo( new Long( (Integer)map.get("id") ) ); List<TbSpecificationOption> options =
specificationOptionMapper.selectByExample(example); map.put("options", options);
}
return list;
}
（3）在 pinyougou-shop-web 的 TypeTemplateController.java 新增方法
@RequestMapping("/findSpecList")
public List<Map> findSpecList(Long id){
return typeTemplateService.findSpecList(id);
}
测试后端代码：
（4）前端代码：修改 pinyougou-shop-web 的 typeTemplateService.js
//查询规格列表
this.findSpecList=function(id){
return $http.get('../typeTemplate/findSpecList.do?id='+id);
}
（5）修改 pinyougou-shop-web 的 goodsController.js
//模板 ID 选择后 更新模板对象
$scope.$watch('entity.goods.typeTemplateId', function(newValue, oldValue) { typeTemplateService.findOne(newValue).success(
function(response){
$scope.typeTemplate=response;//获取类型模板
$scope.typeTemplate.brandIds= JSON.parse( $scope.typeTemplate.brandIds);//品牌列表
$scope.entity.goodsDesc.customAttributeItems=JSON.parse( $scope.typeTemplate.custom
AttributeItems);//扩展属性
}
);
//查询规格列表typeTemplateService.findSpecList(newValue).success(
function(response){
$scope.specList=response;
}
);
});
（6）修改 goods_edit.html 页面
< div ng-repeat="pojo in specList">
<div class="col-md-2 title">{{pojo.text}}</div>
<div class="col-md-10 data">
<span ng-repeat="option in pojo.options">
<input type="checkbox" >{{option.optionName}}
</span>
</div>
</div>
