buying/WebContent/static/mobile/js/index.js

mui.init();
mui('.mui-scroll-wrapper').scroll({scrollX: true,deceleration:0.0001,scrollY: false});
var pageNumber = 1;
var pageSize=10;
var droploader;
/**
 *初始化、添加监听 
 */
mui.ready(function(){
	getNav();
	getIndex();
	getProduct();
	$('.mui-bar-tab').on('tap', 'a', function(e) {
		location.href=$(this).attr("href");
	});
	$(".mui-segmented-control").on("tap",".mui-control-item",function(e){
		pageNumber=1;
		$(".product").empty();
		$(".dropload-down").remove();
		getProduct($(this).attr("data-id"));
	});
	//跳转
	$(".product").on('tap','li',function(){
		location.href=base+'/mobile/productDetail.jsp?id='+$(this).attr('data-id');
	});
	
	//推广
    $("#tuiguang").on('tap',function(){
        if(user.is_share=='1'){
            $("#share").show();
        }else{
            location.href=base+'/mobile/userInfo.jsp?flag=1';
        }
    });
    $("#kefu").on("tap",function(e){
        var html=[];
        html.push('<img src="'+mobile.getParam('customer_qrcode')+'" style="width:100%">' +
            '<a class="fs16" href="tel:'+mobile.getParam('customer_tel')+'">电话：'+mobile.getParam('customer_tel')+'</a>');
        mui.alert(html.join(""), '长按二维码联系客服');
    });
	//分享
	$(".share-bg").on('tap',function(){
		$("#share").hide();
	});
	//分享
	$(".share-img").on('tap',function(){
		$("#share").hide();
	});
	
});

function swiper() {
    if ($("#hot .swiper-slide").length>1) {
        var mySwiper1 = new Swiper('#hot-swiper', {
            loop: true,
            lazy: true,
            autoplay: 3000,//可选选项，自动滑动
            // 如果需要分页器
            pagination: '#hot-pagination',
            paginationType: 'fraction',
            autoplayDisableOnInteraction: false
        });
    }
    if ($("#cut .swiper-slide").length>1) {
        var mySwiper2 = new Swiper('#cut-swiper', {
            loop: true,
            lazy: true,
            autoplay: 3000,//可选选项，自动滑动
            // 如果需要分页器
            pagination: '#cut-pagination',
            paginationType: 'fraction',
            autoplayDisableOnInteraction: false
        });
    }
}
/**
 *获取导航
 */
function getNav(){
    mobile.ajaxPost(base+'/wxNav/getList',{},function(json){
        $("#nav").empty();
        if(json.data){
            $.each(json.data,function(id,item){
                if(item.type=="10"){//轮播
                    $("#nav").append('<div id="slider" class="mui-slider">'+
                        '<div class="mui-slider-group mui-slider-loop">'+
                        '</div>'+
                        '<div class="mui-slider-indicator">'+
                        '</div>'+
                        '</div>');
                    $("#slider .mui-slider-group").append('<div class="mui-slider-item mui-slider-item-duplicate">'+
                        '<a href="'+item.list[item.list.length-1].nav_url+'">'+
                        '<img class="slider-lazy" data-original="'+imgUrl+item.list[item.list.length-1].nav_img+'" >'+
                        '</a>'+
                        '</div>');
                    if(item.list.length>1){//数量大于1定时滚动
                        $.each(item.list,function(id2,item2){
                            $("#slider .mui-slider-group").append('<div class="mui-slider-item">'+
                                '<a href="'+item2.nav_url+'">'+
                                '<img class="slider-lazy" data-original="'+imgUrl+item2.nav_img+'" >'+
                                '</a>'+
                                '</div>');
                            if(id2==0){
                                $("#slider .mui-slider-indicator").append('<div class="mui-indicator mui-active"></div>');
                            }else{
                                $("#slider .mui-slider-indicator").append('<div class="mui-indicator"></div>');
                            }
                        });
                    }else{//数量等于1
                        $("#slider .mui-slider-group").append('<div class="mui-slider-item">'+
                            '<a href="'+item.list[0].nav_url+'">'+
                            '<img class="slider-lazy" data-original="'+imgUrl+item.list[0].nav_img+'" >'+
                            '</a>'+
                            '</div>');
                    }
                    $("#slider .mui-slider-group").append('<div class="mui-slider-item mui-slider-item-duplicate">'+
                        '<a href="'+item.list[0].nav_url+'">'+
                        '<img src="'+imgUrl+item.list[0].nav_img+'" >'+
                        '</a>'+
                        '</div>');
                    if(item.list.length>1){
                        var slider = mui("#slider");
                        slider.slider({
                            interval: 3000
                        });
                    }
                } else if(item.type=="20"){
                    $("#nav").append('<ul class="mui-table-view mui-grid-view mui-grid-9 bgcolor1 nav2 no-bg"></ul>');
                    $.each(item.list,function(id2,item2){
                        $("#nav .nav2").append('<li class="mui-table-view-cell mui-media mui-col-xs-3 mui-col-sm-3">'+
                            '<a href="'+item2.nav_url+'">'+
                            '<img src="'+imgUrl+item2.nav_img+'">'+
                            '<div class="mui-media-body mt0">'+item2.nav_name+'</div>'+
                            '</a>'+
                            '</li>');
                    });
                }else if(item.type=="30"){
                    $("#nav").append('<ul class="mui-table-view mui-grid-view mui-grid-9 bgcolor1 nav3 no-bg"></ul>');
                    $.each(item.list,function(id2,item2){
                        $("#nav .nav3").append('<li class="mui-table-view-cell mui-media mui-col-xs-6 mui-col-sm-6">'+
                            '<a href="'+item2.nav_url+'">'+
                            '<img src="'+imgUrl+item2.nav_img+'">'+
                            '</a>'+
                            '</li>');
                    });
                }
            });
            $("img.slider-lazy").lazyload({
                threshold : 200,
                placeholder: base+'/static/mobile/image/500.gif',
                skip_invisible : false
            });
        }
    },"");
}

/**
 *获取导航
 */
function getProduct(){
    mobile.ajaxPost(base+'/productCategory/getNavList',{},function(json){
        console.info(json);
        var html = [];
        $.each(json.data,function (id1,item1) {
            if (item1.list&&item1.list.length>0){
                html.push('<div class="product-section pb0">');
                html.push('<div class="section-title items">');
                if (item1.remark){
                    html.push('<span class="fs20">'+item1.remark+'</span>');
                }else{
                    html.push('<span class="fs20">'+item1.cat_name+'</span>');
                }

                html.push('<a href="'+base+'/mobile/productCategory.jsp?type='+item1.id+'" class="mui-navigate-right"><span class="fs14 color2 more">更多</span></a>');
                html.push('</div>');
                html.push('<div class="section-style1">');
                html.push('<div class="section-list">');
                $.each(item1.list,function (id2,item2) {
                    html.push('<a class="section-item" href="'+base+'/mobile/productDetail.jsp?id='+item2.id+'">');
                    html.push('<div class="image-box">');
                    html.push('<img class="slider-lazy" data-original="'+imgUrl+item2.product_main_img+'" style="width: 100%; display: block;">');
                    html.push('</div>');
                    html.push('<div class="info-box">');
                    html.push('<div class="info-title">'+item2.product_name+'</div>');
                    html.push('<div class="items">');
                    html.push('<div class="product-price item"><em>¥'+item2.product_price+'<span class="del-line color3 ml5">'+item2.product_old_price+'元</span></em></div>')
                    html.push('<div class="fs12 color3">'+item2.visit_num+'人关注</div>')
                    html.push('</div></div>');
                    html.push('</a>');
                });
                html.push('</div>');
                html.push('</div>');
                html.push('</div>');
            }
        });
        $("#product").html(html.join(""));
        $("img.slider-lazy").lazyload({
            threshold : 200,
            placeholder: base+'/static/mobile/image/100.gif',
            skip_invisible : false
        });
    });
}

function getIndex(){
    mobile.ajaxPost(base+'/product/getIndex',{},function(json){
        if (json.data.hot&&json.data.hot.length>0){
            var html = [];
            $.each(json.data.hot,function (id,item) {
                html.push('<div class="swiper-slide">');
                html.push('<a href="'+base+'/mobile/productDetail.jsp?id='+item.id+'">');
                html.push('<img src="'+imgUrl+item.product_img_1+'">');
                html.push('<p class="color1 fs16 productName mb10 mt5 mui-ellipsis-2">'+item.product_name+'</p>');
                html.push('<div class="mui-table">');
                html.push('<div class="mui-table-cell mui-col-xs-6  product-price">');
                html.push('<span class="fs15"></span><span class="fs24">¥'+item.product_price+'</span>');
                html.push('<span class="fs13 del-line color3 ml5">'+item.product_old_price+'元</span>');
                html.push('</div>');
                html.push('<div class="mui-table-cell mui-col-xs-6 mui-text-right saleNum">');
                html.push('<span class="color3 fs12 pr5">'+item.visit_num+'人关注</span>');
                html.push('<span class="mui-btn mui-btn-primary">立即购买</span>');
                html.push('</div>');
                html.push('</div>');
                html.push('</a>');
                html.push('</div>');
            });
            $("#hot .swiper-wrapper").html(html.join(""));
        }else{
            $("#hot").hide();
        }

        if (json.data.cut&&json.data.cut.length>0){
            var html = [];
            $.each(json.data.cut,function (id,item) {
                html.push('<div class="swiper-slide">');
                html.push('<a href="'+base+'/mobile/cutProductDetail.jsp?id='+item.id+'">');
                html.push('<img src="'+imgUrl+item.product_img_1+'">');
                html.push('<p class="color1 fs16 productName mb10 mt5 mui-ellipsis-2">'+item.product_name+'</p>');
                html.push('<div class="mui-table">');
                html.push('<div class="mui-table-cell mui-col-xs-6  product-price">');
                html.push('<span class="fs15"></span><span class="fs24">¥'+item.product_price+'</span>');
                html.push('<span class="fs13 del-line color3 ml5">'+item.product_old_price+'元</span>');
                html.push('</div>');
                html.push('<div class="mui-table-cell mui-col-xs-6 mui-text-right saleNum">');
                html.push('<span class="color3 fs12 pr5">'+item.visit_num+'人关注 </span>');
                html.push('<span class="mui-btn mui-btn-primary">立即参与</span>');
                html.push('</div>');
                html.push('</div>');
                html.push('</a>');
                html.push('</div>');
            });
            $("#cut .swiper-wrapper").html(html.join(""));
        }else{
            $("#cut").hide();
        }

        if (json.data.end&&json.data.end.length>0){
            var html = [];
            $.each(json.data.end,function (id,item) {
                html.push('<a class="section-item" href="'+base+'/mobile/productDetail.jsp?id='+item.id+'">');
                html.push('<div class="image-box">');
                html.push('<img class="slider-lazy1" src="'+imgUrl+item.product_img_1+'" style="width: 100%; height:2rem;display: block;">');
                if (item.time_status=='1'){
                    html.push('<div class="section-item-status saled"></div>');
                }else{
                    html.push('<div class="section-item-status end"></div>');
                }
                html.push('</div>');
                html.push('<div class="info-box">');
                html.push('<div class="info-title">'+item.product_name+'</div>');
                html.push('<div class="items">');
                html.push('<div class="product-price item"><em>¥'+item.product_price+'<span class="del-line color3 ml5">'+item.product_old_price+'元</span></em></div>')
                html.push('</div></div>');
                html.push('</a>');
            });
            $("#end .section-list").html(html.join(""));
        }else{
            $("#end").hide();
        }
        // $("img.slider-lazy1").lazyload({
        //     placeholder: base+'/static/mobile/image/500.gif',
        //     skip_invisible : false
        // });
        swiper();
    });
}