|
...
|
...
|
@@ -3,6 +3,7 @@ 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 lazyLoad from 'yoho-jquery-lazyload';
|
|
|
|
// import tip from 'js/plugin/tip';
|
|
...
|
...
|
@@ -21,11 +22,13 @@ class Group extends Page { |
|
|
|
};
|
|
|
|
this.navInfo = {
|
|
|
|
new: {
|
|
|
|
order: 's_t_desc',
|
|
|
|
reload: true,
|
|
|
|
page: 1,
|
|
|
|
end: false
|
|
|
|
},
|
|
|
|
popularity: {
|
|
|
|
order: 'h_v_desc',
|
|
|
|
reload: true,
|
|
|
|
page: 0,
|
|
|
|
end: false
|
|
...
|
...
|
@@ -86,7 +89,7 @@ class Group extends Page { |
|
|
|
let listHeight = this.selector.groupListContent.height();
|
|
|
|
let windowHeight = $(window).height();
|
|
|
|
|
|
|
|
// 商品列表超过一屏时
|
|
|
|
// 商品列表超过一屏时固定tab
|
|
|
|
if (listHeight > windowHeight || listHeight === windowHeight) {
|
|
|
|
if (!this.selector.tabSection.hasClass('float')) {
|
|
|
|
this.selector.tabSection.addClass('float');
|
|
...
|
...
|
@@ -94,59 +97,71 @@ class Group extends Page { |
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
// 筛选tab切换
|
|
|
|
filterTabChange(e) {
|
|
|
|
let $this = $(e.currentTarget);
|
|
|
|
let navType = $this.data('type');
|
|
|
|
let currentChannel = this.selectedChannel;
|
|
|
|
let nav = this.navInfo[navType];
|
|
|
|
|
|
|
|
// 筛选状态设置
|
|
|
|
// 点击项为筛选
|
|
|
|
if ($this.hasClass('filter')) {
|
|
|
|
if ($this.hasClass('active')) {
|
|
|
|
$('.filter-mask').addClass('hide');
|
|
|
|
$this.removeClass('active');
|
|
|
|
|
|
|
|
} else {
|
|
|
|
$this.addClass('active');
|
|
|
|
filter.showFilter();
|
|
|
|
innerScroll.disableScroll($('body'));
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
this.selector.filterTab.children('li').removeClass('active');
|
|
|
|
$this.addClass('active');
|
|
|
|
this.filterTab[currentChannel].$pre = $this;
|
|
|
|
}
|
|
|
|
|
|
|
|
// 最新和人气
|
|
|
|
if ($this.hasClass('new') || $this.hasClass('popularity')) {
|
|
|
|
nav.reload = true;
|
|
|
|
nav.order = $this.data('order');
|
|
|
|
this.filterTab[currentChannel].order = nav.order;
|
|
|
|
}
|
|
|
|
|
|
|
|
// 价格切换排序状态
|
|
|
|
if ($this.hasClass('price')) {
|
|
|
|
$this.find('.icon > .iconfont').toggleClass('cur');
|
|
|
|
nav.reload = true;
|
|
|
|
nav.order = nav.order === 's_p_asc' ? 's_p_desc' : 's_p_asc'; // 切换排序
|
|
|
|
this.filterTab[currentChannel].order = nav.order;
|
|
|
|
}
|
|
|
|
// 最新和人气
|
|
|
|
if ($this.hasClass('new') || $this.hasClass('popularity')) {
|
|
|
|
// 点击项为激活项时
|
|
|
|
if (navType === this.filterTab[currentChannel].$pre.data('type')) {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
nav.reload = true;
|
|
|
|
nav.order = $this.data('order');
|
|
|
|
this.filterTab[currentChannel].order = nav.order;
|
|
|
|
}
|
|
|
|
|
|
|
|
// 价格切换排序状态
|
|
|
|
if ($this.hasClass('price')) {
|
|
|
|
$this.find('.icon > .iconfont').toggleClass('cur');
|
|
|
|
nav.reload = true;
|
|
|
|
nav.order = nav.order === 's_p_asc' ? 's_p_desc' : 's_p_asc'; // 切换排序
|
|
|
|
this.filterTab[currentChannel].order = nav.order;
|
|
|
|
}
|
|
|
|
this.filterTab[currentChannel].$pre = $this;
|
|
|
|
|
|
|
|
this.search();
|
|
|
|
// 根据条件重置筛选页面及商品列表
|
|
|
|
this.filterInit();
|
|
|
|
this.search();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
// 团切换
|
|
|
|
groupTabChange(e) {
|
|
|
|
let target = $(e.target);
|
|
|
|
let channel = target.data('channel');
|
|
|
|
let navInfo = this.navInfo;
|
|
|
|
let filterTab = this.filterTab[channel];
|
|
|
|
|
|
|
|
if (this.selectedChannel === channel) {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
this.selectedChannel = channel;
|
|
|
|
|
|
|
|
// 切换tab
|
|
|
|
if (!target.hasClass('active')) {
|
|
|
|
this.selector.groupTab.find('.tiptext').removeClass('active');
|
|
|
|
target.addClass('active');
|
|
|
|
}
|
|
|
|
this.selectedChannel = channel;
|
|
|
|
|
|
|
|
// 筛选tab状态重置
|
|
|
|
for (let i in navInfo) {
|
|
...
|
...
|
@@ -154,7 +169,7 @@ class Group extends Page { |
|
|
|
navInfo[i].reload = true;
|
|
|
|
navInfo[i].end = false;
|
|
|
|
|
|
|
|
if (navInfo[i].hasOwnProperty('order')) {
|
|
|
|
if (i === 'price') {
|
|
|
|
navInfo[i].order = 's_p_asc';
|
|
|
|
}
|
|
|
|
}
|
|
...
|
...
|
@@ -162,6 +177,7 @@ class Group extends Page { |
|
|
|
this.selector.filterTab.children('li').removeClass('active');
|
|
|
|
filterTab.$pre.addClass('active');
|
|
|
|
|
|
|
|
|
|
|
|
// 价格筛选状态设置
|
|
|
|
if (filterTab.$pre.hasClass('price')) {
|
|
|
|
navInfo.price.order = filterTab.order;
|
|
...
|
...
|
@@ -172,6 +188,9 @@ class Group extends Page { |
|
|
|
filterTab.$pre.find('.icon > .down').addClass('cur');
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
// 根据条件重置筛选页面及商品列表
|
|
|
|
this.filterInit();
|
|
|
|
this.search();
|
|
|
|
}
|
|
|
|
|
|
...
|
...
|
@@ -200,7 +219,7 @@ class Group extends Page { |
|
|
|
search() {
|
|
|
|
let params = this.filterTab[this.selectedChannel];
|
|
|
|
|
|
|
|
console.log(params, this.navInfo.price);
|
|
|
|
console.log('searchParam', params);
|
|
|
|
|
|
|
|
// let setting;
|
|
|
|
|
|
...
|
...
|
@@ -223,28 +242,28 @@ class Group extends Page { |
|
|
|
|
|
|
|
// 筛选初始化
|
|
|
|
filterInit() {
|
|
|
|
let $filterMask;
|
|
|
|
let requestParams = this.filterTab[this.selectedChannel];
|
|
|
|
let requestParams = {
|
|
|
|
...this.filterTab[this.selectedChannel]
|
|
|
|
};
|
|
|
|
let filterTab = this.selector.filterTab;
|
|
|
|
let search = this.search.bind(this);
|
|
|
|
|
|
|
|
delete requestParams.$pre;
|
|
|
|
console.log(requestParams);
|
|
|
|
console.log('initParam', requestParams);
|
|
|
|
$.ajax({
|
|
|
|
type: 'GET',
|
|
|
|
url: '/activity/group/filter',
|
|
|
|
data: requestParams,
|
|
|
|
success: function(data) {
|
|
|
|
$filterMask && $filterMask.remove();
|
|
|
|
|
|
|
|
$('.filter-mask').remove();
|
|
|
|
$('.group').append(data);
|
|
|
|
|
|
|
|
$filterMask = $('.filter-mask');
|
|
|
|
|
|
|
|
// 初始化filter&注册filter回调
|
|
|
|
filter.initFilter({
|
|
|
|
fCbFn: this.search,
|
|
|
|
fCbFn: search,
|
|
|
|
hCbFn: function() {
|
|
|
|
filterTab.children('.filter').removeClass('active');
|
|
|
|
innerScroll.enableScroll($('body'));
|
|
|
|
},
|
|
|
|
missStatus: true
|
|
|
|
});
|
...
|
...
|
|
