详细信息列表，详细信息的描述以及热销榜的排序问题，列表按商品类型显示出来(8-5)
一 商品图片的滚动效果以及商品的详细列表信息
1 首先将details中的头文件引进，然后写入function方法，编写图片滚动效果的代码
details.html中商品详细信息的主要代码:
<div class="col-sm-6">
<h4 class="yh detailsT" th:text="${goodsForm.commodityName}"></h4>
<dl class="dl-horizontal detailsInfo cf">
<dt>零售价：</dt>
<dd class="price yh"><i>￥</i><span th:text="${goodsForm.retailPrice}">128</span></dd>
<dt>运 费 ：</dt>
<dd>8元</dd>
<dt>品 牌：</dt>
<dd><span th:text="${goodsForm.brandName}">日思</span></dd>
<dt>经销商：</dt>
<dd><span th:text="${goodsForm.supplierName}">天津日思优质小站稻开发公司</span></dd>
<dt>规 格：</dt>
<dd><span th:text="${#strings.concat(goodsForm.unit).concat(goodsForm.specifications)}">每袋5kg</span></dd>
<dt>库 存：</dt>
<dd><span th:text="${goodsForm.stock}">99</span></dd>
<dt>数 量：</dt>
<dd style="height:32px;">
<!-- 实现购买数量的加减 -->
<div class="chooseAmount mt5">
<a href="javascript:void(0);" onclick="subNum();" value="-" ></a>
<input type="text" class="fl inp-t" value="1" id="count"/>
<a href="javascript:void(0);" onclick="addNum();" value="+" ></a>
</div>
</dd>
</dl>
<p class="mt20"><a href="#" class="btnBlue yh ">立即购买</a><a href="#" class="btnYellow yh">加入购物车</a></p>
</div>
</div>
二 热卖榜商品按照库存降序自动检索并排列
1 details.html中热卖榜主要代码:
<div class="col-md-2 goodsHot">
<h4 class="h5 link yh goodsHotT">热卖榜</h4>
<ul class="row goodsHotList">
<li class="col-md-12 col-sm-3 col-xs-6 cf" th:each="goodsInfo,status:${list}" >
<div class="pic"><a th:href="@{initGoodsDetail(commodityId=${goodsInfo.commodityId})}"><img th:src="@{showImage(pictureId=${goodsInfo.pictureId})}" alt="" /></a></div>
<div class="tit">
<h4><a th:href="@{initGoodsDetail(commodityId=${goodsInfo.commodityId})}"><p th:text="${goodsInfo.commodityName}">15</p></a></h4>
<p>￥<span th:text="${goodsInfo.retailPrice}">15元</span></p>
</div>
</li>
</ul>
</div>
2 goodsservice中添加一个设置显示四条结果的类
public List<GoodsForm> searchGoodsList3(GoodsForm frm) {
List<GoodsForm> result = queryDao.executeForObjectList("Goods.selectGoodsList", frm,0,4);
return result;
}
3 goodscontroller中
@RequestMapping(value = "initGoodsDetail", method = RequestMethod.GET)
public String initGoodsDetail(Model model, HttpSession session, GoodsForm goodsForm, Device device) {
log.info("商品明细初始化");
model.addAttribute("commodityType", goodsService.getType());
UVO uvo = (UVO)session.getAttribute("UVO");
if (uvo == null) {
uvo = new UVO();
session.setAttribute("UVO", uvo);
}
CartForm cartForm = new CartForm();
cartForm.setGuestId(uvo.getGuestId());
model.addAttribute("cartList", cartService.searchCartList(cartForm));
model.addAttribute("goodsForm", goodsService.searchGoods(goodsForm));
model.addAttribute("list", goodsService.searchGoodsList3(goodsForm));
if(device.isNormal()) {
return "shop/goods/details";
} else {
return "mobile/goods/details";//实现点击图片或者文字返回到details页面
}
}
4 在goodsSqlMap中编写按库存降序排列的代码
ORDER BY cast(stock.stock as signed) desc
二 列表中商品按类型进行检索
1 list中
<ul class="goodsList cf">
<li class="col-md-2 col-sm-4 col-xs-6" th:each="goodsInfo,status:${list}" >
<div class="cont">
<a th:href="@{selectGoods(commodityId=${goodsInfo.commodityId})}"><img th:src="@{showImage(pictureId=${goodsInfo.pictureId})}" alt="" /></a>
<h4 class="h5"><a href="@{selectGoods(commodityId=${goodsInfo.commodityId})}"><p class="title" th:text="${goodsInfo.commodityName}">品美知糖道阿胶姜汤260g</p></a></h4>
<!-- <p class="num"><span th:text="${goodsInfo.stock}">500克 / 库存 9999</span>每<span th:text="${goodsInfo.retailPrice}"></span></p> -->
<p class="num">库存:<span th:text="${goodsInfo.stock}">9999</span>
每<span th:text="${#strings.concat(goodsInfo.unit).concat(goodsInfo.specifications)}">500克</span>
</p>
<p class="cf">
<span class="price yh">￥<span th:text="${goodsInfo.retailPrice}">128</span></span>
<!--<p>￥<span th:text="${goodsInfo.retailPrice}" class="price yh">128</span></p> -->
<a href="#" class="btnBuy" title="加入购物车"></a>
</p>
</div>
</li>
</ul>
2 goodscontroller中
//控制商品检索类型
List<GoodsForm> commodityType = goodsService.getType();
model.addAttribute("commodityType", goodsService.getType());
if(goodsForm.getCommodityTypeId()==null)
{
goodsForm.setCommodityTypeId(commodityType.get(0).getCommodityTypeId());
model.addAttribute("list", goodsService.getTypeList(goodsForm));
model.addAttribute("goodsForm", goodsForm);
}
else
{model.addAttribute("goodsForm", goodsForm);
model.addAttribute("list", goodsService.getTypeList(goodsForm));
}