seckill-detail.page.js 12.4 KB
require('product/detail/detail.page.css');
var $ = require('yoho-jquery');
var productId = $('#productId').val();
var goodsId = $('#goodsId').val();
var productSkn = $('#productSkn').val();
var brandId = $('#brand-id').val();
var bundleType = $('#bundleType').val();

require('../common');

// 领券
require('./detail/brand-coupon');

// 页面底部异步加载的部分
require('./detail/desc');

// 为你优选
require('./detail/recommend-for-you-product-desc');

window.rePosFooter && window.rePosFooter();

setTimeout(() => {
    var Swiper = require('yoho-swiper');

    // 顶部swiper
    var swiper = new Swiper('.banner-swiper', {
        preloadImages: false,
        lazyLoading: true,
        lazyLoadingInPrevNext: true,
        lazyLoadingOnTransitionStart: true,
        paginationClickable: true,
        pagination: '.banner-top .pagination-inner',
        nextButton: '.my-swiper-button-next',
        prevButton: '.my-swiper-button-prev',
        spaceBetween: 3
    });

    $('.banner-swiper').click(function() {
        $('.banner-top').toggleClass('hover');
        swiper.onResize();
    });
    $('.banner-top-single').click(function() {
        $('.banner-top-single').toggleClass('hover');
    });
}, 500);


// 动态加载数据
(function() {
    function renderInfo(data) {
        if (!data) {
            return;
        }

        var dbClass = 'data-bind',
            infoDataHbs = require('product/detail/infodata.hbs'),
            priceDataHbs = require('product/detail/pricedata.hbs');

        // 商品价格
        if (data.goodsPrice) {
            $('.goods-price>.current-price').text(data.goodsPrice.currentPrice);
            $('.goods-price>.previous-price').text(data.goodsPrice.previousPrice);
        }

        // 限购码
        if (!data.noLimitGoodsBtn) {
            if (data.canGetLimitCode) {
                $('.data-can-get-limit-code').removeClass(dbClass);
            }
            if (data.codeEmpty) {
                $('.data-code-empty').removeClass(dbClass);
            }
            if (data.gotCode) {
                $('.data-got-code').removeClass(dbClass);
            }
        }

        if (data.studentPrice) {
            data.studentPrice = Math.round(data.studentPrice.toString().replace('¥', ''));
        }
        $('#placeholder-pricedata').replaceWith(priceDataHbs(data));

        $('#placeholder-infodata').replaceWith(infoDataHbs(data));

        if (data.isDepositAdvance === 'Y') {
            // 定金预售商品
            var tip = require('../plugin/tip');

            setTimeout(function() {
                $('#addtoCart').text('立即购买').off('touchstart').on('touchstart', function() {
                    tip.show('定金预售商品只能在APP端购买');
                    return false;
                });
            }, 200);
        }

        // 调用秒杀js
        require('./tick');
    }

    if (productId && (goodsId || productSkn)) {
        setTimeout(() => {
            $.ajax({
                type: 'POST',
                url: '/product/detail/newinfo',
                data: {
                    id: productId,
                    goodsId: goodsId,
                    productSkn: productSkn,
                    bundleType: bundleType
                },
                success: (data) => {
                    // 如果当前是秒杀商品,且不在秒杀路径下,跳到该商品的秒杀详情页
                    var reg = /\/product\/show_([\d]+)/;
                    var regPro = /\/product\/pro_([\d]+)_([\d]+)/;
                    var regSeckill = /\/product\/seckill/;

                    // var regProSeckill = /\/product\/seckill\/pro_([\d]+)_([\d]+)/;
                    var thisHref = window.location.href;
                    var thisRefer = document.referrer;

                    if (!regSeckill.test(thisRefer)) {
                        if (data.isSecKill === 'Y' && (reg.test(thisHref) || regPro.test(thisHref))) {
                            window.location.replace('/product/seckill/show_' + productSkn + '.html');
                        }
                    }

                    // 如果秒杀商品没有吊牌价,显示原销售价
                    if (data.isSecKill === 'Y' && !data.cartInfo.price) {
                        $('.previous-price').text(data.cartInfo.salePrice);
                    }

                    // 渲染动态数据
                    renderInfo(data);

                    // 引入like事件
                    require('./detail/like');

                    // 设定购物bar
                    var $cartBar = $('.cart-bar');
                    var timer = setInterval(function() {
                        if ($cartBar) {
                            window.reMarginFooter('.cart-bar');
                            clearInterval(timer);
                        } else {
                            $cartBar = $('.cart-bar');
                        }
                    }, 500);

                    // 限购
                    var dialog = require('../plugin/dialog');

                    $('#limit-sale').on('touchend', function(e) {
                        var loginUrl = $('#loginUrl').val(),
                            time,
                            ifr;

                        e.stopPropagation();

                        if (loginUrl) {
                            window.location = loginUrl;
                        } else {
                            dialog.showDialog({
                                dialogText: '进入有货APP,获取限购码',
                                hasFooter: {
                                    rightBtnText: '打开Yoho!Buy有货APP'
                                }
                            }, function() {
                                var appUrl = $('input[name="limitCodeUrl"]').val();

                                ifr = document.createElement('iframe');
                                ifr.src = appUrl;
                                ifr.style.display = 'none';
                                document.body.appendChild(ifr);
                                window.location.href = appUrl;

                                time = Date.now();
                                window.setTimeout(function() {
                                    document.body.removeChild(ifr);
                                    if (Date.now() - time < 3200) {
                                        window.location.href = 'http://a.app.qq.com/o/simple.jsp?pkgname=com.yoho';
                                    }
                                }, 3000);

                            }, null, true);

                            $('.dialog-wrapper').off('touchstart').on('touchstart', function(para) {
                                para.stopPropagation();
                                if ($(para.target).hasClass('dialog-wrapper')) {
                                    dialog.hideDialog();
                                }
                            });
                        }
                    });

                    window.rePosFooter && window.rePosFooter();
                }
            });
        }, 150);
    }
}());

/*
 *   获取商品 相关数据: 1. 促销 2. feedback 3. 店铺, 并初始化
 */
+ (function(skn, productId, brandId) { // eslint-disable-line
    // 模版: 促销, feedback, 店铺
    var promotionT = require('product/detail/promotion.hbs');
    var feedbackT = require('product/detail/feedbacks.hbs');
    var enterStoreT = require('product/detail/enterStore.hbs');
    var bundleT = require('product/detail/bundle.hbs');

    // placeholder
    var $feedbackStore = $('#placeholder-feedback-store');
    var $promotion = $('#placeholder-promotion');
    var $bundle = $('#placeholder-bundle');

    /**
     *  渲染 feedback, 店铺, 替换placeholder
     *  @param data
     *  {
     *      enterStore, feedback
     *  }
     *  @param $placeholder
     */
    function renderFeedbackStore(data, $placeholder) {
        var feedbackHtml = feedbackT({
            feedbacks: data.feedbacks
        });

        var enterStoreHtml = enterStoreT({
            enterStore: data.enterStore
        });

        return $placeholder.replaceWith([feedbackHtml, enterStoreHtml]);
    }


    /**
     *  渲染 促销, 替换placeholder
     *  @param data
     *  {
     *      promotion
     *  }
     *  @param $placeholder
     */
    function renderPromotion(data, $placeholder) {
        var promotionHtml = promotionT({
            promotion: data.promotion
        });

        return $placeholder.replaceWith(promotionHtml);
    }

    /**
     * 渲染 套装,替换placeholder
     * @param data
     * @param $placeholder
     * @returns {*}
     */
    function renderBundle(data, $placeholder) {
        var bundleHtml = bundleT({
            bundleData: data.bundleData
        });

        return $placeholder.replaceWith(bundleHtml);
    }

    function promotionInit() {
        var $goodsDiscount = $('#goodsDiscount');
        var $discountFirstItem = $goodsDiscount.find('.first-item');
        var $discountFolder = $goodsDiscount.find('.discount-folder');
        var $discountArrow = $goodsDiscount.find('.first-item span');

        // 初始化goods-discount
        if ($discountFolder.children().length === 0) {
            $discountFolder.css('display', 'none');
            $discountArrow.html('');
        }

        // goods-discount下拉按钮点击事件
        if ($goodsDiscount.length && $discountFolder.children().length > 0) {
            $goodsDiscount.on('click', function() {
                if ($discountFolder.is(':hidden')) {
                    $discountFirstItem.removeClass('short-text');
                    $discountArrow.removeClass('icon-down').addClass('icon-up').html('&#xe608;');
                    $discountFolder.slideDown();
                } else {
                    $discountFirstItem.addClass('short-text');
                    $discountArrow.removeClass('icon-up').addClass('icon-down').html('&#xe609;');
                    $discountFolder.slideUp();
                }
            });
        }
    }

    // boot
    setTimeout(() => {
        $.get('/product/detail/sknData.json', {
            skn: skn,
            productId: productId,
            brandId: brandId,
            bundleType: bundleType,
            gid: goodsId
        }).done(function(info) {
            // step1: render dom
            renderFeedbackStore(info, $feedbackStore);
            renderPromotion(info, $promotion);

            if (info.bundleData) {
                renderBundle(info, $bundle);
                $('.bundle').on('touchstart', function() {
                    if (window._yas && window._yas.sendCustomInfo) {
                        window._yas.sendCustomInfo({
                            op: 'YB_GDS_PACKAGE_C',
                            param: JSON.stringify({
                                C_ID: window._ChannelVary[window.cookie('_Channel')],
                                PRD_ID: productId
                            })
                        }, true);
                    }
                });
            }

            // step2: init js
            require('./detail/comments-consults');
            require('./detail/consultform'); // TODO
            require('./detail/bundle');
            promotionInit();
            window.rePosFooter && window.rePosFooter();
        });
    }, 200);

    // 加载详情页的返回顶部按钮并注册事件

    $(document).scroll(function() {
        if ($(document).scrollTop() >= $(document).height() - $(window).height() - 120) {
            var top = $('.back-to-top').offset().top - $('.float-top').offset().top + ($('.back-to-top').height() - $('.float-top').height()) / 2;
            var left = $('.back-to-top').offset().left - $('.float-top').offset().left;

            $('.float-top').addClass('animation').css({
                transform: 'translate(' + left + 'px, ' + top + 'px) scale(0, 0)',
            });
        } else if ($('.product-detail').length && $(document).scrollTop() >= $('.product-detail').offset().top) {
            if (!$('.float-top').hasClass('hover') || $('.float-top').hasClass('animation')) {
                $('.float-top').addClass('hover').removeClass('animation').removeAttr('style');
            }
        } else {
            if ($('.float-top').hasClass('hover')) {
                $('.float-top').removeClass('hover');
            }
        }
    });

    // 加载详情页的返回顶部按钮并注册事件-end
}(productSkn, productId, brandId));