Blame view

public/js/guang/plusstar-index.page.js 13.4 KB
lijing authored
1 2
require('guang/plusstar/index.page.css');
陈峰 authored
3
let $ = require('yoho-jquery'),
4
    tip = require('plugin/tip'),
5
    Swiper = require('yoho-swiper2'),
6
    loading = require('plugin/loading'),
郝肖肖 authored
7
    debounce = require('lodash/debounce');
郝肖肖 authored
8
陈峰 authored
9
let plusstar = {};
郝肖肖 authored
10
陈峰 authored
11 12
let windowHeight = $(window).height();
let scrollFn,
13
    scrollTop,
14
    RECPOSE,
郝肖肖 authored
15
    isApp,
16
    searching = false,
沈志敏 authored
17 18
    resourcesTp = {},
    CID;
郝肖肖 authored
19
20
require('yoho-jquery-lazyload');
21
require('common');
郝肖肖 authored
22
郝肖肖 authored
23
plusstar = {
24
    common: {
郝肖肖 authored
25
        codeDefault: '',
26 27 28
        page: 1,
        pagesize: 20,
        pageTotal: 1,
郝肖肖 authored
29
        productSkns: []
30
    },
郝肖肖 authored
31
    init: function() {
陈峰 authored
32
        let that = this,
郝肖肖 authored
33 34 35 36 37 38 39 40
            $liDom,
            $tabUlDom;

        $tabUlDom = $('.plusstar-page .tab-nav ul');

        $tabUlDom.find('li').css({
            width: 100 / $tabUlDom.find('li').length + '%'
        });
郝肖肖 authored
41
42 43 44 45 46
        $tabUlDom.find('li').each(function() {
            // 重新进入滑动位置清除
            window.setCookie($(this).data('code'), 0);
        });
47
        // 事情委托机制
郝肖肖 authored
48
        $tabUlDom.bind('click', function(event) {
沈志敏 authored
49
郝肖肖 authored
50
            $liDom = $(event.target).closest('li');
51 52 53 54 55

            if ($liDom.hasClass('focus')) {
                return true;
            }
郝肖肖 authored
56 57
            $(this).find('li').removeClass('focus');
            $liDom.addClass('focus');
58
            that.ParentLiDom = $liDom;// 保留当前tab先中的对象
郝肖肖 authored
59
            that.tabNav($liDom.data('code'));
60
61 62 63
            if (!window._yas || !window._yas.sendCustomInfo) {
                return;
            }
64
65
            // 点击潮流优选上方的TAB按钮时
沈志敏 authored
66 67 68 69 70
            window._yas.sendCustomInfo({
                op: 'YB_FASHION_TAB_C',
                appop: 'YB_H5_STROLL_PLUSSTAR_TAB_C',
                param: JSON.stringify({
                    TAB_ID: $liDom.index() + 1,
沈志敏 authored
71
                    C_ID: CID
沈志敏 authored
72 73 74 75 76 77 78
                })
            }, true);

            window._yas.sendCustomInfo({
                op: 'YB_FASHION_HOME_L',
                param: JSON.stringify({
                    TAB_ID: that.ParentLiDom.index() + 1,
沈志敏 authored
79
                    C_ID: CID
沈志敏 authored
80 81
                })
            }, true);
郝肖肖 authored
82 83
        });
84
        // start -- 默认选中
郝肖肖 authored
85 86 87 88
        $liDom = $tabUlDom.find('li.focus');
        if ($liDom.length <= 0) {
            // 默认第一个
            $liDom = $('.plusstar-page .tab-nav ul li:eq(0)');
郝肖肖 authored
89
        }
郝肖肖 authored
90
        $tabUlDom.find('li').removeClass('focus');
91
        $liDom.addClass('focus');
郝肖肖 authored
92
        that.ParentLiDom = $liDom;// 保留当前tab先中的对象
93 94
        // that.tabNav($liDom.data('code'));
        that.resInit();
ccbikai(👎🏻🍜) authored
95
96
        // ent -- 默认选中
97 98 99 100 101
        setTimeout(function() {
            that._yas();
        }, 1000);
    },
    _yas: function() {
郝肖肖 authored
102
        // http://redmine.yoho.cn/issues/12224
陈峰 authored
103
        let that = this;
104 105 106 107

        if (!window._yas || !window._yas.sendCustomInfo) {
            return false;
        }
郝肖肖 authored
108
109
        RECPOSE = that.ParentLiDom.index() !== 0 ? 100015 : 100014;
郝肖肖 authored
110
        $('.plusstar-resources').bind('click', function(event) {
陈峰 authored
111
            let $dom, $domA, index;
郝肖肖 authored
112 113 114 115 116

            if ($(event.target).closest('.good-info').length > 0) {
                // 商品单击埋点
                $dom = $(event.target).closest('.good-info');
                index = $dom.index() + 1;
沈志敏 authored
117
                window.givePoint({
沈志敏 authored
118
                    isAppOp: true,
郝肖肖 authored
119
                    REC_POSE: RECPOSE,
120
                    PRD_ID: $dom.data('good-id'),
郝肖肖 authored
121
                    ORDER_CODE: '',
122 123
                    PRD_NUM: index % that.common.pagesize === 0 ? that.common.pagesize : index % that.common.pagesize,
                    ACTION_ID: 1,
沈志敏 authored
124
                    PAGE_NUM: Math.ceil(index / that.common.pagesize)
沈志敏 authored
125
                });
郝肖肖 authored
126 127
            } else if ($(event.target).closest('.banner-top').length > 0) {
                // 头部banner楼层埋点
郝肖肖 authored
128
                $dom = $(event.target).closest('li');
郝肖肖 authored
129 130 131
                index = $dom.index() + 1;
                window._yas.sendCustomInfo({
                    op: 'YB_FASHION_FLR_C',
沈志敏 authored
132 133
                    appop: 'YB_H5_STROLL_PLUSSTAR_FLR_C',
                    param: JSON.stringify({
沈志敏 authored
134
                        C_ID: CID,
郝肖肖 authored
135
                        TAB_ID: that.ParentLiDom.index() + 1,
郝肖肖 authored
136
                        F_ID: $dom.closest('ul').data('id'),
郝肖肖 authored
137
                        F_NAME: '焦点图',
郝肖肖 authored
138
                        F_URL: encodeURIComponent($dom.find('a').attr('href').replace(/\"/g, '\\"')),
郝肖肖 authored
139
                        F_INDEX: 1,
140
                        I_INDEX: index
沈志敏 authored
141
                    })
郝肖肖 authored
142
                }, true);
郝肖肖 authored
143 144 145 146 147
            } else if ($(event.target).closest('.speck-title-image a').length > 0) {
                // 各楼层埋点
                $dom = $(event.target).closest('.speck-title-image');
                $domA = $(event.target).closest('.speck-title-image a');
郝肖肖 authored
148 149
                window._yas.sendCustomInfo({
                    op: 'YB_FASHION_FLR_C',
沈志敏 authored
150 151
                    appop: 'YB_H5_STROLL_PLUSSTAR_FLR_C',
                    param: JSON.stringify({
沈志敏 authored
152
                        C_ID: CID,
郝肖肖 authored
153
                        TAB_ID: that.ParentLiDom.index() + 1,
郝肖肖 authored
154 155
                        F_ID: $dom.data('fid'),
                        F_NAME: $dom.data('name'),
郝肖肖 authored
156
                        F_URL: encodeURIComponent($domA.attr('href').replace(/\"/g, '\\"')),
郝肖肖 authored
157 158
                        F_INDEX: $dom.index() + 1,
                        I_INDEX: $domA.hasClass('more') ? 0 : ($domA.index() + 1)
沈志敏 authored
159
                    })
郝肖肖 authored
160 161
                }, true);
            }
郝肖肖 authored
162
        });
163 164 165 166

        // 潮流优选首页加载时
        window._yas.sendCustomInfo({
            op: 'YB_FASHION_HOME_L',
沈志敏 authored
167
            param: JSON.stringify({
沈志敏 authored
168
                C_ID: CID,
169
                TAB_ID: that.ParentLiDom.index() + 1
沈志敏 authored
170
            })
171
        }, true);
郝肖肖 authored
172 173
    },
    tabNav: function(code) {
陈峰 authored
174 175
        let that = this;
        let tabId = that.ParentLiDom.index() + 1;
176
177
        this.common.codeDefault = code;// 记住最后一次的tab code
178
        this.common.page = 1;// 商品列表从第一页开始
郝肖肖 authored
179
        searching = false;// 初始化翻页
郝肖肖 authored
180
沈志敏 authored
181
        function execResData(data) {
郝肖肖 authored
182
沈志敏 authored
183
            $('.plusstar-resources').html(data);
184
沈志敏 authored
185 186 187 188
            if (data === '') {
                tip.show('没有更多内容了');
                return true;
            }
189
沈志敏 authored
190 191
            // 固定底部去除
            window.rePosFooter();
郝肖肖 authored
192
沈志敏 authored
193 194
            // 记录切换tab位置
            $(document).scrollTop(window.cookie(code) || 0);
郝肖肖 authored
195
沈志敏 authored
196
            that.resInit();
197
沈志敏 authored
198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215
        }

        if (resourcesTp[tabId]) {
            execResData(resourcesTp[tabId]);
        } else {
            $.ajax({
                type: 'GET',
                url: '/guang/plusstar/resources-template',
                data: {
                    code: code,
                    uid: window.queryString.uid,
                    app_version: isApp,
                    yh_channel: tabId
                },
                dataType: 'html',
                success: function(data) {
                    resourcesTp[tabId] = data;
                    execResData(data);
216
沈志敏 authored
217 218 219
                    // 页面中下拉曝光
                    setTimeout(function() {
                        if (window._yas && window._yas.sendAppLogs) {
陈峰 authored
220
                            let actionUrl = [],
沈志敏 authored
221 222 223 224 225
                                aDom = $('.plusstar-resources').find('a');

                            aDom.each(function() {
                                actionUrl.push($(this).attr('href'));
                            });
226 227 228 229 230 231 232 233 234 235 236 237

                            aDom.on('click', function() {
                                window._yas.sendAppLogs({
                                    appop: 'YB_H5_PAGE_FLR_C',
                                    param: JSON.stringify({
                                        C_ID: window._ChannelVary[window.cookie('_Channel')] || 1,
                                        PAGE_URL: window.originUrl,
                                        PAGE_NAME: window.qs.title || document.title,
                                        F_URL: $(this).attr('href')
                                    })
                                }, true);
                            });
沈志敏 authored
238 239 240 241 242 243 244 245 246 247 248 249

                            window._yas.sendAppLogs({
                                appop: 'YB_H5_SHOW',
                                param: JSON.stringify({
                                    C_ID: window._ChannelVary[window.cookie('_Channel')] || 1,
                                    PAGE_URL: window.originUrl,
                                    PAGE_NAME: window.qs.title || document.title,
                                    ACTION_URL: actionUrl
                                })
                            }, true);
                        }
                    }, 500);
沈志敏 authored
250 251 252 253 254 255
                },
                error: function() {
                    tip.show('网络断开连接了~');
                }
            });
        }
256 257
    },
    resInit: function() {
陈峰 authored
258
        let that = this,
259 260 261
            productSkns = '',
            tabId;
262 263 264 265 266
        // 头部banner轮播
        if ($('.banner-swiper').find('li').size() > 1) {
            new Swiper('.banner-swiper', {
                lazyLoading: true,
                lazyLoadingInPrevNext: true,
267
                loop: false,
268 269 270 271 272 273 274
                autoplay: 3000,
                autoplayDisableOnInteraction: false,
                paginationClickable: true,
                slideElement: 'li',
                pagination: '.banner-top .pagination-inner'
            });
        }
275 276 277

        $('.plusstar-resources').find('img.lazy').lazyload();
        productSkns = $('.product-skns').val();
278
279 280 281 282 283 284
        if (productSkns) {
            this.common.productSkns = productSkns.split(',');
        }

        this.common.pageTotal = Math.ceil(this.common.productSkns.length / this.common.pagesize);
285
        tabId = that.ParentLiDom.index() + 1;
286 287 288 289 290 291 292 293 294 295 296 297 298 299 300 301 302 303 304 305 306 307
        setTimeout(function() {
            $.ajax({
                type: 'POST',
                url: '/guang/plusstar/userSkn',
                data: {
                    skns: productSkns,
                    uid: window.queryString.uid,
                    app_version: isApp,
                    yh_channel: tabId
                },
                dataType: 'json',
                success: function(data) {
                    if (data) {
                        that.common.productSkns = data;
                    }
                    that.common.pageTotal = Math.ceil(that.common.productSkns.length / that.common.pagesize);
                },
                error: function() {
                    tip.show('网络断开连接了~');
                }
            });
        }, 300);
郝肖肖 authored
308
    },
309
    goodsList: function(reload) {
陈峰 authored
310
        let that = this,
郝肖肖 authored
311
            skn = [];
郝肖肖 authored
312
313 314 315 316 317 318 319 320 321
        if (searching) {
            return;
        }
        searching = true;

        if (that.common.page > that.common.pageTotal) {
            return false;
        }
322 323 324 325
        if (!reload) {
            $('.goods').append('<div class="divide">正在加载...</div>');
        }
326
        loading.showLoadingMask();
陈峰 authored
327 328
        skn = that.common.productSkns.slice((that.common.page - 1) *
            that.common.pagesize, that.common.page * that.common.pagesize);
郝肖肖 authored
329 330 331
        $.ajax({
            type: 'POST',
            url: '/guang/plusstar/resources-goodsList',
郝肖肖 authored
332
            timeout: 5000,
郝肖肖 authored
333
            data: {
334
                productSkn: skn.join(','),
335
                app_version: isApp
郝肖肖 authored
336 337 338
            },
            dataType: 'html',
            success: function(data) {
郝肖肖 authored
339
                skn = [];
340 341
                loading.hideLoadingMask();
                searching = false;
342
                that.common.page++;
郝肖肖 authored
343
郝肖肖 authored
344 345 346 347
                if (data === '') {
                    return true;
                }
郝肖肖 authored
348
                $.each($(data).siblings('.good-info'), function() {
349
                    skn.push($(this).data('good-id'));
郝肖肖 authored
350 351
                });
沈志敏 authored
352
                window.givePoint({
沈志敏 authored
353
                    isAppOp: true,
沈志敏 authored
354
                    C_ID: CID,
郝肖肖 authored
355 356 357
                    REC_POSE: RECPOSE,
                    PRD_ID: skn.join(','),
                    ORDER_CODE: '',
358 359
                    PRD_NUM: that.common.pagesize,
                    ACTION_ID: 0,
沈志敏 authored
360
                    PAGE_NUM: that.common.page - 1
沈志敏 authored
361
                });
郝肖肖 authored
362
363
                $('.divide').remove();
郝肖肖 authored
364 365
                $('.plusstar-resources .goods').append(data);
郝肖肖 authored
366
                $('.plusstar-resources .goods').find('img.lazy:not([src])').lazyload();
367
                $('.resources .goods .page-total').remove();
郝肖肖 authored
368 369
            },
            error: function() {
370
                searching = false;
郝肖肖 authored
371
                tip.show('网络断开连接了~');
372
                loading.hideLoadingMask();
郝肖肖 authored
373 374
            }
        });
郝肖肖 authored
375 376 377
    }
};
郝肖肖 authored
378
scrollFn = debounce(function() {
379
    scrollTop = $(document).scrollTop();
380 381

    // 保留滑动位置,产品要求
郝肖肖 authored
382
    window.setCookie(plusstar.common.codeDefault, $(this).scrollTop());
383
384
    // 当scroll到最后一列商品的高度后继续请求下一页数据
385
    if (400 + scrollTop >= $(document).height() - windowHeight) {
386
        plusstar.goodsList();
郝肖肖 authored
387
    }
388
郝肖肖 authored
389
}, 200);
390
郝肖肖 authored
391
$(function() {
392
    isApp = window.queryString.app_version || window.queryString.appVersion;
郝肖肖 authored
393
394 395 396 397 398 399 400
    // if (isApp) {
    //     $('.plusstar-resources').css({'margin-top': $('.tab-nav').height()});
    // } else {
    //     $('.tab-nav').css({
    //         position: 'relative'
    //     });
    // }
郝肖肖 authored
401
402
    // 男:1,女:2,潮童:3,创意生活:4
沈志敏 authored
403
    CID = window.queryString.yh_channel || window._ChannelVary[window.cookie('_Channel')] || 1;
404
郝肖肖 authored
405
    plusstar.init();
406
407 408
    plusstar.goodsList(true);
郝肖肖 authored
409 410 411 412
    // 滚动翻页
    $(window).scroll(function() {
        scrollFn();
    });
413
});