...
|
...
|
@@ -3,13 +3,9 @@ import Swiper from 'yoho-swiper'; |
|
|
import $ from 'yoho-jquery';
|
|
|
import Page from 'js/yoho-page';
|
|
|
import filter from 'js/plugin/filter';
|
|
|
let innerScroll = require('js/plugin/inner-scroll');
|
|
|
|
|
|
import cacheStore from './group/cache-store';
|
|
|
import lazyLoad from 'yoho-jquery-lazyload';
|
|
|
|
|
|
// import tip from 'js/plugin/tip';
|
|
|
import loading from 'js/plugin/loading';
|
|
|
|
|
|
import innerScroll from 'js/plugin/inner-scroll';
|
|
|
|
|
|
class Group extends Page {
|
|
|
constructor() {
|
...
|
...
|
@@ -47,6 +43,8 @@ class Group extends Page { |
|
|
};
|
|
|
this.beforeScroll = document.body.scrollTop; // 滚动前位置记录
|
|
|
this.selectedChannel = 'newGroup';
|
|
|
|
|
|
// tab选中状态存储
|
|
|
this.filterTab = {
|
|
|
newGroup: {
|
|
|
$pre: this.selector.filterTab.find('.active'), // 记录新团筛选tab的激活项
|
...
|
...
|
@@ -59,6 +57,8 @@ class Group extends Page { |
|
|
order: 's_t_desc'
|
|
|
}
|
|
|
};
|
|
|
|
|
|
// 筛选页条件存储
|
|
|
this.filterPage = {
|
|
|
newGroup: {},
|
|
|
normalGroup: {}
|
...
|
...
|
@@ -68,11 +68,11 @@ class Group extends Page { |
|
|
this.filterInit();
|
|
|
let self = this;
|
|
|
|
|
|
$(window).scroll(function() {
|
|
|
$(window).scroll(() => {
|
|
|
window.requestAnimationFrame(() => {
|
|
|
self.scrollHandler();
|
|
|
});
|
|
|
setTimeout(function() {
|
|
|
setTimeout(() => {
|
|
|
let afterScroll = window.scrollY;
|
|
|
|
|
|
if (afterScroll - self.beforeScroll > 0) {
|
...
|
...
|
@@ -89,8 +89,8 @@ class Group extends Page { |
|
|
});
|
|
|
}
|
|
|
|
|
|
// 滚动固定tab
|
|
|
scrollHandler() {
|
|
|
// 滚动固定tab
|
|
|
let floorsContentHeight = this.selector.floorsContentHeight + 5;
|
|
|
|
|
|
if ($(window).scrollTop() > floorsContentHeight) {
|
...
|
...
|
@@ -101,8 +101,9 @@ class Group extends Page { |
|
|
this.selector.groupListContent.removeClass('mrt');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
// 当scroll到1/2$goodsContainer高度后继续请求下一页数据
|
|
|
scrollListHandler() {
|
|
|
// 当scroll到1/2$goodsContainer高度后继续请求下一页数据
|
|
|
let floorsContentHeight = this.selector.floorsContentHeight + 5;
|
|
|
let goodsContainerHeight = this.selector.groupListContent.height();
|
|
|
let navType = this.judgeType(this.filterTab[this.selectedChannel].$pre);
|
...
|
...
|
@@ -120,12 +121,13 @@ class Group extends Page { |
|
|
this.selector.tabSection.on('click', this.fixedTab.bind(this));
|
|
|
this.selector.groupTab.on('click', this.groupTabChange.bind(this));
|
|
|
this.selector.filterTab.on('click', 'li', this.filterTabChange.bind(this));
|
|
|
this.selector.groupListContent.on('click', '.group-product-cell', this.checkDetail.bind(this));
|
|
|
}
|
|
|
fixedTab() {
|
|
|
let listHeight = this.selector.groupListContent.height();
|
|
|
let windowHeight = $(window).height();
|
|
|
|
|
|
// 商品列表超过一屏时固定tab
|
|
|
// 商品列表高度超过一屏时固定tab
|
|
|
if (listHeight > windowHeight || listHeight === windowHeight) {
|
|
|
if (!this.selector.tabSection.hasClass('float')) {
|
|
|
this.selector.tabSection.addClass('float');
|
...
|
...
|
@@ -134,6 +136,16 @@ class Group extends Page { |
|
|
}
|
|
|
}
|
|
|
|
|
|
checkDetail(e) {
|
|
|
let $this = $(e.currentTarget);
|
|
|
let productSkn = $this.data('product-skn');
|
|
|
let activityId = $this.data('activity-id');
|
|
|
|
|
|
console.log(productSkn, activityId);
|
|
|
|
|
|
window.location.href = `/activity/group/goodsDetail?activityId=${activityId}&productSkn=${productSkn}`;
|
|
|
}
|
|
|
|
|
|
// 筛选tab切换
|
|
|
filterTabChange(e) {
|
|
|
let $this = $(e.currentTarget);
|
...
|
...
|
@@ -281,11 +293,10 @@ class Group extends Page { |
|
|
return navType;
|
|
|
}
|
|
|
|
|
|
//
|
|
|
/**
|
|
|
* 筛选注册的回调,筛选子项点击后逻辑
|
|
|
* 需要执行search的场景:1.点选筛选项;2.下拉加载
|
|
|
* @param opt
|
|
|
* @param type
|
|
|
*/
|
|
|
search(type) {
|
|
|
let groupListContent = this.selector.groupListContent;
|
...
|
...
|
@@ -314,18 +325,19 @@ class Group extends Page { |
|
|
page = 1;
|
|
|
}
|
|
|
nav.page = page;
|
|
|
console.log('searchParam', {
|
|
|
let searchParams = {
|
|
|
...params,
|
|
|
...pageParams,
|
|
|
page
|
|
|
});
|
|
|
};
|
|
|
let catchKey = '/activity/group/search?' + $.param(searchParams);
|
|
|
|
|
|
console.log(searchParams);
|
|
|
if (nav.end) {
|
|
|
// 不需要重新加载并且数据请求结束
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
loading.showLoadingMask();
|
|
|
|
|
|
$.ajax({
|
|
|
type: 'GET',
|
|
|
url: '/activity/group/search',
|
...
|
...
|
@@ -336,6 +348,12 @@ class Group extends Page { |
|
|
},
|
|
|
async: false,
|
|
|
beforeSend: () => {
|
|
|
let cacheData = cacheStore.get(catchKey);
|
|
|
|
|
|
if (cacheData) {
|
|
|
this.dataRender(cacheData, nav);
|
|
|
return false;
|
|
|
}
|
|
|
if ($('.search-divide').length > 0) {
|
|
|
$('.search-divide').remove();
|
|
|
}
|
...
|
...
|
@@ -346,6 +364,10 @@ class Group extends Page { |
|
|
},
|
|
|
success: (data) => {
|
|
|
that.dataRender(data, nav);
|
|
|
|
|
|
if (data && data.length) {
|
|
|
cacheStore.set(catchKey, data);
|
|
|
}
|
|
|
},
|
|
|
error: () => {
|
|
|
let $divide = $('.search-divide');
|
...
|
...
|
@@ -358,6 +380,7 @@ class Group extends Page { |
|
|
}
|
|
|
});
|
|
|
}
|
|
|
|
|
|
dataRender(result, curNav) {
|
|
|
// 去掉正在加载
|
|
|
$('.search-divide').remove();
|
...
|
...
|
@@ -398,7 +421,6 @@ class Group extends Page { |
|
|
};
|
|
|
let filterTab = this.selector.filterTab;
|
|
|
let filterPage = this.filterPage;
|
|
|
let search = this.search.bind(this);
|
|
|
|
|
|
delete requestParams.$pre;
|
|
|
console.log('initParam', requestParams);
|
...
|
...
|
@@ -406,20 +428,20 @@ class Group extends Page { |
|
|
type: 'GET',
|
|
|
url: '/activity/group/filter',
|
|
|
data: requestParams,
|
|
|
success: function(data) {
|
|
|
success: (data) => {
|
|
|
$('.filter-mask').remove();
|
|
|
$('.group').append(data);
|
|
|
|
|
|
// 初始化filter&注册filter回调
|
|
|
filter.initFilter({
|
|
|
fCbFn: function(params) {
|
|
|
fCbFn: (params) => {
|
|
|
console.log(params);
|
|
|
|
|
|
// 存储筛选页数据
|
|
|
filterPage[selectedChannel][params.type] = !params.id ? '' : params.id;
|
|
|
search('filter');
|
|
|
this.search('filter');
|
|
|
},
|
|
|
hCbFn: function() {
|
|
|
hCbFn: () => {
|
|
|
filterTab.children('.filter').removeClass('active');
|
|
|
innerScroll.enableScroll($('body'));
|
|
|
},
|
...
|
...
|
|