fe / yohobuywap-node · Commits

Go to a project

Authored by 沈志敏
Commit 3a40e11782a61de875b57bdac28740e90e5f0ff7 2 parents a7aaaca4 69de8046

merge 优化分支

Inline Side-by-side
Showing 23 changed files with 475 additions and 575 deletions
... ... @@ -36,6 +36,7 @@ exports.index = (req, res, next) => {
}),
content: result,
noLoginUrl: result.noLoginUrl,
localCss: true,
appPath: 'yohobuy://yohobuy.com/goapp?openby:yohobuy＝{"action":"go.couponCenter", "params":{"share":"/operations/api/v5/webshare/getShare","share_id":"1037","title":"领券中心"}}' //eslint-disable-line
});
}).catch(next);
... ...
... ... @@ -2,7 +2,7 @@
{{# content}}
{{#if isSingleImage}}
<div data-id="{{templateId}}" data-floor-name="{{templateName}}" class="floor">
<a href="{{url}}"><img src="{{image src 0 0}}" class="just-img"/></a>
<a href="{{url}}"><img src="{{image2 src w=0 h=0 q=60}}" class="just-img"/></a>
</div>
{{/if}}
{{#if isCarouselBanner}}
... ...
... ... @@ -21,23 +21,28 @@ let index = (req, res, next) => {
let responseData = {
module: 'channel',
page: 'brand',
localCss: true,
// title: '品牌一览 | Yoho!Buy有货 | 潮流购物逛不停',
showFooterTab: footerModel.getUrlData('category')
};
let param = {
channel: req.query.channel || '1',
gender: req.query.gender || '1,3'
};
indexModel.getBrandByChannel(param.channel).then(result => {
res.render('brand/index', Object.assign(responseData, result));
}).catch(next);
};
let brandList = (req, res, next) => {
var channel = req.query.channel || '1';
indexModel.getBrandListByChannel(channel).then(result => {
res.json(result);
}).catch(next);
};
/**
... ... @@ -47,7 +52,6 @@ let index = (req, res, next) => {
* @param int channel 1表示男生频道, 2表示女生频道, 3表示潮童频道, 4表示创意生活频道
*/
let search = (req, res, next) => {
let headerData = headerModel.setNav({
navTitle: '品牌一览'
});
... ... @@ -56,6 +60,7 @@ let search = (req, res, next) => {
pageHeader: headerData,
module: 'channel',
page: 'brand',
localCss: true,
isWechat: req.yoho.isWechat,
title: '品牌一览 | Yoho!Buy有货 | 潮流购物逛不停',
pageFooter: true
... ... @@ -144,6 +149,7 @@ let searchAsync = (req, res, next) => {
module.exports = {
index,
search,
brandList,
delBrandHistory,
addBrandSearch,
searchAsync
... ...
... ... @@ -30,7 +30,6 @@ let CODE_TOPPOS_LIFESTYLE = 'f1aa914fd23cbcda71a87de6f5416c75';
*/
const _packageAd = (params) => {
return service.get('/operations/api/v5/resource/get', {
content_code: params.contentCode,
gender: 1,
... ... @@ -38,71 +37,48 @@ const _packageAd = (params) => {
page: 1
}, {
cache: true
}).then(result => {
return result;
});
};
const _packageList = (params) => {
const _packageList = (channel) => {
return api.get('', {
method: 'app.brand.newBrandList',
yh_channel: params.channel
yh_channel: channel
}, {
cache: true,
code: 200
}).then(result => {
return result;
});
};
const getBrandByChannel = (channel) => {
let params = {};
/* 根据频道调用接口 */
switch (channel) {
case '1': // 男生
params = {
contentCode: CODE_TOPPOS_BOYS,
channel: 1
contentCode: CODE_TOPPOS_BOYS
};
break;
case '2': // 女生
params = {
contentCode: CODE_TOPPOS_GIRLS,
channel: 2
contentCode: CODE_TOPPOS_GIRLS
};
break;
case '3': // 潮童
params = {
contentCode: CODE_TOPPOS_KIDS,
channel: 3
contentCode: CODE_TOPPOS_KIDS
};
break;
case '4': // 创意生活
params = {
contentCode: CODE_TOPPOS_LIFESTYLE,
channel: 4
contentCode: CODE_TOPPOS_LIFESTYLE
};
break;
default:
}
return api.all([
_packageAd(params),
_packageList(params)
]).then(result => {
return _packageAd(params).then(result => {
let resu = {
channel: {
channels: [{
... ... @@ -120,24 +96,17 @@ const getBrandByChannel = (channel) => {
},
searchUrl: helpers.urlFormat('/brands/search', null),
brandPage: true,
brandType: '全部品牌',
secondBrandType: '新入驻品牌',
thirdBrandType: '热门品牌',
brandList: [],
newBrandWall: [],
recommandBrandWall: []
thirdBrandType: '热门品牌'
}
};
resu.channel.channels[channel - 1].active = true;
if (result && result[0] && result[0].data) {
if (result[0].data[0] && result[0].data[0].data) {
if (result && result.data) {
if (result.data[0] && result.data[0].data) {
// 轮播图资源位
let adList = result[0].data[0].data;
let adList = result.data[0].data;
let build = [];
adList.forEach(ad => {
... ... @@ -146,15 +115,12 @@ const getBrandByChannel = (channel) => {
url: ad.url
});
});
resu.channel.topData.bannerTop.list = build;
}
if (result[0].data[1] && result[0].data[1].data) {
if (result.data[1] && result.data[1].data) {
// 推荐品牌资源位
let brandList = result[0].data[1].data.list;
let brandList = result.data[1].data.list || [];
let brand = [];
brandList.forEach(ad => {
... ... @@ -165,106 +131,76 @@ const getBrandByChannel = (channel) => {
});
});
resu.channel.topData.hotBrandsScroll.name = result[0].data[1].data.title.title;
resu.channel.topData.hotBrandsScroll.name = result.data[1].data.title.title;
resu.channel.topData.hotBrandsScroll.list = brand;
}
}
return resu;
});
};
/* 按字母'A-Z'分组的品牌列表 */
if (result && result[1] && result[1].data) {
let allList = result[1].data.all_list;
for (let key in allList) {
let obj = {};
obj = Object.assign(obj, {
title: key
});
let list = [];
allList[key].forEach(row => {
const getBrandListByChannel = (channel) => {
return _packageList(channel).then(result => {
let resu = {
brandList: [],
newBrandWall: [],
recommandBrandWall: []
};
list.push({
name: row.brand_name,
isHot: row.is_hot === 'Y' ? true : false,
isNew: row.is_show_new === 'Y' ? true : false,
url: helpers.urlFormat('/product/index/brand?domain=' + row.brand_domain)
});
if (!result || !result.data) {
return resu;
}
});
/* 按字母'A-Z'分组的品牌列表 */
let allList = result.data.all_list;
for (let key in allList) {
let obj = {
title: key,
list: []
};
obj = Object.assign(obj, {
list
allList[key].forEach(row => {
obj.list.push({
name: row.brand_name,
isHot: row.is_hot === 'Y' ? true : false,
isNew: row.is_show_new === 'Y' ? true : false,
url: helpers.urlFormat('/product/index/brand?domain=' + row.brand_domain)
});
resu.channel.brandList.push(obj);
}
});
resu.brandList.push(obj);
}
// 新入驻品牌
if (result && result[1] && result[1].data) {
let newList = result[1].data.new_list;
for (let key in newList) {
let obj = {};
let list = [];
list.push({
brandName: newList[key].brand_name,
url: helpers.urlFormat('/product/index/brand?domain=' + newList[key].brand_domain),
img: helpers.image(newList[key].brand_ico, 186, 115),
});
obj = Object.assign(obj, {
list
});
resu.channel.newBrandWall.push(obj);
}
let newList = result.data.new_list;
for (let key in newList) {
let obj = {
list: []
};
obj.list.push({
brandName: newList[key].brand_name,
url: helpers.urlFormat('/product/index/brand?domain=' + newList[key].brand_domain),
img: helpers.image(newList[key].brand_ico, 186, 115),
});
resu.newBrandWall.push(obj);
}
// 推荐品牌
if (result && result[1] && result[1].data) {
let hotList = result[1].data.hot_list;
for (let key in hotList) {
let obj = {};
let list = [];
list.push({
brandName: hotList[key].brand_name,
url: helpers.urlFormat('/product/index/brand?domain=' + hotList[key].brand_domain),
img: helpers.image(hotList[key].brand_ico, 186, 115),
});
obj = Object.assign(obj, {
list
});
resu.channel.recommandBrandWall.push(obj);
}
let hotList = result.data.hot_list;
for (let key in hotList) {
let obj = {
list: []
};
obj.list.push({
brandName: hotList[key].brand_name,
url: helpers.urlFormat('/product/index/brand?domain=' + hotList[key].brand_domain),
img: helpers.image(hotList[key].brand_ico, 186, 115),
});
resu.recommandBrandWall.push(obj);
}
return resu;
});
};
... ... @@ -602,6 +538,7 @@ const branchSearchHistoryAsync = (uid) => {
module.exports = {
getBrandByChannel,
getBrandListByChannel,
branchSearch,
delBrandSearchHistory,
addSearchHistory,
... ...
... ... @@ -26,6 +26,7 @@ router.get('/(:channel)/bottomBanner', channel.bottomBanner);
router.get('/cate', cate.index);
router.get('/brands', brandController.index); // 品牌首页
router.get('/brands/search', brandController.search); // 品牌搜索页
router.get('/brands/getBrandList', brandController.brandList); // 获取品牌列表
router.post('/brands/searchAsync', brandController.searchAsync); // 品牌搜索异步数据
router.post('/brands/addBrandSearch', brandController.addBrandSearch); // 添加品牌搜索记录
router.get('/brands/delBrandHistory', brandController.delBrandHistory); // 删除品牌搜索记录
... ...
... ... @@ -20,7 +20,7 @@
</a>
</div>
</div>
<div class="hide-when-loading">
<div>
{{# topData}}
{{! 头部banner}}
{{# bannerTop}}
... ... @@ -49,56 +49,11 @@
</li>
</ul>
</div>
<div class="second-level-brand">
{{# brandList}}
<div class="brand-list bar-{{@index}}">
<div class="title-bar">
<h2 style="position: static;">{{title}}</h2>
</div>
{{# list}}
<p>
<a href="{{url}}">{{name}}
{{# isHot}}
<i class="icon-hot">HOT</i>
{{/ isHot}}
{{# isNew}}
<i class="icon-new">NEW</i>
{{/ isNew}}
</a>
</p>
{{/ list}}
</div>
{{/ brandList}}
{{# newBrandWall}}
<div class="new-brand-wall branding-wall hide">
{{# list}}
<div class="brand-wall-box">
<a href="{{url}}">
<img class="lazy" data-original="{{img}}"></img>
<div class="brand-name">{{brandName}}</div>
</a>
</div>
{{/ list}}
</div>
{{/ newBrandWall}}
{{# recommandBrandWall}}
<div class="recommand-brand-wall branding-wall hide">
{{# list}}
<div class="brand-wall-box">
<a href="{{url}}">
<img class="lazy" data-original="{{img}}"></img>
<div class="brand-name">{{brandName}}</div>
</a>
</div>
{{/ list}}
</div>
{{/ recommandBrandWall}}
{{!--占位: 品牌列表部分--}}
<div id="placeholder-brandlist">
</div>
</div>
{{/channel}}
</div>
{{> footer-tab}}
\ No newline at end of file
... ...
... ... @@ -13,7 +13,6 @@
<a href="{{url}}">
<img class="swiper-lazy" data-src="{{image2 img q=60}}">
</a>
<div class="swiper-lazy-preloader"></div>
</li>
{{/if}}
{{/each}}
... ...
... ... @@ -6,8 +6,8 @@
<li class="swiper-slide">
<a href="{{url}}">
<img src="{{image2 img q=60}}" alt="">
<span class="brands-title">{{textCn}}</span>
</a>
<span class="brands-title">{{textCn}}</span>
</li>
{{/ list}}
</ul>
... ...
... ... @@ -20,9 +20,9 @@
<div class="swiper-slide">
<a href="{{url}}">
{{#if @first}}
<img src="{{image2 img width=200 height=100 q=60}}">
<img src="{{image2 img q=60}}">
{{^}}
<img class="swiper-lazy" data-src="{{image2 img width=200 height=100 q=60}}">
<img class="swiper-lazy" data-src="{{image2 img q=60}}">
{{/if}}
</a>
</div>
... ...
<div class="guang-info" data-id="{{id}}">
{{# author}}
<a class="info-author clearfix" href={{url}}>
<img class="lazy avatar" data-original={{avatar}}>
<span class="name">{{name}}</span>
</a>
{{/ author}}
<div class="info-img">
{{#if showTags}}
<a href="javascript:;" class="info-match">
{{# isTip}}
小贴士
<div class="info-tag tip"></div>
{{/ isTip}}
{{# isCollocation}}
搭配
<div class="info-tag collocation"></div>
{{/ isCollocation}}
{{# isFashionMan}}
潮人
<div class="info-tag fashion-man"></div>
{{/ isFashionMan}}
{{# isFashionGood}}
潮品
<div class="info-tag fashion-good"></div>
{{/ isFashionGood}}
{{# isTopic}}
话题
<div class="info-tag topic"></div>
{{/ isTopic}}
{{# isSpecialTopic}}
专题
<div class="info-tag special-topic"></div>
{{/ isSpecialTopic}}
</a>
{{/if}}
<a href="{{url}}">
<img class="lazy" data-original="{{img}}" alt="{{alt}}">
</a>
</div>
<div class="info-deps">
<a class="info-title-container" href="{{url}}">
<h2 class="info-title">{{title}}</h2>
</a>
<p class="info-text">{{text}}</p>
{{> guang/tvls}}
</div>
</div>
\ No newline at end of file
... ... @@ -31,7 +31,6 @@
<b>{{price}}</b>
</div>
</div>
<div class="swiper-lazy-preloader"></div>
</li>
{{/ productList}}
</ul>
... ...
... ... @@ -100,6 +100,6 @@
<input id="brand-id" type="hidden" value="{{brandId}}">
<input id="product-limit" type="hidden" value="{{isLimitBuy}}">
<input id="product-coupon-switch" type="hidden" value="{{showCoupon}}">
{{> common/suspend-home}}
</div>
{{/ result}}
... ...
... ... @@ -11,7 +11,6 @@
<span class="sale-price {{^price}}no-price{{/price}}">¥{{salePrice}}</span>
{{#price}}<span class="old-price">&yen;{{.}}</span>{{/price}}
</div>
<div class="swiper-lazy-preloader"></div>
</a>
{{/ recommendList}}
</div>
... ...
... ... @@ -7,7 +7,6 @@
<a href="{{#if url}}{{url}}{{else}}javascript:;{{/if}}">
<img class="swiper-lazy" data-src="{{image img 640 240}}">
</a>
<div class="swiper-lazy-preloader"></div>
</li>
{{/ list}}
</ul>
... ...
... ... @@ -11,7 +11,6 @@
<span class="sale-price {{^price}}no-price{{/price}}">￥{{salePrice}}</span>
{{#price}}<span class="old-price">￥{{.}}</span>{{/price}}
</div>
<div class="swiper-lazy-preloader"></div>
</a>
{{/recommendList}}
</div>
... ...
... ... @@ -31,7 +31,6 @@
<b>{{price}}</b>
</div>
</div>
<div class="swiper-lazy-preloader"></div>
</li>
{{/ productList}}
</ul>
... ...
... ... @@ -16,7 +16,6 @@
<a href="{{url}}">
<img class="swiper-lazy" data-src="{{image2 default_images w=235 h=314 q=60}}" alt="">
</a>
<div class="swiper-lazy-preloader"></div>
</div>
<div class="fresh-info">
<p class="fresh-name"><a href="{{url}}">{{product_name}}</a></p>
... ...
<div class="second-level-brand">
{{# brandList}}
<div class="brand-list bar-{{@index}}">
<div class="title-bar">
<h2 style="position: static;">{{title}}</h2>
</div>
{{# list}}
<p>
<a href="{{url}}">{{name}}
{{# isHot}}
<i class="icon-hot">HOT</i>
{{/ isHot}}
{{# isNew}}
<i class="icon-new">NEW</i>
{{/ isNew}}
</a>
</p>
{{/ list}}
</div>
{{/ brandList}}
{{# newBrandWall}}
<div class="new-brand-wall branding-wall hide">
{{# list}}
<div class="brand-wall-box">
<a href="{{url}}">
<img class="lazy" data-original="{{img}}"></img>
<div class="brand-name">{{brandName}}</div>
</a>
</div>
{{/ list}}
</div>
{{/ newBrandWall}}
{{# recommandBrandWall}}
<div class="recommand-brand-wall branding-wall hide">
{{# list}}
<div class="brand-wall-box">
<a href="{{url}}">
<img class="lazy" data-original="{{img}}"></img>
<div class="brand-name">{{brandName}}</div>
</a>
</div>
{{/ list}}
</div>
{{/ recommandBrandWall}}
</div>
\ No newline at end of file
... ...
/**
* Created by Acgpiano on 2016/9/19.
*/
require('../../scss/activity/_coupon-floor.css');
var $ = require('yoho-jquery'),
Swiper = require('yoho-swiper'),
Swiper = require('yoho-swiper2'),
$receive = $('.main-right-receive'),
$mask = $('.floor-mask'),
$message = $('.floor-message'),
$tooltip = $('.floor-tooltip'),
tip = require('../plugin/tip');
require('../common');
// 获取url中的参数
function getUrlParam(name) {
// 构造一个含有目标参数的正则表达式对象
var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)');
// 匹配目标参数
var r = window.location.search.substr(1).match(reg);
// 返回参数值
if (r !== null) {
return r[2];
}
return null;
return window.queryString[name];
}
require('../common');
// 获取领券状态
function getCouponStatus() {
setTimeout(function() {
var req = '',
code = getUrlParam('code'),
version = getUrlParam('app_version'),
... ... @@ -55,7 +45,7 @@ function getCouponStatus() {
cates.forEach(function(obj) {
var e = document.getElementById(obj.couponID);
if (!e) {
return;
}
... ... @@ -79,9 +69,7 @@ function getCouponStatus() {
}
}
});
}
getCouponStatus();
}, 300);
$receive.on('click', function() {
var $curDom = $(this);
... ...
... ... @@ -3,64 +3,77 @@
* @author: liangzhifeng<zhifeng.liang@yoho.cn>
* @date: 2015/10/23
*/
require('../../scss/channel/_brand.css');
var $ = require('yoho-jquery'),
Hammer = require('yoho-hammer'),
Hammer = require('../common/toy-hammer'),
Swiper = require('yoho-swiper'),
loading = require('../plugin/loading'),
lazyLoad = require('yoho-jquery-lazyload');
var ranToken = ' ??++ ';
var ranToken2 = ' ???--- ';
var swiper,
$fixTitleBar,
$brandList = $('.brand-list'),
var $brandList,
$newBrandWall,
$recommandBrandWall,
$icon = $('.search-icon'),
$genderItem = $('.genderNav li'),
$brandItem = $('.brandNav li'),
$newBrandWall = $('.new-brand-wall'),
$recommandBrandWall = $('.recommand-brand-wall'),
$searchAction = $('.search-action'),
$homebuttom = $('.homebuttom'),
$genderNav = $('.genderNav'),
$newSearch = $('.newbrand-search'),
$netHistory = $('.net-history'),
$navBtn = $('.nav-home'),
hotBrandsSwiper;
var searchH = $('.newbrand-search').outerHeight(),
headerH = $('.yoho-header').outerHeight(),
brandSwipe = parseInt(searchH) + parseInt(headerH) - 1,
minBrandListTop;
$searchResult = $('.search-result'),
$navBtn = $('.nav-home');
var brandsData,
$keyword = $('#keyword'),
clearTextHammer;
$keyword = $('#keyword');
var $history = $('.local-history');
var $searchPage = $('.search-brand-page');
var $historySearch = $('.history-search');
var $hotSearch = $('.hot-search');
var $clearHistory = $('#clear-history');
var chHammer;
var isSearchPage = $('.brand-search-page').length > 0;
require('../common');
require('../footer');
function getBrandList() {
var listHbs = require('channel/brandlist.hbs');
$.ajax({
url: '/brands/getBrandList',
data: {
channel: window.queryString.channel
},
success: function(data) {
$('#placeholder-brandlist').replaceWith(listHbs(data));
lazyLoad($('img.lazy'));
// 改变背景色
changeBackground();
$brandList = $('.brand-list');
$newBrandWall = $('.new-brand-wall');
$recommandBrandWall = $('.recommand-brand-wall');
},
error: function() {
}
});
}
function changeBackground() {
var $brandList = $('.brand-list').find('p');
var brandList = $('.brand-list').find('p');
$brandList.on('touchstart', function() {
$brandList.css('background', '#fff');
brandList.on('touchstart', function() {
brandList.css('background', '#fff');
$(this).css('background', '#eee');
}).on('touchend touchcancel', function() {
$(this).css('background', '#fff');
});
}
changeBackground();
/**
* 增加单条记录
... ... @@ -70,7 +83,7 @@ function addHistory(brandName) {
type: 'POST',
url: '/brands/addBrandSearch',
data: 'brandName=' + encodeURIComponent(brandName),
success: function(data) {
success: function() {
},
error: function() {
}
... ... @@ -91,15 +104,16 @@ function sequence(a, b) {
function searchInput() {
if ($keyword.val().length) {
$icon.css('color', '#444');
$searchResult.css('margin-bottom', '6rem');
// $(this).closest('.search-box').css('width', '11.25rem');
$searchAction.show().find('.clear-text').show();
} else {
$icon.css('color', '#b2b2b2');
$searchResult.css('margin-bottom', '0');
// $(this).closest('.search-box').css('width', '12.5rem');
$searchAction.find('.clear-text').hide();
}
searchResult();
}
... ... @@ -241,47 +255,20 @@ function searchResult() {
}
// 插入 dom，绑定事件
$('.search-result').html(html);
$searchResult.html(html);
changeBackground();
bindWriteLocal($('.brand-list'), true);
}
loading.showLoadingMask();
lazyLoad($('img.lazy'));
$('.yoho-header').css({
'z-index': 2,
position: 'fixed',
top: 0
});
$homebuttom.css('top', '47px');
$homebuttom.css('position', 'fixed');
$navBtn.on('touchstart', function() {
if ($homebuttom.hasClass('hide')) {
$genderNav.css('top', '47px');
$newSearch.css('margin-top', '0px');
$searchPage.css('margin-top', '0px');
$('.banner-top').css('margin-top', '0px');
} else {
$genderNav.css('top', '97px');
$newSearch.css('margin-top', '47px');
$searchPage.css('margin-top', '47px');
$('.banner-top').css('margin-top', '47px');
}
});
(function() {
if ($('.banner-top').length > 0) {
$('.hot-brands').css('padding-top', '0');
if ($('.banner-top').length === 0) {
var h1 = $('.genderNav').height();
var h2 = $('.newbrand-search').height();
$('.hot-brands').css('padding-top', (h1 + h2) + 'px');
}
$('.hide-when-loading').show();
loading.hideLoadingMask();
// banner滑动
swiper = new Swiper('.swiper-container', {
new Swiper('.swiper-container', {
lazyLoading: true,
loop: true,
autoplay: 3000,
... ... @@ -289,60 +276,67 @@ $navBtn.on('touchstart', function() {
});
// 热门品牌滑动
hotBrandsSwiper = new Swiper('.brands-swiper', {
new Swiper('.brands-swiper', {
grabCursor: true,
slidesPerView: 'auto',
wrapperClass: 'brands-list',
slideElement: 'li'
});
}());
$fixTitleBar = $('<div class="title-bar fixed-title-bar"><h2></h2></div>');
$fixTitleBar.css({
position: 'fixed',
top: brandSwipe
}).hide();
minBrandListTop = brandSwipe + $('.hot-brands').outerHeight() + $('.banner-top').outerHeight();
$brandList.last().append($fixTitleBar);
$genderItem.on('touchstart', function() {
var index = $(this).data('id') + 1;
window.location.search = 'channel=' + index;
});
function scrollHandler() {
var scrTop = $(window).scrollTop();
$brandItem.on('click', function() {
var index = $(this).data('id');
$('.brandNav ul .active').removeClass('active');
$(this).addClass('active');
if (index === 0) {
$recommandBrandWall.not('.hide').addClass('hide');
$newBrandWall.not('.hide').addClass('hide');
$brandList.removeClass('hide');
} else if (index === 1) {
$newBrandWall.removeClass('hide');
$brandList.not('.hide').addClass('hide');
$recommandBrandWall.not('.hide').addClass('hide');
} else {
$recommandBrandWall.removeClass('hide');
$brandList.not('.hide').addClass('hide');
$newBrandWall.not('.hide').addClass('hide');
}
});
if ($brandList.eq(0).offset().top < minBrandListTop) {
$fixTitleBar.hide();
if (!isSearchPage) {
setTimeout(getBrandList, 50);
}
}());
$brandList.each(function() {
var offTop = $(this).offset().top - brandSwipe;
if (scrTop >= offTop) {
$fixTitleBar.css({
display: 'block'
}).find('h2').html($(this).find('.title-bar').text());
}
// 搜索页面
if (isSearchPage) {
$('.yoho-header').css({
'z-index': 2,
position: 'fixed',
top: 0
});
}
if ($('.brand-index-page').length > 0) {
/**
* srcoll to load more
*/
$(window).scroll(function() {
window.requestAnimationFrame(scrollHandler);
$homebuttom.css('top', '45px');
$homebuttom.css('position', 'fixed');
$navBtn.on('touchstart', function() {
if ($homebuttom.hasClass('hide')) {
$searchResult.css('margin-top', '0px');
$newSearch.css('margin-top', '0px');
$searchPage.css('margin-top', '0px');
} else {
$searchResult.css('margin-top', '45px');
$newSearch.css('margin-top', '45px');
$searchPage.css('margin-top', '45px');
}
});
}
if ($('.history-search').length > 0) {
bindWriteLocal($('.history-search'), false);
}
if ($('.hot-search').length > 0) {
bindWriteLocal($('.hot-search'), false);
}
bindWriteLocal($historySearch, false);
bindWriteLocal($hotSearch, false);
if ($('.brand-search-page').length > 0) {
brandsData = $.parseJSON($('#brands-data').html());
$keyword.on('input', function() {
... ... @@ -354,86 +348,35 @@ if ($('.brand-search-page').length > 0) {
$keyword.closest('.search-box').css('width', '13rem');
$searchAction.show().find('.clear-text').hide();
clearTextHammer = new Hammer($('.clear-text')[0]);
var clearTextHammer = new Hammer($('.clear-text')[0]);
clearTextHammer.on('tap', function(e) {
$('.search-result').html('');
$searchResult.html('');
$('#keyword').val('').trigger('input');
e.preventDefault();
e.srcEvent.preventDefault();
e.srcEvent.stopPropagation();
});
$('form.search-box').on('submit', function() {
return false;
});
}
if ($genderItem.length > 0) {
$genderItem.on('touchstart', function() {
var index = $(this).data('id') + 1;
$('.genderNav ul .active').removeClass('active');
$(this).addClass('active');
$('.hide-when-loading').hide();
loading.showLoadingMask();
function reload() {
window.location.search = 'channel=' + index;
}
setTimeout(reload.bind(this), 100);
});
}
if ($brandItem.length > 0) {
$brandItem.on('click', function() {
var index = $(this).data('id');
$('.brandNav ul .active').removeClass('active');
$(this).addClass('active');
if (index === 0) {
$recommandBrandWall.not('.hide').addClass('hide');
$newBrandWall.not('.hide').addClass('hide');
$brandList.removeClass('hide');
} else if (index === 1) {
$newBrandWall.removeClass('hide');
$brandList.not('.hide').addClass('hide');
$recommandBrandWall.not('.hide').addClass('hide');
} else {
$recommandBrandWall.removeClass('hide');
$brandList.not('.hide').addClass('hide');
$newBrandWall.not('.hide').addClass('hide');
}
});
}
/**
* 清除记录
*/
function removeHistory() {
$.ajax({
type: 'GET',
url: '/brands/delBrandHistory',
data: '',
success: function(data) {
},
error: function() {
// 初始化历史搜索的内容
if (isSearchPage) {
require('./brand-render')(function() {
// 清除记录
function removeHistory() {
$.ajax({
type: 'GET',
url: '/brands/delBrandHistory',
data: '',
success: function() {},
error: function() {}
});
}
});
}
// 初始化历史搜索的内容
require('./brand-render')(function() {
$netHistory = $('.net-history');
if ($('.brand-search-page').length > 0) {
chHammer = new Hammer($clearHistory[0]);
$netHistory = $('.net-history');
var chHammer = new Hammer($clearHistory[0]);
chHammer.on('tap', function() {
if (isLocalStorageSupported()) {
localStorage.removeItem('historys-brand');
... ... @@ -450,7 +393,6 @@ require('./brand-render')(function() {
});
// 搜索页面
(function() {
var html = '',
history,
... ... @@ -465,7 +407,6 @@ require('./brand-render')(function() {
netArr = [];
$netHistory.find('li').each(function() {
brand = $(this).find('a').attr('brandName');
time = $(this).find('a').attr('collectTime');
dict = {
... ... @@ -568,9 +509,6 @@ require('./brand-render')(function() {
} else {
$history.addClass('hide');
}
}());
}
});
});
}
... ...
.coupon-area-page {
max-width: 640px;
overflow: hidden;
@import "../layout/_swiper.css";
.swiper-slide {
img {
max-width: 640px;
max-height: 310.303px;
.coupon-area-page {
max-width: 640px;
overflow: hidden;
.banner-top {
position: relative;
margin-bottom: -2PX;
.swiper-pagination {
position: absolute;
left: 0;
right: 0;
bottom: 20px;
text-align: center;
z-index: 1;
.pagination-inner {
display: inline-block;
padding: 0 8px 4px;
background: rgba(0, 0, 0, 0.2);
border-radius: 50px;
line-height: 1.2;
span {
display: inline-block;
width: 14px;
height: 14px;
background: #fff;
opacity: 0.5;
margin: 0 9px;
border-radius: 50%;
&.swiper-pagination-bullet-active {
background: #fff;
opacity: 1;
}
}
}
}
}
.swiper-slide {
img {
max-width: 640px;
max-height: 310.303px;
}
}
}
.just-img{
width: 100%;
float: left;
margin:0;
.just-img {
width: 100%;
float: left;
margin: 0;
}
.coupon-floor {
float: left;
float: left;
width: 100%;
.floor-title {
background-color: #fff;
text-align: center;
height: 96px;
line-height: 96px;
font-size: 30px;
}
.floor-main {
height: 180px;
width: 100%;
background-size: 100%;
background-repeat: no-repeat;
padding: 10px 30px;
box-sizing: border-box;
float: left;
.floor-title {
background-color: #fff;
text-align: center;
height: 96px;
line-height: 96px;
font-size: 30px;
.main-left {
float: left;
width: 78%;
height: 160px;
}
.floor-main {
height: 180px;
width: 100%;
background-size: 100%;
.main-right-receive,
.main-right-use,
.main-right-go {
float: right;
width: 18%;
height: 160px;
position: relative;
&.hidden {
display: none;
}
span {
background-repeat: no-repeat;
padding: 10px 30px;
box-sizing: border-box;
float: left;
.main-left {
float: left;
width: 78%;
height: 160px;
background-size: contain;
&.on-receive {
position: absolute;
left: 50%;
top: 50px;
margin-left: -26px;
display: inline-block;
width: 52px;
height: 54px;
background-image: resolve("activity/click-txt.png");
}
&.received {
width: 100%;
height: 132px;
background-image: resolve("activity/received.png");
position: absolute;
top: 0;
right: 0;
}
.main-right-receive, .main-right-use, .main-right-go {
float: right;
width: 18%;
height: 160px;
position: relative;
&.hidden {
display: none;
}
span {
background-repeat: no-repeat;
background-size: contain;
&.on-receive {
position: absolute;
left: 50%;
top: 50px;
margin-left: -26px;
display: inline-block;
width: 52px;
height: 54px;
background-image: resolve('activity/click-txt.png');
}
&.received {
width: 100%;
height: 132px;
background-image: resolve('activity/received.png');
position: absolute;
top: 0;
right: 0;
}
&.zero {
width: 100%;
height: 132px;
background-image: resolve('activity/zero.png');
position: absolute;
top: 0;
right: 0;
}
}
&.zero {
width: 100%;
height: 132px;
background-image: resolve("activity/zero.png");
position: absolute;
top: 0;
right: 0;
}
}
}
}
}
.floor-mask {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0, 0, 0, .5);
display: none;
z-index: 9;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0, 0, 0, .5);
display: none;
z-index: 9;
}
.floor-message {
position: fixed;
top: 50%;
left: 50%;
width: 550px;
height: 250px;
margin-left: -275px;
margin-top: -125px;
z-index: 10;
background-color: rgba(250, 250, 250, .92);
display: none;
border-radius: 10px;
.coupon-message-content {
border-bottom: 1px solid rgb(197, 197, 197);
height: 160px;
text-align: center;
line-height: 160px;
font-size: 28px;
}
.coupon-message-op {
height: 90px;
text-align: center;
line-height: 90px;
font-size: 32px;
color: rgb(223, 98, 112);
}
position: fixed;
top: 50%;
left: 50%;
width: 550px;
height: 250px;
margin-left: -275px;
margin-top: -125px;
z-index: 10;
background-color: rgba(250, 250, 250, .92);
display: none;
border-radius: 10px;
.coupon-message-content {
border-bottom: 1px solid rgb(197, 197, 197);
height: 160px;
text-align: center;
line-height: 160px;
font-size: 28px;
}
.coupon-message-op {
height: 90px;
text-align: center;
line-height: 90px;
font-size: 32px;
color: rgb(223, 98, 112);
}
}
.floor-tooltip{
position: fixed;
top: 50%;
left: 50%;
width: 220px;
height: 140px;
margin-left: -110px;
margin-top: -70px;
z-index: 11;
background-color: rgba(60, 60, 60, .7);
display: none;
border-radius: 8px;
color: #fff;
.icon-box{
height: 84px;
line-height: 84px;
text-align: center;
}
.icon-msg{
height: 56px;
text-align: center;
}
.floor-tooltip {
position: fixed;
top: 50%;
left: 50%;
width: 220px;
height: 140px;
margin-left: -110px;
margin-top: -70px;
z-index: 11;
background-color: rgba(60, 60, 60, .7);
display: none;
border-radius: 8px;
color: #fff;
.icon-box {
height: 84px;
line-height: 84px;
text-align: center;
}
.icon-msg {
height: 56px;
text-align: center;
}
}
\ No newline at end of file
... ...
@import "search";
@import "floor-header";
@import "footer-tab";
@import "hot-brands";
@import "../layout/_swiper.css";
.brand-page {
.re-pos-search {
top: 80px !important;
}
.hide-when-loading {
display: none;
.banner-top {
position: relative;
margin-bottom: -2PX;
.swiper-pagination {
position: absolute;
left: 0;
right: 0;
bottom: 20px;
text-align: center;
z-index: 1;
.pagination-inner {
display: inline-block;
padding: 0 8px 4px;
background: rgba(0, 0, 0, 0.2);
border-radius: 50px;
line-height: 1.2;
span {
display: inline-block;
width: 14px;
height: 14px;
background: #fff;
opacity: 0.5;
margin: 0 9px;
border-radius: 50%;
&.swiper-pagination-bullet-active {
background: #fff;
opacity: 1;
}
}
}
}
}
.genderNav {
... ... @@ -212,13 +249,17 @@
}
}
.second-level-brand {
overflow: hidden;
margin-bottom: 100px;
}
.banner-top {
padding-top: 168px;
background-color: #f8f8f8;
}
.hot-brands {
padding-top: 178px;
border-top: 30px solid #f4f4f4;
.floor-header {
... ... @@ -371,7 +412,7 @@
padding-top: 178px;
&.wechat {
padding-top: 88px;
padding-top: 88px;
}
}
}
... ...
... ... @@ -97,8 +97,10 @@
li {
float: left;
padding-left: 5%;
padding-bottom: 5%;
width: 21.875%;
height: 140px;
position: relative;
a {
position: relative;
... ... @@ -113,14 +115,13 @@
display: inline-block;
max-width: 100%;
max-height: 100%;
vertical-align: middle;
}
.brands-title {
position: absolute;
left: 8px;
left: 40px;
right: 8px;
bottom: 8px;
bottom: -5px;
height: 28px;
line-height: 28px;
text-align: center;
... ...