购物车
在index.html首页 点击购物车（在header中加入initcart方法返回到cart-1）
在hearder.html
<p class="cartbar nobox mt25 yh"><a th:href="@{initCart}"><i class="ico"></i>购物车<i class="num"></i></a>
在cart-1.html中
利用js来进行自增减、单选、圈选、小计
<script type="text/javascript">
function addNum(inputId) {
document.getElementById(inputId).value = parseInt(document
.getElementById(inputId).value) + 1;
var sumCount = document.getElementById("single" + inputId).innerText * document.getElementById(inputId).value;
document.getElementById("sum" + inputId).innerText = sumCount.toFixed(2);这个是固定它的长度
check();
}
function subNum(inputId) {
if (document.getElementById(inputId).value == "1") {
return;
}
document.getElementById(inputId).value = parseInt(document
.getElementById(inputId).value) - 1;
var sumCount = document.getElementById("single" + inputId).innerText * document.getElementById(inputId).value;
document.getElementById("sum" + inputId).innerText = sumCount.toFixed(2);
check();
}
function count(obj) {
var sumCount = document.getElementById("single" + obj.id).innerText * document.getElementById(obj.id).value;
document.getElementById("sum" + obj.id).innerText = sumCount.toFixed(2);
check();
}
function checkAll(obj) {
var el = document.getElementsByTagName('input');
if(obj.checked == true) {
var sumXiaoji = 0;
var sumCount = 0;
var xiaojiLen = document.getElementsByName("xiaoji");
for(var xiaoji in xiaojiLen) {
if (xiaojiLen[xiaoji].tagName == 'SPAN') {
sumXiaoji = sumXiaoji + parseFloat(xiaojiLen[xiaoji].innerText);
sumCount = sumCount + 1;
}
}
document.getElementById("sumCount").innerText = sumCount;
document.getElementById("sumMoney").innerText = sumXiaoji.toFixed(2);
for (var key in el) {
if (el[key].type == 'checkbox') {
el[key].checked = true;
}
}
} else {
document.getElementById("sumCount").innerText = 0;
document.getElementById("sumMoney").innerText = 0;
for (var key in el) {
if (el[key].type == 'checkbox') {
el[key].checked = false;
}
}
}
}
function check() {
var el = document.getElementsByTagName('input');
var xiaojiLen = document.getElementsByName("xiaoji");
var xiaojiArray=new Array();
var xiaojiInt = 0;
var allCheckFlag = true;
for (var key in el) {
if (el[key].type == 'checkbox') {
if(el[key].id !="checkAllId") {
xiaojiArray[xiaojiInt] = el[key].checked;
xiaojiInt++;
if (el[key].checked == false) {
allCheckFlag = false;
}
}
}
}
document.getElementById("checkAllId").checked = allCheckFlag;
var sumXiaoji = 0;
var sumCount = 0;
for(var xiaoji in xiaojiLen) {
if (xiaojiLen[xiaoji].tagName == 'SPAN') {
if(xiaojiArray[xiaoji] == true) {
sumXiaoji = sumXiaoji + parseFloat(xiaojiLen[xiaoji].innerText);
sumCount = sumCount + 1;
}
}
}
document.getElementById("sumCount").innerText = sumCount;
document.getElementById("sumMoney").innerText = sumXiaoji.toFixed(2);
}
</script>
在cart-1的一些关键地方写入
<tr>
<th class="wp7_5"> 这是全选 利用onclick调用上面的js的checkall
<input type="checkbox" id="checkAllId" onclick="checkAll(this);" class="vm" /> 全选</th>
<th class="wp40">商品详情</th>
<th class="wp15">单价</th><th class="wp15">数量</th><th class="wp15">小计</th>
<th class="wp7_5">操作</th></tr></thead>
<tbody th:each="cartsInfo,status:${cartList}">利用这句话作循环
<tr><td class="chk">
<input type="hidden" th:name="${#strings.concat('listBean[').concat(status.index).concat('].commodityId')}" th:value="${cartsInfo.commodityId}"/>
<input type="hidden" th:name="${#strings.concat('listBean[').concat(status.index).concat('].cartId')}" th:value="${cartsInfo.cartId}"/>
<input type="checkbox" th:name="${#strings.concat('listBean[').concat(status.index).concat('].checkArray')}" onclick="check();"/></td><td>
<div class="cont cf">
<img th:src="@{showImage(pictureId=${cartsInfo.pictureId})}"alt="购物车详细情况" class="pic" />
<h4><span th:text="${cartsInfo.commodityName}"></span></h4>
<p class=" mt10">
规格：每<span th:text="${#strings.concat(cartsInfo.unit).concat(cartsInfo.specifications)}"></span>
</p>
<p>品牌：<span th:text="${cartsInfo.brandName}"></span></p></div></td>
<td><p class="price yh">
<span th:id="${#strings.concat('single').concat(cartsInfo.commodityId)}" th:text="${cartsInfo.retailPrice}"></span>元</p></td><td>
<div class="chooseAmount">
<a href="javascript:void(0);"这些地方是用来调用js自增减
th:onclick="${#strings.concat('subNum(').concat(cartsInfo.commodityId).concat(')')}"></a>
<input th:id="${cartsInfo.commodityId}" type="text" class="fl inp-t" th:name="${#strings.concat('listBean[').concat(status.index).concat('].countArray')}" th:value="${cartsInfo.count}" value="1" onblur="count(this);"/>
<a href="javascript:void(0);"
th:onclick="${#strings.concat('addNum(').concat(cartsInfo.commodityId).concat(')')}"></a></div></td>
<td><p class="price yh">
<span name="xiaoji" th:id="${#strings.concat('sum').concat(cartsInfo.commodityId)}" th:text="${cartsInfo.smallSumPrice}"></span>元</p></td>
<td><a class="button"th:href="@{delCart(cartId=${cartsInfo.cartId},count=${cartsInfo.count},commodityId=${cartsInfo.commodityId})}"><span>删除</span></a></td></tr>
在cartcontroller.java
删除选中商品调用的
@RequestMapping(value = "alipayConfirm", method = RequestMethod.POST,params="delChoosedCart")
public String executeDelChoosedCart(Model model, HttpSession session,
CartForm cartForm, Device device) throws SQLException {
log.info("删除选中购物车");
UVO uvo = (UVO) session.getAttribute("UVO");
if (uvo == null || StringUtils.isEmpty(uvo.getGuestId())) {
return "redirect:/initGuestLogin";
}
List<ListBean> listBean = cartForm.getListBean();
int b = listBean.size();
for (int k = 0; k < b;k++) {
String check = listBean.get(k).getCheckArray();
if (check != null) {
cartForm.setCount(listBean.get(k).getCountArray());
cartForm.setCommodityId(listBean.get(k).getCommodityId());
cartForm.setCartId(listBean.get(k).getCartId());
cartForm.setUpdateUser(uvo.getGuestName());
Date date = new Date();
SimpleDateFormat dateformat = new SimpleDateFormat(
"yyyy-MM-dd HH:mm:ss");
cartForm.setUpdateTime(dateformat.format(date));
boolean result = cartService.delCart(cartForm);
if (!result) {
throw new SQLException("删除购物车失败！");
}
}
}
cartForm.setGuestId(uvo.getGuestId());
GoodsForm goodsForm = new GoodsForm();
// goodsForm.setType("粮食");
// model.addAttribute("goodsForm", goodsForm);
List<GoodsForm> commodityType = goodsService.getType();
goodsForm.setCommodityTypeId(commodityType.get(0).getCommodityTypeId());
model.addAttribute("goodsForm", goodsForm);
model.addAttribute("commodityType", commodityType);
model.addAttribute("cartList", cartService.searchCartList(cartForm));
model.addAttribute("list",cartService.searchAlipayHistoryList(cartForm));
cartForm.setGuestId(uvo.getGuestId());
List<CartForm> cartFormList=cartService.searchCartList(cartForm);
for(int i=0;i<cartFormList.size();i++){
cartFormList.get(i).setSmallSumPrice(Double.toString(Double.valueOf(cartFormList.get(i).getCount())*Double.valueOf(cartFormList.get(i).getRetailPrice())));
}
model.addAttribute("cartList", cartFormList);
if (device.isNormal()) {
return "shop/cart/cart-1";
} else {
return "mobile/cart/cart-1";
}
}
结算调用的
@RequestMapping(value = "alipayConfirm", method = RequestMethod.POST,params="Go")
public String alipayConfirm(Model model, HttpSession session,
CartForm cartForm, Device device) throws SQLException {
GoodsForm goodsForm = new GoodsForm();
// goodsForm.setType("粮食");
// model.addAttribute("goodsForm", goodsForm);
List<GoodsForm> commodityType = goodsService.getType();
goodsForm.setCommodityTypeId(commodityType.get(0).getCommodityTypeId());
model.addAttribute("goodsForm", goodsForm);
model.addAttribute("commodityType", commodityType);
log.info("确认支付");
// CartForm cartForm = new CartForm();
UVO uvo = (UVO) session.getAttribute("UVO");
if (uvo == null || StringUtils.isEmpty(uvo.getGuestId())) {
return "redirect:/initGuestLogin";
}
List<ListBean> listBean = cartForm.getListBean();
int b = listBean.size();
String cartIds = "";
for (int i = 0; i < b; i++) {
cartForm.setUpdateUser(uvo.getGuestName());
Date date = new Date();
SimpleDateFormat dateformat = new SimpleDateFormat(
"yyyy-MM-dd HH:mm:ss");
cartForm.setUpdateTime(dateformat.format(date));
cartForm.setCommodityId(listBean.get(i).getCommodityId());
cartForm.setCount(listBean.get(i).getCountArray());
cartForm.setGuestId(uvo.getGuestId());
String check = listBean.get(i).getCheckArray();
if (check != null) {
cartForm.setCartId(listBean.get(i).getCartId());
boolean result = cartService.editStockByCart(cartForm);
if (!result) {
throw new SQLException("库存不足！");
}
boolean hisResult = cartService.updateCart(cartForm);
if (!hisResult) {
throw new SQLException("添加支付宝失败");
}
cartIds = cartIds + ",'" + listBean.get(i).getCartId() + "'";
}
}
cartForm.setCartId(cartIds.substring(1));
// cartForm.setGuestId(uvo.getGuestId());
List<CartForm> list = cartService.searchCartListForCartId(cartForm);
AlipayForm alipayForm = new AlipayForm();
String body = "您购买的商品如下：";
Double price = 0d;
for (CartForm item : list) {
body = body
+ "品名："
+ item.getCommodityName()
+ ", 数量："
+ item.getCount()
+ ", 总价："
+ String.valueOf(Double.valueOf(item.getCount())
* Double.valueOf(item.getRetailPrice())) + ";";
price = price + Double.valueOf(item.getCount())
* Double.valueOf(item.getRetailPrice());
}
alipayForm.setBody(body);
alipayForm.setOutTradeNo(list.get(0).getCartId());
// 不满88元加8元邮费
if (price < 88) {
price = price + 8;
body = body + "(由于本次订单未满88元，加收您邮费8元)";
}
alipayForm.setCartFormList(list);
alipayForm.setPrice(price.toString());
alipayForm.setReceiveAddress(uvo.getAddress());
alipayForm.setReceiveMobile(uvo.getMobile());
alipayForm.setReceiveName(uvo.getGuestName());
alipayForm.setReceivePhone(uvo.getPhone());
alipayForm.setReceiveZip(uvo.getZip());
String host = env.getProperty("host.web");
alipayForm.setShowUrl(host + "/initCart");
alipayForm.setSubject(body);
model.addAttribute("alipayForm", alipayForm);
cartForm.setGuestId(uvo.getGuestId());
model.addAttribute("cartList", cartService.searchCartList(cartForm));
ReceiveForm receiveForm=new ReceiveForm();
receiveForm.setGuestId(uvo.getGuestId());
List<ReceiveForm> list1=receiveservice.searchlist(receiveForm);
model.addAttribute("list", list1);
if (device.isNormal()) {
return "shop/cart/cart-2";
} else {
return "mobile/alipay/cart-2";
删除
<a class="button"th:href="@{delCart(cartId=${cartsInfo.cartId},count=${cartsInfo.count},commodityId=${cartsInfo.commodityId)