|
...
|
...
|
@@ -6,6 +6,7 @@ import yoho from 'yoho-app'; |
|
|
|
import integral from 'home/integral-paradise.hbs';
|
|
|
|
import vipDetailInfo from 'home/vip-detail.hbs';
|
|
|
|
|
|
|
|
const Swiper = require('yoho-swiper2');
|
|
|
|
const echarts = require('echarts/lib/echarts');
|
|
|
|
|
|
|
|
require('echarts/lib/chart/pie');
|
|
...
|
...
|
@@ -26,7 +27,10 @@ class FamilyIndex extends Page { |
|
|
|
$integralContent: $('.integral-content'),
|
|
|
|
$contentItem: $('.content-item'),
|
|
|
|
$close: $('.close'),
|
|
|
|
$userName: $('.user-name')
|
|
|
|
$userName: $('.user-name'),
|
|
|
|
$trendWord: $('.trend-word'),
|
|
|
|
$wordOuter: $('.word-outer'),
|
|
|
|
$bannerCenterSwiper: $('.banner-center-swiper')
|
|
|
|
};
|
|
|
|
|
|
|
|
this.view = {
|
|
...
|
...
|
@@ -44,6 +48,9 @@ class FamilyIndex extends Page { |
|
|
|
this.integralCharts();
|
|
|
|
this.bindEvents();
|
|
|
|
this.viewVipInfo();
|
|
|
|
this.initTrend();
|
|
|
|
this.trendWordMarquee();
|
|
|
|
this.resources();
|
|
|
|
}
|
|
|
|
|
|
|
|
bindEvents() {
|
|
...
|
...
|
@@ -61,6 +68,42 @@ class FamilyIndex extends Page { |
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
// 潮流口令滚动
|
|
|
|
trendWordMarquee() {
|
|
|
|
let diff = $('.word-outer').scrollLeft() - $('.trend-word').eq(0).width();
|
|
|
|
|
|
|
|
$('.word-outer').scrollLeft($('.word-outer').scrollLeft() + 1);
|
|
|
|
|
|
|
|
if (diff > 0) {
|
|
|
|
$('.word-outer').scrollLeft(Math.abs(diff));
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
initTrend() {
|
|
|
|
if (this.selector.$trendWord.eq(0).width() > parseInt(this.selector.$wordOuter.css('max-width'), 10)) {
|
|
|
|
|
|
|
|
this.selector.$trendWord.width(this.selector.$trendWord.width() + 40);
|
|
|
|
|
|
|
|
this.selector.$wordOuter.append('<span class="trend-word">' + this.selector.$trendWord.html() + '</span>').css({
|
|
|
|
width: 2 * this.selector.$trendWord.width()
|
|
|
|
});
|
|
|
|
|
|
|
|
this.selector.$trendWord = $('.trend-word');
|
|
|
|
|
|
|
|
this.selector.$trendWord.addClass('rem-lin');
|
|
|
|
|
|
|
|
setInterval(this.trendWordMarquee, 40);
|
|
|
|
} else {
|
|
|
|
this.selector.$trendWord = $('.trend-word');
|
|
|
|
|
|
|
|
if (this.selector.$trendWord.length > 1) {
|
|
|
|
this.selector.$trendWord.eq(1).remove();
|
|
|
|
}
|
|
|
|
|
|
|
|
this.selector.$trendWord.removeClass('rem-lin');
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
// 积分乐园图表
|
|
|
|
integralCharts() {
|
|
|
|
let integralData = {
|
|
...
|
...
|
@@ -96,6 +139,19 @@ class FamilyIndex extends Page { |
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
// 资源位初始化
|
|
|
|
resources() {
|
|
|
|
if (this.selector.$bannerCenterSwiper.length > 0) {
|
|
|
|
new Swiper('.banner-center-swiper', {
|
|
|
|
pagination: '.swiper-pagination',
|
|
|
|
lazyLoading: true,
|
|
|
|
lazyLoadingInPrevNext: true,
|
|
|
|
paginationClickable: true,
|
|
|
|
autoplay: 3000
|
|
|
|
});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
// 查看VIP信息
|
|
|
|
viewVipInfo() {
|
|
|
|
this.ajax({
|
|
...
|
...
|
@@ -131,7 +187,14 @@ class FamilyIndex extends Page { |
|
|
|
if (result.code === 200) {
|
|
|
|
this.selector.$invition.show();
|
|
|
|
this.selector.$invitonSet.hide();
|
|
|
|
this.selector.$invition.find('.trend-code').html('# ' + trendWord + ' #');
|
|
|
|
this.selector.$invition.find('.trend-word').html(trendWord);
|
|
|
|
this.selector.$trendWord.css({
|
|
|
|
width: 'auto'
|
|
|
|
});
|
|
|
|
this.selector.$wordOuter.css({
|
|
|
|
width: 'auto'
|
|
|
|
});
|
|
|
|
this.initTrend();
|
|
|
|
} else {
|
|
|
|
this.selector.$textarea.focus();
|
|
|
|
}
|
|
...
|
...
|
@@ -160,6 +223,8 @@ class FamilyIndex extends Page { |
|
|
|
this.selector.$diaC.append(this.view.vipDetailInfo(this.vipInfo[appType]));
|
|
|
|
}
|
|
|
|
|
|
|
|
$('.vip-detail').addClass(appType);
|
|
|
|
|
|
|
|
if (this.selector.$userAvatar.data('avatar')) {
|
|
|
|
$('.base .pic').css('background-image', 'url(' + this.selector.$userAvatar.data('avatar') + ')');
|
|
|
|
}
|
...
|
...
|
|
