diff --git a/src/main/java/com/phy/ebuy/controller/EbuyController.java b/src/main/java/com/phy/ebuy/controller/EbuyController.java index c0fe91f..19ab7c4 100644 --- a/src/main/java/com/phy/ebuy/controller/EbuyController.java +++ b/src/main/java/com/phy/ebuy/controller/EbuyController.java @@ -107,6 +107,12 @@ public class EbuyController { return "/cart.html"; } + //商品页面 + @RequestMapping("/commodity") + public String commodity() { + return "/commodity.html"; + } + //验证登录 @ResponseBody @RequestMapping("/verifyLogin") @@ -153,12 +159,28 @@ public class EbuyController { //获取商品分类 @RequestMapping("/commodityType") @ResponseBody - public List> commodityType(String typeDowns) { + public Map commodityType(String typeDowns) { String str = typeDowns.substring(typeDowns.indexOf("[")+2,typeDowns.indexOf("]")-1); String[] typeDownsArr = str.split("\",\""); - List> result = new ArrayList<>(); + Map result = new HashMap<>(); result = ebuyService.typeDown(typeDownsArr); return result; } + //购物车 + @RequestMapping("/getCartInfo") + @ResponseBody + public List> getCartInfo(@RequestParam("userId")String userId) { + List> result = ebuyService.getCartInfo(userId); + return result; + } + + //查询商品 + @RequestMapping("/commodityInfo") + @ResponseBody + public List> commodityInfo(@RequestParam("keyword")String keyword) { + List> result = ebuyService.commodityInfo(keyword); + return result; + } + } diff --git a/src/main/java/com/phy/ebuy/dao/EbuyMapper.java b/src/main/java/com/phy/ebuy/dao/EbuyMapper.java index aad5a6a..2bed63a 100644 --- a/src/main/java/com/phy/ebuy/dao/EbuyMapper.java +++ b/src/main/java/com/phy/ebuy/dao/EbuyMapper.java @@ -32,6 +32,15 @@ public interface EbuyMapper { /** * 获取商品分类 */ - String[] typeDown(String typeDown); + List typeDown(String typeDown); + /** + * 获取购物车信息 + */ + List> getCartInfo(String userId); + + /** + * 获取商品列表 + */ + List> commodityInfo(String keyword); } diff --git a/src/main/java/com/phy/ebuy/dao/mapping/EbuyMapper.xml b/src/main/java/com/phy/ebuy/dao/mapping/EbuyMapper.xml index 7a5618b..0bba8c4 100644 --- a/src/main/java/com/phy/ebuy/dao/mapping/EbuyMapper.xml +++ b/src/main/java/com/phy/ebuy/dao/mapping/EbuyMapper.xml @@ -33,10 +33,13 @@ + + + + + + \ No newline at end of file diff --git a/src/main/java/com/phy/ebuy/service/EbuyService.java b/src/main/java/com/phy/ebuy/service/EbuyService.java index b56efdd..1189dd0 100644 --- a/src/main/java/com/phy/ebuy/service/EbuyService.java +++ b/src/main/java/com/phy/ebuy/service/EbuyService.java @@ -4,24 +4,34 @@ import java.util.HashMap; import java.util.List; import java.util.Map; -public interface EbuyService{ +public interface EbuyService { /** * 验证登录 */ - Map verifyLogin(Map parameter); + Map verifyLogin(Map parameter); /** * 注册提交 */ - Map registerSub(Map parameter); + Map registerSub(Map parameter); /** * 所有订单Table */ - List> allOrderTable(String orderStatus); + List> allOrderTable(String orderStatus); /** * 获取商品分类 */ - List> typeDown(String[] typeDown); -} + Map typeDown(String[] typeDown); + + /** + * 获取购物车信息 + */ + List> getCartInfo(String userId); + + /** + * 获取商品列表 + */ + List> commodityInfo(String keyword); +} \ No newline at end of file diff --git a/src/main/java/com/phy/ebuy/service/impl/EbuyServiceImpl.java b/src/main/java/com/phy/ebuy/service/impl/EbuyServiceImpl.java index 96d8d79..7295e2f 100644 --- a/src/main/java/com/phy/ebuy/service/impl/EbuyServiceImpl.java +++ b/src/main/java/com/phy/ebuy/service/impl/EbuyServiceImpl.java @@ -68,12 +68,25 @@ public class EbuyServiceImpl implements EbuyService { } @Override - public List> typeDown(String[] typeDowns) { - List> result = new ArrayList<>(); + public Map typeDown(String[] typeDowns) { + Map result = new HashMap<>(); for (int i = 0; i < typeDowns.length; i++) { - String[] one = {}; + List one = new ArrayList<>(); one = ebuyMapper.typeDown(typeDowns[i]); + result.put(typeDowns[i]+","+i,one); } return result; } + + @Override + public List> getCartInfo(String userId) { + List> result = ebuyMapper.getCartInfo(userId); + return result; + } + + @Override + public List> commodityInfo(String keyword) { + List> result = ebuyMapper.commodityInfo(keyword); + return result; + } } diff --git a/src/main/webapp/WEB-INF/view/cart.html b/src/main/webapp/WEB-INF/view/cart.html index ffbf310..005ea2b 100644 --- a/src/main/webapp/WEB-INF/view/cart.html +++ b/src/main/webapp/WEB-INF/view/cart.html @@ -38,7 +38,7 @@
操作
-
+
diff --git a/src/main/webapp/WEB-INF/view/commodity.html b/src/main/webapp/WEB-INF/view/commodity.html new file mode 100644 index 0000000..745ac65 --- /dev/null +++ b/src/main/webapp/WEB-INF/view/commodity.html @@ -0,0 +1,127 @@ + + + + + Title + + + + + + + + + +
+
+ +
+
+ +
+
+
+ + +
+ +
+
+ + + + + \ No newline at end of file diff --git a/src/main/webapp/WEB-INF/view/index.html b/src/main/webapp/WEB-INF/view/index.html index a97eb4b..8009940 100644 --- a/src/main/webapp/WEB-INF/view/index.html +++ b/src/main/webapp/WEB-INF/view/index.html @@ -60,7 +60,7 @@
购物车 - 1 +
diff --git a/src/main/webapp/WEB-INF/view/middle.html b/src/main/webapp/WEB-INF/view/middle.html index f5bca6a..ea086f7 100644 --- a/src/main/webapp/WEB-INF/view/middle.html +++ b/src/main/webapp/WEB-INF/view/middle.html @@ -42,7 +42,7 @@
  • - 童装玩具 / 孕产 / 奶粉 + 童装玩具 / 孕产用品 / 奶粉
  • @@ -87,69 +87,9 @@
  • -
    -
    - 女装 -
    - 更多 - -
    -
    -
    - 羽绒服 - 棉衣棉服 - 毛呢大衣 - 毛衣针织 - 卫衣绒衫 - 皮衣皮草 - 裤裙 - 衬衫 - 半身裙 - 汉服 -
    -
    -
    -
    - 女装 -
    - 更多 - -
    -
    -
    - 羽绒服 - 棉衣棉服 - 毛呢大衣 - 毛衣针织 - 卫衣绒衫 - 皮衣皮草 - 裤裙 - 衬衫 - 半身裙 - 汉服 -
    -
    -
    -
    - 女装 -
    - 更多 - -
    -
    -
    - 羽绒服 - 棉衣棉服 - 毛呢大衣 - 毛衣针织 - 卫衣绒衫 - 皮衣皮草 - 裤裙 - 衬衫 - 半身裙 - 汉服 -
    -
    +
    +
    +
    猜你喜欢 @@ -197,126 +137,95 @@
    -
    +
    +
    +
    +
    +
    +
    +
    + 猜你喜欢 +
    +
    -
    -
    - 女装 -
    - 更多 - -
    -
    -
    - 羽绒服 - 棉衣棉服 - 毛呢大衣 - 毛衣针织 - 卫衣绒衫 - 皮衣皮草 - 裤裙 - 衬衫 - 半身裙 - 汉服 -
    -
    -
    -
    - 女装 -
    - 更多 - -
    -
    -
    - 羽绒服 - 棉衣棉服 - 毛呢大衣 - 毛衣针织 - 卫衣绒衫 - 皮衣皮草 - 裤裙 - 衬衫 - 半身裙 - 汉服 -
    -
    -
    -
    - 女装 -
    - 更多 - -
    -
    -
    - 羽绒服 - 棉衣棉服 - 毛呢大衣 - 毛衣针织 - 卫衣绒衫 - 皮衣皮草 - 裤裙 - 衬衫 - 半身裙 - 汉服 -
    -
    +
    +
    +
    +
    +
    + 猜你喜欢 +
    +
    +
    +
    +
    +
    +
    +
    +
    + 猜你喜欢 +
    +
    +
    +
    +
    +
    +
    +
    +
    + 猜你喜欢 +
    +
    +
    +
    +
    +
    +
    +
    + 猜你喜欢 +
    +
    +
    +
    +
    +
    +
    +
    +
    + 猜你喜欢 +
    +
    +
    +
    +
    +
    +
    +
    +
    + 猜你喜欢 +
    +
    +
    +
    +
    +
    +
    +
    +
    + 猜你喜欢 +
    +
    +
    +
    +
    +
    +
    猜你喜欢 -
    -
    -
    -
    - AngelFields公主风睡裙纯棉宫廷睡衣全棉复古连衣裙家居服 -
    -
    -
    -
    -
    - AngelFields公主风睡裙纯棉宫廷睡衣全棉复古连衣裙家居服 -
    -
    -
    -
    -
    -
    - AngelFields公主风睡裙纯棉宫廷睡衣全棉复古连衣裙家居服 -
    -
    -
    -
    -
    -
    - AngelFields公主风睡裙纯棉宫廷睡衣全棉复古连衣裙家居服 -
    -
    -
    -
    -
    -
    - AngelFields公主风睡裙纯棉宫廷睡衣全棉复古连衣裙家居服 -
    -
    -
    -
    -
    -
    - AngelFields公主风睡裙纯棉宫廷睡衣全棉复古连衣裙家居服 -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    diff --git a/src/main/webapp/static/css/cart.css b/src/main/webapp/static/css/cart.css index 66f1e5d..46cb783 100644 --- a/src/main/webapp/static/css/cart.css +++ b/src/main/webapp/static/css/cart.css @@ -137,6 +137,9 @@ body{ height: 10em; } +.middle .cart-info .info-one .one-commodity:hover{ + border:1px dashed #17b5fe; +} .middle .cart-info .info-one .one-commodity .check{ flex: 1; padding: 1em 0 0 1em; @@ -214,9 +217,9 @@ body{ .operation p{ margin-top: 0.2rem; } -.operation p:nth-child(3){ +/*.operation p:nth-child(3){ display: none; -} +}*/ .arithmetic:hover{ color: #17b5fe; border: 1px solid #17b5fe!important; @@ -224,16 +227,20 @@ body{ .frame{ border: 1px dashed #DBEBFE; } +.frame:hover{ + border:1px dashed #DBEBFE; +} .commodity-attribute i{ - /*display: none;*/ + display: none; float: right; margin: -1rem; } .commodity-attribute span{ - display: none; + /*display: none;*/ float: right; margin: -1rem; background: #17b5fe; color: #fff; cursor: pointer; } + diff --git a/src/main/webapp/static/css/commodity.css b/src/main/webapp/static/css/commodity.css new file mode 100644 index 0000000..3873867 --- /dev/null +++ b/src/main/webapp/static/css/commodity.css @@ -0,0 +1,134 @@ +p,span{ + text-decoration: none; +} +.middle .box{ + height: fit-content; +} +.middle .commodity-list{ + width: 80%; + margin: 0 auto; +} +.middle .commodity-list .commodity{ + height: 14em; + margin-top: 1em; +} +.commodity{ + margin-top: 1em; + /*background: rgb(245,245,245);*/ + /*height: 3em;*/ + /*line-height: 3em;*/ + height: 12em; +} +.commodity .business-name{ + height: 2em; +} +.business-name span:nth-child(4){ + float: right; + margin: 0 1rem; +} +.business-name span:nth-child(5){ + float: right; +} +.commodity .one-commodity{ + display: flex; + border: 1px solid rgb(204,204,204); + height: 10em; +} +.commodity .one-commodity .check{ + flex: 1; + padding: 1em 0 0 1em; +} +.middle .one-commodity .commodity-info{ + flex:14; + text-align: center; + padding: 1em; +} +.commodity-info img{ + height: 6rem; + width: 6rem; + float: left; +} +.commodity-info .commodity-name{ + float: left; + width: 7.3rem; + margin-left: 1rem; + text-align: initial; + color: rgb(60,60,60); +} +.middle .one-commodity .commodity-attribute{ + flex: 8; + text-align: inherit; + padding: 1em; + color: rgb(156,156,156); +} +.middle .one-commodity .commodity-attribute span{ + display: inline-block; +} +.middle .one-commodity .commodity-attribute .attribute{ + margin: 0.3rem 0; +} +.attribute select{ + height: 1.5rem; + line-height: 1.5rem; +} +.middle .one-commodity .commodity-price{ + flex: 6; + text-align: center; + padding: 1em; + font-weight: bold; +} +.commodity-price span:nth-child(3){ + font-weight: normal; + +} +.middle .one-commodity .commodity-amount{ + text-align: center; + padding:1em; +} +.commodity-amount .amount-box{ + width: 5rem; + display: flex; + margin: 0 auto; + height: 2em; + line-height: 2em; +} +.amount-box .subtraction{ + width: 1rem; + background: rgb(240,240,240); + border: 1px solid rgb(240,240,240); + user-select: none; +} +.amount-box input{ + width: 3rem; + + text-align: center; +} +.amount-box .addition{ + width: 1rem; + background: rgb(240,240,240); + border: 1px solid rgb(240,240,240); + user-select: none; +} +.middle .one-commodity .commodity-describe{ + flex: 12; + padding: 1rem 1rem 1rem 2rem; + overflow: auto; +} +.middle .one-commodity .operation{ + flex:8; + text-align: center; + padding: 1em; +} +.operation p{ + margin-top: 0.2rem; +} +.operation p :hover{ + +} +.arithmetic:hover{ + color: #17b5fe; + border: 1px solid #17b5fe!important; +} +.frame{ + border: 1px dashed #DBEBFE; +} diff --git a/src/main/webapp/static/css/index.css b/src/main/webapp/static/css/index.css index 82f9f1f..27438c2 100644 --- a/src/main/webapp/static/css/index.css +++ b/src/main/webapp/static/css/index.css @@ -14,6 +14,7 @@ body{ overflow: hidden; } .head{ + user-select: none; background: rgb(245,245,245); /*flex: 1;*/ width: 100%; @@ -357,7 +358,7 @@ body{ } .middle .box .search{ display: flex; - height: 20%; + height: 12.5em; width: 100%; } .middle .box .search .search-log{ @@ -518,8 +519,11 @@ body{ } .middle .box .navigation-carousel-person .carousel .li-content .three-type .type-1 .type-content span{ - margin-right: 1em; + display: inline-block; + margin: 0.4em 1em 0 0; white-space:nowrap; + font-size: 0.9em; + } .middle .box .navigation-carousel-person .carousel .li-content .you-like{ height: 100%; diff --git a/src/main/webapp/static/css/public.css b/src/main/webapp/static/css/public.css index 3ab3c41..e561502 100644 --- a/src/main/webapp/static/css/public.css +++ b/src/main/webapp/static/css/public.css @@ -7,4 +7,7 @@ .selection-text:hover{ color: #17b5fe; text-decoration: underline; -} \ No newline at end of file +} +.gray-font{ + color:rgb(136,136,136); +} diff --git a/src/main/webapp/static/img/commodity/女装/T恤/nvduanxiu04.jpg b/src/main/webapp/static/img/commodity/女装/T恤/nvduanxiu04.jpg new file mode 100644 index 0000000..956f561 Binary files /dev/null and b/src/main/webapp/static/img/commodity/女装/T恤/nvduanxiu04.jpg differ diff --git a/src/main/webapp/static/js/allOrder.js b/src/main/webapp/static/js/allOrder.js index 5e49b84..48a3085 100644 --- a/src/main/webapp/static/js/allOrder.js +++ b/src/main/webapp/static/js/allOrder.js @@ -28,12 +28,12 @@ layui.use(["layer","jquery","element","carousel","table"], function() {
    订单号: ${data[i].order_id}
    - ${data[i].businesses_name} + ${data[i].business_name}
    - +
    ${data[i].commodity_name}
    ${data[i].commodity_attribute}
    @@ -72,12 +72,12 @@ layui.use(["layer","jquery","element","carousel","table"], function() {
    订单号: ${data[i].order_id}
    - ${data[i].businesses_name} + ${data[i].business_name}
    - +
    ${data[i].commodity_name}
    ${data[i].commodity_attribute}
    @@ -112,12 +112,12 @@ layui.use(["layer","jquery","element","carousel","table"], function() {
    订单号: ${data[i].order_id}
    - ${data[i].businesses_name} + ${data[i].business_name}
    - +
    ${data[i].commodity_name}
    ${data[i].commodity_attribute}
    @@ -157,12 +157,12 @@ layui.use(["layer","jquery","element","carousel","table"], function() {
    订单号: ${data[i].order_id}
    - ${data[i].businesses_name} + ${data[i].business_name}
    - +
    ${data[i].commodity_name}
    ${data[i].commodity_attribute}
    diff --git a/src/main/webapp/static/js/cart.js b/src/main/webapp/static/js/cart.js index b1007c8..57e048d 100644 --- a/src/main/webapp/static/js/cart.js +++ b/src/main/webapp/static/js/cart.js @@ -1,22 +1,170 @@ -//一条记录悬停样式 -function oneOnmousemove() { - $(".operation p:nth-child(3)").css("display","block"); -} -function oneOnmouseout() { - $(".operation p:nth-child(3)").css("display","none"); -} +let userId = JSON.parse(sessionStorage.getItem("userInfo")).user_id; +//获取购物车信息 +$.ajax({ + url:"/ebuy/getCartInfo", + type:"post", + dataType:"json", + data:{ + userId:userId, + }, + success:function (data) { + console.log(data); + let cartInfo = ""; + for (let i = 0; i < data.length; i++) { + let attribute = data[i].commodity_attribute; + let attributes = attribute.split(","); + let attributesInfo = ""; + for (let j = 0; j < attributes.length; j++) { + let one = `

    ${attributes[j]}

    `; + attributesInfo += one; + } + let oneInfo = ` +
    +
    + + 店铺: + ${data[i].business_name} +
    +
    +
    + +
    +
    + +
    + ${data[i].commodity_name} +
    +
    +
    + 修改 + ` + +attributesInfo+ + ` +
    +
    + ¥${data[i].commodity_price} +
    +
    +
    +
    -
    + +
    +
    +
    +
    +
    ¥`+(data[i].commodity_price*data[i].commodity_amount).toFixed(2)+`
    +
    +

    移入收藏夹

    +

    删除

    +

    相似宝贝

    +
    +
    +
    + `; + cartInfo += oneInfo; + } + $(".cart-info").html(cartInfo); + + for (let i = 0; i < data.length; i++) { + //监听数量 + let $input = $(".amount:eq("+i+")"); + //商品数量 + let amount = $input.val(); + if (amount == 1) { + $(".subtraction:eq("+i+")").removeClass("arithmetic hand-shape"); + $(".subtraction:eq("+i+")").html(""); + $input.val(1); + } + //输入框监听 + $input.on("input propertychange",function () { + let amount = $input.val(); + if (amount < 1) { + $(".subtraction:eq("+i+")").removeClass("arithmetic hand-shape"); + $(".subtraction:eq("+i+")").html(""); + amount = 1; + layer.msg("商品数量不能小于1"); + } + if (amount == 1) { + $(".subtraction:eq("+i+")").removeClass("arithmetic hand-shape"); + $(".subtraction:eq("+i+")").html("") + } + if (amount > 1) { + $(".subtraction:eq("+i+")").addClass("arithmetic hand-shape"); + $(".subtraction:eq("+i+")").html("-") + $input.val(amount); + } + if (amount == data[i].commodity_amountall) { + $(".addition:eq("+i+")").removeClass("arithmetic hand-shape"); + $(".addition:eq("+i+")").html(""); + } + if (amount > data[i].commodity_amountall) { + $(".addition:eq("+i+")").removeClass("arithmetic hand-shape"); + $(".addition:eq("+i+")").html(""); + amount = parseInt(data[i].commodity_amountall); + layer.msg("商品数量不能大于库存") + + } + if (amount < data[i].commodity_amountall) { + $(".addition:eq("+i+")").addClass("arithmetic hand-shape"); + $(".addition:eq("+i+")").html("+"); + } + $(".amount:eq("+i+")").val(amount); + $(".cart-info .commodity-money").eq(i).text("¥"+(amount*onePrice).toFixed(2)); + }) + //购物车商品数量改变 + //获取商品单价 + let onePrice = data[i].commodity_price; + //商品减一 + $(".subtraction:eq("+i+")").on("click",function () { + let amount = $input.val(); + amount--; + if (amount < 2) { + $(".subtraction:eq("+i+")").removeClass("arithmetic hand-shape"); + $(".subtraction:eq("+i+")").html(""); + if (amount < 1) { + layer.msg("商品数量不能小于1") + } + amount = 1; + } + if (amount < data[i].commodity_amountall) { + $(".addition:eq("+i+")").addClass("arithmetic hand-shape"); + $(".addition:eq("+i+")").html("+"); + } + $(".amount:eq("+i+")").val(amount); + $(".cart-info .commodity-money").eq(i).text("¥"+(amount*onePrice).toFixed(2)); + }) + //商品加一 + $(".addition:eq("+i+")").on("click",function () { + let amount = $input.val(); + amount++; + $(".amount:eq("+i+")").val(amount); + if (amount > 1) { + $(".subtraction:eq("+i+")").addClass("arithmetic hand-shape"); + $(".subtraction:eq("+i+")").html("-") + } + if (amount == data[i].commodity_amountall) { + $(".addition:eq("+i+")").removeClass("arithmetic hand-shape"); + $(".addition:eq("+i+")").html(""); + amount = parseInt(data[i].commodity_amountall); + layer.msg("商品数量不能大于库存") + } + if (amount > data[i].commodity_amountall) { + $(".addition:eq("+i+")").removeClass("arithmetic hand-shape"); + $(".addition:eq("+i+")").html(""); + amount = parseInt(data[i].commodity_amountall); + layer.msg("商品数量不能大于库存") + } + $(".amount:eq("+i+")").val(amount); + $(".cart-info .commodity-money").eq(i).text("¥"+(amount*onePrice).toFixed(2)); + }) + + } + }, + error:function () { + + } +}) + -//商品属性的悬停事件 -function attributeOnmousemove() { - $(".commodity-attribute span").css("display","inline"); - $(".commodity-attribute i").css("display","none"); - $(".frame").css("border","1px dashed #17b5fe") -} -function attributeOnmouseout() { - $(".commodity-attribute span").css("display","none"); - $(".commodity-attribute i").css("display","inline"); - $(".frame").css("border","1px dashed #DBEBFE") -} layui.use(["layer","jquery","element","carousel","table"], function() { const layer = layui.layer @@ -25,59 +173,5 @@ layui.use(["layer","jquery","element","carousel","table"], function() { , table = layui.table , carousel = layui.carousel; - //监听数量 - let $input = $("#amount"); - //商品数量 - let amount = $input.val(); - if (amount == 1) { - $(".subtraction").removeClass("arithmetic hand-shape"); - $(".subtraction").html(""); - $input.val(1); - } - $input.on("input propertychange",function () { - let amount = $input.val(); - if (amount < 1) { - layer.msg("商品数量不能低于1") - } - if (amount == 1) { - $(".subtraction").removeClass("arithmetic hand-shape"); - $(".subtraction").html("") - } - if (amount > 1) { - $input.val(amount); - } - }) - //购物车商品数量改变 - //商品减一 - $(".subtraction").on("click",function () { - let amount = $input.val(); - amount--; - if (amount < 2) { - $(".subtraction").removeClass("arithmetic hand-shape"); - $(".subtraction").html(""); - if (amount < 1) { - layer.msg("商品数量不能低于1") - } - amount = 1; - } - $("#amount").val(amount); - }) - //商品加一 - $(".addition").on("click",function () { - let amount = $input.val(); - amount++; - $("#amount").val(amount); - if (amount > 1) { - $(".subtraction").addClass("arithmetic hand-shape"); - $(".subtraction").html("-") - } - }) - //一条记录的悬停样式 - $(".info-one").attr("onmouseover","oneOnmousemove()"); - $(".info-one").attr("onmouseout","oneOnmouseout()"); - - //修改属性的悬停事件 - $(".commodity-attribute").attr("onmouseover","attributeOnmousemove()") - $(".commodity-attribute").attr("onmouseout","attributeOnmouseout()") }) \ No newline at end of file diff --git a/src/main/webapp/static/js/commodity.js b/src/main/webapp/static/js/commodity.js new file mode 100644 index 0000000..0d70a35 --- /dev/null +++ b/src/main/webapp/static/js/commodity.js @@ -0,0 +1,224 @@ +//商品属性的悬停事件 +function attributeOnmousemove() { + $(".commodity-attribute span").css("display","inline"); + $(".commodity-attribute i").css("display","none"); + $(".frame").css("border","1px dashed #17b5fe") +} +function attributeOnmouseout() { + $(".commodity-attribute span").css("display","none"); + $(".commodity-attribute i").css("display","inline"); + $(".frame").css("border","1px dashed #DBEBFE") +} +layui.use(['layer',"jquery","element","carousel"], function() { + const layer = layui.layer + , $ = layui.jquery + , element = layui.element + , carousel = layui.carousel; + + //搜索回车触发 + $("body").keydown(function () { + + if (window.event.keyCode == 13) { + //如果发生了按下回车键事件,回车键对应的编号是13 + $(".search-text").trigger("click"); //则激活登录按钮的click事件 + } + }); + let keyword = sessionStorage.getItem("keyword"); + //查询商品信息 + $.ajax({ + url:"/ebuy/commodityInfo", + data:{ + keyword:keyword, + }, + dataType:"json", + type:"post", + success:function (data) { + + let commodityList = ''; + for (let i = 0; i < data.length; i++) { + //商品属性 + let attribute = data[i].commodity_attribute.split(";"); + let attrs = ''; + for (let j = 0; j < attribute.length; j++) { + let attributeName = attribute[j].split(":"); + let attributeText = attributeName[1].split(","); + let texts = ''; + for (let k = 0; k < attributeText.length; k++) { + let text = ``; + texts += text; + } + let attr = `${attributeName[0]}: +
    + +
    `; + attrs += attr; + } + //商品描述 + let describes = ''; + let commodity_describe = data[i].commodity_describe.split(","); + for (let j = 0; j < commodity_describe.length; j++) { + let describe = `

    ${commodity_describe[j]}

    `; + describes += describe; + } + let commodity = + ` +
    +
    + + 店铺: + ${data[i].business_name} + ${data[i].business_address} + ${data[i].paid_number}人付款 +
    +
    +
    + +
    +
    + +
    + ${data[i].commodity_name} +
    +
    +
    + `+attrs+` +
    +
    + ¥${data[i].commodity_price} +
    +
    +
    -
    + +
    +
    +
    +
    +

    (库存${data[i].commodity_amount}件)

    +
    +
    + `+describes+` +
    +
    +

    加入购物车

    +

    立即购买

    +

    收藏宝贝

    +

    举报

    +
    +
    +
    + `; + commodityList += commodity; + } + $(".commodity-list").html(commodityList); + + for (let i = 0; i < data.length; i++) { + //监听数量 + let $input = $(".amount:eq("+i+")"); + //商品数量 + let amount = $input.val(); + if (amount == 1) { + $(".subtraction:eq("+i+")").removeClass("arithmetic hand-shape"); + $(".subtraction:eq("+i+")").html(""); + $input.val(1); + } + //输入框监听 + $input.on("input propertychange",function () { + if (amount < 1) { + $(".subtraction:eq("+i+")").removeClass("arithmetic hand-shape"); + $(".subtraction:eq("+i+")").html(""); + amount = 1; + layer.msg("商品数量不能小于1"); + } + if (amount == 1) { + $(".subtraction:eq("+i+")").removeClass("arithmetic hand-shape"); + $(".subtraction:eq("+i+")").html("") + } + if (amount > 1) { + $(".subtraction:eq("+i+")").addClass("arithmetic hand-shape"); + $(".subtraction:eq("+i+")").html("-") + $input.val(amount); + } + if (amount == data[i].commodity_amount) { + $(".addition:eq("+i+")").removeClass("arithmetic hand-shape"); + $(".addition:eq("+i+")").html(""); + } + if (amount > data[i].commodity_amount) { + $(".addition:eq("+i+")").removeClass("arithmetic hand-shape"); + $(".addition:eq("+i+")").html(""); + amount = parseInt(data[i].commodity_amount); + layer.msg("商品数量不能大于库存") + } + if (amount < data[i].commodity_amount) { + $(".addition:eq("+i+")").addClass("arithmetic hand-shape"); + $(".addition:eq("+i+")").html("+"); + } + $(".amount:eq("+i+")").val(amount); + $(".commodity-price span").eq(i).text("¥"+(amount*onePrice).toFixed(2)); + }) + //购物车商品数量改变 + //获取商品单价 + let onePrice = data[i].commodity_price; + //商品减一 + $(".subtraction:eq("+i+")").on("click",function () { + let amount = $input.val(); + amount--; + if (amount < 2) { + $(".subtraction:eq("+i+")").removeClass("arithmetic hand-shape"); + $(".subtraction:eq("+i+")").html(""); + if (amount < 1) { + layer.msg("商品数量商品数量不能小于1") + } + amount = 1; + } + if (amount < data[i].commodity_amount) { + $(".addition:eq("+i+")").addClass("arithmetic hand-shape"); + $(".addition:eq("+i+")").html("+"); + } + $(".amount:eq("+i+")").val(amount); + $(".commodity-price span").eq(i).text("¥"+(amount*onePrice).toFixed(2)); + }) + //商品加一 + $(".addition:eq("+i+")").on("click",function () { + let amount = $input.val(); + amount++; + if (amount > 1) { + $(".subtraction:eq("+i+")").addClass("arithmetic hand-shape"); + $(".subtraction:eq("+i+")").html("-") + } + if (amount == data[i].commodity_amount) { + $(".addition:eq("+i+")").removeClass("arithmetic hand-shape"); + $(".addition:eq("+i+")").html(""); + amount = parseInt(data[i].commodity_amount); + layer.msg("商品数量不能大于库存") + } + if (amount > data[i].commodity_amount) { + $(".addition:eq("+i+")").removeClass("arithmetic hand-shape"); + $(".addition:eq("+i+")").html(""); + amount = parseInt(data[i].commodity_amount); + layer.msg("商品数量不能大于库存") + } + $(".amount:eq("+i+")").val(amount); + $(".commodity-price span").eq(i).text("¥"+(amount*onePrice).toFixed(2)); + }) + + } + + }, + error:function () { + + } + }) + + //加入购物车 + $(".operation .selection-text").on("click",function () { + alert(1) + }) + + //商品浏览 + $(".middle .box .search .search-box .search-box-box .search-text").on("click",function () { + $(".iframe-middle",window.parent.document).attr("src","/ebuy/commodity"); + sessionStorage.setItem("keyword",$(".search-box-input").val()); + }) +}) \ No newline at end of file diff --git a/src/main/webapp/static/js/index.js b/src/main/webapp/static/js/index.js index f1d2279..fa66bc0 100644 --- a/src/main/webapp/static/js/index.js +++ b/src/main/webapp/static/js/index.js @@ -183,7 +183,7 @@ layui.use(['layer',"jquery","element","carousel"], function() { } //头像去个人首页 - $(".head .content .login-information .login-text .personInfo .info .head-portrait,.login-information .login-text").on("click",function () { + $(".head .head-portrait,.login-information .login-text .info .head-portrait").on("click",function () { $(".iframe-middle").attr("src","/ebuy/account"); sessionStorage.setItem("accountTab","personalHomepage"); }) @@ -208,14 +208,13 @@ layui.use(['layer',"jquery","element","carousel"], function() { } }); - //搜索 + /*//搜索 $(".search-text").on("click",function () { layer.msg($(".search-box-input").val()) - }) + })*/ //购物车 $(".cart").on("click",function () { $(".iframe-middle").attr("src","/ebuy/cart"); }) - }) \ No newline at end of file diff --git a/src/main/webapp/static/js/middle.js b/src/main/webapp/static/js/middle.js index e748049..e25eae0 100644 --- a/src/main/webapp/static/js/middle.js +++ b/src/main/webapp/static/js/middle.js @@ -23,10 +23,38 @@ layui.use(['layer',"jquery","element","carousel"], function() { success: function (data) { console.log("成功"); console.log(data); + for (let i in data) { + let typeName = i.split(",")[0]; + let typeNum = i.split(",")[1]; + let type = ""; + for (let j = 0; j < data[i].length; j++) { + let o = `${data[i][j]}`; + type += o; + } + let one = ` +
    + ${typeName} +
    + 更多 + +
    +
    +
    + `+type+` +
    + `; + + $("#li-"+(Math.ceil((Number(typeNum)+1)/3))+" .type-1:eq("+(((Math.ceil((Number(typeNum)+1)%3)) == 0 ? 3 : (Math.ceil((Number(typeNum)+1)%3)))-1)+")").html(one) + } + }, error: function () { - console.log("shibai1"); } }) + //商品浏览 + $(".middle .box .search .search-box .search-box-box .search-text").on("click",function () { + $(".iframe-middle",window.parent.document).attr("src","/ebuy/commodity"); + sessionStorage.setItem("keyword",$(".search-box-input").val()); + }) }) \ No newline at end of file diff --git a/src/main/webapp/static/js/pendingPayment.js b/src/main/webapp/static/js/pendingPayment.js index 118ca85..13a8816 100644 --- a/src/main/webapp/static/js/pendingPayment.js +++ b/src/main/webapp/static/js/pendingPayment.js @@ -27,12 +27,12 @@ layui.use(["layer","jquery","element","carousel","table"], function() {
    订单号: ${data[i].order_id}
    - ${data[i].businesses_name} + ${data[i].business_name}
    - +
    ${data[i].commodity_name}
    ${data[i].commodity_attribute}
    diff --git a/src/main/webapp/static/js/register.js b/src/main/webapp/static/js/register.js index 8fc9dae..4bd9589 100644 --- a/src/main/webapp/static/js/register.js +++ b/src/main/webapp/static/js/register.js @@ -11,10 +11,16 @@ layui.use(['layer',"jquery"], function() { let againPassWord = $("#againPassWord").val(); if (mobile == '' || mobile == null) { layer.msg("请输入手机号!") + } else if (mobile.length < 11) { + layer.msg("请输入正确的手机号!") } else if (userName == '' || userName == null) { layer.msg("请输入用户名!") + } else if (userName.length < 6) { + layer.msg("用户名不能低于6位数!") } else if (passWord == '' || passWord == null) { layer.msg("请输入密码!") + } else if (passWord.length < 6) { + layer.msg("密码过于简单!") } else if (againPassWord == '' || againPassWord == null) { layer.msg("请确认密码!") } else if (againPassWord != passWord) { diff --git a/src/main/webapp/static/js/toBeEvaluated.js b/src/main/webapp/static/js/toBeEvaluated.js index b715060..8559d68 100644 --- a/src/main/webapp/static/js/toBeEvaluated.js +++ b/src/main/webapp/static/js/toBeEvaluated.js @@ -27,12 +27,12 @@ layui.use(["layer","jquery","element","carousel","table"], function() {
    订单号: ${data[i].order_id}
    - ${data[i].businesses_name} + ${data[i].business_name}
    - +
    ${data[i].commodity_name}
    ${data[i].commodity_attribute}
    diff --git a/src/main/webapp/static/js/toBeRecevied.js b/src/main/webapp/static/js/toBeRecevied.js index f6244f9..82e3868 100644 --- a/src/main/webapp/static/js/toBeRecevied.js +++ b/src/main/webapp/static/js/toBeRecevied.js @@ -27,12 +27,12 @@ layui.use(["layer","jquery","element","carousel","table"], function() {
    订单号: ${data[i].order_id}
    - ${data[i].businesses_name} + ${data[i].business_name}
    - +
    ${data[i].commodity_name}
    ${data[i].commodity_attribute}
    diff --git a/src/main/webapp/static/js/toBeShipped.js b/src/main/webapp/static/js/toBeShipped.js index cdaed62..ec260a6 100644 --- a/src/main/webapp/static/js/toBeShipped.js +++ b/src/main/webapp/static/js/toBeShipped.js @@ -27,12 +27,12 @@ layui.use(["layer","jquery","element","carousel","table"], function() {
    订单号: ${data[i].order_id}
    - ${data[i].businesses_name} + ${data[i].business_name}
    - +
    ${data[i].commodity_name}
    ${data[i].commodity_attribute}