fe / yohoblk-wap · Commits

Go to a project

Authored by ccbikai
Commit 2537b3241f2dcd01077ca3a6f3f6b5d5c3630a22 2 parents 5ca3bdbc 09aebbc6

Merge branch 'develop' of git.yoho.cn:fe/yohoblk-wap into develop

Inline Side-by-side
Showing 43 changed files with 2242 additions and 2023 deletions

Too many changes to show.
Reload with full diff Plain diff Email patch

To preserve performance only 43 of 43+ files are displayed.

... ... @@ -2,4 +2,5 @@
|---|---|---|
|Name | Path| Note|
|首页| /|
|侧边栏| /sidebar| 只有 app 使用|
\ No newline at end of file
|侧边栏| /sidebar| 只有 app 使用|
|品牌列表| /brand-list| |
\ No newline at end of file
... ...
... ... @@ -20,15 +20,17 @@ module.exports = {
index: (req, res) => {
res.render('brand/index', {
module: 'channel',
page: 'brand'
page: 'brand',
domain: req.domain
});
},
/* 获取品牌介绍 */
getBrandIntro: (req, res) => {
let params = req.query;
brandModel.getBrandData(params).then(result => {
brandModel.getBrandData({
domain: req.query.domain,
uid: req.user.uid
}).then(result => {
res.json(result);
});
},
... ... @@ -62,14 +64,19 @@ module.exports = {
/* 全部分类 */
cate: (req, res) => {
res.render('brand/cate', {
module: 'channel',
page: 'cate'
});
},
// 全部分类api
getCateList: (req, res) => {
let params = req.query;
brandModel.getCateListData(params).then(result => {
res.render('brand/cate', {
module: 'channel',
page: 'cate',
result: result
brandModel.getCateListData(params)
.then(result => {
res.json(result);
});
});
}
};
... ...
... ... @@ -25,9 +25,37 @@ module.exports = {
* 从接口获取品牌店铺数据
* @returns {*}
*/
getBrandOriginData(params) {
getShopInfoData(params) {
let finalParams = {
method: 'app.shops.getIntro',
shop_id: params.shopId
};
if (params.uid) {
Object.assign(finalParams, {
uid: params.uid
});
}
return api.get('', finalParams);
},
/**
* 通过品牌域名获取品牌信息
* @param params
*/
getBrandInfoByDomain(params) {
return api.get('', {
method: ''
method: 'web.brand.byDomain',
domain: params.domain
});
},
getShopsDecoratorList(params) {
return api.get('', {
method: 'app.shopsdecorator.getList',
});
},
... ... @@ -57,8 +85,9 @@ module.exports = {
* @returns {*}
*/
getCateListData(params) {
return api.get('', {
method: ''
});
return api.get('', Object.assign(params, {
method: 'app.sort.get'
})
);
}
};
... ...
... ... @@ -55,19 +55,50 @@ const handleBrandList = origin => {
const getBrandData = params => {
let finalResult = {};
return api.all([brandApi.getBrandOriginData(params)]).then(result => {
// 待处理，拼接输出模拟数据
Object.assign(finalResult, {
brandBg: 'http://7xwj52.com1.z0.glb.clouddn.com/brandbg.jpg',
showBrandLogo: false,
brandLogo: 'https://img11.static.yhbimg.com/brandLogo/2016/04/13/15/010eb8606c1072fd2e769c62567d3bbe93.png?imageView2/2/w/140/h/140',
brandName: 'A.Dorad',
brandIntro: 'Dora毕业于中国美术学院的珠宝设计专业。毕业之后，Dora便开始游走于各国，吸收各地首饰设计的精髓，之后又在首尔修学了3年，A.Dorad饰品系列诞生于首尔， 设计师Dora将首尔设为起点并逐步推向国际。2013年，A.Dorad将旗下主力设计师带领进军广州，并以此为基地，以国际化的标准，设计出全新概念饰品。A.Dorad给人们提供高品质的服务，并且拥有独有的工艺。多样的珠宝首饰产品造型更衬托出其前卫、高雅的设计理念。珍贵的矿石搭配流行的创意理念，启迪了人类艺术。A.Dorad饰品符合现代年轻人对珠宝的追求与热爱，充满个性与时尚.它可以满足不同人的需求独家定制专属于自己的水晶饰品。A.Dorad将继续发挥无与伦比的创造力并开启通往浪漫梦幻的大门。',
showMore: false
});
return finalResult;
return api.all([
brandApi.getBrandInfoByDomain({domain: params.domain})
]).then(result => {
if (result[0].code === 200) {
/* 品牌有店铺 */
if (result[0].data.shop_id) {
return api.all([
brandApi.getShopInfoData({
shopId: result[0].data.shop_id,
uid: params.uid
})
]).then(subResult => {
if (subResult[0].code === 200) {
/* TODO 判断是否是使用 BLK 模板，不使用 BLK 模板的就直接返回 */
if (subResult[0].data.shop_template_type === '2') {
Object.assign(finalResult, {
/* TODO 背景图取资源位，接口未开发 */
brandBg: 'http://7xwj52.com1.z0.glb.clouddn.com/brandbg.jpg',
/* TODO 是否显示店铺 LOGO，接口未开发 */
showBrandLogo: false,
brandLogo: subResult[0].data.shop_logo,
brandName: subResult[0].data.shop_name,
brandIntro: subResult[0].data.shop_intro,
showMore: false
});
return finalResult;
} else {
logger.info('no BLK template');
}
} else {
logger.error('getShopInfoData api code no 200');
}
});
} else {
logger.info('brand has no shop');
}
} else {
logger.error('getBrandOriginData api code no 200');
}
});
};
... ... @@ -108,17 +139,69 @@ const getBrandListData = params => {
* @returns {*|Promise.<TResult>}
*/
const getCateListData = params => {
let finalResult = {};
let finalResult = [];
let item = {};
let oneClass = [];
let subitem = {};
let genderArr = {boy: '1,3', girl: '2,3', kids: '1,2,3', lifestyle: '1,2,3'};
return brandApi.getCateListData(params).then(result => {
return api.all([brandApi.getCateListData(params)]).then(result => {
if (result.code !== 200) {
return [];
}
_.forEach(result.data, (category, categorykey) => {
oneClass = {name: categorykey, ca: []};
_.forEach(category, (cate) => {
item = {
id: cate.category_id,
name: cate.category_name,
sort: cate.relation_parameter.sort,
sub: []
};
if (_.isEmpty(cate.sub)) {
item.url = helpers.urlFormat('/', {
sort: item.sort,
sort_name: item.name,
gender: genderArr[categorykey]
}, 'list');
oneClass.ca.push(item);
return true;// equal continue;
}
// 有子分类的，首先添加一级分类
item.sub.push({
name: '全部' + item.name,
id: item.sort,
url: helpers.urlFormat('/', {
sort: item.sort,
sort_name: item.name,
gender: genderArr[categorykey]
}, 'list'),
sub: []
});
_.forEach(cate.sub, (sub) => {
subitem = {
id: sub.category_id,
name: sub.category_name,
sort: sub.relation_parameter.sort,
url: ''
};
subitem.url = helpers.urlFormat('/', {
sort: subitem.sort,
sort_name: subitem.name,
gender: genderArr[categorykey]
}, 'list');
item.sub.push(subitem);
});
oneClass.ca.push(item);
});
// 待处理，拼接输出模拟数据
Object.assign(finalResult, {
brandBg: 'http://7xwj52.com1.z0.glb.clouddn.com/brandbg.jpg',
brandLogo: '',
brandName: 'A.Dorad',
brandIntro: 'Dora毕业于中国美术学院的珠宝设计专业。毕业之后，Dora便开始游走于各国，吸收各地首饰设计的精髓，之后又在首尔修学了3年，A.Dorad饰品系列诞生于首尔， 设计师Dora将首尔设为起点并逐步推向国际。2013年，A.Dorad将旗下主力设计师带领进军广州，并以此为基地，以国际化的标准，设计出全新概念饰品。A.Dorad给人们提供高品质的服务，并且拥有独有的工艺。多样的珠宝首饰产品造型更衬托出其前卫、高雅的设计理念。珍贵的矿石搭配流行的创意理念，启迪了人类艺术。A.Dorad饰品符合现代年轻人对珠宝的追求与热爱，充满个性与时尚.它可以满足不同人的需求独家定制专属于自己的水晶饰品。A.Dorad将继续发挥无与伦比的创造力并开启通往浪漫梦幻的大门。',
showMore: false
finalResult.push(oneClass);
});
return finalResult;
... ...
... ... @@ -21,6 +21,7 @@ router.get('/get-brand-shop-goods', brand.getBrandShopGoods); // 店铺介绍
router.get('/brand-list', brand.brandList); // 品牌列表页
router.get('/get-brand-list', brand.getBrandList); // 获取品牌列表数据
router.get('/cate', brand.cate); // 全部分类
router.get('/get-cate-list', brand.getCateList); // 全部分类数据列表
router.get('/sidebar', channel.sidebar); // 资源位接口
... ...
<div class="cate-page" id='cate'>
<div class="cate-nav clearfix">
<li class="focus">
<span>Boy</span>
</li>
<li class="">
<span>Girl</span>
</li>
<li class="">
<span>Kid</span>
</li>
<li class="">
<span>Lifestyle</span>
</li>
</div>
<div class="cate-container clearfix">
<div class="content " style="height: 522px;">
<ul class="primary-level">
<li class="p-level-item">
上衣
</li>
<li class="p-level-item focus">
鞋靴
</li>
<li class="p-level-item">
包类
</li>
<li class="p-level-item">
内衣/家居服
</li>
<li class="p-level-item">
美妆/个护
</li>
<li class="p-level-item">
裤装
</li>
<li class="p-level-item">
服配
</li>
<li class="p-level-item">
<a href="//list.dev.yohobuy.com/?sort=115&amp;sort_name=NINO&amp;gender=1%2C3"> NINO</a>
</li>
<li class="p-level-item">
<a href="//list.dev.yohobuy.com/?sort=242&amp;sort_name=%E6%B5%8B%E8%AF%95%E5%89%8D%E5%8F%B0%E6%98%AF%E5%90%A6%E8%83%BD%E5%90%8C%E6%AD%A5&amp;gender=1%2C3"> 测试前台是否能同步</a>
</li>
<li class="p-level-item">
<a href="//list.dev.yohobuy.com/?sort=585&amp;sort_name=%E5%90%AB3%E7%BA%A7%E4%B8%8D%E5%85%B3%E8%81%94&amp;gender=1%2C3"> 含3级不关联</a>
</li>
<li class="p-level-item">
含3级关联
</li>
<li class="p-level-item">
<a href="//list.dev.yohobuy.com/?sort=321&amp;sort_name=12&amp;gender=1%2C3"> 12</a>
</li>
</ul>
<div class="sub-level-container">
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=116%2C114%2C640&amp;sort_name=%E4%B8%8A%E8%A1%A3&amp;gender=1%2C3">
全部上衣
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=114%2C293&amp;sort_name=T%E6%81%A4&amp;gender=1%2C3">
T恤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=123&amp;sort_name=%E6%A3%89%E8%A1%A3&amp;gender=1%2C3">
棉衣
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=119&amp;sort_name=%E5%8D%AB%E8%A1%A3&amp;gender=1%2C3">
卫衣
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=115&amp;sort_name=%E8%A1%AC%E8%A1%AB&amp;gender=1%2C3">
衬衫
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=125&amp;sort_name=%E5%A4%A7%E8%A1%A3%2F%E9%A3%8E%E8%A1%A3&amp;gender=1%2C3">
大衣/风衣
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=173&amp;sort_name=%E7%9A%AE%E8%A1%A3&amp;gender=1%2C3">
皮衣
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=227&amp;sort_name=%E9%98%B2%E9%A3%8E%E5%A4%96%E5%A5%97&amp;gender=1%2C3">
防风外套
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=118&amp;sort_name=%E9%A9%AC%E7%94%B2&amp;gender=1%2C3">
马甲
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=124&amp;sort_name=%E5%A4%B9%E5%85%8B&amp;gender=1%2C3">
夹克
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=258&amp;sort_name=%E6%AF%9B%E8%A1%A3%2F%E9%92%88%E7%BB%87&amp;gender=1%2C3">
毛衣/针织
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=122&amp;sort_name=%E8%A5%BF%E8%A3%85&amp;gender=1%2C3">
西装
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=413&amp;sort_name=%E5%A5%97%E8%A3%85&amp;gender=1%2C3">
套装
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=116&amp;sort_name=POLO&amp;gender=1%2C3">
POLO
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=117&amp;sort_name=%E8%83%8C%E5%BF%83&amp;gender=1%2C3">
背心
</a>
</li>
</ul>
<ul class="sub-level">
<li>
<a href="//list.dev.yohobuy.com/?sort=228%2C299%2C231%2C149%2C148%2C147&amp;sort_name=%E9%9E%8B%E9%9D%B4&amp;gender=1%2C3">
全部鞋靴
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=147&amp;sort_name=%E4%BC%91%E9%97%B2%2F%E8%BF%90%E5%8A%A8%E9%9E%8B&amp;gender=1%2C3">
休闲/运动鞋
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=148&amp;sort_name=%E9%9D%B4%E5%AD%90&amp;gender=1%2C3">
靴子
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=151&amp;sort_name=%E6%97%B6%E8%A3%85%E9%9E%8B&amp;gender=1%2C3">
时装鞋
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=149&amp;sort_name=%E5%87%89%E9%9E%8B%2F%E5%87%89%E6%8B%96&amp;gender=1%2C3">
凉鞋/凉拖
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=231&amp;sort_name=%E4%BF%9D%E5%85%BB%E6%8A%A4%E7%90%86&amp;gender=1%2C3">
保养护理
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=152%2C153%2C196%2C238%2C239%2C240%2C349%2C157%2C342%2C156%2C161%2C300%2C160%2C233%2C341%2C340%2C210%2C339%2C351%2C195%2C197&amp;sort_name=%E5%8C%85%E7%B1%BB&amp;gender=1%2C3">
全部包类
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=339&amp;sort_name=%E5%89%91%E6%A1%A5%E5%8C%85&amp;gender=1%2C3">
剑桥包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=153%2C196%2C195%2C197&amp;sort_name=%E6%89%8B%E6%8B%8E%E5%8C%85%2F%E5%8D%95%E8%82%A9%E5%8C%85&amp;gender=1%2C3">
手拎包/单肩包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=238%2C239%2C240%2C349&amp;sort_name=%E9%92%B1%E5%8C%85%2F%E5%8D%A1%E5%8C%85%2F%E6%89%8B%E5%8C%85%2F%E9%92%A5%E5%8C%99%E5%8C%85&amp;gender=1%2C3">
钱包/卡包/手包/钥匙包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=157&amp;sort_name=%E8%85%B0%E5%8C%85&amp;gender=1%2C3">
腰包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=342&amp;sort_name=%E9%82%AE%E5%B7%AE%E5%8C%85&amp;gender=1%2C3">
邮差包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=156&amp;sort_name=%E7%94%B5%E8%84%91%E5%8C%85&amp;gender=1%2C3">
电脑包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=161%2C300&amp;sort_name=%E5%82%A8%E7%89%A9%E5%8C%85&amp;gender=1%2C3">
储物包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=160&amp;sort_name=%E7%8E%AF%E4%BF%9D%E5%8C%85&amp;gender=1%2C3">
环保包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=233&amp;sort_name=%E5%8C%85%E9%85%8D&amp;gender=1%2C3">
包配
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=341&amp;sort_name=tote%E5%8C%85&amp;gender=1%2C3">
tote包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=340&amp;sort_name=%E6%97%85%E8%A1%8C%E5%8C%85&amp;gender=1%2C3">
旅行包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=210&amp;sort_name=%E6%97%85%E8%A1%8C%E7%AE%B1&amp;gender=1%2C3">
旅行箱
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=351&amp;sort_name=mini%E5%8C%85&amp;gender=1%2C3">
mini包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=239&amp;sort_name=%E6%BD%AE%E5%8C%85&amp;gender=1%2C3">
潮包
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=311%2C357%2C359&amp;sort_name=%E5%86%85%E8%A1%A3%2F%E5%AE%B6%E5%B1%85%E6%9C%8D&amp;gender=1%2C3">
全部内衣/家居服
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=311&amp;sort_name=%E5%86%85%E8%A3%A4&amp;gender=1%2C3">
内裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=357&amp;sort_name=%E5%AE%B6%E5%B1%85%E6%9C%8D&amp;gender=1%2C3">
家居服
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=359&amp;sort_name=%E5%AE%B6%E5%B1%85%E9%9E%8B&amp;gender=1%2C3">
家居鞋
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=263%2C260%2C264%2C261%2C352&amp;sort_name=%E7%BE%8E%E5%A6%86%2F%E4%B8%AA%E6%8A%A4&amp;gender=1%2C3">
全部美妆/个护
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=263&amp;sort_name=%E9%A6%99%E6%B0%B4&amp;gender=1%2C3">
香水
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=260&amp;sort_name=%E9%9D%A2%E9%83%A8%E6%8A%A4%E7%90%86&amp;gender=1%2C3">
面部护理
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=264&amp;sort_name=%E4%B8%AA%E4%BA%BA%E6%8A%A4%E7%90%86&amp;gender=1%2C3">
个人护理
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=261&amp;sort_name=%E5%BD%A9%E5%A6%86&amp;gender=1%2C3">
彩妆
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=352&amp;sort_name=%E7%BA%B9%E8%BA%AB%E8%B4%B4&amp;gender=1%2C3">
纹身贴
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=131%2C129%2C346%2C133%2C348%2C130&amp;sort_name=%E8%A3%A4%E8%A3%85&amp;gender=1%2C3">
全部裤装
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=130&amp;sort_name=%E7%89%9B%E4%BB%94%E8%A3%A4&amp;gender=1%2C3">
牛仔裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=129&amp;sort_name=%E4%BC%91%E9%97%B2%E8%A3%A4&amp;gender=1%2C3">
休闲裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=131&amp;sort_name=%E7%9F%AD%E8%A3%A4&amp;gender=1%2C3">
短裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=346&amp;sort_name=%E8%BF%90%E5%8A%A8%E8%A3%A4&amp;gender=1%2C3">
运动裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=133&amp;sort_name=%E6%89%93%E5%BA%95%E8%A3%A4%2F%E7%B4%A7%E8%BA%AB%E8%A3%A4&amp;gender=1%2C3">
打底裤/紧身裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=348&amp;sort_name=%E8%A5%BF%E8%A3%A4&amp;gender=1%2C3">
西裤
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=186%2C235%2C163%2C224%2C322%2C323%2C324%2C325%2C326%2C327%2C328%2C329%2C330%2C331%2C72%2C74%2C75%2C76%2C142%2C77%2C78%2C79%2C80%2C199%2C213%2C217%2C218%2C234%2C303%2C305%2C306%2C307%2C334%2C162%2C316%2C320%2C164%2C317%2C295%2C321&amp;sort_name=%E6%9C%8D%E9%85%8D&amp;gender=1%2C3">
全部服配
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=186%2C235&amp;sort_name=%E5%A4%AA%E9%98%B3%E9%95%9C%2F%E7%9C%BC%E9%95%9C&amp;gender=1%2C3">
太阳镜/眼镜
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=163%2C224%2C322%2C323%2C324%2C325%2C326%2C327%2C328%2C329%2C330%2C331&amp;sort_name=%E5%B8%BD%E5%AD%90&amp;gender=1%2C3">
帽子
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=72%2C74%2C75%2C76&amp;sort_name=%E9%A6%96%E9%A5%B0&amp;gender=1%2C3">
首饰
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=142&amp;sort_name=%E8%A2%9C%E5%AD%90&amp;gender=1%2C3">
袜子
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=77%2C78%2C79%2C80%2C199%2C213%2C217%2C218%2C234%2C303%2C305%2C306%2C307%2C334&amp;sort_name=%E9%85%8D%E9%A5%B0&amp;gender=1%2C3">
配饰
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=162&amp;sort_name=%E6%89%8B%E8%A1%A8&amp;gender=1%2C3">
手表
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=316&amp;sort_name=%E5%9B%B4%E5%B7%BE&amp;gender=1%2C3">
围巾
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=320&amp;sort_name=%E6%89%8B%E5%B8%95&amp;gender=1%2C3">
手帕
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=321&amp;sort_name=%E4%B8%9D%E5%B7%BE&amp;gender=1%2C3">
丝巾
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=164&amp;sort_name=%E6%89%8B%E5%A5%97&amp;gender=1%2C3">
手套
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=317&amp;sort_name=%E6%8A%AB%E8%82%A9&amp;gender=1%2C3">
披肩
</a>
</li>
</ul>
<ul class="sub-level hide">
</ul>
<ul class="sub-level hide">
</ul>
<ul class="sub-level hide">
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=362&amp;sort_name=%E5%90%AB3%E7%BA%A7%E5%85%B3%E8%81%94&amp;gender=1%2C3">
全部含3级关联
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=618&amp;sort_name=3%E7%BA%A7%E5%85%B3%E8%81%94&amp;gender=1%2C3">
3级关联
</a>
</li>
</ul>
<ul class="sub-level hide">
</ul>
</div>
</div>
<div class="content hide" style="height: 522px;">
<ul class="primary-level">
<li class="p-level-item focus">
上衣
</li>
<li class="p-level-item">
裙装
</li>
<li class="p-level-item">
裤装
</li>
<li class="p-level-item">
鞋靴
</li>
<li class="p-level-item">
包类
</li>
<li class="p-level-item">
服配
</li>
<li class="p-level-item">
内衣/家居服
</li>
<li class="p-level-item">
美妆/个护
</li>
</ul>
<div class="sub-level-container">
<ul class="sub-level ">
<li>
<a href="//list.dev.yohobuy.com/?sort=227%2C173%2C125%2C258%2C121%2C123%2C119%2C124%2C118%2C122%2C115%2C117%2C114%2C293%2C116%2C413&amp;sort_name=%E4%B8%8A%E8%A1%A3&amp;gender=2%2C3">
全部上衣
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=114%2C293&amp;sort_name=T%E6%81%A4&amp;gender=2%2C3">
T恤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=116&amp;sort_name=POLO&amp;gender=2%2C3">
POLO
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=115&amp;sort_name=%E8%A1%AC%E8%A1%AB&amp;gender=2%2C3">
衬衫
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=119&amp;sort_name=%E5%8D%AB%E8%A1%A3&amp;gender=2%2C3">
卫衣
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=124&amp;sort_name=%E5%A4%B9%E5%85%8B&amp;gender=2%2C3">
夹克
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=121%2C123&amp;sort_name=%E6%A3%89%E6%9C%8D&amp;gender=2%2C3">
棉服
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=121&amp;sort_name=%E7%BE%BD%E7%BB%92%E6%9C%8D&amp;gender=2%2C3">
羽绒服
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=258&amp;sort_name=%E6%AF%9B%E8%A1%A3%2F%E9%92%88%E7%BB%87&amp;gender=2%2C3">
毛衣/针织
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=227&amp;sort_name=%E9%98%B2%E9%A3%8E%E5%A4%96%E5%A5%97&amp;gender=2%2C3">
防风外套
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=173&amp;sort_name=%E7%9A%AE%E8%A1%A3&amp;gender=2%2C3">
皮衣
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=122&amp;sort_name=%E8%A5%BF%E8%A3%85&amp;gender=2%2C3">
西装
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=117&amp;sort_name=%E8%83%8C%E5%BF%83&amp;gender=2%2C3">
背心
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=118&amp;sort_name=%E9%A9%AC%E7%94%B2&amp;gender=2%2C3">
马甲
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=413&amp;sort_name=%E5%A5%97%E8%A3%85&amp;gender=2%2C3">
套装
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=125&amp;sort_name=%E5%A4%A7%E8%A1%A3%2F%E9%A3%8E%E8%A1%A3&amp;gender=2%2C3">
大衣/风衣
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=134%2C135&amp;sort_name=%E8%A3%99%E8%A3%85&amp;gender=2%2C3">
全部裙装
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=134&amp;sort_name=%E8%BF%9E%E8%A1%A3%E8%A3%99&amp;gender=2%2C3">
连衣裙
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=135&amp;sort_name=%E5%8D%8A%E8%BA%AB%E8%A3%99&amp;gender=2%2C3">
半身裙
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=134&amp;sort_name=LOLITA%28%E6%B5%8B%E8%AF%95%29&amp;gender=2%2C3">
LOLITA(测试)
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=362&amp;sort_name=LOLITA2%EF%BC%88%E6%B5%8B%E8%AF%95%EF%BC%89&amp;gender=2%2C3">
LOLITA2（测试）
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=359%2C364&amp;sort_name=%E6%B5%8B%E8%AF%95&amp;gender=2%2C3">
测试
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=348%2C346%2C131%2C133%2C129%2C130&amp;sort_name=%E8%A3%A4%E8%A3%85&amp;gender=2%2C3">
全部裤装
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=129&amp;sort_name=%E4%BC%91%E9%97%B2%E8%A3%A4&amp;gender=2%2C3">
休闲裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=130&amp;sort_name=%E7%89%9B%E4%BB%94%E8%A3%A4&amp;gender=2%2C3">
牛仔裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=346&amp;sort_name=%E8%BF%90%E5%8A%A8%E8%A3%A4&amp;gender=2%2C3">
运动裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=133&amp;sort_name=%E6%89%93%E5%BA%95%E8%A3%A4%2F%E7%B4%A7%E8%BA%AB%E8%A3%A4&amp;gender=2%2C3">
打底裤/紧身裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=131&amp;sort_name=%E7%9F%AD%E8%A3%A4&amp;gender=2%2C3">
短裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=348&amp;sort_name=%E8%A5%BF%E8%A3%A4&amp;gender=2%2C3">
西裤
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=147%2C149%2C148%2C151%2C231&amp;sort_name=%E9%9E%8B%E9%9D%B4&amp;gender=2%2C3">
全部鞋靴
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=147&amp;sort_name=%E4%BC%91%E9%97%B2%2F%E8%BF%90%E5%8A%A8%E9%9E%8B&amp;gender=2%2C3">
休闲/运动鞋
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=148&amp;sort_name=%E9%9D%B4%E5%AD%90&amp;gender=2%2C3">
靴子
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=151&amp;sort_name=%E6%97%B6%E8%A3%85%E9%9E%8B&amp;gender=2%2C3">
时装鞋
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=149&amp;sort_name=%E5%87%89%E9%9E%8B%2F%E5%87%89%E6%8B%96&amp;gender=2%2C3">
凉鞋/凉拖
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=231&amp;sort_name=%E4%BF%9D%E5%85%BB%E6%8A%A4%E7%90%86&amp;gender=2%2C3">
保养护理
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=152%2C153%2C238%2C239%2C240%2C349%2C157%2C342%2C156%2C161%2C300%2C160%2C233%2C341%2C340%2C210%2C339%2C351%2C195%2C196%2C197&amp;sort_name=%E5%8C%85%E7%B1%BB&amp;gender=2%2C3">
全部包类
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=152&amp;sort_name=%E5%8F%8C%E8%82%A9%E5%8C%85&amp;gender=2%2C3">
双肩包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=153%2C195%2C196%2C197&amp;sort_name=%E6%89%8B%E6%8B%8E%E5%8C%85%2F%E5%8D%95%E8%82%A9%E5%8C%85&amp;gender=2%2C3">
手拎包/单肩包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=238%2C239%2C240%2C349&amp;sort_name=%E9%92%B1%E5%8C%85%2F%E5%8D%A1%E5%8C%85%2F%E6%89%8B%E5%8C%85%2F%E9%92%A5%E5%8C%99%E5%8C%85&amp;gender=2%2C3">
钱包/卡包/手包/钥匙包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=157&amp;sort_name=%E8%85%B0%E5%8C%85&amp;gender=2%2C3">
腰包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=342&amp;sort_name=%E9%82%AE%E5%B7%AE%E5%8C%85&amp;gender=2%2C3">
邮差包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=156&amp;sort_name=%E7%94%B5%E8%84%91%E5%8C%85&amp;gender=2%2C3">
电脑包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=161%2C300&amp;sort_name=%E5%82%A8%E7%89%A9%E5%8C%85&amp;gender=2%2C3">
储物包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=160&amp;sort_name=%E7%8E%AF%E4%BF%9D%E5%8C%85&amp;gender=2%2C3">
环保包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=233&amp;sort_name=%E5%8C%85%E9%85%8D&amp;gender=2%2C3">
包配
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=341&amp;sort_name=tote%E5%8C%85&amp;gender=2%2C3">
tote包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=340&amp;sort_name=%E6%97%85%E8%A1%8C%E5%8C%85&amp;gender=2%2C3">
旅行包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=210&amp;sort_name=%E6%97%85%E8%A1%8C%E7%AE%B1&amp;gender=2%2C3">
旅行箱
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=339&amp;sort_name=%E5%89%91%E6%A1%A5%E5%8C%85&amp;gender=2%2C3">
剑桥包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=351&amp;sort_name=mini+%E5%8C%85&amp;gender=2%2C3">
mini 包
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=186%2C235%2C163%2C224%2C322%2C323%2C324%2C325%2C326%2C327%2C328%2C329%2C330%2C331%2C72%2C74%2C75%2C76%2C142%2C77%2C78%2C79%2C80%2C199%2C213%2C217%2C218%2C234%2C303%2C305%2C306%2C307%2C334%2C162%2C316%2C320%2C164%2C317%2C295%2C321&amp;sort_name=%E6%9C%8D%E9%85%8D&amp;gender=2%2C3">
全部服配
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=163%2C224%2C322%2C323%2C324%2C325%2C326%2C327%2C328%2C329%2C330%2C331&amp;sort_name=%E5%B8%BD%E5%AD%90&amp;gender=2%2C3">
帽子
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=72%2C74%2C75%2C76&amp;sort_name=%E9%A6%96%E9%A5%B0&amp;gender=2%2C3">
首饰
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=142&amp;sort_name=%E8%A2%9C%E5%AD%90&amp;gender=2%2C3">
袜子
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=77%2C78%2C79%2C80%2C199%2C213%2C217%2C218%2C234%2C303%2C305%2C306%2C307%2C334&amp;sort_name=%E9%85%8D%E9%A5%B0&amp;gender=2%2C3">
配饰
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=162&amp;sort_name=%E6%89%8B%E8%A1%A8&amp;gender=2%2C3">
手表
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=316&amp;sort_name=%E5%9B%B4%E5%B7%BE&amp;gender=2%2C3">
围巾
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=164&amp;sort_name=%E6%89%8B%E5%A5%97&amp;gender=2%2C3">
手套
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=317&amp;sort_name=%E6%8A%AB%E8%82%A9&amp;gender=2%2C3">
披肩
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=186%2C235&amp;sort_name=%E5%A4%AA%E9%98%B3%E9%95%9C%2F%E7%9C%BC%E9%95%9C&amp;gender=2%2C3">
太阳镜/眼镜
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=320&amp;sort_name=%E6%89%8B%E5%B8%95&amp;gender=2%2C3">
手帕
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=321&amp;sort_name=%E4%B8%9D%E5%B7%BE&amp;gender=2%2C3">
丝巾
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=311%2C364%2C357%2C359&amp;sort_name=%E5%86%85%E8%A1%A3%2F%E5%AE%B6%E5%B1%85%E6%9C%8D&amp;gender=2%2C3">
全部内衣/家居服
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=364&amp;sort_name=%E6%96%87%E8%83%B8&amp;gender=2%2C3">
文胸
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=311&amp;sort_name=%E5%86%85%E8%A3%A4&amp;gender=2%2C3">
内裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=357&amp;sort_name=%E5%AE%B6%E5%B1%85%E6%9C%8D&amp;gender=2%2C3">
家居服
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=359&amp;sort_name=%E5%AE%B6%E5%B1%85%E9%9E%8B&amp;gender=2%2C3">
家居鞋
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=263&amp;sort_name=%E7%BE%8E%E5%A6%86%2F%E4%B8%AA%E6%8A%A4&amp;gender=2%2C3">
全部美妆/个护
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=263&amp;sort_name=%E9%A6%99%E6%B0%B4&amp;gender=2%2C3">
香水
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=260&amp;sort_name=%E9%9D%A2%E9%83%A8%E6%8A%A4%E7%90%86&amp;gender=2%2C3">
面部护理
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=264&amp;sort_name=%E4%B8%AA%E4%BA%BA%E6%8A%A4%E7%90%86&amp;gender=2%2C3">
个人护理
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=261&amp;sort_name=%E5%BD%A9%E5%A6%86&amp;gender=2%2C3">
彩妆
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=352&amp;sort_name=%E7%BA%B9%E8%BA%AB%E8%B4%B4&amp;gender=2%2C3">
纹身贴
</a>
</li>
</ul>
</div>
</div>
<div class="content hide" style="height: 522px;">
<ul class="primary-level">
<li class="p-level-item focus">
上衣
</li>
<li class="p-level-item">
裤装
</li>
<li class="p-level-item">
泳衣
</li>
<li class="p-level-item">
裙装
</li>
<li class="p-level-item">
鞋靴
</li>
<li class="p-level-item">
包类
</li>
<li class="p-level-item">
服配
</li>
<li class="p-level-item">
<a href="//list.dev.yohobuy.com/?sort=211&amp;sort_name=%E6%B5%8B%E8%AF%95%E6%BD%AE%E7%AB%A5%E6%96%B0%E5%A2%9E%E4%BA%8C%E7%BA%A7%E7%B1%BB%E7%9B%AE&amp;gender=1%2C2%2C3"> 测试潮童新增二级类目</a>
</li>
</ul>
<div class="sub-level-container">
<ul class="sub-level ">
<li>
<a href="//list.dev.yohobuy.com/?sort=407%2C405%2C403%2C397%2C374%2C373&amp;sort_name=%E4%B8%8A%E8%A1%A3&amp;gender=1%2C2%2C3">
全部上衣
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=407&amp;sort_name=%E5%A4%A7%E8%A1%A3%2F%E9%A3%8E%E8%A1%A3&amp;gender=1%2C2%2C3">
大衣/风衣
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=405&amp;sort_name=%E5%A4%B9%E5%85%8B%2F%E9%98%B2%E9%A3%8E%E5%A4%96%E5%A5%97&amp;gender=1%2C2%2C3">
夹克/防风外套
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=401&amp;sort_name=%E6%AF%9B%E8%A1%A3%2F%E9%92%88%E7%BB%87&amp;gender=1%2C2%2C3">
毛衣/针织
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=403&amp;sort_name=%E9%A9%AC%E7%94%B2&amp;gender=1%2C2%2C3">
马甲
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=397&amp;sort_name=%E5%8D%AB%E8%A1%A3&amp;gender=1%2C2%2C3">
卫衣
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=399%2C400%2C374&amp;sort_name=%E8%A1%AC%E8%A1%AB&amp;gender=1%2C2%2C3">
衬衫
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=387&amp;sort_name=%E8%83%8C%E5%BF%83&amp;gender=1%2C2%2C3">
背心
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=373&amp;sort_name=T%E6%81%A4&amp;gender=1%2C2%2C3">
T恤
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=389%2C385%2C377%2C376%2C391&amp;sort_name=%E8%A3%A4%E8%A3%85&amp;gender=1%2C2%2C3">
全部裤装
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=376&amp;sort_name=%E4%BC%91%E9%97%B2%E8%A3%A4&amp;gender=1%2C2%2C3">
休闲裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=389&amp;sort_name=%E7%89%9B%E4%BB%94%E8%A3%A4&amp;gender=1%2C2%2C3">
牛仔裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=391&amp;sort_name=%E8%BF%90%E5%8A%A8%E8%A3%A4&amp;gender=1%2C2%2C3">
运动裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=385&amp;sort_name=%E6%89%93%E5%BA%95%E8%A3%A4+%2F%E7%B4%A7%E8%BA%AB%E8%A3%A4&amp;gender=1%2C2%2C3">
打底裤 /紧身裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=377&amp;sort_name=%E7%9F%AD%E8%A3%A4&amp;gender=1%2C2%2C3">
短裤
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=381&amp;sort_name=%E6%B3%B3%E8%A1%A3&amp;gender=1%2C2%2C3">
全部泳衣
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=381&amp;sort_name=%E6%B3%B3%E8%A1%A3&amp;gender=1%2C2%2C3">
泳衣
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=378%2C379&amp;sort_name=%E8%A3%99%E8%A3%85&amp;gender=1%2C2%2C3">
全部裙装
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=378&amp;sort_name=%E8%BF%9E%E8%A1%A3%E8%A3%99&amp;gender=1%2C2%2C3">
连衣裙
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=379&amp;sort_name=%E5%8D%8A%E8%BA%AB%E8%A3%99&amp;gender=1%2C2%2C3">
半身裙
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=383%2C375&amp;sort_name=%E9%9E%8B%E9%9D%B4&amp;gender=1%2C2%2C3">
全部鞋靴
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=383&amp;sort_name=%E5%87%89%E9%9E%8B%2F%E5%87%89%E6%8B%96&amp;gender=1%2C2%2C3">
凉鞋/凉拖
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=375&amp;sort_name=%E4%BC%91%E9%97%B2%2F%E8%BF%90%E5%8A%A8%E9%9E%8B&amp;gender=1%2C2%2C3">
休闲/运动鞋
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=393&amp;sort_name=%E5%8C%85%E7%B1%BB&amp;gender=1%2C2%2C3">
全部包类
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=393&amp;sort_name=%E5%8F%8C%E8%82%A9%E5%8C%85&amp;gender=1%2C2%2C3">
双肩包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=153&amp;sort_name=%E6%89%8B%E6%8B%8E%E5%8C%85%2F%E5%8D%95%E8%82%A9%E5%8C%85&amp;gender=1%2C2%2C3">
手拎包/单肩包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=210&amp;sort_name=%E6%97%85%E8%A1%8C%E7%AE%B1&amp;gender=1%2C2%2C3">
旅行箱
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=351%2C342&amp;sort_name=%E6%B5%8B%E8%AF%953%E7%BA%A7&amp;gender=1%2C2%2C3">
测试3级
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=395%2C431%2C433&amp;sort_name=%E6%9C%8D%E9%85%8D&amp;gender=1%2C2%2C3">
全部服配
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=395&amp;sort_name=%E6%8A%AB%E8%82%A9&amp;gender=1%2C2%2C3">
披肩
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=431%2C433&amp;sort_name=%E5%A4%AA%E9%98%B3%E9%95%9C%2F%E7%9C%BC%E9%95%9C&amp;gender=1%2C2%2C3">
太阳镜/眼镜
</a>
</li>
</ul>
<ul class="sub-level hide">
</ul>
</div>
</div>
<div class="content hide" style="height: 522px;">
<ul class="primary-level">
<li class="p-level-item focus">
<a href="//list.dev.yohobuy.com/?sort=259%2C263%2C352&amp;sort_name=%E5%8B%BF%E5%88%A0SYJ%E6%B5%8B%E8%AF%95%E5%88%86%E7%B1%BB&amp;gender=1%2C2%2C3"> 勿删SYJ测试分类</a>
</li>
<li class="p-level-item">
<a href="//list.dev.yohobuy.com/?sort=110%2C112%2C184&amp;sort_name=%E6%96%87%E5%85%B72&amp;gender=1%2C2%2C3"> 文具2</a>
</li>
<li class="p-level-item">
家居生活
</li>
<li class="p-level-item">
数码3C
</li>
<li class="p-level-item">
美妆/个护
</li>
<li class="p-level-item">
<a href="//list.dev.yohobuy.com/?sort=130%2C348%2C346&amp;sort_name=%E6%B5%8B%E8%AF%95%E6%96%B0%E5%A2%9E%E5%88%86%E7%B1%BB%EF%BC%88%E9%9D%9E%E6%B5%8B%E8%AF%95%E8%AF%AF%E6%93%8D%E4%BD%9C%EF%BC%81%EF%BC%89&amp;gender=1%2C2%2C3"> 测试新增分类（非测试误操作！）</a>
</li>
<li class="p-level-item">
<a href="//list.dev.yohobuy.com/?sort=292&amp;sort_name=%E5%85%B3%E8%81%94%E4%B8%80%E4%B8%AA%E7%89%A9%E7%90%86%E7%B1%BB%E7%9B%AE&amp;gender=1%2C2%2C3"> 关联一个物理类目</a>
</li>
</ul>
<div class="sub-level-container">
<ul class="sub-level ">
</ul>
<ul class="sub-level hide">
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=281%2C292%2C304%2C267%2C268%2C269%2C270%2C271%2C272%2C273%2C274%2C275%2C276%2C277%2C332%2C333%2C353%2C355%2C110%2C112%2C184%2C302%2C343%2C344%2C399&amp;sort_name=%E5%AE%B6%E5%B1%85%E7%94%9F%E6%B4%BB&amp;gender=1%2C2%2C3">
全部家居生活
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=268%2C269%2C270%2C271%2C272%2C273%2C274%2C275%2C276%2C277%2C332%2C333%2C353&amp;sort_name=%E5%B1%85%E5%AE%B6&amp;gender=1%2C2%2C3">
居家
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=355&amp;sort_name=%E5%AE%A0%E7%89%A9%E5%91%A8%E8%BE%B9&amp;gender=1%2C2%2C3">
宠物周边
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=281%2C282%2C283%2C284%2C292%2C304&amp;sort_name=%E7%8E%A9%E5%85%B7%E5%A8%B1%E4%B9%90&amp;gender=1%2C2%2C3">
玩具娱乐
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=283%2C110%2C111%2C112%2C184&amp;sort_name=%E6%96%87%E5%85%B7&amp;gender=1%2C2%2C3">
文具
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=112&amp;sort_name=%E6%96%87%E5%85%B73&amp;gender=1%2C2%2C3">
文具3
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=185%2C211%2C313%2C212%2C171%2C113%2C200%2C398&amp;sort_name=%E6%95%B0%E7%A0%813C&amp;gender=1%2C2%2C3">
全部数码3C
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=211&amp;sort_name=%E6%95%B0%E7%A0%81%E9%85%8D%E4%BB%B6&amp;gender=1%2C2%2C3">
数码配件
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=313&amp;sort_name=%E6%89%8B%E6%9C%BA%2Fipad%E5%A3%B3%E5%A5%97&amp;gender=1%2C2%2C3">
手机/ipad壳套
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=212&amp;sort_name=%E6%89%8B%E6%9C%BA%E9%85%8D%E4%BB%B6&amp;gender=1%2C2%2C3">
手机配件
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=171&amp;sort_name=%E8%80%B3%E6%9C%BA&amp;gender=1%2C2%2C3">
耳机
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=113&amp;sort_name=U%E7%9B%98&amp;gender=1%2C2%2C3">
U盘
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=200&amp;sort_name=%E7%94%B5%E8%84%91%E6%9E%B6&amp;gender=1%2C2%2C3">
电脑架
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=398&amp;sort_name=%E6%99%BA%E8%83%BD%E8%A3%85%E5%A4%87&amp;gender=1%2C2%2C3">
智能装备
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=263%2C260%2C264%2C261%2C352&amp;sort_name=%E7%BE%8E%E5%A6%86%2F%E4%B8%AA%E6%8A%A4&amp;gender=1%2C2%2C3">
全部美妆/个护
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=352&amp;sort_name=%E7%BA%B9%E8%BA%AB%E8%B4%B4&amp;gender=1%2C2%2C3">
纹身贴
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=264&amp;sort_name=%E4%B8%AA%E4%BA%BA%E6%8A%A4%E7%90%86&amp;gender=1%2C2%2C3">
个人护理
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=260&amp;sort_name=%E9%9D%A2%E9%83%A8%E6%8A%A4%E8%82%A4&amp;gender=1%2C2%2C3">
面部护肤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=263&amp;sort_name=%E9%A6%99%E6%B0%B4&amp;gender=1%2C2%2C3">
香水
</a>
</li>
</ul>
<ul class="sub-level hide">
</ul>
<ul class="sub-level hide">
</ul>
</div>
</div>
</div>
<div id="brand-cate">
<brand-cate></brand-cate>
</div>
\ No newline at end of file
... ...
/**
* 收藏商品、品牌
* @type {Object}
*/
'use strict';
const favModel = require('../models/favorite');
const helpers = global.yoho.helpers;
const fav = {
favorite: (req, res) => {
if (req.query.tab === 'brand') {
res.render('favorite-brand', {
module: 'home',
page: 'favorite-brand',
brandUrl: helpers.urlFormat('/product/new')
});
} else {
res.render('favorite', {
module: 'home',
page: 'favorite',
productUrl: helpers.urlFormat('/product/new')
});
}
},
favpaging: (req, res, next) => {
let uid = req.user.uid;
uid = 20000134; // 测试uid
const tab = req.query.tab;
const page = req.query.page;
const result = [];
let isend = true;
if (tab === 'brand') {
const gender = '1,2,3'; // todo 获取频道的性别
favModel.getFavBrandData(uid, gender, page, 10).then(data => {
if (data && page <= data.page_total) {
data.brand_list.forEach(function(d) {
result.push({
fav_id: d.brand_id,
link: '', // todo
imgUrl: d.brand_ico ? helpers.image(d.brand_ico, 160, 125) : '',
brandName: d.brand_name,
down: d.status == 0
});
});
if (page < data.page_total) {
isend = false;
}
}
return res.json({
isend: isend,
list: result
});
});
} else {
favModel.getFavProductData(uid, page, 10).then(data => {
if (data && page <= data.page_total) {
data.product_list.forEach(function(d) {
if (!d.product_skn) {
return;
}
let link = '';
if (d.goodsId && d.cnAlphabet) {
link = helpers.urlFormat(`/product/pro_${d.product_id}_${d.goodsId}/${d.cnAlphabet}.html`);
}
result.push({
fav_id: d.product_id,
link: link,
imgUrl: d.image ? helpers.image(d.image) : '',
title: d.product_name,
price: '¥' + Number(d.market_price).toFixed(2),
discountPrice: (Number(d.market_price) - Number(d.sales_price) > 0) ? '¥' + Number(d.sales_price).toFixed(2) : false,
sellOut: d.storage < 0,
invalidGoods: d.status == 0
});
});
if (page < data.page_total) {
isend = false;
}
}
return res.json({
isend: isend,
list: result
});
}).catch(next);
}
},
favdel: (req, res, next) => {
let uid = req.user.uid;
uid = 20000134; // 测试uid
const favId = req.body.favId;
const type = req.body.type;
favModel.favoriteDelete(uid, favId, type).then(data => {
return res.json(data);
}).catch(next);
}
}
module.exports = fav;
\ No newline at end of file
... ...
... ... @@ -104,100 +104,6 @@ const component = {
}
}).catch(next);
},
favorite: (req, res, next) => {
if (req.query.tab === 'brand') {
res.render('favorite-brand', {
module: 'home',
page: 'favorite-brand',
brandUrl: helpers.urlFormat('/product/new')
});
} else {
res.render('favorite', {
module: 'home',
page: 'favorite',
productUrl: helpers.urlFormat('/product/new')
});
}
},
favpaging: (req, res, next) => {
let uid = req.user.uid;
uid = 20000134; // 测试uid
const tab = req.query.tab;
const page = req.query.page;
const result = [];
let isend = true;
if (tab === 'brand') {
const gender = '1,2,3'; // todo 获取频道的性别
homeModel.getFavBrandData(uid, gender, page, 10).then(data => {
if (data && page <= data.page_total) {
data.brand_list.forEach(function(d) {
result.push({
fav_id: d.brand_id,
link: '', // todo
imgUrl: d.brand_ico ? helpers.image(d.brand_ico, 160, 125) : '',
brandName: d.brand_name,
down: d.status == 0
});
});
if (page < data.page_total) {
isend = false;
}
}
return res.json({
isend: isend,
list: result
});
});
} else {
homeModel.getFavProductData(uid, page, 10).then(data => {
if (data && page <= data.page_total) {
data.product_list.forEach(function(d) {
if (!d.product_skn) {
return;
}
let link = '';
if (d.goodsId && d.cnAlphabet) {
link = helpers.urlFormat(`/product/pro_${d.product_id}_${d.goodsId}/${d.cnAlphabet}.html`);
}
result.push({
fav_id: d.product_id,
link: link,
imgUrl: d.image ? helpers.image(d.image) : '',
title: d.product_name,
price: '¥' + Number(d.market_price).toFixed(2),
discountPrice: (Number(d.market_price) - Number(d.sales_price) > 0) ? '¥' + Number(d.sales_price).toFixed(2) : false,
sellOut: d.storage < 0,
invalidGoods: d.status == 0
});
});
if (page < data.page_total) {
isend = false;
}
}
return res.json({
isend: isend,
list: result
});
}).catch(next);
}
},
favdel: (req, res, next) => {
let uid = req.user.uid;
uid = 20000134; // 测试uid
const favId = req.body.favId;
const type = req.body.type;
homeModel.favoriteDelete(uid, favId, type).then(data => {
return res.json(data);
});
},
// 关于我们
aboutUs: (req, res) => {
res.render('about-us', {
... ... @@ -235,4 +141,4 @@ const component = {
}
};
module.exports = component;
module.exports = component;
\ No newline at end of file
... ...
... ... @@ -9,12 +9,18 @@ const refund = {
res.render('refund');
},
order(req, res, next) {
const uid = 8050560;
const orderId = 160192757;
const uid = 8050882;
const orderId = 160181661;
refundModel.getOrderData(uid, orderId).then(result => {
res.json(result);
}).catch(next);
},
logistics(req, res) {
res.render('logistics', {
module: 'home',
page: 'logistics'
});
}
};
... ...
'use strict';
const api = global.yoho.API;
/**
* 处理用户收藏的商品数据
*
* @param int uid 用户ID
* @param int page 第几页
* @param int limit 限制读取的数目，默认10
* @return array 处理之后的收藏的商品数据
*/
exports.getFavProductData = (uid, page, limit) => {
return api.get('', {
method: 'app.favorite.product',
uid: uid,
page: page,
limit: limit
}).then(result => {
return result.data;
});
};
/**
* 处理用户收藏的品牌数据
*
* @param int uid 用户ID
* @param string gender 性别 1,3表示男，2,3表示女，1,2,3表示全部
* @param int page 第几页
* @param int limit 限制读取的数目
* @return array 处理之后的收藏的品牌数据
*/
exports.getFavBrandData = (uid, gender, page, limit) => {
return api.get('', {
method: 'app.favorite.brand',
uid: uid,
gender: gender,
page: page,
limit: limit
}).then(result => {
return result.data;
})
}
/**
* 取消收藏的商品/品牌数据
*
* @param int uid 用户ID
* @param int favId 要取消的收藏id
* @param string type 取消类型(brand:品牌,product:商品)
* @return array 接口返回的数据
*/
exports.favoriteDelete = (uid, favId, type) => {
return api.get('', {
method: 'app.favorite.cancel',
uid: uid,
type: type,
fav_id: favId
});
}
\ No newline at end of file
... ...
... ... @@ -2,7 +2,6 @@
const api = global.yoho.API;
const serviceAPI = global.yoho.ServiceAPI;
const Promise = require('bluebird');
const co = Promise.coroutine;
const _ = require('lodash');
const helpers = global.yoho.helpers;
... ... @@ -76,63 +75,6 @@ exports.getUserHomeData = (uid) => {
};
/**
* 处理用户收藏的商品数据
*
* @param int uid 用户ID
* @param int page 第几页
* @param int limit 限制读取的数目，默认10
* @return array 处理之后的收藏的商品数据
*/
exports.getFavProductData = (uid, page, limit) => {
return api.get('', {
method: 'app.favorite.product',
uid: uid,
page: page,
limit: limit
}).then(result => {
return result.data;
});
};
/**
* 处理用户收藏的品牌数据
*
* @param int uid 用户ID
* @param string gender 性别 1,3表示男，2,3表示女，1,2,3表示全部
* @param int page 第几页
* @param int limit 限制读取的数目
* @return array 处理之后的收藏的品牌数据
*/
exports.getFavBrandData = (uid, gender, page, limit) => {
return api.get('', {
method: 'app.favorite.brand',
uid: uid,
gender: gender,
page: page,
limit: limit
}).then(result => {
return result.data;
})
}
/**
* 取消收藏的商品/品牌数据
*
* @param int uid 用户ID
* @param int favId 要取消的收藏id
* @param string type 取消类型(brand:品牌,product:商品)
* @return array 接口返回的数据
*/
exports.favoriteDelete = (uid, favId, type) => {
return api.get('', {
method: 'app.favorite.cancel',
uid: uid,
type: type,
fav_id: favId
});
}
/**
* 帮助中心列表页
*
* @param data
... ...
... ... @@ -9,6 +9,7 @@
const expressRouter = require('express').Router;
const cRoot = './controllers';
const home = require(cRoot);
const favorite = require(cRoot + '/favorite');
const refund = require(cRoot + '/refund');
const router = expressRouter();
... ... @@ -24,15 +25,16 @@ router.get('/helpDetail', home.helpDetail); // 帮助中心详情页
router.get('/feedback', home.feedback); // 个人中心-意见反馈
router.post('/save-feedback', home.saveFeedback); // 个人中心-提交意见反馈
router.get('/favorite', home.favorite); // 个人中心 - 收藏
router.get('/favorite/favpaging', home.favpaging); // 个人中心 - 收藏商品/品牌(翻页)
router.post('/favorite/favdel', home.favdel); // 个人中心 - 收藏商品/品牌(刪除)
router.get('/favorite', favorite.favorite); // 个人中心 - 收藏
router.get('/favorite/favpaging', favorite.favpaging); // 个人中心 - 收藏商品/品牌(翻页)
router.post('/favorite/favdel', favorite.favdel); // 个人中心 - 收藏商品/品牌(刪除)
router.get('/refund', refund.refund);
router.get('/refund/order', refund.order);
router.get('/refund/logistics', refund.logistics); // 退换货 - 商品寄回信息
router.get('/about-us', home.aboutUs); // 个人中心 - 关于我们
module.exports = router;
module.exports = router;
\ No newline at end of file
... ...
... ... @@ -70,7 +70,7 @@
帮助中心
<span class="num"><span class="icon icon-right"></span></span>
</a>
<a class="list-item" href="/home/onlineService">
<a class="list-item" href="/home/online-service">
在线客服
<span class="num"><span class="icon icon-right"></span></span>
</a>
... ...
<div class="logistics-page">
<div class="edit-logistics-page">
<form class="edit-logistics">
<label class="company">
选择快递公司
<input type="text" name="company" value="{{company}}" readonly>
<span class="icon icon-right"></span>
</label>
<label class="num">
快递单号
<input type="text" name="num" value="{{num}}">
</label>
</form>
<div class="submit">确认</div>
</div>
</div>
\ No newline at end of file
... ...
... ... @@ -30,8 +30,8 @@ const component = {
let params = {
productId: _.toString(pid),
method: 'h5.product.data' // TODO replace this to 'app.product.data'
method: 'h5.product.data',
uid: req.user.uid || 8050378 // TODO: fix this hard coded uid
};
api.get('', params).then(result => {
... ... @@ -40,7 +40,7 @@ const component = {
},
intro(req, res, next) {
let params = {
method: 'h5.product.intro', // TODO replace this to 'app.product.intro'
method: 'h5.product.intro',
productskn: req.query.skn,
udid: 'f528764d624db129b32c21fbca0cb8d6'
};
... ... @@ -68,30 +68,35 @@ const component = {
};
api.get('', params).then(result => {
res.json(result);
}).catch(next);
},
getFavorite(req, res, next) {
api.get('', {}).then(result => {
if (result.code === 200) {
// 将 shopping_key 写入Cookie
res.cookie('_SPK', result.data.shopping_key, {maxAge: 86400 * 360});
}
res.json(result);
}).catch(next);
},
/**
* 收藏
* 添加收藏/取消收藏
*
* @param req
* @param res
* @param next
*/
addFavorite(req, res, next) {
favorite(req, res, next) {
let params = {
method: 'app.Shopping.addfavorite',
product_sku_list: req.body.sku,
uid: req.user.uid || 8050378 // TODO: fix this hard coded uid
uid: req.user.uid || 8050378, // TODO: fix this hard coded uid
type: 'product'
};
if (req.body.operation === 'add') {
params.id = req.body.id;
params.method = 'app.favorite.add';
} else if (req.body.operation === 'remove') {
params.fav_id = req.body.id;
params.method = 'app.favorite.cancel';
}
api.get('', params).then(result => {
res.json(result);
}).catch(next);
... ...
... ... @@ -25,11 +25,10 @@ router.post('/list', productList.getProducts);
// 商品详情controller
const detail = require(`${cRoot}/detail`);
router.get(/\/pro_([\d]+)_([\d]+)\/(.*)/, detail.index); // 商品详情routers
router.get(/\/product_([\d]+)_([\d]+)\.json/, detail.product);
router.get(/\/intro\.json/, detail.intro);
router.get(/\/([\d]+)(.*)/, detail.index); // 商品详情routers
router.get(/\/product_([\d]+)\.json/, detail.product);
router.get(/\/intro_([\d]+)\.json/, detail.intro);
router.post(/cart.json/, detail.addToCart);
router.get(/favorite.json/, detail.getFavorite);
router.post(/favorite.json/, detail.addFavorite);
router.post(/favorite.json/, detail.favorite);
router.get(/cart-count.json/, detail.getCartCount);
module.exports = router;
... ...
<div id="product-list">
<filter-sub :data="brand" :value="3" type="brand"></filter-sub>
<Sort :config.once="sortConfig" :val="sort">
</Sort>
<List :data="productList"></List>
<Drawer on v-ref:drawer>
<Drawer v-ref:drawer>
<Filter :config.once="filterConfig"></Filter>
</Drawer>
</div>
... ... @@ -27,53 +28,78 @@ var sortConfig = [{
var filterConfig = {
"color": [{
"colorId": 11,
"colorName": "红色",
"colorValue": "",
"colorCode": "ee0000"
"id": 11,
"name": "红色",
"value": "",
"code": "ee0000"
}, {
"colorId": 3,
"colorName": "灰色",
"colorValue": "",
"colorCode": "b9b7af"
"id": 3,
"name": "灰色",
"value": "",
"code": "b9b7af"
}, {
"colorId": 7,
"colorName": "蓝色",
"colorValue": "",
"colorCode": "0000fe"
"id": 7,
"name": "蓝色",
"value": "",
"code": "0000fe"
}],
"gender": [{
genderName: 'BOYS',
genderId: '1,3'
name: 'BOYS',
id: '1,3'
}, {
genderName: 'GIRLS',
genderId: '2,3'
name: 'GIRLS',
id: '2,3'
}],
"size": [{
"sizeName": "110",
"sizeId": 326
"name": "110",
"id": 326
}, {
"sizeName": "120",
"sizeId": 327
"name": "120",
"id": 327
}, {
"sizeName": "90",
"sizeId": 186
"name": "90",
"id": 186
}, {
"sizeName": "100",
"sizeId": 255
"name": "100",
"id": 255
}, {
"sizeName": "130",
"sizeId": 333
"name": "130",
"id": 333
}],
"discount": [{
discountCount: 2,
discountName: '7~9',
discountId: '0.7,0.999'
count: 2,
name: '7~9',
id: '0.7,0.999'
}, {
discountCount: 3,
discountName: '4~6',
discountId: '0.4,0.699'
}]
};
count: 3,
name: '4~6',
id: '0.4,0.699'
}],
"brand": [{
"hotKeyword": "",
"domain": "smileyworldkids",
"dlif": "S",
"isHot": "Y",
"dco": "http://img10.static.yhbimg.com/brandLogo/2015/12/23/17/01088824d9ca36f91bb9265a3cc0cc25eb.jpg",
"name": "Smiley World Kids",
"keyword": "童装",
"id": 1069,
"nameEn": "Smiley World kids",
"nameCn": "Smiley World Kids"
},
{
"hotKeyword": "",
"domain": "smileyworldkids",
"alif": "S",
"isHot": "Y",
"ico": "http://img10.static.yhbimg.com/brandLogo/2015/12/23/17/01088824d9ca36f91bb9265a3cc0cc25eb.jpg",
"name": "Smiley World Kids",
"keyword": "童装",
"id": 1069,
"nameEn": "Smiley World kids",
"nameCn": "Smiley World Kids"
}
]
};
</script>
... ...
No preview for this file type
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
<svg xmlns="http://www.w3.org/2000/svg">
<metadata>Generated by IcoMoon</metadata>
<metadata>
Created by FontForge 20120731 at Fri Jul 22 13:41:45 2016
By admin
</metadata>
<defs>
<font id="iconfont" horiz-adv-x="1024">
<font-face units-per-em="1024" ascent="896" descent="-128" />
<missing-glyph horiz-adv-x="1024" />
<glyph unicode="&#x20;" horiz-adv-x="0" d="" />
<glyph unicode="&#xe600;" glyph-name="delete" d="M911 809h-242v123q0 21-13.5 34.5t-34.5 13.5h-246q-20 0-33.5-13.5t-13.5-34.5v-123h-246q-21 0-34.5-13.5t-13.5-34 13.5-34 34.5-13.5h829q21 0 34.5 13.5t13.5 34-13.5 34-34.5 13.5zM423 809v72h147v-72h-147zM765 663q-21 0-34.5-14t-13.5-34v-560h-441v560q0 20-13.5 34t-34 14-34-14-13.5-34v-611q0-21 13.5-34.5t34.5-13.5h536q20 0 33.5 13.5t13.5 34.5v611q3 20-11.5 34t-35.5 14zM447 151v389q0 20-13.5 33.5t-34 13.5-34-13.5-13.5-33.5v-389q0-21 13.5-34.5t34-13.5 34 13.5 13.5 34.5zM645 151v389q0 20-13.5 33.5t-34.5 13.5q-20 0-35.5-13.5t-15.5-33.5v-389q0-21 13.5-34.5t34.5-13.5 36 13.5 15 34.5z" />
<glyph unicode="&#xe601;" glyph-name="bag" d="M512 896q43 0 82.5-17t68-45.5 45.5-68 17-82.5v-43h171v-640q0-53-37.5-90.5t-90.5-37.5h-512q-53 0-90.5 37.5t-37.5 90.5v640h171v43q0 43 17 82.5t45.5 68 68 45.5 82.5 17zM811 0v555h-598v-555q0-18 12.5-30.5t30.5-12.5h512q18 0 30.5 12.5t12.5 30.5zM512 811q-53 0-90.5-37.5t-37.5-90.5v-43h256v43q0 53-37.5 90.5t-90.5 37.5z" />
<glyph unicode="&#xe602;" glyph-name="down" d="M516 340l409 404q2 1 6 6t7 8 8 7 9 5.5 8.5 2 8.5-2.5l38-21q7-7 7.5-17.5t-6.5-17.5l-476-471q-7-8-17.5-8t-17.5 7zM531 242q-8-7-18.5-7t-17.5 8l-475 471q-7 7-7 17.5t7 17.5l38 21q4 3 8.5 2.5t8.5-2 9-5.5 8-7 7-8 6-6l415-407z" />
<glyph unicode="&#xe603;" glyph-name="check" d="M998.5 808.5q-12.5 11.5-29.5 11t-29-12.5l-552-588-302 297q-12 12-29.5 12t-29.5-12.5-12-29.5 13-29l332-327v-1q2-1 9-5 1-1 2.5-2t2.5-1q7-3 15-3t16 3q1 1 3 2l1 1q7 5 9 6l1 1 581 619q12 13 11.5 30t-13 28.5z" />
<glyph unicode="&#xe605;" glyph-name="close" d="M512 499l360 360 45-45-360-360 360-359-45-45-360 359-360-359-45 45 360 359-360 360 45 45z" />
<glyph unicode="&#xe606;" glyph-name="left" d="M245 468l-9 9 472 472 80-80-400-401 400-401-80-80-472 472z" />
<glyph unicode="&#xe607;" glyph-name="right" d="M785 468l13 13-488 487-84-84 416-416-416-416 84-84 488 487z" />
<glyph unicode="&#xe608;" glyph-name="search" d="M682 158q-108-89-249-89-107 0-197.5 53t-143.5 143.5-53 197.5 53 197.5 143.5 143.5 197.5 53 197.5-53 143.5-143.5 53-197.5q0-141-89-249l286-286-56-56zM433.5 148q130.5 0 222.5 92t92 222.5-92 223-222.5 92.5-223-92.5-92.5-223 92.5-222.5 223-92z" />
<glyph unicode="&#xe609;" glyph-name="print" horiz-adv-x="1001" d="M281 627q-27-1-53-1h-83q-18 0-36.5-6t-32.5-18.5-23-32-9-45.5v-76h912v41q0 16-0.5 30t-0.5 18q0 13-5 29t-17 29.5-31.5 22.5-49.5 9h-133v-97h-438v97zM955 394v-52q0-23 0.5-52t0.5-58-10.5-47.5-26-30-33-16-31.5-4.5q-14-1-29.5-0.5t-29.5 0.5h-32l-45 128h-439l-44-128h-63q-20 0-45 1-25 0-41 9.5t-25.5 23-13.5 29.5-4 30v167h911zM163 331q-12 0-21-8.5t-9-21.5 9-21.5 21-8.5q13 0 22 8.5t9 21.5-9 21.5-22 8.5zM316 207q-8-26-14-48-5-19-10.5-37t-7.5-25-3-15 1-14.5 9.5-10.5 21.5-4h365q23 0 34 12t2 38q-5 13-9.5 30.5t-9.5 34.5q-5 19-11 39h-368zM336 582v228q0 11 2.5 23t10 21.5 20.5 15.5 34 6h188q31 0 51.5-14.5t20.5-52.5v-227h-327z" />
<glyph unicode="&#xe60d;" glyph-name="love" d="M734 944q-65 0-123.5-31t-99.5-85q-41 54-99.5 85t-124.5 31q-118 0-202.5-92t-84.5-222q0-37 7-70.5t21.5-65 25-50 29.5-48.5q31-48 82.5-105.5t98-101.5 100-90 75-63.5 35.5-28.5q17-13 37-13t37 13q13 11 35 28.5t75.5 63.5 100 90 98 101.5 81.5 105.5q19 30 29.5 48.5t25.5 50 22 65 7 70.5q0 130-84.5 222t-203.5 92zM886 436q-29-45-78-100t-98.5-101-95.5-85.5-74-62.5l-29-23q-11 9-30 24t-71.5 60-98 88-96 99-79.5 101q-24 37-37 60.5t-24 60-11 73.5q0 101 65.5 172.5t157.5 71.5q68 0 123-40t82-105v0q4-15 19-15t19 15q27 65 82 105t122 40q93 0 158.5-71.5t65.5-172.5q0-37-11.5-73.5t-24-60-36.5-60.5z" />
<glyph unicode="&#xe617;" glyph-name="up" d="M24 178l22-22q9-10 22-10t23 10l424 430 420-426q9-9 21.5-9t21.5 9l22 22q9 9 9 22t-9 23l-458 464q-5 5-12 7-9 7-20.5 6t-20.5-9l-465-472q-9-9-9-22t9-23z" />
<glyph unicode="&#xe900;" glyph-name="sort-asc" horiz-adv-x="585" d="M585.143 475.428q0-14.857-10.857-25.714t-25.714-10.857h-512q-14.857 0-25.714 10.857t-10.857 25.714 10.857 25.714l256 256q10.857 10.857 25.714 10.857t25.714-10.857l256-256q10.857-10.857 10.857-25.714z" />
<glyph unicode="&#xe901;" glyph-name="sort-desc" horiz-adv-x="585" d="M585.143 256q0-14.857-10.857-25.714l-256-256q-10.857-10.857-25.714-10.857t-25.714 10.857l-256 256q-10.857 10.857-10.857 25.714t10.857 25.714 25.714 10.857h512q14.857 0 25.714-10.857t10.857-25.714z" />
</font></defs></svg>
\ No newline at end of file
<font id="iconfont" horiz-adv-x="1024" >
<font-face
font-family="iconfont"
font-weight="500"
font-stretch="normal"
units-per-em="1024"
panose-1="2 0 6 3 0 0 0 0 0 0"
ascent="896"
descent="-128"
x-height="792"
bbox="13 -212 1024 896"
underline-thickness="50"
underline-position="-100"
unicode-range="U+0078-E617"
/>
<missing-glyph horiz-adv-x="374"
d="M34 0v682h272v-682h-272zM68 34h204v614h-204v-614z" />
<glyph glyph-name=".notdef" horiz-adv-x="374"
d="M34 0v682h272v-682h-272zM68 34h204v614h-204v-614z" />
<glyph glyph-name=".null" horiz-adv-x="0"
/>
<glyph glyph-name="nonmarkingreturn" horiz-adv-x="341"
/>
<glyph glyph-name="x" unicode="x" horiz-adv-x="1001"
d="M281 543q-27 -1 -53 -1h-83q-18 0 -36.5 -6t-32.5 -18.5t-23 -32t-9 -45.5v-76h912v41q0 16 -0.5 30t-0.5 18q0 13 -5 29t-17 29.5t-31.5 22.5t-49.5 9h-133v-97h-438v97zM955 310v-52q0 -23 0.5 -52t0.5 -58t-10.5 -47.5t-26 -30t-33 -16t-31.5 -4.5q-14 -1 -29.5 -0.5
t-29.5 0.5h-32l-45 128h-439l-44 -128h-29h-34q-20 0 -45 1q-25 0 -41 9.5t-25.5 23t-13.5 29.5t-4 30v167h911zM163 247q-12 0 -21 -8.5t-9 -21.5t9 -21.5t21 -8.5q13 0 22 8.5t9 21.5t-9 21.5t-22 8.5zM316 123q-8 -26 -14 -48q-5 -19 -10.5 -37t-7.5 -25t-3 -15t1 -14.5
t9.5 -10.5t21.5 -4h37h67h81h80h64h36q23 0 34 12t2 38q-5 13 -9.5 30.5t-9.5 34.5q-5 19 -11 39h-368zM336 498v228q0 11 2.5 23t10 21.5t20.5 15.5t34 6h188q31 0 51.5 -14.5t20.5 -52.5v-227h-327z" />
<glyph glyph-name="uniE600" unicode="&#xe600;"
d="M911 725h-242v123q0 21 -13.5 34.5t-34.5 13.5h-246q-20 0 -33.5 -13.5t-13.5 -34.5v-123h-246q-21 0 -34.5 -13.5t-13.5 -34t13.5 -34t34.5 -13.5h829q21 0 34.5 13.5t13.5 34t-13.5 34t-34.5 13.5zM423 725v72h147v-72h-147zM765 579q-21 0 -34.5 -14t-13.5 -34v-560
h-441v560q0 20 -13.5 34t-34 14t-34 -14t-13.5 -34v-611q0 -21 13.5 -34.5t34.5 -13.5h536q20 0 33.5 13.5t13.5 34.5v611q3 20 -11.5 34t-35.5 14zM447 67v389q0 20 -13.5 33.5t-34 13.5t-34 -13.5t-13.5 -33.5v-389q0 -21 13.5 -34.5t34 -13.5t34 13.5t13.5 34.5zM645 67
v389q0 20 -13.5 33.5t-34.5 13.5q-20 0 -35.5 -13.5t-15.5 -33.5v-389q0 -21 13.5 -34.5t34.5 -13.5t36 13.5t15 34.5z" />
<glyph glyph-name="uniE601" unicode="&#xe601;"
d="M512 812q43 0 82.5 -17t68 -45.5t45.5 -68t17 -82.5v-43h171v-640q0 -53 -37.5 -90.5t-90.5 -37.5h-512q-53 0 -90.5 37.5t-37.5 90.5v640h171v43q0 43 17 82.5t45.5 68t68 45.5t82.5 17zM811 -84v555h-598v-555q0 -18 12.5 -30.5t30.5 -12.5h512q18 0 30.5 12.5
t12.5 30.5zM512 727q-53 0 -90.5 -37.5t-37.5 -90.5v-43h256v43q0 53 -37.5 90.5t-90.5 37.5z" />
<glyph glyph-name="uniE602" unicode="&#xe602;"
d="M516 256l409 404q2 1 6 6t7 8t8 7t9 5.5t8.5 2t8.5 -2.5l38 -21q7 -7 7.5 -17.5t-6.5 -17.5l-476 -471q-7 -8 -17.5 -8t-17.5 7zM86 669zM531 158q-8 -7 -18.5 -7t-17.5 8l-475 471q-7 7 -7 17.5t7 17.5l38 21q4 3 8.5 2.5t8.5 -2t9 -5.5t8 -7t7 -8t6 -6l415 -407z
M945 669z" />
<glyph glyph-name="uniE603" unicode="&#xe603;"
d="M998.5 724.5q-12.5 11.5 -29.5 11t-29 -12.5l-552 -588l-302 297q-12 12 -29.5 12t-29.5 -12.5t-12 -29.5t13 -29l332 -327v-1q2 -1 9 -5q1 -1 2.5 -2t2.5 -1q7 -3 15 -3t16 3q1 1 3 2l1 1q7 5 9 6l1 1l581 619q12 13 11.5 30t-13 28.5z" />
<glyph glyph-name="uniE604" unicode="&#xe604;"
d="M887 653q-19 24 -31 33l-4 4l-4 4q-53 51 -126 51q-103 0 -211 -106q-107 106 -210 106q-74 0 -126 -51l-5 -4l-3 -4q-12 -9 -31 -33q-74 -93 -60 -191q7 -48 33.5 -98.5t61.5 -92t80 -82.5t84 -70t77.5 -54.5t57.5 -36.5t28 -15l13 -7l14 7q8 4 27 15t58 36.5t78 54.5
t84 70t80 82.5t61.5 92t33.5 98.5q14 98 -60 191zM893 470q-7 -52 -43.5 -109t-81.5 -101t-100 -86.5t-91.5 -66t-65.5 -38.5q-28 15 -64.5 38.5t-92 66t-100 86.5t-81 101t-43.5 109q-13 92 75 176q4 5 11.5 12.5t32 20t52.5 12.5q87 0 189 -111l21 -23l22 23
q102 111 189 111q27 0 52 -12.5t32.5 -20t11.5 -12.5q88 -84 75 -176z" />
<glyph glyph-name="uniE605" unicode="&#xe605;"
d="M512 415l360 360l45 -45l-360 -360l360 -359l-45 -45l-360 359l-360 -359l-45 45l360 359l-360 360l45 45z" />
<glyph glyph-name="uniE606" unicode="&#xe606;"
d="M245 384l-9 9l472 472l80 -80l-400 -401l400 -401l-80 -80l-472 472z" />
<glyph glyph-name="uniE607" unicode="&#xe607;"
d="M785 384l13 13l-488 487l-84 -84l416 -416l-416 -416l84 -84l488 487z" />
<glyph glyph-name="uniE608" unicode="&#xe608;"
d="M682 74q-108 -89 -249 -89q-107 0 -197.5 53t-143.5 143.5t-53 197.5t53 197.5t143.5 143.5t197.5 53t197.5 -53t143.5 -143.5t53 -197.5q0 -141 -89 -249l286 -286l-56 -56zM433.5 64q130.5 0 222.5 92t92 222.5t-92 223t-222.5 92.5t-223 -92.5t-92.5 -223t92.5 -222.5
t223 -92z" />
<glyph glyph-name="uniE609" unicode="&#xe609;"
d="M513 17q-15 0 -121 93t-168 161q-37 40 -64 95.5t-27 99.5q0 97 61.5 166.5t149.5 69.5q49 0 93 -34.5t76 -86.5q31 52 75 86.5t93 34.5q88 0 150 -69.5t62 -166.5q0 -47 -27 -104t-65 -92q-20 -18 -61.5 -57t-74 -68.5t-67 -61t-57 -49t-28.5 -17.5z" />
<glyph glyph-name="uniE617" unicode="&#xe617;"
d="M24 94l22 -22q9 -10 22 -10t23 10l424 430l420 -426q9 -9 21.5 -9t21.5 9l22 22q9 9 9 22t-9 23l-458 464q-5 5 -12 7q-9 7 -20.5 6t-20.5 -9l-465 -472q-9 -9 -9 -22t9 -23z" />
</font>
</defs></svg>
... ...
No preview for this file type
No preview for this file type
const $ = require('yoho-jquery');
const Vue = require('yoho-vue');
const brandCate = require('channel/brand-cate.vue');
var $nav = $('.cate-nav'),
$cateContainer = $('.cate-container'),
$contents = $cateContainer.children('.content'),
$subLevelItem = $cateContainer.find('.sub-level li'),
$primaryItem = $cateContainer.find('.primary-level li');
var $curContent = $contents.not('.hide');
(function() {
var $header = $('.yoho-header'),
$search = $('#search-input');
var h = $(window).height() - $header.outerHeight() - $search.outerHeight() - $nav.outerHeight();
$cateContainer.css('min-height', h);
$contents.height(h);
}());
$('#search-input').focus(function() {
$(this).blur();
});
$nav.bind('contextmenu', function() {
return false;
});
$('.cate-container').bind('contextmenu', function() {
return false;
});
$nav.on('touchend touchcancel', function(e) {
var $this = $(e.target).closest('li'),
index = $this.index();
if ($this.hasClass('focus')) {
return;
}
$nav.find('li.focus').removeClass('focus');
$this.addClass('focus');
$curContent.addClass('hide');
$curContent = $contents.eq(index).removeClass('hide');
});
$cateContainer.on('touchend', function(e) {
var $this = $(e.target),
$subLevel,
$cur, index;
$cur = $this.closest('.p-level-item');
if ($cur.length > 0) {
index = $cur.index();
$subLevel = $this.closest('.content').find('.sub-level');
if ($this.hasClass('focus')) {
return;
}
$this.closest('.primary-level').children('.focus').removeClass('focus');
$this.addClass('focus');
$subLevel.not('.hide').addClass('hide');
$subLevel.eq(index).removeClass('hide');
$subLevel.css({
top: $cur.offset().top - 60
});
new Vue({
el: '#brand-cate',
components: {
brandCate
}
});
$cateContainer.find('.primary-level').on('touchstart touchend touchcancel', 'li', function() {
$primaryItem.removeClass('highlight');
$(this).addClass('highlight');
}).on('touchend touchcancel', 'li', function() {
$(this).removeClass('highlight');
});
$cateContainer.find('.sub-level').on('touchstart', 'li', function() {
$subLevelItem.removeClass('highlight');
$(this).addClass('highlight');
}).on('touchend touchcancel', 'li', function() {
$(this).removeClass('highlight');
});
$nav.on('touchstart', 'li', function() {
$nav.find('li').removeClass('bytouch');
$(this).addClass('bytouch');
}).on('touchend touchcancel', 'li', function() {
$nav.find('li').removeClass('bytouch');
});
... ...
... ... @@ -10,6 +10,8 @@
const $ = require('yoho-jquery');
const Overlay = require('./overlay');
const template = require('components/loading.hbs');
const _ = require('lodash');
const AJAX_LOADING_ENABLED = false; // 全局控制
if (!Overlay) {
throw new Error('Required dependency "Overlay" not found!');
... ... @@ -21,28 +23,54 @@ class Loading {
this.settings = Object.assign({}, this.defaults, opts);
this.elem = $(template());
this.elem.appendTo('body');
}
/**
* 显示
*/
show() {
this.overlay = new Overlay({
animation: 'fade',
clickToClose: false
});
this.overlay.show();
if (!this.isVisible) {
this.isVisible = true;
if (this.elem.parent().length === 0) {
this.elem.appendTo('body');
}
this.overlay = new Overlay({
animation: 'fade',
clickToClose: false
});
this.overlay.show();
}
}
/**
* 关闭
*/
hide() {
this.overlay.hide();
this.elem.remove();
if (this.isVisible) {
this.overlay.hide();
this.elem.detach();
this.isVisible = false;
}
}
}
module.exports = new Loading();
const instance = new Loading();
if (AJAX_LOADING_ENABLED) {
$(document).ajaxStart(()=> {
_.debounce(()=> {
instance.show();
}, 100)();
});
$(document).ajaxStop(()=> {
_.debounce(()=> {
instance.hide();
}, 500)();
});
}
module.exports = instance;
... ...
... ... @@ -8,6 +8,7 @@
'use strict';
const template = require('components/modal.hbs');
const Overlay = require('./overlay');
class Modal {
/**
... ... @@ -46,21 +47,24 @@ class Modal {
const buttons = this.elem.find('.button-group').children();
const self = this;
this.elem.appendTo('body');
// 事件绑定
buttons.each(function(index) {
$(this).click(self.settings.buttons[index].handler.bind(self));
});
}
show() {
// 显示覆盖层
this.overlay = $.overlay({
// 覆盖层
this.overlay = new Overlay({
clickToClose: false
});
}
show() {
this.overlay.show();
if (this.elem.parent().length === 0) {
this.elem.appendTo('body');
}
// 居中显示
this.elem.css({
left: ($(window).width() - this.elem.outerWidth()) / 2,
... ... @@ -70,46 +74,40 @@ class Modal {
hide() {
this.overlay.hide();
this.elem.hide().remove();
this.elem.detach();
}
}
(function($) {
$.modal = function(opts) {
return new Modal(opts);
};
$.extend($.modal, {
alert: (text, title)=> {
const modal = $.modal({
text: text,
title: title
});
modal.show();
},
confirm: (text, title, callback)=> {
const modal = $.modal({
text: text,
title: title,
buttons: [
{
text: '取消',
handler: function() {
this.hide();
}
},
{
text: '好',
handler: callback || $.noop
$.extend(Modal, {
alert: (text, title)=> {
const modal = new Modal({
text: text,
title: title
});
modal.show();
},
confirm: (text, title, callback)=> {
const modal = new Modal({
text: text,
title: title,
buttons: [
{
text: '取消',
handler: function() {
this.hide();
}
]
});
},
{
text: '好',
handler: callback || $.noop
}
]
});
modal.show();
}
});
}(jQuery));
modal.show();
}
});
module.exports = Modal;
... ...
... ... @@ -28,7 +28,7 @@ class Overlay {
clickToClose: true, // 点击关闭
onClose: $.noop, // 关闭回调函数
animation: 'fade', // 动画效果
disableScrolling: true
disableScrolling: true // 是否禁止
};
// 初始化参数
... ... @@ -43,8 +43,6 @@ class Overlay {
class: this.settings.className
});
this.elem.appendTo('body');
// 点击关闭
this.elem.click(()=> {
if (this.settings.clickToClose) {
... ... @@ -72,50 +70,55 @@ class Overlay {
* 显示覆盖层
*/
show() {
this._clearStylesClasses();
this.elem.css({
visibility: 'visible'
}).show().addClass(this.settings.animationClasses.in);
this.isVisible = true;
$('body').css({
overflow: 'hidden'
});
if (this.elem.parent().length === 0 && !this.isVisible) {
this.elem.appendTo('body');
this._clearStylesClasses();
this.elem.css({
visibility: 'visible'
}).show().addClass(this.settings.animationClasses.in);
if (this.settings.disableScrolling) {
$('body').css({
overflow: 'hidden'
});
}
this.isVisible = true;
}
}
/**
* 关闭覆盖层
*/
hide() {
this._clearStylesClasses();
const listener = () => {
// 一次性监听，动画完成事件触发后删除监听器
this.elem[0].removeEventListener('webkitTransitionEnd', listener);
this.elem.css({
visibility: 'hidden'
});
if (this.isVisible) {
this._clearStylesClasses();
this.isVisible = false;
this.elem.remove();
};
this.elem[0].addEventListener('webkitTransitionEnd', listener);
this.elem.addClass(this.settings.animationClasses.out);
const listener = () => {
this.elem.css({
visibility: 'hidden'
});
this._clearStylesClasses();
this.isVisible = false;
this.elem.detach();
// 一次性监听，动画完成事件触发后删除监听器
this.elem[0].removeEventListener('webkitTransitionEnd', listener);
};
this.elem[0].addEventListener('webkitTransitionEnd', listener);
this.elem.addClass(this.settings.animationClasses.out);
if (this.settings.disableScrolling) {
$('body').css({
overflow: 'auto'
});
}
if (this.settings.disableScrolling) {
$('body').css({
overflow: 'auto'
});
this.settings.onClose();
}
this.settings.onClose();
}
}
((function($) {
$.overlay = opts => {
return new Overlay(opts);
};
})(jQuery));
module.exports = Overlay;
... ...
... ... @@ -44,3 +44,12 @@ Vue.filter('clothingGenderIdentity', (value)=> {
return ret;
});
/**
* 品牌URL
*
* @param value brand domain
*/
Vue.filter('brandUrl', (value)=> {
return `/brand?domain=${value}`;
});
... ...
... ... @@ -44,25 +44,25 @@ $('#hbs-placeholder').html(tpl({
var tipBtn = document.querySelector('#show-tip');
tipBtn.addEventListener('click', function(){
tip('中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中')
})
});
var overlay = require('../common/overlay');
var modal = require('../common/modal');
var Overlay = require('../common/overlay');
var Modal = require('../common/modal');
var customModal = require('../../hbs/example/custom-modal.hbs');
var loading = require('../common/loading');
$('#modal-overlay').click(()=> {
var overlay = $.overlay();
var overlay = new Overlay();
overlay.show();
});
$('#modal-alert').click(()=> {
$.modal.alert('自毁系统已经开启，请马上撤离！', '警告');
Modal.alert('自毁系统已经开启，请马上撤离！', '警告');
});
$('#modal-confirm').click(()=> {
$.modal.confirm('是否开启自毁系统？', '', function() {
Modal.confirm('是否开启自毁系统？', '', function() {
this.hide();
alert('BOOM!');
});
... ... @@ -70,7 +70,7 @@ $('#modal-confirm').click(()=> {
// 自定义模态
$('#modal-custom').click(()=> {
const modal = $.modal({
const modal = new Modal({
title: '自定义模态对话框',
text: '你可以自定义哦！',
template: customModal,
... ... @@ -96,8 +96,8 @@ $('#modal-custom').click(()=> {
$('#loading').click(()=> {
const loading = $.loading();
loading.show();
setTimeout(()=> {
loading.hide();
}, 3000)
... ...
const Vue = require('yoho-vue');
const app = require('product/detail.vue');
const app = require('product/detail/index.vue');
const loading = require('common/loading');
const _ = require('lodash');
require('../common/overlay');
... ... @@ -9,3 +11,15 @@ new Vue({
app: app
}
});
$(document).ajaxStart(()=> {
_.debounce(()=> {
loading.show();
}, 100)();
});
$(document).ajaxStop(()=> {
_.debounce(()=> {
loading.hide();
}, 500)();
});
... ...
... ... @@ -6,7 +6,7 @@ const sort = require('product/sort.vue');
const list = require('product/list.vue');
const drawer = require('product/drawer.vue');
const filter = require('product/filter.vue');
const cateMore = require('product/filter/cate-more.vue');
const filterSub = require('product/filter/filter-detail.vue');
Vue.use(lazyload);
Vue.use(infinitScroll);
... ... @@ -31,14 +31,16 @@ const app = new Vue({
productList: [],
// state:
inSearching: false
inSearching: false,
brand: require('product/filter/brand-group-mock')
};
},
components: {
list,
sort,
filter,
cateMore,
filterSub,
drawer
},
methods: {
... ... @@ -64,6 +66,7 @@ const app = new Vue({
})
.fail(error => {
self.page--;
console.log(error);
})
.always(() => {
self.inSearching = false;
... ...
... ... @@ -8,12 +8,12 @@
*
* 希望能与 微信 JS-SDK 一样方便
*/
const $ = require('yoho-jquery');
const tip = require('common/tip');
const native = window.yohoInterface;
window.yohoWapInterface = {
headerRightTopBtn: $.loop()
headerRightTopBtn: function() {}
};
const yoho = {
... ... @@ -35,7 +35,7 @@ const yoho = {
*/
goTap(args, success, fail) {
if (this.isApp) {
native.triggerEvent(success || $.loop(), fail || $.loop(), {
native.triggerEvent(success || function() {}, fail || function() {}, {
method: 'go.tab',
arguments: args
});
... ... @@ -52,7 +52,7 @@ const yoho = {
*/
goLogin(args, success, fail) {
if (this.isApp) {
native.triggerEvent(success || $.loop(), fail || $.loop(), {
native.triggerEvent(success || function() {}, fail || function() {}, {
method: 'go.login',
arguments: args
});
... ... @@ -69,7 +69,7 @@ const yoho = {
*/
goShopingCart(args, success, fail) {
if (this.isApp) {
native.triggerEvent(success || $.loop(), fail || $.loop(), {
native.triggerEvent(success || function() {}, fail || function() {}, {
method: 'go.shopingCart',
arguments: args
});
... ... @@ -86,7 +86,7 @@ const yoho = {
*/
goAddress(args, success, fail) {
if (this.isApp) {
native.triggerEvent(success || $.loop(), fail || $.loop(), {
native.triggerEvent(success || function() {}, fail || function() {}, {
method: 'go.address',
arguments: args
});
... ... @@ -103,7 +103,7 @@ const yoho = {
*/
goImageBrowser(args, success, fail) {
if (this.isApp) {
native.triggerEvent(success || $.loop(), fail || $.loop(), {
native.triggerEvent(success || function() {}, fail || function() {}, {
method: 'go.imageBrowser',
arguments: args
});
... ... @@ -120,7 +120,7 @@ const yoho = {
*/
goNewPage(args, success, fail) {
if (this.isApp) {
native.triggerEvent(success || $.loop(), fail || $.loop(), {
native.triggerEvent(success || function() {}, fail || function() {}, {
method: 'go.newPage',
arguments: args
});
... ... @@ -137,7 +137,7 @@ const yoho = {
*/
goPay(args, success, fail) {
if (this.isApp) {
native.triggerEvent(success || $.loop(), fail || $.loop(), {
native.triggerEvent(success || function() {}, fail || function() {}, {
method: 'go.pay',
arguments: args
});
... ... @@ -147,6 +147,40 @@ const yoho = {
},
/**
* 回到上一个原生界面
* @param args
* @param success
* @param fail
*/
goBack(args, success, fail) {
if (this.isApp) {
native.triggerEvent(success || function() {}, fail || function() {}, {
method: 'go.back',
arguments: args
});
} else {
tip('暂不支持，请在BLK应用中打开');
}
},
/**
* 分享
* @param args
* @param success
* @param fail
*/
goShare(args, success, fail) {
if (this.isApp) {
native.triggerEvent(success || function() {}, fail || function() {}, {
method: 'go.share',
arguments: args
});
} else {
tip('暂不支持，请在BLK应用中打开');
}
},
/**
* 原生调用 JS 方法
* @param name 方法名
* @param callback 回调
... ...
.cate-page {
font-size: 36px;
font-family: helvetica, Arial, "黑体";
ul {
margin: 0;
padding: 0;
li {
margin: 0;
padding: 0;
list-style: none;
}
}
.search-input {
position: relative;
background-color: #f8f8f8;
padding: 13px 20px;
p {
box-sizing: border-box;
width: 100%;
height: 60px;
line-height: 60px;
border: none;
padding-left: 66px;
border-radius: 60px;
font-size: 26px;
background: #fff;
color: #999;
}
}
.search-icon {
position: absolute;
top: 0;
bottom: 0;
left: 43px;
line-height: 86px;
color: #999;
}
.cate-nav {
height: 120px;
border-bottom: 1px solid #e6e6e6;
li {
display: block;
box-sizing: border-box;
float: left;
height: 100%;
padding: 20px 10px;
width: 25%;
text-align: center;
color: #999;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
&:last-child {
border-right: none;
}
&.focus {
color: #000;
span {
border-bottom: 4px solid #000;
font-weight: bold;
}
}
&.bytouch {
background: #eee;
}
}
span {
line-height: 80px;
padding-bottom: 10px;
}
li:last-child span {
border-right: 0;
}
}
.content {
&.hide {
display: none;
}
}
.primary-level {
float: left;
box-sizing: border-box;
width: 45%;
> li {
height: 120px;
line-height: 120px;
padding: 0 32px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
border-bottom: 1px solid #e6e6e6;
&.focus {
background-color: #fff;
}
&.highlight {
background-color: #eee;
}
}
}
.sub-level-container {
float: left;
box-sizing: border-box;
background: #fff;
width: 55%;
height: 100%;
}
.sub-level {
width: 100%;
background-color: #f6f6f6;
position: relative;
&.hide {
display: none;
}
> li {
box-sizing: border-box;
height: 110px;
line-height: 110px;
border-bottom: 1px solid #e6e6e6;
padding-left: 20px;
&.highlight {
background: #eee;
}
&:last-child {
border-bottom: none;
}
&:hover {
background-color: #efefef;
}
&:first-child:before {
content: "";
width: 0;
height: 0;
border-top: 20px solid transparent;
border-bottom: 20px solid transparent;
border-right: 20px solid #efefef;
position: absolute;
margin-top: 32px;
margin-left: -40px;
}
}
a {
display: block;
height: 100%;
width: 100%;
color: #000;
}
}
}
... ... @@ -3,4 +3,5 @@ $white: #fff;
$red: #ff081c;
$green: #1ed96c;
$grey: #b0b0b0;
$division: #e0e0e0;
$blue: #3790de;
... ...
... ... @@ -21,30 +21,10 @@
-moz-osx-font-smoothing: grayscale;
}
.icon-sort-asc:before {
content: "\e900";
}
.icon-sort-desc:before {
content: "\e901";
}
.icon-print:before {
content: "\e609";
}
.icon-delete:before {
content: "\e600";
}
.icon-bag:before {
content: "\e601";
}
.icon-down:before {
content: "\e602";
}
.icon-check:before {
content: "\e603";
}
... ... @@ -65,11 +45,22 @@
content: "\e608";
}
.icon-love:before {
content: "\e60d";
.icon-down:before {
content: "\e602";
}
.icon-up:before {
content: "\e617";
}
.icon-delete:before {
content: "\e600";
}
.icon-love:before {
content: "\e604";
}
.icon-love-solid:before {
content: "\e609";
}
... ...
... ... @@ -2,7 +2,7 @@
position: fixed;
top: 50%;
left: 50%;
z-index: 998;
z-index: 1001;
transform: translate(-50%, -50%);
display: table;
max-width: 90%;
... ...
... ... @@ -29,7 +29,8 @@
height: 35px;
margin-right: 15px;
margin-top: 80px;
background: resolve("home/fav/fav-del.png");
background: resolve("home/fav/fav-del.png");
background-size: 100%;
}
}
... ... @@ -151,9 +152,10 @@
list-style: none;
li {
height: 130px;
height: 135px;
overflow: hidden;
margin-top: 20px;
border-bottom: 1px solid #e0e0e0;
}
.fav-del {
... ... @@ -168,7 +170,8 @@
height: 35px;
margin-right: 15px;
margin-top: 35px;
background: resolve("home/fav/fav-del.png");
background: resolve("home/fav/fav-del.png");
background-size: 100%;
}
}
... ... @@ -193,11 +196,10 @@
.fav-info-list {
color: #444;
font-size: 24px;
border-bottom: 1px solid #e0e0e0;
padding-bottom: 20px;
padding-bottom: 10px;
margin-right: 10px;
margin-top: 35px;
height: 125px;
height: 100px;
overflow: hidden;
position: relative;
... ...
... ... @@ -3,167 +3,9 @@
@import "feedback";
@import "fav";
@import "about-us";
.my-page {
color: #444;
background: #f0f0f0;
a {
color: #000;
}
.user-info {
display: block;
position: relative;
padding: 0 30px;
color: #000;
font-size: 34px;
line-height: 138px;
height: 469px;
background-size: cover;
background: resolve("home/header-bg.png");
text-align: center;
.user-avatar {
display: inline-block;
position: relative;
top: 90px;
width: 200px;
height: 200px;
border-radius: 50%;
border: 6px solid #a7a8a9;
background: resolve("home/user-icon.png");
background-size: 100%;
}
.username {
display: inline-block;
padding: 0 16px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
font-size: 32px;
max-width: 260px;
}
}
.login-btn {
display: inline-block;
top: 40px;
left: 194px;
width: 244px;
height: 82px;
line-height: 82px;
color: #fff;
border: 4px solid #fff;
margin: 150px auto;
}
.my-order {
margin-bottom: 30px;
border-top: 1px solid #e0e0e0;
border-bottom: 1px solid #e0e0e0;
background: #fff;
.order-title {
display: block;
padding: 0 29px;
font-size: 34px;
line-height: 88px;
span {
color: #e0e0e0;
float: right;
}
&.highlight {
background: #eee;
}
.read-order {
font-size: 30px;
}
}
.order-type {
padding: 20px 30px;
text-align: center;
border-top: 1px solid #e0e0e0;
.type-item {
position: relative;
float: left;
color: #444;
font-size: 24px;
line-height: 1.5;
width: 170px;
&.highlight {
background: #eee;
}
.num {
position: absolute;
top: -24px;
right: 36px;
width: 72px;
height: 72px;
font-size: 34px;
line-height: 72px;
color: #fff;
background: #f03d35;
text-align: center;
border-radius: 50%;
transform: scale(0.5);
}
}
}
}
.group-list {
margin-bottom: 30px;
border-top: 1px solid #e0e0e0;
border-bottom: 1px solid #e0e0e0;
background: #fff;
.list-item {
display: block;
position: relative;
padding: 0 30px;
font-size: 34px;
line-height: 90px;
overflow: hidden;
&.highlight {
background: #eee;
}
&:after {
content: "";
position: absolute;
right: 0;
bottom: 0;
width: 100%;
height: 0;
border-top: 1px solid #f0f0f0;
}
&:last-child:after {
content: none;
}
}
.icon {
margin-right: 5px;
font-size: 34px;
vertical-align: top;
}
.num {
color: #b0b0b0;
float: right;
}
}
}
@import "order";
@import "coin";
/*@import "order-detail";*/
\ No newline at end of file
@import "logistics";
/*@import "order-detail";*/
... ...
.logistics-page {
width: 100%;
background: #f0f0f0;
.edit-logistics-page {
width: 100%;
color: #d0d0d0;
background: #f0f0f0;
.edit-logistics {
padding: 0 30px;
background: #fff;
font-size: 30px;
line-height: 88px;
border-bottom: 1px solid #e0e0e0;
label {
display: block;
position: relative;
color: #000;
font-size: 34px;
border-bottom: 1px solid #e0e0e0;
&:last-of-type:after {
content: none;
}
input {
direction: rtl;
}
}
input {
position: absolute;
top: 0;
right: 40px;
width: 360px;
height: 88px;
color: #444;
padding: 0;
border: none;
-webkit-appearance: none;
}
p {
position: absolute;
top: 0;
right: 40px;
width: 360px;
height: 88px;
color: #444;
padding: 0;
border: none;
}
}
.submit {
margin: auto 30px;
width: 100%;
height: 100px;
color: #fff;
background: #000;
text-align: center;
font-size: 28px;
line-height: 88px;
&.highlight {
background: rgba(0, 0, 0, 0.6);
}
}
}
}
... ...
<template>
<brand-top-cmpnt v-bind:share-Link="shareLink"></brand-top-cmpnt>
<brand-top-cmpnt v-bind:share-data="shareData"></brand-top-cmpnt>
<brand-shop-top-cmpnt v-bind:domain="'nike'"></brand-shop-top-cmpnt>
<!--<goods-list v-bind:data="productList"></goods-list>-->
</template>
... ... @@ -11,13 +11,14 @@
const brandShopTopCmpnt = require('channel/brand-shop-top.vue');
const goodsList = require('product/list.vue');
// TODO 确定分享页面后需要添加拼接分享链接的公共方法
let shareLink = 'http://www.yohobuy.com';
module.exports = {
data() {
return {
shareLink: shareLink,
shareData: {
title: 'BLK',
link: 'm.blk.com',
img: 'https://img11.static.yhbimg.com/brandLogo/2016/04/13/15/010eb8606c1072fd2e769c62567d3bbe93.png?imageView2/2/w/140/h/140'
},
productList: []
};
},
... ...
<template>
<div class="cate-page" id='cate-page'>
<div class="cate-nav clearfix" v-on:click='cateNavTopFun'>
<ul>
<li class="focus">
<span>Boy</span>
</li>
<li class="">
<span>Girl</span>
</li>
<li class="">
<span>Kid</span>
</li>
<li class="">
<span>Lifestyle</span>
</li>
</ul>
</div>
<div class="cate-container clearfix" v-on:click='cateNavLeftFun'>
<div class="content " style="height: 522px;">
<ul class="primary-level">
<li class="p-level-item">
上衣
</li>
<li class="p-level-item focus">
鞋靴
</li>
<li class="p-level-item">
包类
</li>
<li class="p-level-item">
内衣/家居服
</li>
<li class="p-level-item">
美妆/个护
</li>
<li class="p-level-item">
裤装
</li>
<li class="p-level-item">
服配
</li>
<li class="p-level-item">
<a href="//list.dev.yohobuy.com/?sort=115&amp;sort_name=NINO&amp;gender=1%2C3"> NINO</a>
</li>
<li class="p-level-item">
<a href="//list.dev.yohobuy.com/?sort=242&amp;sort_name=%E6%B5%8B%E8%AF%95%E5%89%8D%E5%8F%B0%E6%98%AF%E5%90%A6%E8%83%BD%E5%90%8C%E6%AD%A5&amp;gender=1%2C3"> 测试前台是否能同步</a>
</li>
<li class="p-level-item">
<a href="//list.dev.yohobuy.com/?sort=585&amp;sort_name=%E5%90%AB3%E7%BA%A7%E4%B8%8D%E5%85%B3%E8%81%94&amp;gender=1%2C3"> 含3级不关联</a>
</li>
<li class="p-level-item">
含3级关联
</li>
<li class="p-level-item">
<a href="//list.dev.yohobuy.com/?sort=321&amp;sort_name=12&amp;gender=1%2C3"> 12</a>
</li>
</ul>
<div class="sub-level-container">
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=116%2C114%2C640&amp;sort_name=%E4%B8%8A%E8%A1%A3&amp;gender=1%2C3">
全部上衣
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=114%2C293&amp;sort_name=T%E6%81%A4&amp;gender=1%2C3">
T恤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=123&amp;sort_name=%E6%A3%89%E8%A1%A3&amp;gender=1%2C3">
棉衣
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=119&amp;sort_name=%E5%8D%AB%E8%A1%A3&amp;gender=1%2C3">
卫衣
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=115&amp;sort_name=%E8%A1%AC%E8%A1%AB&amp;gender=1%2C3">
衬衫
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=125&amp;sort_name=%E5%A4%A7%E8%A1%A3%2F%E9%A3%8E%E8%A1%A3&amp;gender=1%2C3">
大衣/风衣
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=173&amp;sort_name=%E7%9A%AE%E8%A1%A3&amp;gender=1%2C3">
皮衣
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=227&amp;sort_name=%E9%98%B2%E9%A3%8E%E5%A4%96%E5%A5%97&amp;gender=1%2C3">
防风外套
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=118&amp;sort_name=%E9%A9%AC%E7%94%B2&amp;gender=1%2C3">
马甲
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=124&amp;sort_name=%E5%A4%B9%E5%85%8B&amp;gender=1%2C3">
夹克
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=258&amp;sort_name=%E6%AF%9B%E8%A1%A3%2F%E9%92%88%E7%BB%87&amp;gender=1%2C3">
毛衣/针织
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=122&amp;sort_name=%E8%A5%BF%E8%A3%85&amp;gender=1%2C3">
西装
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=413&amp;sort_name=%E5%A5%97%E8%A3%85&amp;gender=1%2C3">
套装
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=116&amp;sort_name=POLO&amp;gender=1%2C3">
POLO
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=117&amp;sort_name=%E8%83%8C%E5%BF%83&amp;gender=1%2C3">
背心
</a>
</li>
</ul>
<ul class="sub-level">
<li>
<a href="//list.dev.yohobuy.com/?sort=228%2C299%2C231%2C149%2C148%2C147&amp;sort_name=%E9%9E%8B%E9%9D%B4&amp;gender=1%2C3">
全部鞋靴
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=147&amp;sort_name=%E4%BC%91%E9%97%B2%2F%E8%BF%90%E5%8A%A8%E9%9E%8B&amp;gender=1%2C3">
休闲/运动鞋
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=148&amp;sort_name=%E9%9D%B4%E5%AD%90&amp;gender=1%2C3">
靴子
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=151&amp;sort_name=%E6%97%B6%E8%A3%85%E9%9E%8B&amp;gender=1%2C3">
时装鞋
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=149&amp;sort_name=%E5%87%89%E9%9E%8B%2F%E5%87%89%E6%8B%96&amp;gender=1%2C3">
凉鞋/凉拖
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=231&amp;sort_name=%E4%BF%9D%E5%85%BB%E6%8A%A4%E7%90%86&amp;gender=1%2C3">
保养护理
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=152%2C153%2C196%2C238%2C239%2C240%2C349%2C157%2C342%2C156%2C161%2C300%2C160%2C233%2C341%2C340%2C210%2C339%2C351%2C195%2C197&amp;sort_name=%E5%8C%85%E7%B1%BB&amp;gender=1%2C3">
全部包类
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=339&amp;sort_name=%E5%89%91%E6%A1%A5%E5%8C%85&amp;gender=1%2C3">
剑桥包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=153%2C196%2C195%2C197&amp;sort_name=%E6%89%8B%E6%8B%8E%E5%8C%85%2F%E5%8D%95%E8%82%A9%E5%8C%85&amp;gender=1%2C3">
手拎包/单肩包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=238%2C239%2C240%2C349&amp;sort_name=%E9%92%B1%E5%8C%85%2F%E5%8D%A1%E5%8C%85%2F%E6%89%8B%E5%8C%85%2F%E9%92%A5%E5%8C%99%E5%8C%85&amp;gender=1%2C3">
钱包/卡包/手包/钥匙包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=157&amp;sort_name=%E8%85%B0%E5%8C%85&amp;gender=1%2C3">
腰包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=342&amp;sort_name=%E9%82%AE%E5%B7%AE%E5%8C%85&amp;gender=1%2C3">
邮差包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=156&amp;sort_name=%E7%94%B5%E8%84%91%E5%8C%85&amp;gender=1%2C3">
电脑包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=161%2C300&amp;sort_name=%E5%82%A8%E7%89%A9%E5%8C%85&amp;gender=1%2C3">
储物包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=160&amp;sort_name=%E7%8E%AF%E4%BF%9D%E5%8C%85&amp;gender=1%2C3">
环保包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=233&amp;sort_name=%E5%8C%85%E9%85%8D&amp;gender=1%2C3">
包配
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=341&amp;sort_name=tote%E5%8C%85&amp;gender=1%2C3">
tote包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=340&amp;sort_name=%E6%97%85%E8%A1%8C%E5%8C%85&amp;gender=1%2C3">
旅行包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=210&amp;sort_name=%E6%97%85%E8%A1%8C%E7%AE%B1&amp;gender=1%2C3">
旅行箱
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=351&amp;sort_name=mini%E5%8C%85&amp;gender=1%2C3">
mini包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=239&amp;sort_name=%E6%BD%AE%E5%8C%85&amp;gender=1%2C3">
潮包
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=311%2C357%2C359&amp;sort_name=%E5%86%85%E8%A1%A3%2F%E5%AE%B6%E5%B1%85%E6%9C%8D&amp;gender=1%2C3">
全部内衣/家居服
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=311&amp;sort_name=%E5%86%85%E8%A3%A4&amp;gender=1%2C3">
内裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=357&amp;sort_name=%E5%AE%B6%E5%B1%85%E6%9C%8D&amp;gender=1%2C3">
家居服
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=359&amp;sort_name=%E5%AE%B6%E5%B1%85%E9%9E%8B&amp;gender=1%2C3">
家居鞋
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=263%2C260%2C264%2C261%2C352&amp;sort_name=%E7%BE%8E%E5%A6%86%2F%E4%B8%AA%E6%8A%A4&amp;gender=1%2C3">
全部美妆/个护
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=263&amp;sort_name=%E9%A6%99%E6%B0%B4&amp;gender=1%2C3">
香水
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=260&amp;sort_name=%E9%9D%A2%E9%83%A8%E6%8A%A4%E7%90%86&amp;gender=1%2C3">
面部护理
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=264&amp;sort_name=%E4%B8%AA%E4%BA%BA%E6%8A%A4%E7%90%86&amp;gender=1%2C3">
个人护理
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=261&amp;sort_name=%E5%BD%A9%E5%A6%86&amp;gender=1%2C3">
彩妆
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=352&amp;sort_name=%E7%BA%B9%E8%BA%AB%E8%B4%B4&amp;gender=1%2C3">
纹身贴
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=131%2C129%2C346%2C133%2C348%2C130&amp;sort_name=%E8%A3%A4%E8%A3%85&amp;gender=1%2C3">
全部裤装
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=130&amp;sort_name=%E7%89%9B%E4%BB%94%E8%A3%A4&amp;gender=1%2C3">
牛仔裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=129&amp;sort_name=%E4%BC%91%E9%97%B2%E8%A3%A4&amp;gender=1%2C3">
休闲裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=131&amp;sort_name=%E7%9F%AD%E8%A3%A4&amp;gender=1%2C3">
短裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=346&amp;sort_name=%E8%BF%90%E5%8A%A8%E8%A3%A4&amp;gender=1%2C3">
运动裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=133&amp;sort_name=%E6%89%93%E5%BA%95%E8%A3%A4%2F%E7%B4%A7%E8%BA%AB%E8%A3%A4&amp;gender=1%2C3">
打底裤/紧身裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=348&amp;sort_name=%E8%A5%BF%E8%A3%A4&amp;gender=1%2C3">
西裤
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=186%2C235%2C163%2C224%2C322%2C323%2C324%2C325%2C326%2C327%2C328%2C329%2C330%2C331%2C72%2C74%2C75%2C76%2C142%2C77%2C78%2C79%2C80%2C199%2C213%2C217%2C218%2C234%2C303%2C305%2C306%2C307%2C334%2C162%2C316%2C320%2C164%2C317%2C295%2C321&amp;sort_name=%E6%9C%8D%E9%85%8D&amp;gender=1%2C3">
全部服配
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=186%2C235&amp;sort_name=%E5%A4%AA%E9%98%B3%E9%95%9C%2F%E7%9C%BC%E9%95%9C&amp;gender=1%2C3">
太阳镜/眼镜
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=163%2C224%2C322%2C323%2C324%2C325%2C326%2C327%2C328%2C329%2C330%2C331&amp;sort_name=%E5%B8%BD%E5%AD%90&amp;gender=1%2C3">
帽子
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=72%2C74%2C75%2C76&amp;sort_name=%E9%A6%96%E9%A5%B0&amp;gender=1%2C3">
首饰
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=142&amp;sort_name=%E8%A2%9C%E5%AD%90&amp;gender=1%2C3">
袜子
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=77%2C78%2C79%2C80%2C199%2C213%2C217%2C218%2C234%2C303%2C305%2C306%2C307%2C334&amp;sort_name=%E9%85%8D%E9%A5%B0&amp;gender=1%2C3">
配饰
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=162&amp;sort_name=%E6%89%8B%E8%A1%A8&amp;gender=1%2C3">
手表
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=316&amp;sort_name=%E5%9B%B4%E5%B7%BE&amp;gender=1%2C3">
围巾
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=320&amp;sort_name=%E6%89%8B%E5%B8%95&amp;gender=1%2C3">
手帕
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=321&amp;sort_name=%E4%B8%9D%E5%B7%BE&amp;gender=1%2C3">
丝巾
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=164&amp;sort_name=%E6%89%8B%E5%A5%97&amp;gender=1%2C3">
手套
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=317&amp;sort_name=%E6%8A%AB%E8%82%A9&amp;gender=1%2C3">
披肩
</a>
</li>
</ul>
<ul class="sub-level hide">
</ul>
<ul class="sub-level hide">
</ul>
<ul class="sub-level hide">
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=362&amp;sort_name=%E5%90%AB3%E7%BA%A7%E5%85%B3%E8%81%94&amp;gender=1%2C3">
全部含3级关联
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=618&amp;sort_name=3%E7%BA%A7%E5%85%B3%E8%81%94&amp;gender=1%2C3">
3级关联
</a>
</li>
</ul>
<ul class="sub-level hide">
</ul>
</div>
</div>
<div class="content hide" style="height: 522px;">
<ul class="primary-level">
<li class="p-level-item focus">
上衣
</li>
<li class="p-level-item">
裙装
</li>
<li class="p-level-item">
裤装
</li>
<li class="p-level-item">
鞋靴
</li>
<li class="p-level-item">
包类
</li>
<li class="p-level-item">
服配
</li>
<li class="p-level-item">
内衣/家居服
</li>
<li class="p-level-item">
美妆/个护
</li>
</ul>
<div class="sub-level-container">
<ul class="sub-level ">
<li>
<a href="//list.dev.yohobuy.com/?sort=227%2C173%2C125%2C258%2C121%2C123%2C119%2C124%2C118%2C122%2C115%2C117%2C114%2C293%2C116%2C413&amp;sort_name=%E4%B8%8A%E8%A1%A3&amp;gender=2%2C3">
全部上衣
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=114%2C293&amp;sort_name=T%E6%81%A4&amp;gender=2%2C3">
T恤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=116&amp;sort_name=POLO&amp;gender=2%2C3">
POLO
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=115&amp;sort_name=%E8%A1%AC%E8%A1%AB&amp;gender=2%2C3">
衬衫
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=119&amp;sort_name=%E5%8D%AB%E8%A1%A3&amp;gender=2%2C3">
卫衣
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=124&amp;sort_name=%E5%A4%B9%E5%85%8B&amp;gender=2%2C3">
夹克
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=121%2C123&amp;sort_name=%E6%A3%89%E6%9C%8D&amp;gender=2%2C3">
棉服
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=121&amp;sort_name=%E7%BE%BD%E7%BB%92%E6%9C%8D&amp;gender=2%2C3">
羽绒服
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=258&amp;sort_name=%E6%AF%9B%E8%A1%A3%2F%E9%92%88%E7%BB%87&amp;gender=2%2C3">
毛衣/针织
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=227&amp;sort_name=%E9%98%B2%E9%A3%8E%E5%A4%96%E5%A5%97&amp;gender=2%2C3">
防风外套
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=173&amp;sort_name=%E7%9A%AE%E8%A1%A3&amp;gender=2%2C3">
皮衣
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=122&amp;sort_name=%E8%A5%BF%E8%A3%85&amp;gender=2%2C3">
西装
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=117&amp;sort_name=%E8%83%8C%E5%BF%83&amp;gender=2%2C3">
背心
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=118&amp;sort_name=%E9%A9%AC%E7%94%B2&amp;gender=2%2C3">
马甲
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=413&amp;sort_name=%E5%A5%97%E8%A3%85&amp;gender=2%2C3">
套装
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=125&amp;sort_name=%E5%A4%A7%E8%A1%A3%2F%E9%A3%8E%E8%A1%A3&amp;gender=2%2C3">
大衣/风衣
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=134%2C135&amp;sort_name=%E8%A3%99%E8%A3%85&amp;gender=2%2C3">
全部裙装
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=134&amp;sort_name=%E8%BF%9E%E8%A1%A3%E8%A3%99&amp;gender=2%2C3">
连衣裙
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=135&amp;sort_name=%E5%8D%8A%E8%BA%AB%E8%A3%99&amp;gender=2%2C3">
半身裙
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=134&amp;sort_name=LOLITA%28%E6%B5%8B%E8%AF%95%29&amp;gender=2%2C3">
LOLITA(测试)
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=362&amp;sort_name=LOLITA2%EF%BC%88%E6%B5%8B%E8%AF%95%EF%BC%89&amp;gender=2%2C3">
LOLITA2（测试）
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=359%2C364&amp;sort_name=%E6%B5%8B%E8%AF%95&amp;gender=2%2C3">
测试
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=348%2C346%2C131%2C133%2C129%2C130&amp;sort_name=%E8%A3%A4%E8%A3%85&amp;gender=2%2C3">
全部裤装
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=129&amp;sort_name=%E4%BC%91%E9%97%B2%E8%A3%A4&amp;gender=2%2C3">
休闲裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=130&amp;sort_name=%E7%89%9B%E4%BB%94%E8%A3%A4&amp;gender=2%2C3">
牛仔裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=346&amp;sort_name=%E8%BF%90%E5%8A%A8%E8%A3%A4&amp;gender=2%2C3">
运动裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=133&amp;sort_name=%E6%89%93%E5%BA%95%E8%A3%A4%2F%E7%B4%A7%E8%BA%AB%E8%A3%A4&amp;gender=2%2C3">
打底裤/紧身裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=131&amp;sort_name=%E7%9F%AD%E8%A3%A4&amp;gender=2%2C3">
短裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=348&amp;sort_name=%E8%A5%BF%E8%A3%A4&amp;gender=2%2C3">
西裤
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=147%2C149%2C148%2C151%2C231&amp;sort_name=%E9%9E%8B%E9%9D%B4&amp;gender=2%2C3">
全部鞋靴
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=147&amp;sort_name=%E4%BC%91%E9%97%B2%2F%E8%BF%90%E5%8A%A8%E9%9E%8B&amp;gender=2%2C3">
休闲/运动鞋
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=148&amp;sort_name=%E9%9D%B4%E5%AD%90&amp;gender=2%2C3">
靴子
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=151&amp;sort_name=%E6%97%B6%E8%A3%85%E9%9E%8B&amp;gender=2%2C3">
时装鞋
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=149&amp;sort_name=%E5%87%89%E9%9E%8B%2F%E5%87%89%E6%8B%96&amp;gender=2%2C3">
凉鞋/凉拖
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=231&amp;sort_name=%E4%BF%9D%E5%85%BB%E6%8A%A4%E7%90%86&amp;gender=2%2C3">
保养护理
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=152%2C153%2C238%2C239%2C240%2C349%2C157%2C342%2C156%2C161%2C300%2C160%2C233%2C341%2C340%2C210%2C339%2C351%2C195%2C196%2C197&amp;sort_name=%E5%8C%85%E7%B1%BB&amp;gender=2%2C3">
全部包类
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=152&amp;sort_name=%E5%8F%8C%E8%82%A9%E5%8C%85&amp;gender=2%2C3">
双肩包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=153%2C195%2C196%2C197&amp;sort_name=%E6%89%8B%E6%8B%8E%E5%8C%85%2F%E5%8D%95%E8%82%A9%E5%8C%85&amp;gender=2%2C3">
手拎包/单肩包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=238%2C239%2C240%2C349&amp;sort_name=%E9%92%B1%E5%8C%85%2F%E5%8D%A1%E5%8C%85%2F%E6%89%8B%E5%8C%85%2F%E9%92%A5%E5%8C%99%E5%8C%85&amp;gender=2%2C3">
钱包/卡包/手包/钥匙包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=157&amp;sort_name=%E8%85%B0%E5%8C%85&amp;gender=2%2C3">
腰包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=342&amp;sort_name=%E9%82%AE%E5%B7%AE%E5%8C%85&amp;gender=2%2C3">
邮差包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=156&amp;sort_name=%E7%94%B5%E8%84%91%E5%8C%85&amp;gender=2%2C3">
电脑包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=161%2C300&amp;sort_name=%E5%82%A8%E7%89%A9%E5%8C%85&amp;gender=2%2C3">
储物包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=160&amp;sort_name=%E7%8E%AF%E4%BF%9D%E5%8C%85&amp;gender=2%2C3">
环保包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=233&amp;sort_name=%E5%8C%85%E9%85%8D&amp;gender=2%2C3">
包配
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=341&amp;sort_name=tote%E5%8C%85&amp;gender=2%2C3">
tote包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=340&amp;sort_name=%E6%97%85%E8%A1%8C%E5%8C%85&amp;gender=2%2C3">
旅行包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=210&amp;sort_name=%E6%97%85%E8%A1%8C%E7%AE%B1&amp;gender=2%2C3">
旅行箱
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=339&amp;sort_name=%E5%89%91%E6%A1%A5%E5%8C%85&amp;gender=2%2C3">
剑桥包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=351&amp;sort_name=mini+%E5%8C%85&amp;gender=2%2C3">
mini 包
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=186%2C235%2C163%2C224%2C322%2C323%2C324%2C325%2C326%2C327%2C328%2C329%2C330%2C331%2C72%2C74%2C75%2C76%2C142%2C77%2C78%2C79%2C80%2C199%2C213%2C217%2C218%2C234%2C303%2C305%2C306%2C307%2C334%2C162%2C316%2C320%2C164%2C317%2C295%2C321&amp;sort_name=%E6%9C%8D%E9%85%8D&amp;gender=2%2C3">
全部服配
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=163%2C224%2C322%2C323%2C324%2C325%2C326%2C327%2C328%2C329%2C330%2C331&amp;sort_name=%E5%B8%BD%E5%AD%90&amp;gender=2%2C3">
帽子
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=72%2C74%2C75%2C76&amp;sort_name=%E9%A6%96%E9%A5%B0&amp;gender=2%2C3">
首饰
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=142&amp;sort_name=%E8%A2%9C%E5%AD%90&amp;gender=2%2C3">
袜子
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=77%2C78%2C79%2C80%2C199%2C213%2C217%2C218%2C234%2C303%2C305%2C306%2C307%2C334&amp;sort_name=%E9%85%8D%E9%A5%B0&amp;gender=2%2C3">
配饰
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=162&amp;sort_name=%E6%89%8B%E8%A1%A8&amp;gender=2%2C3">
手表
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=316&amp;sort_name=%E5%9B%B4%E5%B7%BE&amp;gender=2%2C3">
围巾
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=164&amp;sort_name=%E6%89%8B%E5%A5%97&amp;gender=2%2C3">
手套
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=317&amp;sort_name=%E6%8A%AB%E8%82%A9&amp;gender=2%2C3">
披肩
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=186%2C235&amp;sort_name=%E5%A4%AA%E9%98%B3%E9%95%9C%2F%E7%9C%BC%E9%95%9C&amp;gender=2%2C3">
太阳镜/眼镜
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=320&amp;sort_name=%E6%89%8B%E5%B8%95&amp;gender=2%2C3">
手帕
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=321&amp;sort_name=%E4%B8%9D%E5%B7%BE&amp;gender=2%2C3">
丝巾
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=311%2C364%2C357%2C359&amp;sort_name=%E5%86%85%E8%A1%A3%2F%E5%AE%B6%E5%B1%85%E6%9C%8D&amp;gender=2%2C3">
全部内衣/家居服
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=364&amp;sort_name=%E6%96%87%E8%83%B8&amp;gender=2%2C3">
文胸
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=311&amp;sort_name=%E5%86%85%E8%A3%A4&amp;gender=2%2C3">
内裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=357&amp;sort_name=%E5%AE%B6%E5%B1%85%E6%9C%8D&amp;gender=2%2C3">
家居服
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=359&amp;sort_name=%E5%AE%B6%E5%B1%85%E9%9E%8B&amp;gender=2%2C3">
家居鞋
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=263&amp;sort_name=%E7%BE%8E%E5%A6%86%2F%E4%B8%AA%E6%8A%A4&amp;gender=2%2C3">
全部美妆/个护
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=263&amp;sort_name=%E9%A6%99%E6%B0%B4&amp;gender=2%2C3">
香水
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=260&amp;sort_name=%E9%9D%A2%E9%83%A8%E6%8A%A4%E7%90%86&amp;gender=2%2C3">
面部护理
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=264&amp;sort_name=%E4%B8%AA%E4%BA%BA%E6%8A%A4%E7%90%86&amp;gender=2%2C3">
个人护理
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=261&amp;sort_name=%E5%BD%A9%E5%A6%86&amp;gender=2%2C3">
彩妆
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=352&amp;sort_name=%E7%BA%B9%E8%BA%AB%E8%B4%B4&amp;gender=2%2C3">
纹身贴
</a>
</li>
</ul>
</div>
</div>
<div class="content hide" style="height: 522px;">
<ul class="primary-level">
<li class="p-level-item focus">
上衣
</li>
<li class="p-level-item">
裤装
</li>
<li class="p-level-item">
泳衣
</li>
<li class="p-level-item">
裙装
</li>
<li class="p-level-item">
鞋靴
</li>
<li class="p-level-item">
包类
</li>
<li class="p-level-item">
服配
</li>
<li class="p-level-item">
<a href="//list.dev.yohobuy.com/?sort=211&amp;sort_name=%E6%B5%8B%E8%AF%95%E6%BD%AE%E7%AB%A5%E6%96%B0%E5%A2%9E%E4%BA%8C%E7%BA%A7%E7%B1%BB%E7%9B%AE&amp;gender=1%2C2%2C3"> 测试潮童新增二级类目</a>
</li>
</ul>
<div class="sub-level-container">
<ul class="sub-level ">
<li>
<a href="//list.dev.yohobuy.com/?sort=407%2C405%2C403%2C397%2C374%2C373&amp;sort_name=%E4%B8%8A%E8%A1%A3&amp;gender=1%2C2%2C3">
全部上衣
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=407&amp;sort_name=%E5%A4%A7%E8%A1%A3%2F%E9%A3%8E%E8%A1%A3&amp;gender=1%2C2%2C3">
大衣/风衣
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=405&amp;sort_name=%E5%A4%B9%E5%85%8B%2F%E9%98%B2%E9%A3%8E%E5%A4%96%E5%A5%97&amp;gender=1%2C2%2C3">
夹克/防风外套
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=401&amp;sort_name=%E6%AF%9B%E8%A1%A3%2F%E9%92%88%E7%BB%87&amp;gender=1%2C2%2C3">
毛衣/针织
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=403&amp;sort_name=%E9%A9%AC%E7%94%B2&amp;gender=1%2C2%2C3">
马甲
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=397&amp;sort_name=%E5%8D%AB%E8%A1%A3&amp;gender=1%2C2%2C3">
卫衣
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=399%2C400%2C374&amp;sort_name=%E8%A1%AC%E8%A1%AB&amp;gender=1%2C2%2C3">
衬衫
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=387&amp;sort_name=%E8%83%8C%E5%BF%83&amp;gender=1%2C2%2C3">
背心
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=373&amp;sort_name=T%E6%81%A4&amp;gender=1%2C2%2C3">
T恤
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=389%2C385%2C377%2C376%2C391&amp;sort_name=%E8%A3%A4%E8%A3%85&amp;gender=1%2C2%2C3">
全部裤装
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=376&amp;sort_name=%E4%BC%91%E9%97%B2%E8%A3%A4&amp;gender=1%2C2%2C3">
休闲裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=389&amp;sort_name=%E7%89%9B%E4%BB%94%E8%A3%A4&amp;gender=1%2C2%2C3">
牛仔裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=391&amp;sort_name=%E8%BF%90%E5%8A%A8%E8%A3%A4&amp;gender=1%2C2%2C3">
运动裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=385&amp;sort_name=%E6%89%93%E5%BA%95%E8%A3%A4+%2F%E7%B4%A7%E8%BA%AB%E8%A3%A4&amp;gender=1%2C2%2C3">
打底裤 /紧身裤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=377&amp;sort_name=%E7%9F%AD%E8%A3%A4&amp;gender=1%2C2%2C3">
短裤
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=381&amp;sort_name=%E6%B3%B3%E8%A1%A3&amp;gender=1%2C2%2C3">
全部泳衣
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=381&amp;sort_name=%E6%B3%B3%E8%A1%A3&amp;gender=1%2C2%2C3">
泳衣
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=378%2C379&amp;sort_name=%E8%A3%99%E8%A3%85&amp;gender=1%2C2%2C3">
全部裙装
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=378&amp;sort_name=%E8%BF%9E%E8%A1%A3%E8%A3%99&amp;gender=1%2C2%2C3">
连衣裙
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=379&amp;sort_name=%E5%8D%8A%E8%BA%AB%E8%A3%99&amp;gender=1%2C2%2C3">
半身裙
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=383%2C375&amp;sort_name=%E9%9E%8B%E9%9D%B4&amp;gender=1%2C2%2C3">
全部鞋靴
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=383&amp;sort_name=%E5%87%89%E9%9E%8B%2F%E5%87%89%E6%8B%96&amp;gender=1%2C2%2C3">
凉鞋/凉拖
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=375&amp;sort_name=%E4%BC%91%E9%97%B2%2F%E8%BF%90%E5%8A%A8%E9%9E%8B&amp;gender=1%2C2%2C3">
休闲/运动鞋
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=393&amp;sort_name=%E5%8C%85%E7%B1%BB&amp;gender=1%2C2%2C3">
全部包类
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=393&amp;sort_name=%E5%8F%8C%E8%82%A9%E5%8C%85&amp;gender=1%2C2%2C3">
双肩包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=153&amp;sort_name=%E6%89%8B%E6%8B%8E%E5%8C%85%2F%E5%8D%95%E8%82%A9%E5%8C%85&amp;gender=1%2C2%2C3">
手拎包/单肩包
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=210&amp;sort_name=%E6%97%85%E8%A1%8C%E7%AE%B1&amp;gender=1%2C2%2C3">
旅行箱
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=351%2C342&amp;sort_name=%E6%B5%8B%E8%AF%953%E7%BA%A7&amp;gender=1%2C2%2C3">
测试3级
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=395%2C431%2C433&amp;sort_name=%E6%9C%8D%E9%85%8D&amp;gender=1%2C2%2C3">
全部服配
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=395&amp;sort_name=%E6%8A%AB%E8%82%A9&amp;gender=1%2C2%2C3">
披肩
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=431%2C433&amp;sort_name=%E5%A4%AA%E9%98%B3%E9%95%9C%2F%E7%9C%BC%E9%95%9C&amp;gender=1%2C2%2C3">
太阳镜/眼镜
</a>
</li>
</ul>
<ul class="sub-level hide">
</ul>
</div>
</div>
<div class="content hide" style="height: 522px;">
<ul class="primary-level">
<li class="p-level-item focus">
<a href="//list.dev.yohobuy.com/?sort=259%2C263%2C352&amp;sort_name=%E5%8B%BF%E5%88%A0SYJ%E6%B5%8B%E8%AF%95%E5%88%86%E7%B1%BB&amp;gender=1%2C2%2C3"> 勿删SYJ测试分类</a>
</li>
<li class="p-level-item">
<a href="//list.dev.yohobuy.com/?sort=110%2C112%2C184&amp;sort_name=%E6%96%87%E5%85%B72&amp;gender=1%2C2%2C3"> 文具2</a>
</li>
<li class="p-level-item">
家居生活
</li>
<li class="p-level-item">
数码3C
</li>
<li class="p-level-item">
美妆/个护
</li>
<li class="p-level-item">
<a href="//list.dev.yohobuy.com/?sort=130%2C348%2C346&amp;sort_name=%E6%B5%8B%E8%AF%95%E6%96%B0%E5%A2%9E%E5%88%86%E7%B1%BB%EF%BC%88%E9%9D%9E%E6%B5%8B%E8%AF%95%E8%AF%AF%E6%93%8D%E4%BD%9C%EF%BC%81%EF%BC%89&amp;gender=1%2C2%2C3"> 测试新增分类（非测试误操作！）</a>
</li>
<li class="p-level-item">
<a href="//list.dev.yohobuy.com/?sort=292&amp;sort_name=%E5%85%B3%E8%81%94%E4%B8%80%E4%B8%AA%E7%89%A9%E7%90%86%E7%B1%BB%E7%9B%AE&amp;gender=1%2C2%2C3"> 关联一个物理类目</a>
</li>
</ul>
<div class="sub-level-container">
<ul class="sub-level ">
</ul>
<ul class="sub-level hide">
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=281%2C292%2C304%2C267%2C268%2C269%2C270%2C271%2C272%2C273%2C274%2C275%2C276%2C277%2C332%2C333%2C353%2C355%2C110%2C112%2C184%2C302%2C343%2C344%2C399&amp;sort_name=%E5%AE%B6%E5%B1%85%E7%94%9F%E6%B4%BB&amp;gender=1%2C2%2C3">
全部家居生活
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=268%2C269%2C270%2C271%2C272%2C273%2C274%2C275%2C276%2C277%2C332%2C333%2C353&amp;sort_name=%E5%B1%85%E5%AE%B6&amp;gender=1%2C2%2C3">
居家
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=355&amp;sort_name=%E5%AE%A0%E7%89%A9%E5%91%A8%E8%BE%B9&amp;gender=1%2C2%2C3">
宠物周边
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=281%2C282%2C283%2C284%2C292%2C304&amp;sort_name=%E7%8E%A9%E5%85%B7%E5%A8%B1%E4%B9%90&amp;gender=1%2C2%2C3">
玩具娱乐
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=283%2C110%2C111%2C112%2C184&amp;sort_name=%E6%96%87%E5%85%B7&amp;gender=1%2C2%2C3">
文具
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=112&amp;sort_name=%E6%96%87%E5%85%B73&amp;gender=1%2C2%2C3">
文具3
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=185%2C211%2C313%2C212%2C171%2C113%2C200%2C398&amp;sort_name=%E6%95%B0%E7%A0%813C&amp;gender=1%2C2%2C3">
全部数码3C
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=211&amp;sort_name=%E6%95%B0%E7%A0%81%E9%85%8D%E4%BB%B6&amp;gender=1%2C2%2C3">
数码配件
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=313&amp;sort_name=%E6%89%8B%E6%9C%BA%2Fipad%E5%A3%B3%E5%A5%97&amp;gender=1%2C2%2C3">
手机/ipad壳套
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=212&amp;sort_name=%E6%89%8B%E6%9C%BA%E9%85%8D%E4%BB%B6&amp;gender=1%2C2%2C3">
手机配件
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=171&amp;sort_name=%E8%80%B3%E6%9C%BA&amp;gender=1%2C2%2C3">
耳机
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=113&amp;sort_name=U%E7%9B%98&amp;gender=1%2C2%2C3">
U盘
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=200&amp;sort_name=%E7%94%B5%E8%84%91%E6%9E%B6&amp;gender=1%2C2%2C3">
电脑架
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=398&amp;sort_name=%E6%99%BA%E8%83%BD%E8%A3%85%E5%A4%87&amp;gender=1%2C2%2C3">
智能装备
</a>
</li>
</ul>
<ul class="sub-level hide">
<li>
<a href="//list.dev.yohobuy.com/?sort=263%2C260%2C264%2C261%2C352&amp;sort_name=%E7%BE%8E%E5%A6%86%2F%E4%B8%AA%E6%8A%A4&amp;gender=1%2C2%2C3">
全部美妆/个护
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=352&amp;sort_name=%E7%BA%B9%E8%BA%AB%E8%B4%B4&amp;gender=1%2C2%2C3">
纹身贴
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=264&amp;sort_name=%E4%B8%AA%E4%BA%BA%E6%8A%A4%E7%90%86&amp;gender=1%2C2%2C3">
个人护理
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=260&amp;sort_name=%E9%9D%A2%E9%83%A8%E6%8A%A4%E8%82%A4&amp;gender=1%2C2%2C3">
面部护肤
</a>
</li>
<li>
<a href="//list.dev.yohobuy.com/?sort=263&amp;sort_name=%E9%A6%99%E6%B0%B4&amp;gender=1%2C2%2C3">
香水
</a>
</li>
</ul>
<ul class="sub-level hide">
</ul>
<ul class="sub-level hide">
</ul>
</div>
</div>
</div>
</div>
</template>
<style>
.cate-page {
font-size: 36px;
font-family: helvetica, Arial, "黑体";
ul, li {
margin: 0;
padding: 0;
list-style: none;
}
.search-input {
position: relative;
background-color: #f8f8f8;
padding: 13px 20px;
p {
box-sizing: border-box;
width: 100%;
height: 60px;
line-height: 60px;
border: none;
padding-left: 66px;
border-radius: 60px;
font-size: 26px;
background: #fff;
color: #999;
}
}
.search-icon {
position: absolute;
top: 0;
bottom: 0;
left: 43px;
line-height: 86px;
color: #999;
}
.cate-nav {
height: 120px;
border-bottom: 1px solid #e6e6e6;
li {
display: block;
box-sizing: border-box;
float: left;
height: 100%;
padding: 20px 10px;
width: 25%;
text-align: center;
color: #999;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
&:last-child {
border-right: none;
}
&.focus {
color: #000;
span {
border-bottom: 4px solid #000;
font-weight: bold;
}
}
&.bytouch {
background: #eee;
}
}
span {
line-height: 80px;
padding-bottom: 10px;
}
li:last-child span {
border-right: 0;
}
}
.content {
&.hide {
display: none;
}
}
.primary-level {
float: left;
box-sizing: border-box;
width: 45%;
> li {
height: 120px;
line-height: 120px;
padding: 0 32px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
border-bottom: 1px solid #e6e6e6;
&.focus {
background-color: #fff;
&:after {
content: "";
width: 0;
height: 0;
border-top: 20px solid transparent;
border-bottom: 20px solid transparent;
border-right: 20px solid #efefef;
position: absolute;
margin-top: 32px;
right: 55%;
}
}
&.highlight {
background-color: #eee;
}
}
}
.sub-level-container {
float: left;
box-sizing: border-box;
background: #f6f6f6;
width: 55%;
height: 100%;
}
.sub-level {
width: 100%;
background-color: #f6f6f6;
position: relative;
&.hide {
display: none;
}
> li {
box-sizing: border-box;
height: 110px;
line-height: 110px;
border-bottom: 1px solid #e6e6e6;
padding-left: 20px;
&.highlight {
background: #eee;
}
&:hover {
background-color: #efefef;
}
}
a {
display: block;
height: 100%;
width: 100%;
color: #000;
}
}
}
</style>
<script>
const $ = require('yoho-jquery');
const tip = require('common/tip');
module.exports = {
props: [],
data() {
return {
};
},
watch: {
},
methods: {
getCateList() {
let data = {
channel: ''
};
$.ajax({
url: '/get-cate-list',
data: data
}).then(result => {
console.log(result, '====');
}).fail(() => {
tip('网络错误');
});
},
cateNavTopFun(e) {
var $this = $(e.target).closest('li'),
$nav = $('.cate-nav'),
$cateContainer = $('.cate-container'),
$contents = $cateContainer.children('.content'),
$curContent = $contents.not('.hide'),
index = $this.index();
if ($this.hasClass('focus')) {
return;
}
$nav.find('li.focus').removeClass('focus');
$this.addClass('focus');
$curContent.addClass('hide');
$curContent = $contents.eq(index).removeClass('hide');
},
cateNavLeftFun(e) {
var $this = $(e.target),
$subLevel,
$cur, index;
$cur = $this.closest('.p-level-item');
if ($cur.length > 0) {
index = $cur.index();
$subLevel = $this.closest('.content').find('.sub-level');
if ($this.hasClass('focus')) {
return;
}
$this.closest('.primary-level').children('.focus').removeClass('focus');
$this.addClass('focus');
$subLevel.not('.hide').addClass('hide');
$subLevel.eq(index).removeClass('hide');
}
}
},
created() {
this.getCateList();
}
};
</script>
... ...
... ... @@ -19,7 +19,6 @@
<style>
.brand-list-box {
width: 100%;
height: 600px;
.per-brand-box {
.index {
... ... @@ -32,11 +31,12 @@
}
.brand-box {
width: 25%;
height: 175px;
width: 24%;
height: 180px;
float: left;
overflow: hidden;
text-align: center;
margin: 0 0.5%;
.brand-logo {
height: 150px;
... ...
<template>
<div class="brand-top-box" v-bind:style="{ 'background-image': `url(${brandIntro.brandBg})` }">
<div v-if="showBrandInfo" class="brand-top-box" v-bind:style="{ 'background-image': `url(${brandIntro.brandBg})` }">
<div class="brand-bottom">
<img v-if="brandIntro.showBrandLogo" v-lazy="brandIntro.brandLogo" alt="{{ brandIntro.brandName }}">
<div v-else class="brand-title">{{ brandIntro.brandName }}</div>
... ... @@ -22,24 +22,23 @@
width: 100%;
position: absolute;
bottom: 20px;
padding: 0 30px;
.brand-title {
margin-left: 5%;
font-size: 32px;
}
hr {
width: 90%;
width: 100%;
border: #fff solid 1px;
border-top: none;
}
.brand-intro-transition {
transition: all 0.3s ease;
margin-left: 5%;
font-size: 16px;
line-height: 32px;
width: 90%;
width: 82%;
height: 220px;
overflow-y: auto;
}
... ... @@ -52,7 +51,6 @@
.brand-short {
height: 60px !important;
display: -webkit-box !important;
margin-left: 5%;
font-size: 16px;
line-height: 32px;
width: 82%;
... ... @@ -69,7 +67,7 @@
height: 60px;
position: absolute;
bottom: 20px;
right: 5%;
right: 30px;
}
.expand {
... ... @@ -78,20 +76,21 @@
.collapse {
background: url("/channel/collapse.png") no-repeat;
}
}
</style>
<script>
const $ = require('yoho-jquery');
const tip = require('common/tip');
const qs = require('yoho-qs');
module.exports = {
props: ['domain'],
data() {
return {
brandIntro: {},
showMore: false
showMore: false,
showBrandInfo: false
};
},
watch: {
... ... @@ -102,14 +101,17 @@
methods: {
getShopIntro() {
let data = {
domain: this.domain
domain: qs.domain
};
$.ajax({
url: '/get-brand-intro',
data: data
}).then(result => {
this.brandIntro = result;
if (result) {
this.showBrandInfo = true;
this.brandIntro = result;
}
}).fail(() => {
tip('网络错误');
});
... ...