fe / yoho-blk · Commits

Go to a project

Authored by zhangxiaoru
Commit 9f50b162a9ef67593a0817f108768b3c07c3e403 1 parent 545951c4

brand node

Inline Side-by-side
Showing 8 changed files with 296 additions and 205 deletions
... ... @@ -5,207 +5,189 @@
*/
'use strict';
const brand = require('../models/brand');
const index = (req, res) => {
res.display('index', {
module: 'brand',
page: 'index',
title: '品牌',
brand: {
nav: [
{
link: '//guang.yohobuy.com/index/index?type=0',
pathTitle: '首页',
name: 'MEN首页'
},
{
link: '/',
pathTitle: '品牌',
name: 'Brand品牌'
}
],
tabs: [
{
url: '#',
name: '',
src: '#'
},
{
url: '#',
name: '',
src: '#'
},
{
url: '#',
name: '',
src: '#'
}
],
navigation: [
{
name: 'A'
},
{
name: 'B'
},
{
name: 'C'
},
{
name: 'D'
},
{
name: 'E'
},
{
name: 'F'
},
{
name: 'G'
}
],
category: [
{
key: 'A',
brandList: [
{
key: 'A',
href: '#',
name: 'edhwke'
},
{
key: 'A',
href: '#',
name: 'edhwke'
},
{
key: 'A',
href: '#',
name: 'edhwke'
},
{
key: 'A',
href: '#',
name: 'edhwke'
},
{
key: 'A',
href: '#',
name: 'edhwke'
},
{
key: 'A',
href: '#',
name: 'edhwke'
}
]
},
{
key: 'B',
brandList: [
{
key: 'A',
href: '#',
name: 'edhwke'
},
{
key: 'A',
href: '#',
name: 'edhwke'
},
{
key: 'A',
href: '#',
name: 'edhwke'
},
{
key: 'A',
href: '#',
name: 'edhwke'
},
{
key: 'A',
href: '#',
name: 'edhwke'
},
{
key: 'A',
href: '#',
name: 'edhwke'
}
]
},
{
key: 'C',
brandList: [
{
key: 'A',
href: '#',
name: 'edhwke'
},
{
key: 'A',
href: '#',
name: 'edhwke'
},
{
key: 'A',
href: '#',
name: 'edhwke'
},
{
key: 'A',
href: '#',
name: 'edhwke'
},
{
key: 'A',
href: '#',
name: 'edhwke'
},
{
key: 'A',
href: '#',
name: 'edhwke'
}
]
},
{
key: 'D',
brandList: [
{
key: 'A',
href: '#',
name: 'edhwke'
},
{
key: 'A',
href: '#',
name: 'edhwke'
},
{
key: 'A',
href: '#',
name: 'edhwke'
},
{
key: 'A',
href: '#',
name: 'edhwke'
}
]
}
]
},
brand.getListData().then((result) => {
res.display('index', {
module: 'brand',
page: 'index',
title: '品牌',
brand: {
nav: [
{
link: '//guang.yohobuy.com/index/index?type=0',
pathTitle: '首页',
name: 'MEN首页'
},
{
link: '/',
pathTitle: '品牌',
name: 'Brand品牌'
}
],
tabs: [
{
url: '#',
name: '',
src: '#'
},
{
url: '#',
name: '',
src: '#'
},
{
url: '#',
name: '',
src: '#'
}
],
// navigation: result,
category: result
// category: [
// {
// key: 'A',
// brandList: [
// {
// key: 'A',
// href: '#',
// name: 'edhwke'
// },
// {
// key: 'A',
// href: '#',
// name: 'edhwke'
// },
// {
// key: 'A',
// href: '#',
// name: 'edhwke'
// },
// {
// key: 'A',
// href: '#',
// name: 'edhwke'
// },
// {
// key: 'A',
// href: '#',
// name: 'edhwke'
// },
// {
// key: 'A',
// href: '#',
// name: 'edhwke'
// }
// ]
// },
// {
// key: 'B',
// brandList: [
// {
// key: 'A',
// href: '#',
// name: 'edhwke'
// },
// {
// key: 'A',
// href: '#',
// name: 'edhwke'
// },
// {
// key: 'A',
// href: '#',
// name: 'edhwke'
// },
// {
// key: 'A',
// href: '#',
// name: 'edhwke'
// },
// {
// key: 'A',
// href: '#',
// name: 'edhwke'
// },
// {
// key: 'A',
// href: '#',
// name: 'edhwke'
// }
// ]
// },
// {
// key: 'C',
// brandList: [
// {
// key: 'A',
// href: '#',
// name: 'edhwke'
// },
// {
// key: 'A',
// href: '#',
// name: 'edhwke'
// },
// {
// key: 'A',
// href: '#',
// name: 'edhwke'
// },
// {
// key: 'A',
// href: '#',
// name: 'edhwke'
// },
// {
// key: 'A',
// href: '#',
// name: 'edhwke'
// },
// {
// key: 'A',
// href: '#',
// name: 'edhwke'
// }
// ]
// },
// {
// key: 'D',
// brandList: [
// {
// key: 'A',
// href: '#',
// name: 'edhwke'
// },
// {
// key: 'A',
// href: '#',
// name: 'edhwke'
// },
// {
// key: 'A',
// href: '#',
// name: 'edhwke'
// },
// {
// key: 'A',
// href: '#',
// name: 'edhwke'
// }
// ]
// }
// ]
},
helpers: {
// import component, path depends on your project
pagination: require('../../../doraemon/components/pagination/pagination').createPagination
}
helpers: {
// import component, path depends on your project
pagination: require('../../../doraemon/components/pagination/pagination').createPagination
}
});
});
};
}
module.exports = {
index // 组件demo页
... ...
'use strict';
const serviceAPI = global.yoho.ServiceAPI;
const api = global.yoho.API;
const camelCase = global.yoho.camelCase;
const _ = require('lodash');
const _processListData = (list) => {
let category = {
key: '',
brands: []
};
let listData = [];
list = list || [];
list = camelCase(list);
_.forEach(list.data, function(value, index) {
_.forEach(value, function(obj) {
obj.brandIco = `//img13.static.yhbimg.com/brandLogo/${obj.brandIco}?imageView2/3/w/{width}/h/{height}`;
if (!_.isNaN(+index)) {
category.key = '0-9';
category.brands.push(obj);
}
});
if (_.isNaN(+index)) {
listData.push(
{
key: index,
brands: value
}
)
}
console.log(value)
});
listData.push(category);
return listData;
};
const getListData = () => {
return api.get('', {
method: 'app.brand.newBrandList'
}).then((result) => {
if (result && result.code === 200) {
return _processListData(result);
} else {
logger.error('品牌页数据返回 code 不是 200');
return {};
}
});
};
module.exports = {
getListData: getListData
};
... ...
... ... @@ -18,8 +18,8 @@
<div class="brands-category">
<div class="category-nav">
{{#each navigation}}
<a href="#{{name}}">{{name}}</a>
{{#each category}}
<a href="#{{key}}">{{key}}</a>
{{/each}}
</div>
</div>
... ...
... ... @@ -3,11 +3,11 @@
<dt>{{key}}</dt>
<dd>
<ul class="clearfix">
{{#each brandList}}
{{#each brands}}
<li>
<a data-key="{{key}}" href="{{href}}" target="_blank">
<img class="lazy" data-original="{{href}}">
<span>{{name}}</span>
<img class="lazy" data-original="{{image brandIco 270 190}}">
<span>{{brandName}}</span>
</a>
</li>
{{/each}}
... ...
... ... @@ -41,6 +41,7 @@ const _processListData = (list) => {
return data;
});
console.log(artList)
return artList;
};
... ...
... ... @@ -16,5 +16,5 @@ module.exports = app => {
app.use('/me', require('./apps/me')); // 个人中心
app.use('/editorial', require('./apps/editorial')); // 资讯
app.use('/product', require('./apps/product'));
app.use('/brand', require('./apps/brand')); // 资讯
app.use('/brand', require('./apps/brand')); // 品牌
};
... ...
/**
* 品牌页
* @author: zxr<xiaoru.zhang@yoho.cn>
* @date: 2016/07/09
*/
var $ = require('yoho-jquery'),
lazyLoad = require('yoho-jquery-lazyload');
var $list = $('.brands-list'),
$gory = $('.brands-category'),
$category = $gory.find('a'),
categoryHeight = $category.height(),
categoryTop = $category.offset() ? $category.offset().top : 0;
require('../common/header');
require('../common/return-top');
lazyLoad($('.brands-list img.lazy'));
// 品牌类别滚动事件
$(window).scroll(function() {
if ($(this).scrollTop() >= categoryTop) {
$gory.addClass('category-fix');
} else {
$gory.removeClass('category-fix');
}
});
// 点击字母，页面滚动到相关区域
$category.click(function() {
var name = $(this).attr('href').split('#')[1],
targetTop = $list.find('[name=' + name + ']').offset().top - categoryHeight;
$('.category-nav').find('a').css('color', '#222');
$(this).css('color', '#379ed6');
if (!$gory.hasClass('category-fix')) {
targetTop -= categoryHeight;
}
$('html,body').animate({
scrollTop: targetTop
}, 200);
return false;
});
... ...
... ... @@ -4,6 +4,7 @@
.brands-tabs {
position: relative;
margin-bottom: 20px;
overflow: hidden;
a {
display: block;
... ... @@ -60,8 +61,7 @@
.category-nav {
border-top: 1px solid #eee;
border-bottom: 1px solid #eee;
padding-left: 16px;
width: 100%;
width: 1150px;
height: 44px;
line-height: 44px;
font-size: 12px;
... ... @@ -72,13 +72,14 @@
a {
display: inline-block;
padding: 0 7px;
padding-left: 29px;
text-align: center;
color: #222;
cursor: pointer;
}
}
.brands-list {
dt {
... ...