444 lines
17 KiB
JavaScript
Executable File
444 lines
17 KiB
JavaScript
Executable File
mui.plusReady(function() {
|
||
var data = '';
|
||
var data_saleSpec = {}
|
||
var arry_str = '';
|
||
var self = plus.webview.currentWebview();
|
||
var data_id = self.data_id;
|
||
var data_bak = {}
|
||
|
||
function whslePrice(num, arry_str) {
|
||
for(var i in data_saleSpec) {
|
||
if(i == arry_str) {
|
||
if(num >= (+(data_saleSpec[i].initNum))) {
|
||
$('.cclass_con .cc2 p').html(data_saleSpec[i].whslePrice);
|
||
}
|
||
}
|
||
}
|
||
for(var i in data_saleSpec) {
|
||
if(i == arry_str) {
|
||
if(num < (+(data_saleSpec[i].initNum))) {
|
||
$('.cclass_con .cc2 p').html(data_saleSpec[i].specPrice);
|
||
}
|
||
}
|
||
}
|
||
}
|
||
mui.ajax(hyhUrl('app/Goods/detail'), {
|
||
data: {
|
||
goodsId: data_id
|
||
},
|
||
dataType: 'json', //服务器返回json格式数据
|
||
type: 'post', //HTTP请求类型
|
||
timeout: 10000, //超时时间设置为10秒；
|
||
success: function(data) { //服务器返回响应，根据响应结果，分析是否登录成功；
|
||
|
||
var data = toJson(data);
|
||
if(data.status != 1) {
|
||
mui.alert('加载失败请重试！');
|
||
}
|
||
data = data.data;
|
||
data_bak = data;
|
||
var html = '<div class="banner"><div class="swiper-container"><div class="swiper-wrapper">';
|
||
|
||
$.each(data.gallery, function() {
|
||
html += '<div class="swiper-slide"><img src="' + hyhImgUrl(this) + '" /></div>';
|
||
});
|
||
|
||
html += '</div></div></div><div class="summarize"><p class="price">￥' + data.shopPrice + '</p><p class="price_old">价格 <del>￥' + data.marketPrice + '</del></p><div class="compilations"><span class="myf">';
|
||
|
||
if(data.isFreeShipping == '1') {
|
||
html += '免运费';
|
||
} else {
|
||
html += '不包邮';
|
||
}
|
||
html += '</span><span class="yx">月销：' + data.saleNum + '件</span><span class="dz"></span></div><p class="cname">商品介绍 ' + data.goodsTips + '</p></div><div class="guarantee"><div class="row clearfix" style="display:none"><img src="../img/gouwuquan.png" /><span class="text">全合源惠实物商品通用</span><button class="lq">领取</button></div><div class="row clearfix"><img src="../img/jifen.png" /><span class="text">购买后可获得100%积分</span></div><div class="row clearfix"><span class="text">正品保证 · 公益宝贝 · 赠运险费 · 极速退款 · 七天退货</span><button class="caidan" style="display:none"><img src="../img/menu.png"/></button></div></div><div class="guarantee" id="guarantee"><div class="row clearfix" id="changeclass"><span class="text">选择颜色分类 号码尺寸</span><button class="caidan"><img src="../img/menu.png"/></button></div></div>';
|
||
if(data.oneAppraises == '') {
|
||
|
||
} else {
|
||
html += '<div class="pjrk" style="display:none"><p class="pj_title">商品评价（' + data.appraiseNum + '）</p><div class="pj_breviary"><div class="pjbtitle clearfix"><img src="' + hyhImgUrl(data.oneAppraises.userPhoto) + '" /><p>' + data.oneAppraises.loginName + '</p></div><div class="pjbcon">' + data.oneAppraises.content + '</div><div class="pjclass">' + data.oneAppraises.goodsSpecNames + '</div></div><div class="pj_all">查看全部评价</div></div>';
|
||
}
|
||
|
||
html += '<div class="shop_info"><div class="shop_title clearfix"><img src="' + hyhImgUrl(data.shop.shopImg) + '" /><p>' + data.shop.shopName + '</p></div><div class="shopinfocon clearfix"><div class="sicl"><div class="sicl_p1">' + data.goodsCount + '</div><div class="sicl_p2">全部宝贝</div></div><div class="sicl"><div class="sicl_p1">' + data.newGoodsCount + '</div><div class="sicl_p2">上新宝贝</div></div><div class="sicl"><div class="sicl_p1">' + data.favoritesShopsNum + '</div><div class="sicl_p2">关注人数</div></div><div class="sicr"><div class="sicr_p">宝贝描述 <o>' + data.shop.goodsScore + '</o></div><div class="sicr_p">卖家服务 <o>' + data.shop.serviceScore + '</o></div><div class="sicr_p">物流服务 <o>' + data.shop.timeScore + '</o></div></div></div></div><div class="imgcon">' + data.goodsDesc + '</div>';
|
||
$('.con').html(html);
|
||
|
||
$('.cclass_con .img').html('<img src="' + hyhImgUrl(data.goodsImg) + '" />');
|
||
$('.cclass_con .cc2 p').html(data.shopPrice);
|
||
$('.cclass_con .cc2 span').html('库存' + data.goodsStock + '件');
|
||
$('#storebtn').attr('data-shopId', data.shopId)
|
||
var swiper = new Swiper('.swiper-container', {
|
||
pagination: '.swiper-pagination',
|
||
paginationClickable: true,
|
||
spaceBetween: 30,
|
||
autoplay: 3000
|
||
});
|
||
var html1 = '';
|
||
$.each(data.spec, function() {
|
||
html1 += '<div class="cclass1 clearfix" data-class=""><p>' + this.name + '</p>'
|
||
$.each(this.list, function() {
|
||
html1 += '<div class="block" data-itemId="' + this.itemId + '">' + this.itemName + '</div>'
|
||
});
|
||
|
||
html1 += '</div>'
|
||
});
|
||
$('.ccclass').html(html1)
|
||
|
||
for(var i in data.saleSpec) {
|
||
data_saleSpec[i] = data.saleSpec[i];
|
||
}
|
||
|
||
},
|
||
error: function(xhr, type, errorThrown) { //异常处理；
|
||
// alert(type);
|
||
}
|
||
});
|
||
|
||
var scroll = mui('.mui-scroll-wrapper').scroll({
|
||
deceleration: 0.002 //flick 减速系数，系数越大，滚动速度越慢，滚动距离越小，默认值0.0006
|
||
});
|
||
|
||
//导航栏渐变
|
||
document.querySelector('.mui-scroll-wrapper').addEventListener('scroll', function(e) {
|
||
|
||
var num;
|
||
|
||
if(scroll.y >= -387 && scroll.y < 0) {
|
||
|
||
num = scroll.y / -387;
|
||
// console.log('渐变',num)
|
||
$('.header1').css({
|
||
'display': 'block',
|
||
'opacity': num
|
||
})
|
||
$('.zhe').css({
|
||
'display': 'block',
|
||
'opacity': num
|
||
})
|
||
var num1 = 0.2 - num * 0.2;
|
||
// $('.header .mui-action-back').css('background', 'rgba(0,0,0,' + num1 + ')')
|
||
} else if(scroll.y >= 0) {
|
||
num = 0;
|
||
// console.log('透明',num)
|
||
$('.header1').css({
|
||
'display': 'none',
|
||
'opacity': num
|
||
})
|
||
$('.zhe').css({
|
||
'display': 'none',
|
||
'opacity': num
|
||
})
|
||
// $('.header .mui-action-back').css('background', 'rgba(0, 0, 0, 0.2)')
|
||
} else if(scroll.y < -387) {
|
||
|
||
num = 1;
|
||
// console.log('不透明',num)
|
||
$('.header1').css({
|
||
'display': 'block',
|
||
'opacity': num
|
||
})
|
||
$('.zhe').css({
|
||
'display': 'block',
|
||
'opacity': num
|
||
});
|
||
// $('.header .mui-action-back').css('background', 'rgba(0, 0, 0, 0.2)')
|
||
}
|
||
//导航栏自动切换
|
||
if($('.imgcon').offset().top >= 66) {
|
||
$('#nav1').addClass("on").siblings().removeClass('on');
|
||
} else if($('.imgcon').offset().top < 66) {
|
||
$('#nav3').addClass("on").siblings().removeClass('on');
|
||
}
|
||
})
|
||
//点击导航栏跳转
|
||
mui('.nav').on('tap', '#nav1', function() {
|
||
mui('.mui-scroll-wrapper').scroll().scrollTo(0, 0, 100);
|
||
$('#nav1').addClass("on").siblings().removeClass('on');
|
||
});
|
||
mui('.nav').on('tap', '#nav2', function() {
|
||
mui.openWindow({
|
||
url: 'appraise.html',
|
||
id: 'appraise.html',
|
||
styles: {
|
||
top: '0px', //新页面顶部位置
|
||
bottom: '0px', //新页面底部位置
|
||
width: '100%', //新页面宽度，默认为100%
|
||
height: '100%' //新页面高度，默认为100%
|
||
},
|
||
extras: {
|
||
data_id: data_id
|
||
// ..... //自定义扩展参数，可以用来处理页面间传值
|
||
},
|
||
createNew: false, //是否重复创建同样id的webview，默认为false:不重复创建，直接显示
|
||
show: {
|
||
// autoShow: true, //页面loaded事件发生后自动显示，默认为true
|
||
// aniShow: animationType, //页面显示动画，默认为”slide-in-right“；
|
||
// duration: animationTime, //页面动画持续时间，Android平台默认100毫秒，iOS平台默认200毫秒；
|
||
// event: 'titleUpdate', //页面显示时机，默认为titleUpdate事件时显示
|
||
// extras: {} //窗口动画是否使用图片加速
|
||
},
|
||
waiting: {
|
||
autoShow: true, //自动显示等待框，默认为true
|
||
title: '正在加载...', //等待对话框上显示的提示内容
|
||
options: {
|
||
// width: waiting - dialog - widht, //等待框背景区域宽度，默认根据内容自动计算合适宽度
|
||
// height: waiting - dialog - height, //等待框背景区域高度，默认根据内容自动计算合适高度
|
||
// ......
|
||
}
|
||
}
|
||
})
|
||
});
|
||
mui('.nav').on('tap', '#nav3', function() {
|
||
mui('.mui-scroll-wrapper').scroll().scrollTo(0, -1124, 100);
|
||
$('#nav3').addClass("on").siblings().removeClass('on');
|
||
});
|
||
|
||
mui('.con').on('tap', '#changeclass', function() {
|
||
$('#changeclass_con').show();
|
||
})
|
||
|
||
//选择类型
|
||
mui('.ccclass').on('tap', '.block', function() {
|
||
$(this).addClass('on').siblings().removeClass('on');
|
||
$(this).parent().attr('data-class', $(this).attr('data-itemId'));
|
||
|
||
var data_itemId = $(this).attr('data-itemId');
|
||
|
||
$.each(data.spec, function() {
|
||
$.each(this.list, function() {
|
||
if(this.itemId == data_itemId && this.itemImg != '') {
|
||
$('.cclass_con .img').html('<img src="' + hyhImgUrl(this.itemImg) + '" />');
|
||
}
|
||
});
|
||
});
|
||
|
||
var arry = [];
|
||
|
||
$.each($('.cclass1'), function() {
|
||
arry.push($(this).attr('data-class'))
|
||
});
|
||
arry.sort(function(a, b) {
|
||
return a - b;
|
||
});
|
||
|
||
arry_str = arry.join(':');
|
||
$.each(data.saleSpec, function() {
|
||
if(this == arry_str) {
|
||
$('.cclass_con .cc2 p').html(this.specPrice);
|
||
$('.cclass_con .cc2 span').html('库存' + this.specStock + '件');
|
||
}
|
||
});
|
||
|
||
for(var i in data_saleSpec) {
|
||
if(i == arry_str) {
|
||
$('.cclass_con .cc2 p').html(data_saleSpec[i].specPrice);
|
||
$('.cclass_con .cc2 span').html('库存' + data_saleSpec[i].specStock + '件');
|
||
}
|
||
}
|
||
|
||
var num = +$('.change_num input').val();
|
||
whslePrice(num, arry_str);
|
||
})
|
||
//跳转选择类型
|
||
|
||
$('.footer').on('tap', '.btn_ljgm', function() {
|
||
$('#changeclass_con').show();
|
||
})
|
||
|
||
mui('.cc2').on('tap', '.closecclass', function() {
|
||
$('#changeclass_con').hide();
|
||
})
|
||
|
||
mui('.en').on('tap', '.engwc', function() {
|
||
$('#changeclass_con').hide();
|
||
})
|
||
|
||
//改变数量
|
||
mui('.change_num').on('tap', '.jia', function() {
|
||
// console.log($(this).siblings('input').val())
|
||
var num = +$(this).siblings('input').val() + 1;
|
||
if(num <= 0) {
|
||
alert('购买数最小为1！');
|
||
return;
|
||
}
|
||
$(this).siblings('input').val(num);
|
||
whslePrice(num, arry_str)
|
||
})
|
||
mui('.change_num').on('tap', '.jian', function() {
|
||
var num = +$(this).siblings('input').val() - 1;
|
||
if(num <= 0) {
|
||
alert('购买数最小为1！');
|
||
return;
|
||
}
|
||
$(this).siblings('input').val(num);
|
||
whslePrice(num, arry_str)
|
||
})
|
||
$('.change_num input').on('change', function() {
|
||
var num = +$(this).val();
|
||
|
||
whslePrice(num, arry_str);
|
||
})
|
||
//加入购物车&购买
|
||
mui('.en').on('tap', '.enarr', function() {
|
||
|
||
var that = $(this);
|
||
var goodsId = data_id;
|
||
var buyNum = $('.change_num input').val();
|
||
var isGoodsSpecId = 0;
|
||
var goodsSpecId = 0;
|
||
var url = '';
|
||
if($(this).hasClass('engwc')) {
|
||
url = 'addCart';
|
||
} else if($(this).hasClass('ensure')) {
|
||
url = 'buy';
|
||
}
|
||
// console.log(data_bak.isSpec)
|
||
for(var i in data_saleSpec) {
|
||
if(i == arry_str) {
|
||
isGoodsSpecId = 1;
|
||
}
|
||
}
|
||
if(isGoodsSpecId == 1) {
|
||
goodsSpecId = arry_str;
|
||
} else if(data_bak.isSpec == 0) {
|
||
goodsSpecId = 0;
|
||
} else {
|
||
alert('请选择商品分类！');
|
||
return
|
||
}
|
||
that.attr('disabled', 'disabled');
|
||
mui.ajax(hyhUrl('app/carts/' + url), {
|
||
data: {
|
||
goodsId: goodsId,
|
||
buyNum: buyNum,
|
||
goodsSpecId: goodsSpecId
|
||
|
||
},
|
||
dataType: 'json', //服务器返回json格式数据
|
||
type: 'post', //HTTP请求类型
|
||
timeout: 10000, //超时时间设置为10秒；
|
||
success: function(data) { //服务器返回响应，根据响应结果，分析是否登录成功；
|
||
|
||
data = toJson(data);
|
||
if(data.status == 1) {
|
||
if(url == 'buy') {
|
||
mui.openWindow({
|
||
url: 'confirmOrder.html',
|
||
id: 'confirmOrder.html',
|
||
styles: {
|
||
top: '0px', //新页面顶部位置
|
||
bottom: '0px', //新页面底部位置
|
||
width: '100%', //新页面宽度，默认为100%
|
||
height: '100%' //新页面高度，默认为100%
|
||
},
|
||
extras: {
|
||
// data_id: data_id
|
||
|
||
type: 1
|
||
|
||
// ..... //自定义扩展参数，可以用来处理页面间传值
|
||
},
|
||
createNew: false, //是否重复创建同样id的webview，默认为false:不重复创建，直接显示
|
||
show: {
|
||
// autoShow: true, //页面loaded事件发生后自动显示，默认为true
|
||
// aniShow: animationType, //页面显示动画，默认为”slide-in-right“；
|
||
// duration: animationTime, //页面动画持续时间，Android平台默认100毫秒，iOS平台默认200毫秒；
|
||
// event: 'titleUpdate', //页面显示时机，默认为titleUpdate事件时显示
|
||
// extras: {} //窗口动画是否使用图片加速
|
||
},
|
||
waiting: {
|
||
autoShow: true, //自动显示等待框，默认为true
|
||
title: '正在加载...', //等待对话框上显示的提示内容
|
||
options: {
|
||
// width: waiting - dialog - widht, //等待框背景区域宽度，默认根据内容自动计算合适宽度
|
||
// height: waiting - dialog - height, //等待框背景区域高度，默认根据内容自动计算合适高度
|
||
// ......
|
||
}
|
||
}
|
||
})
|
||
} else if(url == 'addCart') {
|
||
alert('添加购物车成功！')
|
||
}
|
||
|
||
} else {
|
||
alert(data.msg);
|
||
//location.reload();
|
||
}
|
||
|
||
},
|
||
error: function(xhr, type, errorThrown) { //异常处理；
|
||
// alert(type);
|
||
}
|
||
});
|
||
|
||
})
|
||
|
||
//打开评价列表
|
||
mui('.con').on('tap', '.pjrk', function() {
|
||
mui.openWindow({
|
||
url: 'appraise.html',
|
||
id: 'appraise.html',
|
||
styles: {
|
||
top: '0px', //新页面顶部位置
|
||
bottom: '0px', //新页面底部位置
|
||
width: '100%', //新页面宽度，默认为100%
|
||
height: '100%' //新页面高度，默认为100%
|
||
},
|
||
extras: {
|
||
data_id: data_id
|
||
// ..... //自定义扩展参数，可以用来处理页面间传值
|
||
},
|
||
createNew: false, //是否重复创建同样id的webview，默认为false:不重复创建，直接显示
|
||
show: {
|
||
// autoShow: true, //页面loaded事件发生后自动显示，默认为true
|
||
// aniShow: animationType, //页面显示动画，默认为”slide-in-right“；
|
||
// duration: animationTime, //页面动画持续时间，Android平台默认100毫秒，iOS平台默认200毫秒；
|
||
// event: 'titleUpdate', //页面显示时机，默认为titleUpdate事件时显示
|
||
// extras: {} //窗口动画是否使用图片加速
|
||
},
|
||
waiting: {
|
||
autoShow: true, //自动显示等待框，默认为true
|
||
title: '正在加载...', //等待对话框上显示的提示内容
|
||
options: {
|
||
// width: waiting - dialog - widht, //等待框背景区域宽度，默认根据内容自动计算合适宽度
|
||
// height: waiting - dialog - height, //等待框背景区域高度，默认根据内容自动计算合适高度
|
||
// ......
|
||
}
|
||
}
|
||
})
|
||
})
|
||
$('.footer').on('tap', '#storebtn', function() {
|
||
var shopId = this.attributes["data-shopId"].nodeValue;
|
||
mui.openWindow({
|
||
url: 'storeout.html',
|
||
id: 'storeout.html'+shopId,
|
||
styles: {
|
||
top: '0px', //新页面顶部位置
|
||
bottom: '0px', //新页面底部位置
|
||
width: '100%', //新页面宽度，默认为100%
|
||
height: '100%' //新页面高度，默认为100%
|
||
},
|
||
extras: {
|
||
shopId: shopId
|
||
// ..... //自定义扩展参数，可以用来处理页面间传值
|
||
},
|
||
createNew: false, //是否重复创建同样id的webview，默认为false:不重复创建，直接显示
|
||
show: {
|
||
// autoShow: true, //页面loaded事件发生后自动显示，默认为true
|
||
// aniShow: animationType, //页面显示动画，默认为”slide-in-right“；
|
||
// duration: animationTime, //页面动画持续时间，Android平台默认100毫秒，iOS平台默认200毫秒；
|
||
// event: 'titleUpdate', //页面显示时机，默认为titleUpdate事件时显示
|
||
// extras: {} //窗口动画是否使用图片加速
|
||
},
|
||
waiting: {
|
||
autoShow: true, //自动显示等待框，默认为true
|
||
title: '正在加载...', //等待对话框上显示的提示内容
|
||
options: {
|
||
// width: waiting - dialog - widht, //等待框背景区域宽度，默认根据内容自动计算合适宽度
|
||
// height: waiting - dialog - height, //等待框背景区域高度，默认根据内容自动计算合适高度
|
||
// ......
|
||
}
|
||
}
|
||
})
|
||
})
|
||
|
||
})
|
||
// var self = plus.webview.currentWebview();
|
||
// console.log(self.aaa)
|