<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"> <head> <meta charset="UTF-8"> <title>购物车</title> <link rel="icon" href="/static/cart/img/心04.png" type="/image/x-icon" /> <link rel="stylesheet" href="/static/cart/css/One_bdyStyle.css"> <link rel="stylesheet" href="/static/cart/css/index.css"> <script src="/static/cart/js/jquery-3.1.1.min.js" charset="utf-8"></script> <link rel="stylesheet" href="/static/cart/css/One_mainFoot.css"> <link rel="stylesheet" href="/static/cart/css/font-awesome-4.7.0/css/font-awesome.css" /> </head> <body> <header> <a name="mao1"> <div class="header"> <ul class="header-left"> <li> <a href="http://alatusmall.com">首页</a> </li> </ul> <ul class="header-right"> <li> <a th:if="${session.get('loginUser')==null}" href="http://auth.alatusmall.com/login.html" style="color: red;">你好，请登录</a> <a th:if="${session.get('loginUser')!=null}" href="" style="color: red;">[[${session.get('loginUser').getNickname()}]]</a> </li> <li><a th:if="${session.get('loginUser')==null}" href="http://auth.alatusmall.com/reg.html">免费注册</a></li> <li class="spacer"></li> <li><a href="">我的订单</a></li> <li class="spacer"></li> </ul> <div style="clear: both;"></div> </div> </a> </header> <div class="one_search"> <div class="one_sousuo"> <div class="one_search_top"> <div class="one_top_left"> <a href="http://alatusmall.com" class="one_left_logo"><img src="/static/cart/img/logo1.jpg"></a> <a href="http://cart.alatus.com/cart.html" class="one_left_link">购物车</a> </div> <div class="one_top_right"> <input type="text" class="one_right_txt" placeholder="" onfocus="this.placeholder=''" onblur="this.placeholder='' "> <input type="button" value="搜索" class="one_right_btn"> </div> </div> <div class="one_search_load" th:if="${session.get('loginUser')==null}"> <img href="/static/cart/img/shop_07.jpg" class="one_load_wraing"> <span>您还没有登录！登录后购物车的商品将保存到您账号中</span> <a href="#"><input type="button" onclick="login()" value="立即登录" class="one_load_btn"></a> </div> </div> </div> <div class="One_BdyShop"> <div class="OneBdy_box"> <div class="One_tabTop"> <div class="One_Topleft"> <span>全部商品 </span> </div> </div> <div class="One_ShopTop"> <ul> <li><input type="checkbox" class="allCheck">全选</li> <li>商品</li> <li>单价</li> <li>数量</li> <li>小计</li> <li>操作</li> </ul> </div> <div class="One_ShopCon"> <ul th:if="${cart.getItems()!=null}"> <li th:each="item:${cart.getItems()}"> <div> </div> <div> <ol> <li><input class="checkedItem" onclick="itemCheck(event)" type="checkbox" th:attr="skuId=${item.getSkuId()}" th:checked="${item.getCheck()}"/></li> <li> <dt><img th:src="${item.getImage()}" alt=""></dt> <dd style="width: 300px"> <p> <span th:text="${item.getTitle()}"></span> <br/><br/> <span th:each="attr:${item.getSkuAttr()}" th:text="${attr+' '}"></span> </p> </dd> </li> <li> <p class="dj" th:text="'￥'+${#numbers.formatDecimal(item.getPrice(),3,2)}"></p> </li> <li> <p th:attr="skuId=${item.getSkuId()}"> <span class="countOpsBtn">-</span> <span class="countOpsNum" th:text="${item.getCount()}"></span> <span class="countOpsBtn">+</span> </p> </li> <li style="font-weight:bold"><p class="zj">￥[[${#numbers.formatDecimal(item.getTotalPrice(),3,2)}]]</p></li> <li> <p th:attr="skuId=${item.getSkuId()}" class="deleteItemBtn">删除</p> </li> </ol> </div> </li> </ul> </div> <div class="One_ShopFootBuy fix1"> <div> <ul> <li><input type="checkbox" class="allCheck"><span>全选</span></li> <li>删除选中的商品</li> <li>移到我的关注</li> <li>清除下柜商品</li> </ul> </div> <div> <font style="color:#e64346;font-weight:bold;" class="sumNum"> </font> <ul> <li><img src="/static/cart/img/buyNumleft.png" alt=""></li> <li><img src="/static/cart/img/buyNumright.png" alt=""></li> </ul> </div> <div> <ol> <li>总价:<span style="color:#e64346;font-weight:bold;font-size:16px;" class="fnt">￥[[${#numbers.formatDecimal(cart.getTotalAmount(),3,2)}]]</span> </li> <li>优惠:<span style="color:#e64346;font-weight:bold;font-size:16px;" class="fnt">￥[[${#numbers.formatDecimal(cart.getReduce(),1,2)}]]</span> </li> </ol> </div> <div><button onclick="toTrade()" type="button">去结算</button></div> </div> </div> </div> <div class="One_isDel"> <p> <span>删除</span><span><img src="/static/cart/img/错误.png" alt=""></span> </p> <div> <dl> <dt><img src="/static/cart/img/感叹三角形 (2).png" alt=""></dt> <dd> <li>删除商品？</li> <li>您可以选择移到关注，或删除商品。</li> </dd> </dl> </div> <div> <button type="button" onclick="deleteItem()">删除</button> <button type="button">取消</button> </div> </div> <div class="One_moveGzIfNull"> <p> <span>删除</span><span><img src="/static/cart/img/错误.png" alt=""></span> </p> <dl> <dt><img src="/static/cart/img/感叹三角形 (2).png" alt=""></dt> <dd>请至少选中一件商品！</dd> </dl> </div> <div class="One_moveMyGz"> <p> <span>删除</span><span><img src="/static/cart/img/错误.png" alt=""></span> </p> <div> <dl> <dt><img src="/static/cart/img/感叹三角形 (2).png" alt=""></dt> <dd> <li>移到关注</li> <li>移动后选中商品将不再购物车中显示</li> </dd> </dl> </div> <div> <button type="button">确定</button> <button type="button">取消</button> </div> </div> <div class="One_clearShop"> <p> <span>提示</span><span><img src="/static/cart/img/错误.png" alt=""></span> </p> <dl> <dt><img src="/static/cart/img/感叹三角形 (2).png" alt=""></dt> <dd>没有下柜商品!</dd> </dl> </div> <!--底部--> <div class="one_footer"> </div> </body> <script src="/static/cart/js/index.js" charset="utf-8"></script> <script type="text/javascript"> function toTrade() { window.location.href = "http://order.alatusmall.com/toTrade"; } function toItem(skuId) { window.location.href = "http://item.alatusmall.com/" + skuId + ".html"; } function checkSku(chkbox) { var skuId = $(chkbox).attr("value"); var checked = $(chkbox).prop("checked"); var isCheckedFlag = "0"; if (checked) { isCheckedFlag = "1"; } var param = "isChecked=" + isCheckedFlag + "&" + "skuId=" + skuId; $.post("checkCart", param, function(data) { sumSumPrice(); }); } //封装总价钱函数 function sumSumPrice() { } //购物车顶端tab $(".One_Topleft span:last-child").mouseover(function() { $(".One_Topleft span:first-child").css({ "color": "black", "border-bottom": "none" }) $(this).css({ "cursor": "pointer", "color": "#E4393C", "border-bottom": "2px solid red" }) }).mouseout(function() { $(this).css({ "color": "black", "border-bottom": "none" }); $(".One_Topleft span:first-child").css({ "cursor": "pointer", "color": "#E4393C", "border-bottom": "2px solid red" }) }) //立即登录 $(".one_search_load input:button").click(function() { $(".One_mb").show(); $(".One_DengLu").show(); }) //去结算 $(".One_ShopFootBuy>div:last-child button").mouseover(function() { $(this).css("cursor", "pointer"); }) $(".One_ShopFootBuy>div:last-child button").click(function() { $(".One_mb").show(); $(".One_DengLu").show(); }) //buyNum $(".One_ShopFootBuy>div:nth-child(2)").mouseover(function() { $(this).css("cursor", "pointer") }) $(".One_ShopFootBuy>div:nth-child(2)").click(function() { $(this).children("ol").toggle(); $(this).children("ul").toggle(); var dis = $(".One_ShopFootBuy>div:nth-child(2) ol").css("display"); if (dis == "none") { $(".One_ShopFootBuy>div:nth-child(2) img").css("transform", "rotateX(0)") } else if (dis == "block") { $(".One_ShopFootBuy>div:nth-child(2) img").css("transform", "rotateX(180deg)") } }) //右侧固定定位 $(".One_RightFix ul>li:not(:first-child)").mouseover(function() { $(this).css({ "cursor": "pointer", "background": "#C91423" }) $(this).children("ol").stop().animate({ "left": "-75px" }, 200) }).mouseout(function() { $(this).css("background", "#7A6E6E"); $(this).children("ol").stop().animate({ "left": "75px" }, 200) }) //右侧底部固定定位 $(".One_RightbtmFix ul>li").mouseover(function() { $(this).css({ "cursor": "pointer", "background": "#C91423" }) $(this).children("ol").stop().animate({ "left": "-55px" }, 200) }).mouseout(function() { $(this).css("background", "#7A6E6E"); $(this).children("ol").stop().animate({ "left": "55px" }, 200) }) //登录弹框tab切换 $(".One_DengLu>div:nth-child(3) ul li").mouseover(function() { $(this).css("cursor", "pointer") }) $(".One_DengLu>div:nth-child(3) ul li").click(function() { var i = $(this).index(); $(this).css({ "color": "#E64346", "font-weight": "bold" }) .siblings("li").css({ "color": "black", "font-weight": "normal" }) $(".One_DengLu>div:nth-child(3) ol li").eq(i).show().siblings().hide() }) //优惠券 $(".One_ShopBottom>div:nth-child(2) img").click(function() { $(".One_mb").show(); $(".One_DengLu").show(); }) //配送地址hover效果 $(".One_Topright span:last-child").mouseover(function() { $(this).children(".One_Local").css("display", "block") }).mouseout(function() { $(".One_Local>ul>li").eq(0).children("ol").css("display", "block") $(this).children(".One_Local").css("display", "none") }) $(".One_Local>ul>li").eq(0).children("ol").css("display", "block") $(".One_Local>ul>li").mouseover(function() { var i = $(this).index(); $(this).css("cursor", "pointer"); $(this).children("ol").css("display", "block") }).mouseout(function() { $(".One_Local>ul>li").eq(0).children("ol").css("display", "block") $(this).children("ol").css("display", "none") }) $(".One_Local>ul>li>ol li").mouseover(function() { $(this).css({ "cursor": "pointer", "color": "#e64346" }) }).mouseout(function() { $(this).css("color", "#005AA0") }) $(".One_Local>ul>li>ol li").click(function() { $(this).parent().parent().children("label").html($(this).html()) }) //购物车全选反选 $(".One_ShopTop ul li:first-child .allCheck").click(function() { if ($(".One_ShopTop ul li:first-child .allCheck").is(":checked")) { // $(".check").each(function(index){ $(".check").prop("checked", true); $(".check").parent().parent().parent().css("background", "#fff4e8"); $(".One_ShopBottom>div:first-child span:first-child .allCheck").prop("checked", true) // }) } else { // $(".check").each(function(){ $(".check").parent().parent().parent().css("background", "none"); $(".check").prop("checked", false); $(".One_ShopBottom>div:first-child span:first-child .allCheck").prop("checked", false) // }) } }) $(".One_ShopFootBuy>div:first-child ul li:first-child .allCheck").click(function() { if ($(".One_ShopFootBuy>div:first-child ul li:first-child .allCheck").is(":checked")) { $(".check").prop("checked", true); $(".check").parent().parent().parent().css("background", "#fff4e8"); $(".One_ShopBottom>div:first-child span:first-child .allCheck").prop("checked", true) } else { $(".check").parent().parent().parent().css("background", "none"); $(".check").prop("checked", false); $(".One_ShopBottom>div:first-child span:first-child .allCheck").prop("checked", false) } }) $(".One_ShopBottom>div:first-child span:first-child .allCheck").click(function() { if ($(".One_ShopBottom>div:first-child span:first-child .allCheck").is(":checked")) { $(".check").prop("checked", true); $(".check").parent().parent().parent().css("background", "#fff4e8"); } else { $(".check").parent().parent().parent().css("background", "none"); $(".check").prop("checked", false); } }) //如果子选择框没有选中则父选框取消全选 $(".check").click(function() { $(".check").each(function() { if ($(this).prop("checked") == true) { $(".allCheck").prop("checked", false); } }) }) //子选择框全部选中复选框也选中 $(".check").click(function() { if ($(".check[class='check']:checked").length == $(".check[class='check']").length) { $(".allCheck").prop("checked", true); } else { $(".allCheck").prop("checked", false) } }) //删除已选的商品 $(".One_ShopFootBuy>div:first-child ul li:nth-child(2)").click(function() { // $(".check").each(function(){ if ($(".check").is(":checked") == false) { $(".One_mb").show(); $(".One_moveGzIfNull").show(); } else { $(".One_mb").show(); //蒙版显示 $(".One_isDel").show(); //删除弹框显示 $(".One_moveGzIfNull").hide(); } }) //确定删除弹框移入我的关注 $(".One_isDel>div:last-child button:last-child").click(function() { $(".One_isDel").hide(); $(".One_mb").show(); $(".One_DengLu").show(); }) //移到我的关注 $(".One_ShopFootBuy>div:first-child ul li:nth-child(3)").click(function() { $(".check").each(function(index) { if ($(this).is(":checked") == false) { $(".One_mb").show(); $(".One_moveGzIfNull").show(); } else { $(".One_mb").show(); $(".One_moveMyGz").show(); $(".One_moveGzIfNull").hide(); } }) }) //点击×号关闭 $(".One_moveGzIfNull>p span:last-child img").click(function() { $(".One_mb").hide(); $(".One_moveGzIfNull").hide(); }) $(".One_moveMyGz>p span:last-child img").click(function() { $(".One_mb").hide(); $(".One_moveMyGz").hide(); $(".One_moveGzIfNull").hide(); }) $(".One_clearShop>p span:last-child img").click(function() { $(".One_mb").hide(); $(".One_clearShop").hide(); }) //移到我的关注取消按钮点击关闭 $(".One_moveMyGz>div:last-child button:last-child").click(function() { $(".One_mb").hide(); $(".One_moveMyGz").hide(); }) //移到我的关注确定按钮点击登录弹框弹出 $(".One_moveMyGz>div:last-child button:first-child").click(function() { $(".One_moveMyGz").hide(); $(".One_mb").show(); $(".One_DengLu").show(); }) $(".One_DengLu>p:first-child span:last-child img").click(function() { $(".One_mb").hide(); $(".One_DengLu").hide(); }) //清除下柜商品 $(".One_ShopFootBuy>div:first-child ul li:nth-child(4)").click(function() { $(".One_mb").show(); $(".One_clearShop").show() }) //购物车+ - //鼠标移入变小手 $(".One_ShopCon ul li>div:nth-child(2) ol>li:nth-child(4) p:first-child span").mouseover(function() { $(this).css("cursor", "pointer") }) //+ $(".One_ShopCon ul li>div:nth-child(2) ol>li:nth-child(4) p:first-child span:last-child").click(function() { var add = $(this).prev("span").html(); add++; $(this).prev("span").html(add); //总价 var dj = $(this).parent().parent().prev().children(".dj").html().substring(1); var sl = $(this).prev("span").html(); $(this).parent().parent().parent().children("li:nth-child(5)").children(".zj").html("￥" + dj * sl + ".00") sumSumPrice(); }) //- $(".One_ShopCon ul li>div:nth-child(2) ol>li:nth-child(4) p:first-child span:first-child").click(function() { var jian = $(this).next("span").html(); jian--; if (jian <= 0) { jian = 0; } $(this).next("span").html(jian); //总价 var dj = $(this).parent().parent().prev().children(".dj").html().substring(1); var sl = $(this).next("span").html(); $(this).parent().parent().parent().children("li:nth-child(5)").children(".zj").html("￥" + dj * sl + ".00") sumSumPrice(); }) //选中当前商品背景变色 $(".check").each(function(index) { $(".check").eq(index).click(function() { if ($(this).is(":checked")) { $(this).parent().parent().parent().css("background", "#fff4e8"); $(this).parent().parent().parent().parent().children("div:last-child").css("background", "#fff4e8") } else { $(this).parent().parent().parent().parent().children("div:last-child").css("background", "none") $(this).parent().parent().parent().css("background", "none") } }) }) //商品删除鼠标移入变色 $(".One_ShopCon ul li>div:nth-child(2) ol>li:nth-child(6) p").mouseover(function() { $(this).css({ "cursor": "pointer", "color": "#e64346" }); }).mouseout(function() { $(this).css({ "cursor": "pointer", "color": "gray" }); }) $(".One_ShopCon ul li>div:nth-child(2) ol>li:nth-child(6) p:nth-child(2)").click(function() { $(".One_mb").show(); $(".One_moveMyGz").show(); }) $(".One_ShopCon ul li>div:nth-child(2) ol>li:nth-child(6) p:last-child").click(function() { $(".One_mb").show(); $(".One_DengLu").show(); }) //点击删除 //点击删除出现弹框 $(".One_isDel>p img").click(function() { $(".One_mb").hide(); $(".One_isDel").hide(); }) $(".One_ShopCon ul li>div:nth-child(2) ol>li:nth-child(6) p:first-child").click(function() { $(".One_mb").show(); $(".One_isDel").show(); }) $(".One_isDel>div:last-child button").mouseover(function() { $(this).css("cursor", "pointer"); }) $(".One_ShopFootBuy>div:first-child ul li:not(:first-child)").mouseover(function() { $(this).css({ "cursor": "pointer", "color": "#e64346" }) }).mouseout(function() { $(this).css("color", "black") }) //封装总价钱函数 function sumSumPrice() { console.log("计算总价"); var zzj = 0; $(".check").each(function() { if ($(this).prop("checked")) { console.log("check!!" + $(this).parents("ol").find(".zj").html()); var zj = $(this).parents("ol").find(".zj").html().substring(1); console.log(" 价格：" + zj); zzj = zzj + parseFloat(zj); } $(".fnt").html("￥" + zzj + ".00") }) } //封装总数量函数 function sumSumNum() { var kong = 0; $(".One_ShopCon ul li>div:nth-child(2) ol>li:nth-child(4) p:first-child span:nth-child(2)").each(function() { kong += parseFloat($(this).html()) }) $(".sumNum").html(kong); } $(".One_ShopCon ul li>div:nth-child(2)>ol>li:nth-child(2)>dd").mouseover(function() { $(this).css({ "cursor": "pointer", "color": "#e64346" }) }).mouseout(function() { $(this).css("color", "black") }) //更多促销下拉 $(".One_ShopCon ul li>div:nth-child(2) ol li:nth-child(3) p:nth-child(2)").click(function() { $(this).parent().children(".nmbd").slideToggle(300); var dis = $(this).parent().children(".nmbd").css("display"); console.log(dis); }) $(".nmbd dd:last-child button:first-child").click(function() { $(this).parent().parent().slideUp(100) }) $(".nmbd dd:last-child button:last-child").click(function() { $(this).parent().parent().slideUp(100) }) //active $(".one_main_div1 .one_main_ul>li").mouseover(function() { $(".one_main_div1 .one_main_ul>li").removeClass("active"); $(this).addClass("active"); }) //选项卡 $(".one_main_div1 .one_main_ul li").mouseover(function() { $(".one_main_div1_1").eq($(this).index()).stop(true).show().siblings().stop(true).hide() }) $(function() { //声明变量记录索引 var index = 0; //点击右边按钮 //忽略重复点击开关 var toggle = true $(".arrow-right").click(function() { if (toggle == false) { return } toggle = false index++; if (index > $('.fade li').length - 1) { index = 0; } }); //点击左边按钮 $(".arrow-left").click(function() { if (toggle == false) { return } toggle = false index--; if (index < 0) { index = $('.fade li').length - 1; } $('.pagination ul li').eq(index).addClass('active').siblings().removeClass('active') $(".slider>ul>li").eq(index).fadeIn(500, function() { toggle = true }).siblings("li").fadeOut(500); }); //点击分页器 $('.pagination ul li').mouseover(function() { var paging = $(this).index() //变颜色 $(this).addClass('active').siblings().removeClass('active') //与图片关联 $(".slider>ul>li").eq(paging).fadeIn(1000).siblings("li").fadeOut(1000); }) }); $(".fade li>div a").mouseover(function() { $(this).children("p").children("img").attr("src", "img/one_mian_gwc2.png") }).mouseout(function() { $(this).children("p").children("img").attr("src", "img/one_mian_gwc1.png") }) function itemCheck(event){ let skuId = event.target.getAttribute("skuId"); let check = event.target.checked; let ajax = new XMLHttpRequest(); ajax.onreadystatechange = function(){ if(ajax.readyState === 4){ if(ajax.status === 200){ let result = JSON.parse(ajax.responseText); if(result.code != 0){ event.target.checked = !check; } } } } ajax.open("GET","http://cart.alatusmall.com/checkItem?skuId=" + skuId + "&check=" + (check ? 1 : 0),true); ajax.send(); } function login() { location.href = "http://auth.alatusmall.com/login.html"; } $(".countOpsBtn").click(function(){ // 获取SkuID let skuId = $(this).parent().attr("skuId"); let count = $(this).parent().find(".countOpsNum"); let num = count.text(); let ajax = new XMLHttpRequest(); ajax.onreadystatechange = function(){ if(ajax.readyState === 4){ if(ajax.satus === 200){ let result = JSON.parse(ajax.responseText); if(result.code != 0){ count.text(num - 1); } } } } ajax.open("GET","http://cart.alatusmall.com/countItem?skuId=" + skuId + "&num="+num,true); ajax.send(); }); var deleteId = 0; function deleteItem(){ location.href = "http://cart.alatusmall.com/deleteItem?skuId="+deleteId; } $(".deleteItemBtn").click(function(){ deleteId = $(this).attr("skuId"); }); </script> </html><!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"> <head> <meta charset="UTF-8"> <title>购物车</title> <link rel="icon" href="/static/cart/img/心04.png" type="/image/x-icon" /> <link rel="stylesheet" href="/static/cart/css/One_bdyStyle.css"> <link rel="stylesheet" href="/static/cart/css/index.css"> <script src="/static/cart/js/jquery-3.1.1.min.js" charset="utf-8"></script> <link rel="stylesheet" href="/static/cart/css/One_mainFoot.css"> <link rel="stylesheet" href="/static/cart/css/font-awesome-4.7.0/css/font-awesome.css" /> </head> <body> <header> <a name="mao1"> <div class="header"> <ul class="header-left"> <li> <a href="http://alatusmall.com">首页</a> </li> </ul> <ul class="header-right"> <li> <a th:if="${session.get('loginUser')==null}" href="http://auth.alatusmall.com/login.html" style="color: red;">你好，请登录</a> <a th:if="${session.get('loginUser')!=null}" href="" style="color: red;">[[${session.get('loginUser').getNickname()}]]</a> </li> <li><a th:if="${session.get('loginUser')==null}" href="http://auth.alatusmall.com/reg.html">免费注册</a></li> <li class="spacer"></li> <li><a href="">我的订单</a></li> <li class="spacer"></li> </ul> <div style="clear: both;"></div> </div> </a> </header> <div class="one_search"> <div class="one_sousuo"> <div class="one_search_top"> <div class="one_top_left"> <a href="http://alatusmall.com" class="one_left_logo"><img src="/static/cart/img/logo1.jpg"></a> <a href="http://cart.alatus.com/cart.html" class="one_left_link">购物车</a> </div> <div class="one_top_right"> <input type="text" class="one_right_txt" placeholder="" οnfοcus="this.placeholder=''" οnblur="this.placeholder='' "> <input type="button" value="搜索" class="one_right_btn"> </div> </div> <div class="one_search_load" th:if="${session.get('loginUser')==null}"> <img href="/static/cart/img/shop_07.jpg" class="one_load_wraing"> <span>您还没有登录！登录后购物车的商品将保存到您账号中</span> <a href="#"><input type="button" οnclick="login()" value="立即登录" class="one_load_btn"></a> </div> </div> </div> <div class="One_BdyShop"> <div class="OneBdy_box"> <div class="One_tabTop"> <div class="One_Topleft"> <span>全部商品 </span> </div> </div> <div class="One_ShopTop"> <ul> <li><input type="checkbox" class="allCheck">全选</li> <li>商品</li> <li>单价</li> <li>数量</li> <li>小计</li> <li>操作</li> </ul> </div> <div class="One_ShopCon"> <ul th:if="${cart.getItems()!=null}"> <li th:each="item:${cart.getItems()}"> <div> </div> <div> <ol> <li><input class="checkedItem" οnclick="itemCheck(event)" type="checkbox" th:attr="skuId=${item.getSkuId()}" th:checked="${item.getCheck()}"/></li> <li> <dt><img th:src="${item.getImage()}" alt=""></dt> <dd style="width: 300px"> <p> <span th:text="${item.getTitle()}"></span> <br/><br/> <span th:each="attr:${item.getSkuAttr()}" th:text="${attr+' '}"></span> </p> </dd> </li> <li> <p class="dj" th:text="'￥'+${#numbers.formatDecimal(item.getPrice(),3,2)}"></p> </li> <li> <p th:attr="skuId=${item.getSkuId()}"> <span class="countOpsBtn">-</span> <span class="countOpsNum" th:text="${item.getCount()}"></span> <span class="countOpsBtn">+</span> </p> </li> <li style="font-weight:bold"><p class="zj">￥[[${#numbers.formatDecimal(item.getTotalPrice(),3,2)}]]</p></li> <li> <p th:attr="skuId=${item.getSkuId()}" class="deleteItemBtn">删除</p> </li> </ol> </div> </li> </ul> </div> <div class="One_ShopFootBuy fix1"> <div> <ul> <li><input type="checkbox" class="allCheck"><span>全选</span></li> <li>删除选中的商品</li> <li>移到我的关注</li> <li>清除下柜商品</li> </ul> </div> <div> <font style="color:#e64346;font-weight:bold;" class="sumNum"> </font> <ul> <li><img src="/static/cart/img/buyNumleft.png" alt=""></li> <li><img src="/static/cart/img/buyNumright.png" alt=""></li> </ul> </div> <div> <ol> <li>总价:<span style="color:#e64346;font-weight:bold;font-size:16px;" class="fnt">￥[[${#numbers.formatDecimal(cart.getTotalAmount(),3,2)}]]</span> </li> <li>优惠:<span style="color:#e64346;font-weight:bold;font-size:16px;" class="fnt">￥[[${#numbers.formatDecimal(cart.getReduce(),1,2)}]]</span> </li> </ol> </div> <div><button οnclick="toTrade()" type="button">去结算</button></div> </div> </div> </div> <div class="One_isDel"> <p> <span>删除</span><span><img src="/static/cart/img/错误.png" alt=""></span> </p> <div> <dl> <dt><img src="/static/cart/img/感叹三角形 (2).png" alt=""></dt> <dd> <li>删除商品？</li> <li>您可以选择移到关注，或删除商品。</li> </dd> </dl> </div> <div> <button type="button" οnclick="deleteItem()">删除</button> <button type="button">取消</button> </div> </div> <div class="One_moveGzIfNull"> <p> <span>删除</span><span><img src="/static/cart/img/错误.png" alt=""></span> </p> <dl> <dt><img src="/static/cart/img/感叹三角形 (2).png" alt=""></dt> <dd>请至少选中一件商品！</dd> </dl> </div> <div class="One_moveMyGz"> <p> <span>删除</span><span><img src="/static/cart/img/错误.png" alt=""></span> </p> <div> <dl> <dt><img src="/static/cart/img/感叹三角形 (2).png" alt=""></dt> <dd> <li>移到关注</li> <li>移动后选中商品将不再购物车中显示</li> </dd> </dl> </div> <div> <button type="button">确定</button> <button type="button">取消</button> </div> </div> <div class="One_clearShop"> <p> <span>提示</span><span><img src="/static/cart/img/错误.png" alt=""></span> </p> <dl> <dt><img src="/static/cart/img/感叹三角形 (2).png" alt=""></dt> <dd>没有下柜商品!</dd> </dl> </div> <!--底部--> <div class="one_footer"> </div> </body> <script src="/static/cart/js/index.js" charset="utf-8"></script> <script type="text/javascript"> function toTrade() { window.location.href = "http://order.alatusmall.com/toTrade"; } function toItem(skuId) { window.location.href = "http://item.alatusmall.com/" + skuId + ".html"; } function checkSku(chkbox) { var skuId = $(chkbox).attr("value"); var checked = $(chkbox).prop("checked"); var isCheckedFlag = "0"; if (checked) { isCheckedFlag = "1"; } var param = "isChecked=" + isCheckedFlag + "&" + "skuId=" + skuId; $.post("checkCart", param, function(data) { sumSumPrice(); }); } //封装总价钱函数 function sumSumPrice() { } //购物车顶端tab $(".One_Topleft span:last-child").mouseover(function() { $(".One_Topleft span:first-child").css({ "color": "black", "border-bottom": "none" }) $(this).css({ "cursor": "pointer", "color": "#E4393C", "border-bottom": "2px solid red" }) }).mouseout(function() { $(this).css({ "color": "black", "border-bottom": "none" }); $(".One_Topleft span:first-child").css({ "cursor": "pointer", "color": "#E4393C", "border-bottom": "2px solid red" }) }) //立即登录 $(".one_search_load input:button").click(function() { $(".One_mb").show(); $(".One_DengLu").show(); }) //去结算 $(".One_ShopFootBuy>div:last-child button").mouseover(function() { $(this).css("cursor", "pointer"); }) $(".One_ShopFootBuy>div:last-child button").click(function() { $(".One_mb").show(); $(".One_DengLu").show(); }) //buyNum $(".One_ShopFootBuy>div:nth-child(2)").mouseover(function() { $(this).css("cursor", "pointer") }) $(".One_ShopFootBuy>div:nth-child(2)").click(function() { $(this).children("ol").toggle(); $(this).children("ul").toggle(); var dis = $(".One_ShopFootBuy>div:nth-child(2) ol").css("display"); if (dis == "none") { $(".One_ShopFootBuy>div:nth-child(2) img").css("transform", "rotateX(0)") } else if (dis == "block") { $(".One_ShopFootBuy>div:nth-child(2) img").css("transform", "rotateX(180deg)") } }) //右侧固定定位 $(".One_RightFix ul>li:not(:first-child)").mouseover(function() { $(this).css({ "cursor": "pointer", "background": "#C91423" }) $(this).children("ol").stop().animate({ "left": "-75px" }, 200) }).mouseout(function() { $(this).css("background", "#7A6E6E"); $(this).children("ol").stop().animate({ "left": "75px" }, 200) }) //右侧底部固定定位 $(".One_RightbtmFix ul>li").mouseover(function() { $(this).css({ "cursor": "pointer", "background": "#C91423" }) $(this).children("ol").stop().animate({ "left": "-55px" }, 200) }).mouseout(function() { $(this).css("background", "#7A6E6E"); $(this).children("ol").stop().animate({ "left": "55px" }, 200) }) //登录弹框tab切换 $(".One_DengLu>div:nth-child(3) ul li").mouseover(function() { $(this).css("cursor", "pointer") }) $(".One_DengLu>div:nth-child(3) ul li").click(function() { var i = $(this).index(); $(this).css({ "color": "#E64346", "font-weight": "bold" }) .siblings("li").css({ "color": "black", "font-weight": "normal" }) $(".One_DengLu>div:nth-child(3) ol li").eq(i).show().siblings().hide() }) //优惠券 $(".One_ShopBottom>div:nth-child(2) img").click(function() { $(".One_mb").show(); $(".One_DengLu").show(); }) //配送地址hover效果 $(".One_Topright span:last-child").mouseover(function() { $(this).children(".One_Local").css("display", "block") }).mouseout(function() { $(".One_Local>ul>li").eq(0).children("ol").css("display", "block") $(this).children(".One_Local").css("display", "none") }) $(".One_Local>ul>li").eq(0).children("ol").css("display", "block") $(".One_Local>ul>li").mouseover(function() { var i = $(this).index(); $(this).css("cursor", "pointer"); $(this).children("ol").css("display", "block") }).mouseout(function() { $(".One_Local>ul>li").eq(0).children("ol").css("display", "block") $(this).children("ol").css("display", "none") }) $(".One_Local>ul>li>ol li").mouseover(function() { $(this).css({ "cursor": "pointer", "color": "#e64346" }) }).mouseout(function() { $(this).css("color", "#005AA0") }) $(".One_Local>ul>li>ol li").click(function() { $(this).parent().parent().children("label").html($(this).html()) }) //购物车全选反选 $(".One_ShopTop ul li:first-child .allCheck").click(function() { if ($(".One_ShopTop ul li:first-child .allCheck").is(":checked")) { // $(".check").each(function(index){ $(".check").prop("checked", true); $(".check").parent().parent().parent().css("background", "#fff4e8"); $(".One_ShopBottom>div:first-child span:first-child .allCheck").prop("checked", true) // }) } else { // $(".check").each(function(){ $(".check").parent().parent().parent().css("background", "none"); $(".check").prop("checked", false); $(".One_ShopBottom>div:first-child span:first-child .allCheck").prop("checked", false) // }) } }) $(".One_ShopFootBuy>div:first-child ul li:first-child .allCheck").click(function() { if ($(".One_ShopFootBuy>div:first-child ul li:first-child .allCheck").is(":checked")) { $(".check").prop("checked", true); $(".check").parent().parent().parent().css("background", "#fff4e8"); $(".One_ShopBottom>div:first-child span:first-child .allCheck").prop("checked", true) } else { $(".check").parent().parent().parent().css("background", "none"); $(".check").prop("checked", false); $(".One_ShopBottom>div:first-child span:first-child .allCheck").prop("checked", false) } }) $(".One_ShopBottom>div:first-child span:first-child .allCheck").click(function() { if ($(".One_ShopBottom>div:first-child span:first-child .allCheck").is(":checked")) { $(".check").prop("checked", true); $(".check").parent().parent().parent().css("background", "#fff4e8"); } else { $(".check").parent().parent().parent().css("background", "none"); $(".check").prop("checked", false); } }) //如果子选择框没有选中则父选框取消全选 $(".check").click(function() { $(".check").each(function() { if ($(this).prop("checked") == true) { $(".allCheck").prop("checked", false); } }) }) //子选择框全部选中复选框也选中 $(".check").click(function() { if ($(".check[class='check']:checked").length == $(".check[class='check']").length) { $(".allCheck").prop("checked", true); } else { $(".allCheck").prop("checked", false) } }) //删除已选的商品 $(".One_ShopFootBuy>div:first-child ul li:nth-child(2)").click(function() { // $(".check").each(function(){ if ($(".check").is(":checked") == false) { $(".One_mb").show(); $(".One_moveGzIfNull").show(); } else { $(".One_mb").show(); //蒙版显示 $(".One_isDel").show(); //删除弹框显示 $(".One_moveGzIfNull").hide(); } }) //确定删除弹框移入我的关注 $(".One_isDel>div:last-child button:last-child").click(function() { $(".One_isDel").hide(); $(".One_mb").show(); $(".One_DengLu").show(); }) //移到我的关注 $(".One_ShopFootBuy>div:first-child ul li:nth-child(3)").click(function() { $(".check").each(function(index) { if ($(this).is(":checked") == false) { $(".One_mb").show(); $(".One_moveGzIfNull").show(); } else { $(".One_mb").show(); $(".One_moveMyGz").show(); $(".One_moveGzIfNull").hide(); } }) }) //点击×号关闭 $(".One_moveGzIfNull>p span:last-child img").click(function() { $(".One_mb").hide(); $(".One_moveGzIfNull").hide(); }) $(".One_moveMyGz>p span:last-child img").click(function() { $(".One_mb").hide(); $(".One_moveMyGz").hide(); $(".One_moveGzIfNull").hide(); }) $(".One_clearShop>p span:last-child img").click(function() { $(".One_mb").hide(); $(".One_clearShop").hide(); }) //移到我的关注取消按钮点击关闭 $(".One_moveMyGz>div:last-child button:last-child").click(function() { $(".One_mb").hide(); $(".One_moveMyGz").hide(); }) //移到我的关注确定按钮点击登录弹框弹出 $(".One_moveMyGz>div:last-child button:first-child").click(function() { $(".One_moveMyGz").hide(); $(".One_mb").show(); $(".One_DengLu").show(); }) $(".One_DengLu>p:first-child span:last-child img").click(function() { $(".One_mb").hide(); $(".One_DengLu").hide(); }) //清除下柜商品 $(".One_ShopFootBuy>div:first-child ul li:nth-child(4)").click(function() { $(".One_mb").show(); $(".One_clearShop").show() }) //购物车+ - //鼠标移入变小手 $(".One_ShopCon ul li>div:nth-child(2) ol>li:nth-child(4) p:first-child span").mouseover(function() { $(this).css("cursor", "pointer") }) //+ $(".One_ShopCon ul li>div:nth-child(2) ol>li:nth-child(4) p:first-child span:last-child").click(function() { var add = $(this).prev("span").html(); add++; $(this).prev("span").html(add); //总价 var dj = $(this).parent().parent().prev().children(".dj").html().substring(1); var sl = $(this).prev("span").html(); $(this).parent().parent().parent().children("li:nth-child(5)").children(".zj").html("￥" + dj * sl + ".00") sumSumPrice(); }) //- $(".One_ShopCon ul li>div:nth-child(2) ol>li:nth-child(4) p:first-child span:first-child").click(function() { var jian = $(this).next("span").html(); jian--; if (jian <= 0) { jian = 0; } $(this).next("span").html(jian); //总价 var dj = $(this).parent().parent().prev().children(".dj").html().substring(1); var sl = $(this).next("span").html(); $(this).parent().parent().parent().children("li:nth-child(5)").children(".zj").html("￥" + dj * sl + ".00") sumSumPrice(); }) //选中当前商品背景变色 $(".check").each(function(index) { $(".check").eq(index).click(function() { if ($(this).is(":checked")) { $(this).parent().parent().parent().css("background", "#fff4e8"); $(this).parent().parent().parent().parent().children("div:last-child").css("background", "#fff4e8") } else { $(this).parent().parent().parent().parent().children("div:last-child").css("background", "none") $(this).parent().parent().parent().css("background", "none") } }) }) //商品删除鼠标移入变色 $(".One_ShopCon ul li>div:nth-child(2) ol>li:nth-child(6) p").mouseover(function() { $(this).css({ "cursor": "pointer", "color": "#e64346" }); }).mouseout(function() { $(this).css({ "cursor": "pointer", "color": "gray" }); }) $(".One_ShopCon ul li>div:nth-child(2) ol>li:nth-child(6) p:nth-child(2)").click(function() { $(".One_mb").show(); $(".One_moveMyGz").show(); }) $(".One_ShopCon ul li>div:nth-child(2) ol>li:nth-child(6) p:last-child").click(function() { $(".One_mb").show(); $(".One_DengLu").show(); }) //点击删除 //点击删除出现弹框 $(".One_isDel>p img").click(function() { $(".One_mb").hide(); $(".One_isDel").hide(); }) $(".One_ShopCon ul li>div:nth-child(2) ol>li:nth-child(6) p:first-child").click(function() { $(".One_mb").show(); $(".One_isDel").show(); }) $(".One_isDel>div:last-child button").mouseover(function() { $(this).css("cursor", "pointer"); }) $(".One_ShopFootBuy>div:first-child ul li:not(:first-child)").mouseover(function() { $(this).css({ "cursor": "pointer", "color": "#e64346" }) }).mouseout(function() { $(this).css("color", "black") }) //封装总价钱函数 function sumSumPrice() { console.log("计算总价"); var zzj = 0; $(".check").each(function() { if ($(this).prop("checked")) { console.log("check!!" + $(this).parents("ol").find(".zj").html()); var zj = $(this).parents("ol").find(".zj").html().substring(1); console.log(" 价格：" + zj); zzj = zzj + parseFloat(zj); } $(".fnt").html("￥" + zzj + ".00") }) } //封装总数量函数 function sumSumNum() { var kong = 0; $(".One_ShopCon ul li>div:nth-child(2) ol>li:nth-child(4) p:first-child span:nth-child(2)").each(function() { kong += parseFloat($(this).html()) }) $(".sumNum").html(kong); } $(".One_ShopCon ul li>div:nth-child(2)>ol>li:nth-child(2)>dd").mouseover(function() { $(this).css({ "cursor": "pointer", "color": "#e64346" }) }).mouseout(function() { $(this).css("color", "black") }) //更多促销下拉 $(".One_ShopCon ul li>div:nth-child(2) ol li:nth-child(3) p:nth-child(2)").click(function() { $(this).parent().children(".nmbd").slideToggle(300); var dis = $(this).parent().children(".nmbd").css("display"); console.log(dis); }) $(".nmbd dd:last-child button:first-child").click(function() { $(this).parent().parent().slideUp(100) }) $(".nmbd dd:last-child button:last-child").click(function() { $(this).parent().parent().slideUp(100) }) //active $(".one_main_div1 .one_main_ul>li").mouseover(function() { $(".one_main_div1 .one_main_ul>li").removeClass("active"); $(this).addClass("active"); }) //选项卡 $(".one_main_div1 .one_main_ul li").mouseover(function() { $(".one_main_div1_1").eq($(this).index()).stop(true).show().siblings().stop(true).hide() }) $(function() { //声明变量记录索引 var index = 0; //点击右边按钮 //忽略重复点击开关 var toggle = true $(".arrow-right").click(function() { if (toggle == false) { return } toggle = false index++; if (index > $('.fade li').length - 1) { index = 0; } }); //点击左边按钮 $(".arrow-left").click(function() { if (toggle == false) { return } toggle = false index--; if (index < 0) { index = $('.fade li').length - 1; } $('.pagination ul li').eq(index).addClass('active').siblings().removeClass('active') $(".slider>ul>li").eq(index).fadeIn(500, function() { toggle = true }).siblings("li").fadeOut(500); }); //点击分页器 $('.pagination ul li').mouseover(function() { var paging = $(this).index() //变颜色 $(this).addClass('active').siblings().removeClass('active') //与图片关联 $(".slider>ul>li").eq(paging).fadeIn(1000).siblings("li").fadeOut(1000); }) }); $(".fade li>div a").mouseover(function() { $(this).children("p").children("img").attr("src", "img/one_mian_gwc2.png") }).mouseout(function() { $(this).children("p").children("img").attr("src", "img/one_mian_gwc1.png") }) function itemCheck(event){ let skuId = event.target.getAttribute("skuId"); let check = event.target.checked; let ajax = new XMLHttpRequest(); ajax.onreadystatechange = function(){ if(ajax.readyState === 4){ if(ajax.status === 200){ let result = JSON.parse(ajax.responseText); if(result.code != 0){ event.target.checked = !check; } } } } ajax.open("GET","http://cart.alatusmall.com/checkItem?skuId=" + skuId + "&check=" + (check ? 1 : 0),true); ajax.send(); } function login() { location.href = "http://auth.alatusmall.com/login.html"; } $(".countOpsBtn").click(function(){ // 获取SkuID let skuId = $(this).parent().attr("skuId"); let count = $(this).parent().find(".countOpsNum"); let num = count.text(); let ajax = new XMLHttpRequest(); ajax.onreadystatechange = function(){ if(ajax.readyState === 4){ if(ajax.satus === 200){ let result = JSON.parse(ajax.responseText); if(result.code != 0){ count.text(num - 1); } } } } ajax.open("GET","http://cart.alatusmall.com/countItem?skuId=" + skuId + "&num="+num,true); ajax.send(); }); var deleteId = 0; function deleteItem(){ location.href = "http://cart.alatusmall.com/deleteItem?skuId="+deleteId; } $(".deleteItemBtn").click(function(){ deleteId = $(this).attr("skuId"); }); </script> </html>
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"> <head> <meta charset="UTF-8"> <title></title> <link rel="stylesheet" href="/static/order/pay/css/style.css"> <script src="/static/order/pay/js/jquery-3.1.1.min.js" charset="utf-8"></script> </head> <body> <div class="One_Jdbox"> <div class="Jdbox_head"> <img src="/static/order/pay/img/logo1.jpg" alt=""><span class="bank">收银台</span> <ul> <li><span>[[${session.get('loginUser').getNickname()}]]</span><span>退出</span></li> <li>我的订单</li> <li>支付帮助</li> </ul> </div> <div class="Jdbox_BuySuc"> <dl> <dt><img src="/static/order/pay/img/saoyisao.png" alt=""></dt> <dd> <span>订单提交成功，请尽快付款！订单号：[[${submitOrder.getOrderEntity().getOrderSn()}]]</span> <span>应付金额<font>[[${#numbers.formatDecimal(submitOrder.getOrderEntity().getPayAmount(),1,2)}]]</font>元</span> </dd> <dd> <span>推荐使用</span> <span>扫码支付请您在<font>24小时</font>内完成支付，否则订单会被自动取消(库存紧订单请参见详情页时限)</span> <span>订单详细</span> </dd> </dl> </div> <div class="Jd_Con"> <p class="JdCon_title"><img src="/static/order/pay/img/title.png" alt=""></p> <div class="Jd_Fenqi"> <ul> <li><img src="/static/order/pay/img/BAITIAO_2.0.png" alt="">打白条</li> <li> <span>可用额度 7275.38元</span> <span>白条还款日 2018-01-27</span> <span><font>优惠</font>随机立减(最高10元)</span> </li> <li>支付<font>28.90</font>元</li> </ul> <ol> <li> <p>不分期</p> <p>0服务费</p> </li> <li> <p>3期</p> <p>9.48元/期</p> </li> <li> <p>6期</p> <p>4.94元/期</p> </li> <li> <p>12期</p> <p>2.35元/期</p> </li> <li> <p>24期</p> <p>1.44元/期</p> </li> </ol> </div> <div class="Jd_main"> <ul> <li> <span> <img src="/static/order/pay/img/XJKCONSUME.png" alt="">谷粒学院小金库 </span> <span>未开通小金库</span> </li> <li> <span> <img src="/static/order/pay/img/CMB.png" alt="">招商银行 </span> <span>信用卡(4337)</span> <span><font>优惠</font>单单减最高99元</span> </li> <li> <button>更多付款方式</button> <button>添加新卡/网银支付</button> </li> <li> <p>请输入6位数字支付密码</p> <input type="password"><span>忘记支付密码？</span> </li> <li> <button>立即支付</button> </li> </ul> </div> </div> <div class="Jd_footer"> <ul> <li> <img src="/static/order/pay/img/weixin.png" alt="">微信支付 </li> <li> <img src="/static/order/pay/img/zhifubao.png" style="weight:auto;height:30px;" alt="">支付宝 </li> </ul> </div> <div class="Jd_foots"> <p> <span>Copyright @2004-2017 谷粒学院gulimall.com 版权所有</span> <span> <img src="/static/order/pay/img/foots.png" alt=""> </span> </p> </div> </div> </body> <script type="text/javascript"> //头部订单成功 订单详细鼠标移入效果 $(".Jdbox_BuySuc dl dd:last-child span:last-child").mouseover(function(){ $(this).css({"cursor":"pointer","color":"#E31613"}) }).mouseout(function(){ $(this).css("color","#7EA4FF") }) //分期付款鼠标移入hover效果 $(".Jd_Fenqi>ol li:not(:first-child)").mouseover(function(){ $(this).css({"cursor":"pointer","border":"1px solid #E31613"}) }).mouseout(function(){ $(this).css("border","1px solid #C9DFFF") }) //支付方式按钮选择hover效果 $(".Jd_main ul li:nth-child(3) button").mouseover(function(){ $(this).css({"cursor":"pointer","color":"#E31613"}) }).mouseout(function(){ $(this).css("color","#67A4FF") }) //忘记密码鼠标移入效果 $(".Jd_main ul li:nth-child(4) span").mouseover(function(){ $(this).css({"cursor":"pointer","color":"#E31613"}) }).mouseout(function(){ $(this).css("color","#67A4FF") }) //立即支付按钮效果 $(".Jd_main ul li:nth-child(5) button").mouseover(function(){ $(this).css({"cursor":"pointer","background":"#FF5350"}) }).mouseout(function(){ $(this).css("background","#FC6E6C") }) $(".Jd_footer ul li").mouseover(function(){ $(this).css({"cursor":"pointer","color":"#E31613"}) }).mouseout(function(){ $(this).css("color","#5E5E5E") }) $(".Jdbox_head>ul li span").mouseover(function(){ $(this).css({"cursor":"pointer","color":"#E31613"}) }).mouseout(function(){ $(this).css("color","#666666") }) $(".Jdbox_head>ul li:not(:first-child)").mouseover(function(){ $(this).css({"cursor":"pointer","color":"#E31613"}) }).mouseout(function(){ $(this).css("color","#666666") }) $(".Jd_Fenqi ul li:first-child").mouseover(function(){ $(this).css({"cursor":"pointer","color":"#666666"}) }).mouseout(function(){ $(this).css({"color":"black"}) }) </script> </html><!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"> <head> <meta charset="UTF-8"> <title></title> <link rel="stylesheet" href="/static/order/pay/css/style.css"> <script src="/static/order/pay/js/jquery-3.1.1.min.js" charset="utf-8"></script> </head> <body> <div class="One_Jdbox"> <div class="Jdbox_head"> <img src="/static/order/pay/img/logo1.jpg" alt=""><span class="bank">收银台</span> <ul> <li><span>[[${session.get('loginUser').getNickname()}]]</span><span>退出</span></li> <li>我的订单</li> <li>支付帮助</li> </ul> </div> <div class="Jdbox_BuySuc"> <dl> <dt><img src="/static/order/pay/img/saoyisao.png" alt=""></dt> <dd> <span>订单提交成功，请尽快付款！订单号：[[${submitOrder.getOrderEntity().getOrderSn()}]]</span> <span>应付金额<font>[[${#numbers.formatDecimal(submitOrder.getOrderEntity().getPayAmount(),1,2)}]]</font>元</span> </dd> <dd> <span>推荐使用</span> <span>扫码支付请您在<font>24小时</font>内完成支付，否则订单会被自动取消(库存紧订单请参见详情页时限)</span> <span>订单详细</span> </dd> </dl> </div> <div class="Jd_Con"> <p class="JdCon_title"><img src="/static/order/pay/img/title.png" alt=""></p> <div class="Jd_Fenqi"> <ul> <li><img src="/static/order/pay/img/BAITIAO_2.0.png" alt="">打白条</li> <li> <span>可用额度 7275.38元</span> <span>白条还款日 2018-01-27</span> <span><font>优惠</font>随机立减(最高10元)</span> </li> <li>支付<font>28.90</font>元</li> </ul> <ol> <li> <p>不分期</p> <p>0服务费</p> </li> <li> <p>3期</p> <p>9.48元/期</p> </li> <li> <p>6期</p> <p>4.94元/期</p> </li> <li> <p>12期</p> <p>2.35元/期</p> </li> <li> <p>24期</p> <p>1.44元/期</p> </li> </ol> </div> <div class="Jd_main"> <ul> <li> <span> <img src="/static/order/pay/img/XJKCONSUME.png" alt="">谷粒学院小金库 </span> <span>未开通小金库</span> </li> <li> <span> <img src="/static/order/pay/img/CMB.png" alt="">招商银行 </span> <span>信用卡(4337)</span> <span><font>优惠</font>单单减最高99元</span> </li> <li> <button>更多付款方式</button> <button>添加新卡/网银支付</button> </li> <li> <p>请输入6位数字支付密码</p> <input type="password"><span>忘记支付密码？</span> </li> <li> <button>立即支付</button> </li> </ul> </div> </div> <div class="Jd_footer"> <ul> <li> <img src="/static/order/pay/img/weixin.png" alt="">微信支付 </li> <li> <img src="/static/order/pay/img/zhifubao.png" style="weight:auto;height:30px;" alt="">支付宝 </li> </ul> </div> <div class="Jd_foots"> <p> <span>Copyright @2004-2017 谷粒学院gulimall.com 版权所有</span> <span> <img src="/static/order/pay/img/foots.png" alt=""> </span> </p> </div> </div> </body> <script type="text/javascript"> //头部订单成功 订单详细鼠标移入效果 $(".Jdbox_BuySuc dl dd:last-child span:last-child").mouseover(function(){ $(this).css({"cursor":"pointer","color":"#E31613"}) }).mouseout(function(){ $(this).css("color","#7EA4FF") }) //分期付款鼠标移入hover效果 $(".Jd_Fenqi>ol li:not(:first-child)").mouseover(function(){ $(this).css({"cursor":"pointer","border":"1px solid #E31613"}) }).mouseout(function(){ $(this).css("border","1px solid #C9DFFF") }) //支付方式按钮选择hover效果 $(".Jd_main ul li:nth-child(3) button").mouseover(function(){ $(this).css({"cursor":"pointer","color":"#E31613"}) }).mouseout(function(){ $(this).css("color","#67A4FF") }) //忘记密码鼠标移入效果 $(".Jd_main ul li:nth-child(4) span").mouseover(function(){ $(this).css({"cursor":"pointer","color":"#E31613"}) }).mouseout(function(){ $(this).css("color","#67A4FF") }) //立即支付按钮效果 $(".Jd_main ul li:nth-child(5) button").mouseover(function(){ $(this).css({"cursor":"pointer","background":"#FF5350"}) }).mouseout(function(){ $(this).css("background","#FC6E6C") }) $(".Jd_footer ul li").mouseover(function(){ $(this).css({"cursor":"pointer","color":"#E31613"}) }).mouseout(function(){ $(this).css("color","#5E5E5E") }) $(".Jdbox_head>ul li span").mouseover(function(){ $(this).css({"cursor":"pointer","color":"#E31613"}) }).mouseout(function(){ $(this).css("color","#666666") }) $(".Jdbox_head>ul li:not(:first-child)").mouseover(function(){ $(this).css({"cursor":"pointer","color":"#E31613"}) }).mouseout(function(){ $(this).css("color","#666666") }) $(".Jd_Fenqi ul li:first-child").mouseover(function(){ $(this).css({"cursor":"pointer","color":"#666666"}) }).mouseout(function(){ $(this).css({"color":"black"}) }) </script> </html>
package com.alatus.mall.order.web; import com.alatus.common.exception.NoStockException; import com.alatus.mall.order.service.OrderService; import com.alatus.mall.order.vo.OrderConfirmVo; import com.alatus.mall.order.vo.OrderSubmitVo; import com.alatus.mall.order.vo.SubmitOrderResponseVo; import com.alibaba.fastjson.JSON; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.stereotype.Controller; import org.springframework.ui.Model; import org.springframework.web.bind.annotation.GetMapping; import org.springframework.web.bind.annotation.PathVariable; import org.springframework.web.bind.annotation.PostMapping; import org.springframework.web.bind.annotation.ResponseBody; import org.springframework.web.servlet.mvc.support.RedirectAttributes; import java.math.BigDecimal; import java.util.concurrent.ExecutionException; @Controller public class OrderWebController { @Autowired private OrderService orderService; @GetMapping("/toTrade") public String toTrade(Model model) throws ExecutionException, InterruptedException { OrderConfirmVo confirmVo = orderService.confirmOrder(); model.addAttribute("orderConfirmData",confirmVo); return "confirm"; } @GetMapping("/changeAddr/{addrId}") @ResponseBody public String changeAddr(@PathVariable("addrId") Long addrId) throws ExecutionException, InterruptedException { BigDecimal bigDecimal = orderService.changeAddr(addrId); return JSON.toJSONString(bigDecimal); } @PostMapping("/submitOrder") public String submitOrder(OrderSubmitVo orderSubmitVo, Model model, RedirectAttributes redirectAttributes){ try{ // 去创建订单,验证令牌,验证价格,锁定库存 SubmitOrderResponseVo submitOrderResponseVo = orderService.submitOrder(orderSubmitVo); if(submitOrderResponseVo.getCode()==0){ // 下单成功去支付选择页面 model.addAttribute("submitOrder",submitOrderResponseVo); return "pay"; }else{ // 下单失败去重新确认订单信息 String msg = "下单失败"; switch (submitOrderResponseVo.getCode()){ case 1: msg += "订单信息过期,请刷新再次提交"; break; case 2: msg += "订单商品价格发生,请确认后再次提交"; break; } redirectAttributes.addFlashAttribute("msg",msg); return "redirect:http://order.alatusmall.com/toTrade"; } }catch (Exception e){ if(e instanceof NoStockException){ redirectAttributes.addFlashAttribute("msg","库存锁定失败,商品库存不足"); } return "redirect:http://order.alatusmall.com/toTrade"; } } }package com.alatus.mall.order.web; import com.alatus.common.exception.NoStockException; import com.alatus.mall.order.service.OrderService; import com.alatus.mall.order.vo.OrderConfirmVo; import com.alatus.mall.order.vo.OrderSubmitVo; import com.alatus.mall.order.vo.SubmitOrderResponseVo; import com.alibaba.fastjson.JSON; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.stereotype.Controller; import org.springframework.ui.Model; import org.springframework.web.bind.annotation.GetMapping; import org.springframework.web.bind.annotation.PathVariable; import org.springframework.web.bind.annotation.PostMapping; import org.springframework.web.bind.annotation.ResponseBody; import org.springframework.web.servlet.mvc.support.RedirectAttributes; import java.math.BigDecimal; import java.util.concurrent.ExecutionException; @Controller public class OrderWebController { @Autowired private OrderService orderService; @GetMapping("/toTrade") public String toTrade(Model model) throws ExecutionException, InterruptedException { OrderConfirmVo confirmVo = orderService.confirmOrder(); model.addAttribute("orderConfirmData",confirmVo); return "confirm"; } @GetMapping("/changeAddr/{addrId}") @ResponseBody public String changeAddr(@PathVariable("addrId") Long addrId) throws ExecutionException, InterruptedException { BigDecimal bigDecimal = orderService.changeAddr(addrId); return JSON.toJSONString(bigDecimal); } @PostMapping("/submitOrder") public String submitOrder(OrderSubmitVo orderSubmitVo, Model model, RedirectAttributes redirectAttributes){ try{ // 去创建订单,验证令牌,验证价格,锁定库存 SubmitOrderResponseVo submitOrderResponseVo = orderService.submitOrder(orderSubmitVo); if(submitOrderResponseVo.getCode()==0){ // 下单成功去支付选择页面 model.addAttribute("submitOrder",submitOrderResponseVo); return "pay"; }else{ // 下单失败去重新确认订单信息 String msg = "下单失败"; switch (submitOrderResponseVo.getCode()){ case 1: msg += "订单信息过期,请刷新再次提交"; break; case 2: msg += "订单商品价格发生,请确认后再次提交"; break; } redirectAttributes.addFlashAttribute("msg",msg); return "redirect:http://order.alatusmall.com/toTrade"; } }catch (Exception e){ if(e instanceof NoStockException){ redirectAttributes.addFlashAttribute("msg","库存锁定失败,商品库存不足"); } return "redirect:http://order.alatusmall.com/toTrade"; } } }
package com.alatus.mall.cart.web; import com.alatus.common.utils.R; import com.alatus.mall.cart.service.CartService; import com.alatus.mall.cart.vo.Cart; import com.alatus.mall.cart.vo.CartItem; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.stereotype.Controller; import org.springframework.ui.Model; import org.springframework.web.bind.annotation.GetMapping; import org.springframework.web.bind.annotation.RequestParam; import org.springframework.web.bind.annotation.ResponseBody; import org.springframework.web.servlet.mvc.support.RedirectAttributes; import java.util.concurrent.ExecutionException; @Controller public class CartWebController { @Autowired private CartService cartService; @GetMapping("/cart.html") public String cartListPage(Model model) throws ExecutionException, InterruptedException { Cart cart = cartService.getCart(); model.addAttribute("cart",cart); return "cartList"; } @GetMapping("/deleteItem") public String deleteItem(@RequestParam("skuId")Long skuId){ cartService.deleteItem(skuId); return "redirect:http://cart.alatusmall.com/cart.html"; } @GetMapping("/countItem") public R countItem(@RequestParam("skuId") Long skuId, @RequestParam("num") Integer num){ cartService.changeItemCount(skuId,num); return R.ok(); } @GetMapping("/addToCart") public String addToCart(@RequestParam("skuId") Long skuId, @RequestParam("num") Integer num, RedirectAttributes model) throws ExecutionException, InterruptedException { if(num > 0){ cartService.addToCart(skuId,num); // RedirectAttributes的addAttribute会自动拼串,自动以参数的形式携带数据 // RedirectAttributes的addFlashAttribute()会保存在session里面,但是仅可以取一次值 model.addAttribute("skuId",skuId); return "redirect:http://cart.alatusmall.com/addToCartSuccess.html"; } return "redirect:http://cart.alatusmall.com/addToCartSuccess.html"; } @GetMapping("/checkItem") @ResponseBody public R checkItem(@RequestParam("skuId")Long skuId,@RequestParam("check")Integer check){ cartService.checkItem(skuId,check); return R.ok(); } @GetMapping("/addToCartSuccess.html") public String addToCartSuccessPage(@RequestParam("skuId")Long skuId,Model model){ CartItem cartItem = cartService.getCartItem(skuId); model.addAttribute("item",cartItem); return "success"; } }package com.alatus.mall.cart.web; import com.alatus.common.utils.R; import com.alatus.mall.cart.service.CartService; import com.alatus.mall.cart.vo.Cart; import com.alatus.mall.cart.vo.CartItem; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.stereotype.Controller; import org.springframework.ui.Model; import org.springframework.web.bind.annotation.GetMapping; import org.springframework.web.bind.annotation.RequestParam; import org.springframework.web.bind.annotation.ResponseBody; import org.springframework.web.servlet.mvc.support.RedirectAttributes; import java.util.concurrent.ExecutionException; @Controller public class CartWebController { @Autowired private CartService cartService; @GetMapping("/cart.html") public String cartListPage(Model model) throws ExecutionException, InterruptedException { Cart cart = cartService.getCart(); model.addAttribute("cart",cart); return "cartList"; } @GetMapping("/deleteItem") public String deleteItem(@RequestParam("skuId")Long skuId){ cartService.deleteItem(skuId); return "redirect:http://cart.alatusmall.com/cart.html"; } @GetMapping("/countItem") public R countItem(@RequestParam("skuId") Long skuId, @RequestParam("num") Integer num){ cartService.changeItemCount(skuId,num); return R.ok(); } @GetMapping("/addToCart") public String addToCart(@RequestParam("skuId") Long skuId, @RequestParam("num") Integer num, RedirectAttributes model) throws ExecutionException, InterruptedException { if(num > 0){ cartService.addToCart(skuId,num); // RedirectAttributes的addAttribute会自动拼串,自动以参数的形式携带数据 // RedirectAttributes的addFlashAttribute()会保存在session里面,但是仅可以取一次值 model.addAttribute("skuId",skuId); return "redirect:http://cart.alatusmall.com/addToCartSuccess.html"; } return "redirect:http://cart.alatusmall.com/addToCartSuccess.html"; } @GetMapping("/checkItem") @ResponseBody public R checkItem(@RequestParam("skuId")Long skuId,@RequestParam("check")Integer check){ cartService.checkItem(skuId,check); return R.ok(); } @GetMapping("/addToCartSuccess.html") public String addToCartSuccessPage(@RequestParam("skuId")Long skuId,Model model){ CartItem cartItem = cartService.getCartItem(skuId); model.addAttribute("item",cartItem); return "success"; } }
package com.alatus.mall.cart.service.impl; import com.alatus.common.utils.R; import com.alatus.mall.cart.feign.ProductFeignService; import com.alatus.mall.cart.service.CartService; import com.alatus.mall.cart.vo.Cart; import com.alatus.mall.cart.vo.CartItem; import com.alatus.mall.cart.vo.SkuInfoVo; import com.alatus.mall.cart.vo.UserInfoTo; import com.alibaba.fastjson.JSON; import com.alibaba.fastjson.TypeReference; import lombok.extern.slf4j.Slf4j; import org.apache.commons.lang.StringUtils; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.data.redis.core.BoundHashOperations; import org.springframework.data.redis.core.StringRedisTemplate; import org.springframework.stereotype.Service; import com.alatus.mall.cart.interceptor.CartInterceptor; import java.math.BigDecimal; import java.util.ArrayList; import java.util.List; import java.util.concurrent.CompletableFuture; import java.util.concurrent.ExecutionException; import java.util.concurrent.ThreadPoolExecutor; import java.util.stream.Collectors; @Slf4j @Service public class CartServiceImpl implements CartService { @Autowired private StringRedisTemplate redisTemplate; @Autowired private ProductFeignService productFeignService; @Autowired private ThreadPoolExecutor threadPoolExecutor; private final String CART_PREFIX = "alatusmall:cart:"; @Override public void addToCart(Long skuId, Integer num) throws ExecutionException, InterruptedException { BoundHashOperations<String, Object, Object> cartOps = getCartOps(); String res = (String) cartOps.get(skuId.toString()); if(StringUtils.isEmpty(res)){ CartItem cartItem = new CartItem(); // 当购物车没有该商品 // 查询商品服务目前添加的商品信息 CompletableFuture<Void> getSkuInfo = CompletableFuture.runAsync(() -> { R info = productFeignService.info(skuId); if (info.getCode() == 0) { SkuInfoVo skuInfo = info.get("skuInfo", new TypeReference<SkuInfoVo>() {}); cartItem.setCheck(true); cartItem.setCount(num); cartItem.setImage(skuInfo.getSkuDefaultImg()); cartItem.setTitle(skuInfo.getSkuTitle()); cartItem.setSkuId(skuId); cartItem.setPrice(skuInfo.getPrice()); } }, threadPoolExecutor); CompletableFuture<Void> getSkuAttrValues = CompletableFuture.runAsync(() -> { // 远程查询sku的组合信息 List<String> skuSaleAttrValues = productFeignService.getSkuSaleAttrValues(skuId); cartItem.setSkuAttr(skuSaleAttrValues); }, threadPoolExecutor); CompletableFuture.allOf(getSkuInfo,getSkuAttrValues).get(); String jsonString = JSON.toJSONString(cartItem); cartOps.put(skuId.toString(),jsonString); } else{ // 购物车有这个商品 CartItem oldCartItem = JSON.parseObject(res, CartItem.class); oldCartItem.setCount(oldCartItem.getCount()+num); cartOps.put(skuId.toString(),JSON.toJSONString(oldCartItem)); } } @Override public CartItem getCartItem(Long skuId) { BoundHashOperations<String, Object, Object> cartOps = getCartOps(); String res = (String)cartOps.get(skuId.toString()); return JSON.parseObject(res, CartItem.class); } @Override public Cart getCart() throws ExecutionException, InterruptedException { UserInfoTo userInfoTo = CartInterceptor.threadLocal.get(); Cart cart = new Cart(); String userKey = CART_PREFIX + userInfoTo.getUserId(); String templateKey = CART_PREFIX + userInfoTo.getUserKey(); if (userInfoTo.getUserId()!=null) { // 登录了 // 先获取临时购物车 List<CartItem> tempCartItems = getCartItems(templateKey); // 如果临时购物车还没有合并 List<String> skuIds = new ArrayList<>(); if(tempCartItems!=null&&tempCartItems.size()>0){ // 两个购物车要合并 for (CartItem cartItem : tempCartItems) { addToCart(cartItem.getSkuId(),cartItem.getCount()); skuIds.add(cartItem.getSkuId().toString()); } // 清除临时购物车的数据 for (int i = 0; i < skuIds.size(); i++) { redisTemplate.boundHashOps(templateKey).delete(skuIds.get(i)); } } // 登陆后的所有购物车数据(包含所有合并的购物车) List<CartItem> newCartItems = getCartItems(userKey); cart.setItems(newCartItems); } else{ // 没登陆 List<CartItem> cartItems = getCartItems(templateKey); cart.setItems(cartItems); } return cart; } @Override public void checkItem(Long skuId, Integer check) { CartItem cartItem = getCartItem(skuId); cartItem.setCheck(check == 1); getCartOps().put(skuId.toString(),JSON.toJSONString(cartItem)); } @Override public void changeItemCount(Long skuId, Integer num) { CartItem cartItem = getCartItem(skuId); cartItem.setCount(num); getCartOps().put(skuId.toString(),JSON.toJSONString(cartItem)); } @Override public void deleteItem(Long skuId) { getCartOps().delete(skuId.toString()); } @Override public List<CartItem> getUserCartItems() { UserInfoTo userInfoTo = CartInterceptor.threadLocal.get(); if (userInfoTo.getUserId()!=null) { String cartKey = CART_PREFIX + userInfoTo.getUserId(); List<CartItem> cartItems = getCartItems(cartKey); cartItems = cartItems.stream().filter(CartItem::getCheck).map(item->{ // 更新为最新价格,因为购物车价格是缓存,不一定准确 // TODO 价格我们采用远程获取的方式 R price = productFeignService.getPrice(item.getSkuId()); if(price.getCode()==0){ item.setPrice(price.getData(new TypeReference<BigDecimal>(){})); } return item; }).collect(Collectors.toList()); return cartItems; } else{ return null; } } private List<CartItem> getCartItems(String cartKey){ BoundHashOperations<String, Object, Object> operations = redisTemplate.boundHashOps(cartKey); List<Object> values = operations.values(); if(values!=null&&values.size()>0){ List<CartItem> collect = values.stream().map((obj) -> { return JSON.parseObject(obj.toString(), CartItem.class); }).collect(Collectors.toList()); return collect; } else{ return null; } } // 获取我们要操作的购物车 private BoundHashOperations<String, Object, Object> getCartOps(){ UserInfoTo userInfoTo = CartInterceptor.threadLocal.get(); // 用户已登录 String cartKey = ""; if(userInfoTo.getUserId()!=null){ cartKey = CART_PREFIX + userInfoTo.getUserId(); } // 用户未登录 else{ cartKey = CART_PREFIX + userInfoTo.getUserKey(); } BoundHashOperations<String, Object, Object> operations = redisTemplate.boundHashOps(cartKey); return operations; } }package com.alatus.mall.cart.service.impl; import com.alatus.common.utils.R; import com.alatus.mall.cart.feign.ProductFeignService; import com.alatus.mall.cart.service.CartService; import com.alatus.mall.cart.vo.Cart; import com.alatus.mall.cart.vo.CartItem; import com.alatus.mall.cart.vo.SkuInfoVo; import com.alatus.mall.cart.vo.UserInfoTo; import com.alibaba.fastjson.JSON; import com.alibaba.fastjson.TypeReference; import lombok.extern.slf4j.Slf4j; import org.apache.commons.lang.StringUtils; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.data.redis.core.BoundHashOperations; import org.springframework.data.redis.core.StringRedisTemplate; import org.springframework.stereotype.Service; import com.alatus.mall.cart.interceptor.CartInterceptor; import java.math.BigDecimal; import java.util.ArrayList; import java.util.List; import java.util.concurrent.CompletableFuture; import java.util.concurrent.ExecutionException; import java.util.concurrent.ThreadPoolExecutor; import java.util.stream.Collectors; @Slf4j @Service public class CartServiceImpl implements CartService { @Autowired private StringRedisTemplate redisTemplate; @Autowired private ProductFeignService productFeignService; @Autowired private ThreadPoolExecutor threadPoolExecutor; private final String CART_PREFIX = "alatusmall:cart:"; @Override public void addToCart(Long skuId, Integer num) throws ExecutionException, InterruptedException { BoundHashOperations<String, Object, Object> cartOps = getCartOps(); String res = (String) cartOps.get(skuId.toString()); if(StringUtils.isEmpty(res)){ CartItem cartItem = new CartItem(); // 当购物车没有该商品 // 查询商品服务目前添加的商品信息 CompletableFuture<Void> getSkuInfo = CompletableFuture.runAsync(() -> { R info = productFeignService.info(skuId); if (info.getCode() == 0) { SkuInfoVo skuInfo = info.get("skuInfo", new TypeReference<SkuInfoVo>() {}); cartItem.setCheck(true); cartItem.setCount(num); cartItem.setImage(skuInfo.getSkuDefaultImg()); cartItem.setTitle(skuInfo.getSkuTitle()); cartItem.setSkuId(skuId); cartItem.setPrice(skuInfo.getPrice()); } }, threadPoolExecutor); CompletableFuture<Void> getSkuAttrValues = CompletableFuture.runAsync(() -> { // 远程查询sku的组合信息 List<String> skuSaleAttrValues = productFeignService.getSkuSaleAttrValues(skuId); cartItem.setSkuAttr(skuSaleAttrValues); }, threadPoolExecutor); CompletableFuture.allOf(getSkuInfo,getSkuAttrValues).get(); String jsonString = JSON.toJSONString(cartItem); cartOps.put(skuId.toString(),jsonString); } else{ // 购物车有这个商品 CartItem oldCartItem = JSON.parseObject(res, CartItem.class); oldCartItem.setCount(oldCartItem.getCount()+num); cartOps.put(skuId.toString(),JSON.toJSONString(oldCartItem)); } } @Override public CartItem getCartItem(Long skuId) { BoundHashOperations<String, Object, Object> cartOps = getCartOps(); String res = (String)cartOps.get(skuId.toString()); return JSON.parseObject(res, CartItem.class); } @Override public Cart getCart() throws ExecutionException, InterruptedException { UserInfoTo userInfoTo = CartInterceptor.threadLocal.get(); Cart cart = new Cart(); String userKey = CART_PREFIX + userInfoTo.getUserId(); String templateKey = CART_PREFIX + userInfoTo.getUserKey(); if (userInfoTo.getUserId()!=null) { // 登录了 // 先获取临时购物车 List<CartItem> tempCartItems = getCartItems(templateKey); // 如果临时购物车还没有合并 List<String> skuIds = new ArrayList<>(); if(tempCartItems!=null&&tempCartItems.size()>0){ // 两个购物车要合并 for (CartItem cartItem : tempCartItems) { addToCart(cartItem.getSkuId(),cartItem.getCount()); skuIds.add(cartItem.getSkuId().toString()); } // 清除临时购物车的数据 for (int i = 0; i < skuIds.size(); i++) { redisTemplate.boundHashOps(templateKey).delete(skuIds.get(i)); } } // 登陆后的所有购物车数据(包含所有合并的购物车) List<CartItem> newCartItems = getCartItems(userKey); cart.setItems(newCartItems); } else{ // 没登陆 List<CartItem> cartItems = getCartItems(templateKey); cart.setItems(cartItems); } return cart; } @Override public void checkItem(Long skuId, Integer check) { CartItem cartItem = getCartItem(skuId); cartItem.setCheck(check == 1); getCartOps().put(skuId.toString(),JSON.toJSONString(cartItem)); } @Override public void changeItemCount(Long skuId, Integer num) { CartItem cartItem = getCartItem(skuId); cartItem.setCount(num); getCartOps().put(skuId.toString(),JSON.toJSONString(cartItem)); } @Override public void deleteItem(Long skuId) { getCartOps().delete(skuId.toString()); } @Override public List<CartItem> getUserCartItems() { UserInfoTo userInfoTo = CartInterceptor.threadLocal.get(); if (userInfoTo.getUserId()!=null) { String cartKey = CART_PREFIX + userInfoTo.getUserId(); List<CartItem> cartItems = getCartItems(cartKey); cartItems = cartItems.stream().filter(CartItem::getCheck).map(item->{ // 更新为最新价格,因为购物车价格是缓存,不一定准确 // TODO 价格我们采用远程获取的方式 R price = productFeignService.getPrice(item.getSkuId()); if(price.getCode()==0){ item.setPrice(price.getData(new TypeReference<BigDecimal>(){})); } return item; }).collect(Collectors.toList()); return cartItems; } else{ return null; } } private List<CartItem> getCartItems(String cartKey){ BoundHashOperations<String, Object, Object> operations = redisTemplate.boundHashOps(cartKey); List<Object> values = operations.values(); if(values!=null&&values.size()>0){ List<CartItem> collect = values.stream().map((obj) -> { return JSON.parseObject(obj.toString(), CartItem.class); }).collect(Collectors.toList()); return collect; } else{ return null; } } // 获取我们要操作的购物车 private BoundHashOperations<String, Object, Object> getCartOps(){ UserInfoTo userInfoTo = CartInterceptor.threadLocal.get(); // 用户已登录 String cartKey = ""; if(userInfoTo.getUserId()!=null){ cartKey = CART_PREFIX + userInfoTo.getUserId(); } // 用户未登录 else{ cartKey = CART_PREFIX + userInfoTo.getUserKey(); } BoundHashOperations<String, Object, Object> operations = redisTemplate.boundHashOps(cartKey); return operations; } }
扫一扫
29万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
