|
...
|
...
|
@@ -2,10 +2,10 @@ import 'scss/activity/group/group.page.scss'; |
|
|
|
import Swiper from 'yoho-swiper';
|
|
|
|
import $ from 'yoho-jquery';
|
|
|
|
import Page from 'js/yoho-page';
|
|
|
|
import filter from 'js/plugin/filter';
|
|
|
|
|
|
|
|
// import lazyLoad from 'yoho-jquery-lazyload';
|
|
|
|
// import tip from 'js/plugin/tip';
|
|
|
|
// import filter from 'js/plugin/filter';
|
|
|
|
// import loading from 'js/plugin/loading';
|
|
|
|
|
|
|
|
class Group extends Page {
|
|
...
|
...
|
@@ -21,33 +21,35 @@ class Group extends Page { |
|
|
|
};
|
|
|
|
this.navInfo = {
|
|
|
|
new: {
|
|
|
|
order: 1,
|
|
|
|
reload: true,
|
|
|
|
page: 1,
|
|
|
|
end: false
|
|
|
|
},
|
|
|
|
popularity: {
|
|
|
|
order: 1,
|
|
|
|
reload: true,
|
|
|
|
page: 1,
|
|
|
|
page: 0,
|
|
|
|
end: false
|
|
|
|
},
|
|
|
|
price: {
|
|
|
|
order: 1,
|
|
|
|
order: 's_p_asc',
|
|
|
|
reload: true,
|
|
|
|
page: 0,
|
|
|
|
end: false
|
|
|
|
}
|
|
|
|
};
|
|
|
|
this.noResult = '<p class="no-result">未找到相关搜索结果</p>';
|
|
|
|
this.$pre = this.selector.filterTab.find('.active');
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.selectedChannel = 'newGroup';
|
|
|
|
this.filterTab = {
|
|
|
|
newGroup: {
|
|
|
|
$pre: this.selector.filterTab.find('.active'), // 记录新团筛选tab的激活项
|
|
|
|
joinLimit: 1,
|
|
|
|
order: 's_t_desc'
|
|
|
|
},
|
|
|
|
normalGroup: {
|
|
|
|
$pre: this.selector.filterTab.find('.active'), // 记录普通团筛选tab的激活项
|
|
|
|
joinLimit: 2,
|
|
|
|
order: 's_t_desc'
|
|
|
|
}
|
|
...
|
...
|
@@ -58,7 +60,7 @@ class Group extends Page { |
|
|
|
};
|
|
|
|
this.bindEvents();
|
|
|
|
this.swiperTop();
|
|
|
|
|
|
|
|
this.filterInit();
|
|
|
|
$(window).scroll(() => {
|
|
|
|
window.requestAnimationFrame(this.scrollHandler.bind(this));
|
|
|
|
});
|
|
...
|
...
|
@@ -94,38 +96,82 @@ class Group extends Page { |
|
|
|
}
|
|
|
|
filterTabChange(e) {
|
|
|
|
let $this = $(e.currentTarget);
|
|
|
|
let order = $this.data('order');
|
|
|
|
let navType = $this.data('type');
|
|
|
|
let currentChannel = this.selectedChannel;
|
|
|
|
let nav = this.navInfo[navType];
|
|
|
|
|
|
|
|
if ($this.hasClass('new') || $this.hasClass('popularity')) {
|
|
|
|
// 筛选状态设置
|
|
|
|
if ($this.hasClass('filter')) {
|
|
|
|
if ($this.hasClass('active')) {
|
|
|
|
$('.filter-mask').addClass('hide');
|
|
|
|
$this.removeClass('active');
|
|
|
|
|
|
|
|
} else {
|
|
|
|
$this.addClass('active');
|
|
|
|
filter.showFilter();
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
this.selector.filterTab.children('li').removeClass('active');
|
|
|
|
$this.addClass('active');
|
|
|
|
this.filterTab[currentChannel].order = order;
|
|
|
|
this.filterTab[currentChannel].$pre = $this;
|
|
|
|
}
|
|
|
|
|
|
|
|
this.search();
|
|
|
|
// 最新和人气
|
|
|
|
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.hasClass('discount')) {
|
|
|
|
|
|
|
|
// 价格/折扣切换排序状态
|
|
|
|
// 价格切换排序状态
|
|
|
|
if ($this.hasClass('price')) {
|
|
|
|
$this.find('.icon > .iconfont').toggleClass('cur');
|
|
|
|
nav.reload = true; // 重置reload,HTML会被替换为逆序的HTML
|
|
|
|
nav.order = nav.order === 0 ? 1 : 0; // 切换排序
|
|
|
|
nav.reload = true;
|
|
|
|
nav.order = nav.order === 's_p_asc' ? 's_p_desc' : 's_p_asc'; // 切换排序
|
|
|
|
this.filterTab[currentChannel].order = nav.order;
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
this.search();
|
|
|
|
}
|
|
|
|
|
|
|
|
groupTabChange(e) {
|
|
|
|
let target = $(e.target);
|
|
|
|
let channel = target.data('channel');
|
|
|
|
let navInfo = this.navInfo;
|
|
|
|
let filterTab = this.filterTab[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) {
|
|
|
|
if (navInfo.hasOwnProperty(i)) {
|
|
|
|
navInfo[i].reload = true;
|
|
|
|
navInfo[i].end = false;
|
|
|
|
|
|
|
|
if (navInfo[i].hasOwnProperty('order')) {
|
|
|
|
navInfo[i].order = 's_p_asc';
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
this.selector.filterTab.children('li').removeClass('active');
|
|
|
|
filterTab.$pre.addClass('active');
|
|
|
|
|
|
|
|
// 价格筛选状态设置
|
|
|
|
if (filterTab.$pre.hasClass('price')) {
|
|
|
|
navInfo.price.order = filterTab.order;
|
|
|
|
filterTab.$pre.find('.icon > .iconfont').removeClass('cur');
|
|
|
|
if (navInfo.price.order === 's_p_asc') {
|
|
|
|
filterTab.$pre.find('.icon > .up').addClass('cur');
|
|
|
|
} else {
|
|
|
|
filterTab.$pre.find('.icon > .down').addClass('cur');
|
|
|
|
}
|
|
|
|
}
|
|
|
|
this.search();
|
|
|
|
}
|
|
|
|
|
|
...
|
...
|
@@ -154,7 +200,7 @@ class Group extends Page { |
|
|
|
search() {
|
|
|
|
let params = this.filterTab[this.selectedChannel];
|
|
|
|
|
|
|
|
console.log(params);
|
|
|
|
console.log(params, this.navInfo.price);
|
|
|
|
|
|
|
|
// let setting;
|
|
|
|
|
|
...
|
...
|
@@ -176,35 +222,35 @@ class Group extends Page { |
|
|
|
}
|
|
|
|
|
|
|
|
// 筛选初始化
|
|
|
|
// filterInit(option) {
|
|
|
|
// let $filterMask;
|
|
|
|
|
|
|
|
// $.ajax({
|
|
|
|
// type: 'GET',
|
|
|
|
// url: '/product/sale/filter',
|
|
|
|
// data: $.extend(defaultOpt, {
|
|
|
|
// saleType: '1'
|
|
|
|
// }, option),
|
|
|
|
// success: function(data) {
|
|
|
|
// $filterMask && $filterMask.remove();
|
|
|
|
|
|
|
|
// this.selector.groupListContent.append(data);
|
|
|
|
|
|
|
|
// $filterMask = $('.filter-mask');
|
|
|
|
|
|
|
|
// // 初始化filter&注册filter回调
|
|
|
|
// filter.initFilter({
|
|
|
|
// fCbFn: this.search,
|
|
|
|
// hCbFn: function() {
|
|
|
|
// // 切换active状态到$pre上
|
|
|
|
// this.$pre.addClass('active');
|
|
|
|
// this.$pre.siblings().removeClass('active');
|
|
|
|
// },
|
|
|
|
// missStatus: true
|
|
|
|
// });
|
|
|
|
// }
|
|
|
|
// });
|
|
|
|
// }
|
|
|
|
filterInit() {
|
|
|
|
let $filterMask;
|
|
|
|
let requestParams = this.filterTab[this.selectedChannel];
|
|
|
|
let filterTab = this.selector.filterTab;
|
|
|
|
|
|
|
|
delete requestParams.$pre;
|
|
|
|
console.log(requestParams);
|
|
|
|
$.ajax({
|
|
|
|
type: 'GET',
|
|
|
|
url: '/activity/group/filter',
|
|
|
|
data: requestParams,
|
|
|
|
success: function(data) {
|
|
|
|
$filterMask && $filterMask.remove();
|
|
|
|
|
|
|
|
$('.group').append(data);
|
|
|
|
|
|
|
|
$filterMask = $('.filter-mask');
|
|
|
|
|
|
|
|
// 初始化filter&注册filter回调
|
|
|
|
filter.initFilter({
|
|
|
|
fCbFn: this.search,
|
|
|
|
hCbFn: function() {
|
|
|
|
filterTab.children('.filter').removeClass('active');
|
|
|
|
},
|
|
|
|
missStatus: true
|
|
|
|
});
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
$(() => {
|
...
|
...
|
|
