var flag = true, param = null, pStatus = true, goodStatus = true, colorId = '', shareOpenid = '', productId = '', openId = '', orderId = '', yuanjia = ''; mui.ready(function() { var nowUrl = location.href; productId = getParam("productId"); colorId = getParam("colorId"); openId = getParam("openId"); orderId = getParam("orderId"); param = nowUrl.split("?")[1]; //springFestivalPop(); marquee_Show(); selectProductInfo(productId); selectProductImageText(productId); mui('body').on('tap', '#click-product-desc', function() { if(flag) { selectProductImageText(productId); flag = false } }); mui('body').on('tap', '.go_gwc', function() { mui.openWindow({ url: 'shopping_cart.html' }) }); fenxiang(); getCartNum(); if(openId != '' && openId != null) { console.log(openId) $.ajax(base_path + '/agent/member?dates=' + new Date().getTime(), { data: { openId: openId }, dataType: 'json', type: 'post', timeout: 15000, xhrFields: { withCredentials: true }, crossDomain: true, success: function(dt) { if(dt.isRedirect) { location.href = dt.redirectURL; } else { var data = dt.data; if(dt.status) { if(typeof(data.userHead) != "undefined") { if(data.userHead != null && data.userHead != '') { $(".userHeader").attr('src', data.userHead) } } $('#userNickname').text(decodeURI(data.userNickname)); $('.friend-ping').show(); } else { } } }, error: function(xhr, type, errorThrown) { console.log(xhr) } }); } document.querySelector('.loading-bg').style.display = 'none' }); function selectProductInfo(productId) { var btnArray = ['否', '是']; $.ajax(base_path + '/product/getProductByProductId?productId=' + productId + '&colorId=' + colorId + '&dates=' + new Date().getTime(), { dataType: 'json', async: false, type: 'GET', timeout: 15000, xhrFields: { withCredentials: true }, crossDomain: true, success: function(dt) { if(dt.isRedirect) { location.href = dt.redirectURL; } else { if(dt.status) { console.log(dt.data.product); if(dt.data.product.productId == 28) { goodStatus = false } shareOpenid = dt.data.shareOpenid; var imageNote = "<div class='mui-slider-item mui-slider-item-duplicate'><a href='#'><img src='" + dt.data.product.pictureList[0].pictureUrl + "'></a></div>"; for(var i = 0; i < dt.data.product.pictureList.length; i += 1) { imageNote += "<div class='mui-slider-item'><a href='#'><img src='" + dt.data.product.pictureList[i].pictureUrl + "'></a></div>"; if(i == 0) { $("#active-div").append("<div class='mui-indicator mui-active'></div>") } else { $("#active-div").append("<div class='mui-indicator'></div>") } } imageNote += "<div class='mui-slider-item mui-slider-item-duplicate'><a href='#'><img src='" + dt.data.product.pictureList[0].pictureUrl + "'></a></div>"; $("#group-images-div").append(imageNote); var banner = mui('#detail-slider'); banner.slider({ interval: 5000 //banner循环间隔时间 }); $("#product-name-font").html(dt.data.product.productName); if(marquee != '' && dt.data.product.productDiscount == '328000') { $('<span class="mui-h6">购买即赠3年滤芯</span>').insertAfter('.price-sp') } let accPrice = accDiv(dt.data.product.productDiscount, 100); //拼单=2 accPrice 拼单价 if(dt.data.product.productIsSpell == 2) { accPrice = accDiv(dt.data.colorList[0].colorSpellAmount, 100); $('#add-cart-div,#shopp-div').hide(); $('#add-cart-div').before('<div class="mui-table-cell mui-col-xs-4 table-middle div-btn-buy" id="btn-buy">¥' + accDiv(dt.data.product.productDiscount, 100) + '<br/>单独购买</div><div class="mui-table-cell mui-col-xs-4 table-middle div-btn-ping" id="btn-ping">¥' + accDiv(dt.data.product.colorSpellAmount, 100) + '<br/>发起拼单</div>'); } $("#product-price-span").html("¥" + accPrice); //原价 if(yuanjia == '') { yuanjia = '<s>¥' + accDiv(dt.data.product.productPrice, 100) + '</s>' } $("#product-price-s").html(yuanjia); $("#product-access-span").html("已售" + dt.data.product.productSalesnum + "件"); if(dt.data.product.productStatus == 1) { pStatus = true } else { pStatus = false } //添加颜色列表弹窗 var btn = '<div class="mui-table"><div class="mui-table-cell mui-col-xs-6 table-middle mui-hidden"><button class="mui-btn my-btn-block my-btn-add-cart">加入购物车</button></div><div class="mui-table-cell mui-col-xs-6 table-middle mui-hidden"><button class="mui-btn my-btn-block my-btn-buy-know">立即购买</button></div><div class="mui-table-cell mui-col-xs-12 table-middle mui-hidden buy-box"><button class="mui-btn my-btn-block my-btn-buy-know">确定</button></div><div class="mui-table-cell mui-col-xs-12 table-middle mui-hidden ping-box"><button class="mui-btn my-btn-block my-btn-ping-know">确定</button></div></div>'; var colorList = '', pic = '', price = ''; mui.each(dt.data.colorList, function() { //遍历产品颜色集合 var active = ''; if(colorId == this.colorId) { active = 'active'; //弹窗选中当前颜色 $(".select-color span").text(this.colorName); //当前颜色 pic = this.colorImg; //当前图片 price = '¥' + (this.colorDiscount / 100).toFixed(2); if(dt.data.product.productIsSpell == 2) { price = accPrice; //拼单价 } $(".price").text(price); //当前价格 colorName = this.colorName; } colorList += '<span class="pro-select-color ' + active + '" name="' + this.colorId + '" src="' + this.colorImg + '" accPrice="' + dt.data.colorList[0].colorSpellAmount + '" price="' + this.colorDiscount + '">' + this.colorName + '</span>'; }); $("body").append('<div class="my-picker"><ul class="mui-table-view mui-table-view-striped mui-table-view-condensed my-grid-view-no"><li class="mui-table-view-cell"><div class="mui-table"><div class="mui-table-cell mui-col-xs-3 table-middle"><img class="dalog-proPic" style="background: #f8f8f8;" width="90%" src="' + pic + '" /></div><div class="mui-table-cell mui-col-xs-8 table-middle"><div>' + dt.data.product.productName + '</div><h6 class="dalog-colorPresent" style="line-height: 14px;"></h6><div class="dalog-proPrice">¥' + price + '</div></div></div></li><li class="mui-table-view-cell">选择颜色</li><li style="padding: 0 15px;"><div class="mui-table" ><div class="mui-table-cell mui-col-xs-12">' + colorList + '</div></div></li><li class="mui-table-view-cell"><div class="mui-table"><div class="mui-table-cell mui-col-xs-6">选择数量</div><div class="mui-table-cell mui-text-right mui-col-xs-6"><div class="mui-numbox" data-numbox-min="0" data-numbox-max="99" name="0"><button class="mui-btn mui-btn-numbox-minus" type="button">-</button><input class="mui-input-numbox" type="number" value="0" readonly="readonly" disabled="disabled"><button class="mui-btn mui-btn-numbox-plus" type="button">+</button></div></div></div></li></ul><br />' + btn + '<span class="iconfont icon-guanbi"></span></div>'); if(colorId == 310) { $(".dalog-colorPresent").css("color", "red"); } getColorNumber(); //获取单个购物项id数量 mui(".mui-numbox").numbox(); //激活加减按钮组合 } else { mui.confirm(dt.message + '是否重新加载页面?', '提示', btnArray, function(e) { if(e.index == 1) { location.reload(true) } }) } } }, error: function(xhr, type, errorThrown) { console.log(xhr) } }) }; function selectProductImageText(productId) { var btnArray = ['否', '是']; $.ajax(base_path + '/product/getPictureByProductId?productId=' + productId, { dataType: 'json', type: 'POST', timeout: 15000, xhrFields: { withCredentials: true }, crossDomain: true, success: function(dt) { if(dt.isRedirect) { location.href = dt.redirectURL; } else { if(dt.status) { if(dt.data != null) { $("#product-param-img").html(dt.data.imagetextContext) } else { $("#item2").empty(); mui.alert('商品详情获取失败') } } else { mui.confirm(dt.message + '是否刷新页面?', '提示', btnArray, function(e) { if(e.index == 1) { location.reload(true) } }) } } }, error: function(xhr, type, errorThrown) { mui.confirm('您的网络开小差了,是否重新加载页面?', '提示', btnArray, function(e) { if(e.index == 1) { location.reload(true) } }) } }) }; //跳转购物车 $(document).on('tap', '.cart', function() { location.href = 'shopping_cart.html'; }); $(window).on("scroll", function() { if($(window).scrollTop() > 120) { $(".return").show() } else { $(".return").hide() } }); //callback为用户点击蒙版时自动执行的回调; var mask = mui.createMask(function() { $(".my-picker").removeClass("active"); //隐藏颜色列表 }); //加入购物车弹出层 var btnTap = ''; var cartStatus = ""; $(document).on('tap', '.mui-bar-tab .div-btn-buy-cart,.mui-bar-tab .div-btn-buy-know,.select-color,#btn-buy', function() { if($(".my-picker").length > 0) { //判断是否已有弹窗 getColorNumber(); //重新获取单个购物项id数量 var pullcolor = $('.pro-select-color.active'); colorId = pullcolor.attr("name"); $(".mui-btn-numbox-minus,.mui-btn-numbox-plus").removeAttr("disabled"); getColorNumber(); //重新获取单个购物项id数量 $(".dalog-proPic").attr("src", pullcolor.attr("src")); //替换当前选择颜色的图片 colorName = pullcolor.text(); fenxiang(); btnTap = ''; $('.dalog-proPrice').text('¥' + accDiv(parseInt(pullcolor.attr('price')), 100)); var th = $(this); mask.show(); //显示遮罩层 //判断点击进来的按钮 if(th.hasClass("select-color") || th.hasClass("div-btn-buy")) { $(".my-picker>.mui-table .mui-col-xs-12").addClass("mui-hidden"); $(".my-picker>.mui-table .mui-col-xs-6").removeClass("mui-hidden"); } else { $(".my-picker>.mui-table .mui-col-xs-6,.my-picker>.mui-table .ping-box").addClass("mui-hidden"); $(".my-picker>.mui-table .buy-box").removeClass("mui-hidden"); if(th.hasClass("div-btn-buy-cart")) { btnTap = 'addCart'; $(".buy-box").find("button").removeClass("my-btn-buy-know").addClass("my-btn-add-cart"); cartStatus = null; } else { btnTap = 'buyknow'; $(".buy-box").find("button").removeClass("my-btn-add-cart").addClass("my-btn-buy-know"); cartStatus = 1; console.log(btnTap) } } $(".my-picker").addClass("active"); //显示颜色列表弹窗 console.log(btnTap) } }); //发起拼单 $(document).on('tap', '#btn-ping,#btn-ping-1', function() { if($(".my-picker").length > 0) { //判断是否已有弹窗 $('.dalog-proPrice').text('¥' + accDiv(parseInt($('.pro-select-color.active').attr('accprice')), 100)); $(".mui-input-numbox").val(1); $(".mui-btn-numbox-minus,.mui-btn-numbox-plus").attr("disabled", "disabled"); var th = $(this); mask.show(); //显示遮罩层 $(".my-picker>.mui-table .mui-col-xs-6,.my-picker>.mui-table .buy-box").addClass("mui-hidden"); $(".my-picker>.mui-table .ping-box").removeClass("mui-hidden"); btnTap = 'ping'; cartStatus = 1; $(".my-picker").addClass("active"); //显示颜色列表弹窗 } }); //切换颜色 $(document).on('tap', '.pro-select-color', function() { var th = $(this); colorId = th.attr("name"); th.addClass("active").siblings().removeClass("active"); //选中自己再把前后的兄弟元素取消选中 if(btnTap == 'ping') { $(".mui-input-numbox").val(1); $(".mui-btn-numbox-minus,.mui-btn-numbox-plus").attr("disabled", "disabled"); } else { $(".select-color span").text(th.text()); getColorNumber(); //重新获取单个购物项id数量 } $(".dalog-proPic").attr("src", th.attr("src")); //替换当前选择颜色的图片 colorName = th.text(); fenxiang(); }); //弹窗的确定 $(document).on('tap', '.my-picker .my-btn-buy-know,.my-picker .my-btn-add-cart,.my-picker .my-btn-ping-know', function() { let th = $(this) var number = $(".mui-input-numbox").val(); if(number != 0) { if(th.hasClass('my-btn-add-cart')) { btnTap = 'addCart' } else if(th.hasClass('my-btn-ping-know')) { btnTap = 'ping' } else { btnTap = 'buyknow' } add(); console.log(btnTap) if(btnTap == 'addCart') { mui.toast('加入购物车成功!'); } } else { mui.toast('请选择商品数量!'); } }); //判断是加减删,ajax分别调用不同的URLclearing.html function add() { var parameter = {}; //ajax参数json集合 var src = '/cart/addProductToCart'; if(typeof($(".my-picker .pro-select-color.active").attr("name")) != "undefined") { parameter["productId"] = productId; //产品id parameter["colorId"] = $(".my-picker .pro-select-color.active").attr("name"); //颜色id console.log($(".mui-input-numbox").val() - $(".mui-numbox").attr("name") < 0) if($(".mui-input-numbox").val() - $(".mui-numbox").attr("name") < 0) { if($(".mui-input-numbox").val() == 0) { src = '/cart/deleteCart'; addCart(parameter, src) } else { parameter["cartNum"] = Math.abs($(".mui-input-numbox").val() - $(".mui-numbox").attr("name")); src = '/cart/deleteCart'; addCart(parameter, src) } getCartNum(); } else if($(".mui-input-numbox").val() - $(".mui-numbox").attr("name") > 0) { parameter["cartNum"] = Math.abs($(".mui-input-numbox").val() - $(".mui-numbox").attr("name")); addCart(parameter, src); getCartNum(); } else { if($(".mui-input-numbox").val() < 1) { mui.toast("请选择商品数量!"); //如果数量为0提示用户去选 } else { $(".my-picker").removeClass("active"); //隐藏颜色列表 $(".mui-backdrop").remove(); //移除遮罩层 if(btnTap == 'buyknow') { if(!window.sessionStorage) { mui.alert("您的浏览器不支持sessionStorage"); } else { //自定义json数据 var obj = { text: [$(".mui-numbox").attr("cartid")] }; //json格式化插入 购物项id集合 sessionStorage.setItem('pay_data', JSON.stringify(obj)); location.href = 'clearing.html?cartId=' + $(".mui-numbox").attr("cartid"); } } else if(btnTap == 'ping') { if(!window.sessionStorage) { mui.alert("您的浏览器不支持sessionStorage"); } else { //自定义json数据 var obj = { text: [$(".mui-numbox").attr("cartid")], isSpell: 1 }; let orderStr = ''; if(orderId != '' && orderId != null) { orderStr = '&orderId=' + orderId; obj[orderId] = orderId; } //json格式化插入 购物项id集合 sessionStorage.setItem('pay_data', JSON.stringify(obj)); console.log(btnTap) location.href = 'clearing.html?cartId=' + $(".mui-numbox").attr("cartid") + '&isSpell=1' + orderStr; } } } } } else { mui.alert("没有获取到产品颜色!"); } }; //商品加减删三个ajax接口集合,parameter参数,src接口的路径 function addCart(parameter, src) { $.ajax(base_path + src + '?dates=' + new Date().getTime(), { data: parameter, dataType: 'json', xhrFields: { withCredentials: true }, crossDomain: true, type: 'get', timeout: 15000, success: function(dt) { if(dt.isRedirect) { location.href = dt.redirectURL; } else { if(dt.status) { getColorNumber(); //重新获取单个购物项id数量 getCartNum(); //重新获取购物车总数量 if(btnTap == 'buyknow') { if($(".mui-input-numbox").val() > 0) { $(".my-picker").removeClass("active"); //隐藏颜色列表 $(".mui-backdrop").remove(); //移除遮罩层 if(!window.sessionStorage) { mui.alert("您的浏览器不支持sessionStorage"); } else { getColorNumber(); setTimeout(function() { //自定义json数据 var obj = { text: [$(".mui-numbox").attr("cartid")] }; //json格式化插入 购物项id集合 sessionStorage.setItem('pay_data', JSON.stringify(obj)); location.href = 'clearing.html?cartId=' + $(".mui-numbox").attr("cartid") + "&tiemstamp=" + new Date().getTime() }, 500); } } else { mui.toast("请选择商品数量!"); } } else { $(".my-picker").removeClass("active"); //隐藏颜色列表 $(".mui-backdrop").remove(); //移除遮罩层 } } else { mui.alert("添加失败!"); } } }, error: function(xhr, type, errorThrown) { console.log(xhr); mui.alert("添加失败!网络错误"); } }); }; //获取单个购物项id数量 function getColorNumber() { $.ajax(base_path + '/cart/getCartColorNum?dates=' + new Date().getTime(), { data: { "colorId": colorId }, dataType: 'json', xhrFields: { withCredentials: true }, crossDomain: true, type: 'get', //减少数量后台限制用get timeout: 15000, success: function(dt) { if(dt.isRedirect) { location.href = dt.redirectURL; } else { if(dt.status) { if(typeof(dt.data) != "undefined") { $(".mui-input-numbox").val(dt.data.cartNum); $(".mui-numbox").attr("name", dt.data.cartNum); $(".mui-numbox").attr("cartid", dt.data.cartId); if(dt.data.cartNum > 0) { $(".mui-btn-numbox-minus").removeAttr("disabled"); } else { $(".mui-btn-numbox-minus").attr("disabled", "disabled"); } } else { $(".mui-numbox").removeAttr("cartid"); $(".mui-numbox").attr("name", "0"); $(".mui-input-numbox").val(1); $(".mui-btn-numbox-minus").attr("disabled", "disabled"); } } else { console.log("失败!"); } } }, error: function(xhr, type, errorThrown) { console.log(xhr); } }); }; //关闭弹窗 $(document).on('tap', '.icon-guanbi', function() { $(".mui-backdrop").remove(); //移除遮罩层 $(".my-picker").removeClass("active"); //隐藏弹窗 }); //分享弹窗 $(document).on('tap', '.share_wechat', function() { $(".share-dalog").show(); }); //关闭分享弹窗 $(document).on('tap', '.share-dalog', function() { $(this).hide(); }); //分享 function fenxiang() { console.log(domanUrl + '/watero/wechat/images/index.jpg') var url = domanUrl + "/watero/wechat/chanpin_details.html?productId=" + productId + '&colorId=' + colorId + "&shareOpenid=" + shareOpenid; window.repleFlag = false; window.wxFriend = { "appId": "", // "imgUrl": domanUrl + '/watero/wechat/images/index.jpg', "imgUrl": 'https://s.iamberry.com/watero/wechat/images/index.jpg', "link": url, "desc": "美国标准,4级净化,5档水温,废水比3:1,水质TDS智能显示。", "title": "Watero,美国高端净水专家,4级净化,5档水温,免安装饮水一体机。", "netError": "您的网络异常,请刷新重试!如多次刷新无效,请向我们反应 ~", "shareTimeSuccess": "分享成功", "shareTimeCancel": "已取消分享", "shareAppSuccess": "分享成功!", "shareAppCancel": "已取消分享" }; getConfig(); } $(document).on('tap', '.go-home', function() { location.href = 'index.html'; });