fe / yohobuywap-node · Commits

Go to a project

Authored by zhangxiaoru
Commit ba7e723ee011b7ca9b30da4719046a49c3264f27 1 parent 25d79c93

品类

Inline Side-by-side
Showing 8 changed files with 274 additions and 44 deletions
@@ -7,8 +7,6 @@ @@ -7,8 +7,6 @@
7 'use strict'; 7 'use strict';
8 8
9 const mRoot = '../models'; 9 const mRoot = '../models';
10 -const headerModel = require('../../../doraemon/models/header'); // 头部model  
11 -const _ = require('lodash');  
12 const brandModel = require(`${mRoot}/brand-list`); 10 const brandModel = require(`${mRoot}/brand-list`);
13 11
14 let channels = { 12 let channels = {
@@ -20,23 +18,30 @@ let channels = { @@ -20,23 +18,30 @@ let channels = {
20 const index = (req, res, next) => { 18 const index = (req, res, next) => {
21 let categoryTab = req.query.tab || ''; 19 let categoryTab = req.query.tab || '';
22 let gender = req.query.gender || req.cookies._Channel && channels[req.cookies._Channel] || 1; 20 let gender = req.query.gender || req.cookies._Channel && channels[req.cookies._Channel] || 1;
23 - let code = '7317a4701a1d3ddc8d93a5df77a63b75';  
24 - let isbrand = true; 21 + let brandCode;
  22 + let cateCode;
  23 + let isCate = categoryTab === 'category' ? true : false;
25 24
26 - brandModel.indexData(isbrand, gender, code).then(result => { 25 + if (parseInt(gender, 10) === 1) {
  26 + brandCode = '7317a4701a1d3ddc8d93a5df77a63b75';
  27 + cateCode = '7f885e9cab53231cff34ea236f3f1120';
  28 + } else {
  29 + brandCode = '84313c4b293a1c0aea985aa16a42a6b5';
  30 + cateCode = 'a6f9dc00219eb7d08520a18864929a30';
  31 + }
  32 +
  33 + brandModel.indexData(gender, brandCode, cateCode).then(result => {
27 34
28 res.render('brand/brand', { 35 res.render('brand/brand', {
29 module: 'guang', 36 module: 'guang',
30 page: 'brand-list', 37 page: 'brand-list',
31 - // pageHeader: headerModel.setNav({  
32 - // navTitle: '潮流优选'  
33 - // }),  
34 - // title: '潮流优选',  
35 width750: true, 38 width750: true,
36 - categoryTab: categoryTab === 'category' ? true : false,  
37 - channel: result.channel,  
38 - brandList: result.brandList  
39 - }) 39 + categoryTab: isCate,
  40 + channel: result.channel ? result.channel : '',
  41 + brandList: result.brandList,
  42 + list: result.list ? result.list : '',
  43 + categoryData: result.categoryData
  44 + });
40 }).catch(next); 45 }).catch(next);
41 }; 46 };
42 47
@@ -44,7 +49,7 @@ const brandList = (req, res, next) => { @@ -44,7 +49,7 @@ const brandList = (req, res, next) => {
44 let code; 49 let code;
45 let gender = req.query.gender || req.cookies._Channel && channels[req.cookies._Channel] || 1; 50 let gender = req.query.gender || req.cookies._Channel && channels[req.cookies._Channel] || 1;
46 51
47 - if (parseInt(gender) === 1) { 52 + if (parseInt(gender, 10) === 1) {
48 code = '7317a4701a1d3ddc8d93a5df77a63b75'; 53 code = '7317a4701a1d3ddc8d93a5df77a63b75';
49 } else { 54 } else {
50 code = '84313c4b293a1c0aea985aa16a42a6b5'; 55 code = '84313c4b293a1c0aea985aa16a42a6b5';
@@ -58,7 +63,26 @@ const brandList = (req, res, next) => { @@ -58,7 +63,26 @@ const brandList = (req, res, next) => {
58 }).catch(next); 63 }).catch(next);
59 }; 64 };
60 65
  66 +const categoryData = (req, res, next) => {
  67 + let code;
  68 + let gender = req.query.gender || req.cookies._Channel && channels[req.cookies._Channel] || 1;
  69 +
  70 + if (parseInt(gender) === 1) {
  71 + code = '7f885e9cab53231cff34ea236f3f1120';
  72 + } else {
  73 + code = 'a6f9dc00219eb7d08520a18864929a30';
  74 + }
  75 +
  76 + brandModel.categoryData(code, gender).then(result => {
  77 + res.render('brand/category', {
  78 + layout: false,
  79 + categoryData: result.categoryData
  80 + });
  81 + }).catch(next);
  82 +};
  83 +
61 module.exports = { 84 module.exports = {
62 index, 85 index,
63 - brandList 86 + brandList,
  87 + categoryData
64 }; 88 };
@@ -151,13 +151,14 @@ const _getBrandListOriginData = (channel) => { @@ -151,13 +151,14 @@ const _getBrandListOriginData = (channel) => {
151 }); 151 });
152 }; 152 };
153 153
154 -const indexData = (isbrand, gender, code) => {  
155 - if (isbrand) {  
156 - return Promise.all([_getChannelData(gender), _getResourcesData(code), _getBrandListOriginData(gender)]).then(result => { 154 +const indexData = (gender, brandCode, cateCode) => {
  155 + return Promise.all([_getChannelData(gender), _getResourcesData(brandCode), _getBrandListOriginData(gender), _getResourcesData(cateCode)]).then(result => {
157 let brandList = {}; 156 let brandList = {};
158 let list = {}; 157 let list = {};
  158 + let categoryData = {};
159 159
160 if (result[0]) { 160 if (result[0]) {
  161 + categoryData.channel = result[0];
161 list.channel = result[0]; 162 list.channel = result[0];
162 } 163 }
163 164
@@ -176,23 +177,62 @@ const indexData = (isbrand, gender, code) => { @@ -176,23 +177,62 @@ const indexData = (isbrand, gender, code) => {
176 brandList.indexList = result[2].indexList; 177 brandList.indexList = result[2].indexList;
177 } 178 }
178 179
  180 + if (result[3]) {
  181 + _.forEach(result[3], function(data) {
  182 + if (data.template_name === 'recommend_content_five') {
  183 + categoryData.list = data.data.list;
  184 + } else if (data.template_name === 'focus') {
  185 + categoryData.focusData = data;
  186 + }
  187 + });
  188 + }
  189 +
179 list.brandList = brandList; 190 list.brandList = brandList;
  191 + list.categoryData = categoryData;
180 return list; 192 return list;
181 }); 193 });
182 - // return favfavBrand(uid, page, limit).then(result=> {  
183 - // if (result.total === 0) {  
184 - // result = {nobrandData: 1}; 194 + // return Promise.all([_getChannelData(gender), _getResourcesData(code)]).then(result => {
  195 + // let categoryData = {};
  196 + // let list = {};
  197 +
  198 + // if (result[0]) {
  199 + // list.channel = result[0];
  200 + // }
  201 +
  202 + // if (result[1]) {
  203 + // _.forEach(result[1], function(data) {
  204 + // if (data.template_name === 'recommend_content_five') {
  205 + // categoryData.list = data.data.list;
  206 + // } else if (data.template_name === 'focus') {
  207 + // categoryData.focusData = data;
185 // } 208 // }
186 - // return result;  
187 // }); 209 // });
188 - } else {  
189 - // return favProduct(uid, page, limit).then(result=> {  
190 - // if (result.total === 0) {  
191 - // result = {noproductData: 1};  
192 // } 210 // }
193 - // return result; 211 +
  212 + // list.categoryData = categoryData;
  213 + // return list;
  214 + // });
  215 +
  216 + //全部分类
  217 + // return api.get('', {
  218 + // method: 'app.sort.get'
  219 + // }, {
  220 + // cache: true
  221 + // }).then((result) => {
  222 + // if (!result.code || result.code !== 200 || !result.data) {
  223 + // return [];
  224 + // }
  225 +
  226 + // // 统一频道名称
  227 + // result.data.boys = result.data.boy;
  228 + // result.data.girls = result.data.girl;
  229 + // _.unset(result.data, 'boy');
  230 + // _.unset(result.data, 'girl');
  231 +
  232 + // return result.data;
  233 + // }).then((list) => {
  234 + // return _processCateData(list, channel);
194 // }); 235 // });
195 - }  
196 }; 236 };
197 237
198 const brandListData = (code, gender) => { 238 const brandListData = (code, gender) => {
@@ -220,7 +260,29 @@ const brandListData = (code, gender) => { @@ -220,7 +260,29 @@ const brandListData = (code, gender) => {
220 }) 260 })
221 } 261 }
222 262
  263 +const categoryData = (code, gender) => {
  264 +
  265 + return _getResourcesData(code).then(result => {
  266 + let categoryData = {};
  267 + let list = {};
  268 +
  269 + if (result) {
  270 + _.forEach(result, function(data) {
  271 + if (data.template_name === 'recommend_content_five') {
  272 + categoryData.list = data.data.list;
  273 + } else if (data.template_name === 'focus') {
  274 + categoryData.focusData = data;
  275 + }
  276 + });
  277 + }
  278 +
  279 + list.categoryData = categoryData;
  280 + return list;
  281 + });
  282 +}
  283 +
223 module.exports = { 284 module.exports = {
224 indexData, 285 indexData,
225 - brandListData 286 + brandListData,
  287 + categoryData
226 }; 288 };
@@ -65,5 +65,6 @@ router.get('/info/detailData', index.detailDynamicData); @@ -65,5 +65,6 @@ router.get('/info/detailData', index.detailDynamicData);
65 65
66 router.get('/brand', brand.index); 66 router.get('/brand', brand.index);
67 router.get('/brandList', brand.brandList); 67 router.get('/brandList', brand.brandList);
  68 +router.get('/category', brand.categoryData);
68 69
69 module.exports = router; 70 module.exports = router;
1 <div class="brand-blk-page yoho-page"> 1 <div class="brand-blk-page yoho-page">
2 <div class="tab-box"> 2 <div class="tab-box">
3 <ul class="brand-tab"> 3 <ul class="brand-tab">
4 - <li class="{{#unless categoryTab}}active{{/ unless}}">品牌</li>  
5 - <li class="{{# categoryTab}}active{{/ categoryTab}}">品类</li> 4 + <li class="brand {{#unless categoryTab}}active{{/ unless}}">品牌</li>
  5 + <li class="cate {{# categoryTab}}active{{/ categoryTab}}">品类</li>
6 </ul> 6 </ul>
7 7
8 <div class="channel-tab"> 8 <div class="channel-tab">
@@ -16,12 +16,12 @@ @@ -16,12 +16,12 @@
16 </div> 16 </div>
17 </div> 17 </div>
18 18
19 - <div class="content">  
20 - <div class="brand-content {{#unless categoryTab}}show{{/ unless}}"> 19 + <div class="content-index">
  20 + <div class="brand-content {{# categoryTab}}hide{{/ categoryTab}}">
21 {{> brand/brand-list}} 21 {{> brand/brand-list}}
22 </div> 22 </div>
23 - <div class="category-content {{# categoryTab}}show{{/ categoryTab}}">  
24 - 23 + <div class="category-content {{#unless categoryTab}}hide{{/ unless}}">
  24 + {{> brand/category}}
25 </div> 25 </div>
26 </div> 26 </div>
27 </div> 27 </div>
  1 +{{# categoryData}}
  2 + <div class="resources">
  3 + <div class="recommend-content-five">
  4 + {{# list}}
  5 + <a href="{{url}}">
  6 + <img src="{{image src 375 375}}">
  7 + </a>
  8 + {{/ list}}
  9 + </div>
  10 +
  11 + <div class="focus-floor">
  12 + {{# focusData}}
  13 + {{> resources/banner-top}}
  14 + {{/ focusData}}
  15 + </div>
  16 + </div>
  17 +{{/ categoryData}}
@@ -16,29 +16,38 @@ function channels(key) { @@ -16,29 +16,38 @@ function channels(key) {
16 }[key]; 16 }[key];
17 }; 17 };
18 18
19 -function loadData(channel) { 19 +function loadData(channel, isBrand) {
  20 + var preUrl;
  21 +
  22 + if (isBrand) {
  23 + preUrl = '/guang/brandList';
  24 + } else {
  25 + preUrl = '/guang/category';
  26 + }
  27 +
20 $.ajax({ 28 $.ajax({
21 method: 'get', 29 method: 'get',
22 - url: '/guang/brandList', 30 + url: preUrl,
23 data: { 31 data: {
24 gender: channel 32 gender: channel
25 }, 33 },
26 success: function(data) { 34 success: function(data) {
  35 + if (isBrand) {
27 $('.brand-content').html(data); 36 $('.brand-content').html(data);
  37 + } else {
  38 + $('.category-content').html(data);
  39 + }
28 } 40 }
29 }); 41 });
30 } 42 }
31 43
32 $('.channel-tab').find('li').click(function() { 44 $('.channel-tab').find('li').click(function() {
33 - var gender = $(this).find('span').text().replace(/[^A-Za-z]+/g, '').toLowerCase(); 45 + var gender = $(this).find('span').text().replace(/[^A-Za-z]+/g, '').toLowerCase(),
  46 + isBrand = $('.brand-tab').find('.brand').hasClass('active');
34 47
35 $(this).addClass('focus').siblings().removeClass('focus'); 48 $(this).addClass('focus').siblings().removeClass('focus');
36 49
37 - // console.log(channels(gender))  
38 -  
39 -  
40 - loadData(channels(gender));  
41 - 50 + loadData(channels(gender), isBrand);
42 }) 51 })
43 52
44 // 点击字母，页面滚动到相关区域 53 // 点击字母，页面滚动到相关区域
@@ -52,6 +61,17 @@ $intercept.click(function() { @@ -52,6 +61,17 @@ $intercept.click(function() {
52 return false; 61 return false;
53 }); 62 });
54 63
  64 +$('.brand-tab').find('li').click(function() {
  65 +
  66 + $(this).addClass('active').siblings().removeClass('active');
  67 +
  68 + if ($(this).hasClass('brand')) {
  69 + $('.brand-content').removeClass('hide').siblings().addClass('hide');
  70 + } else {
  71 + $('.category-content').removeClass('hide').siblings().addClass('hide');
  72 + }
  73 +});
  74 +
55 $(function() { 75 $(function() {
56 // loadData(); 76 // loadData();
57 77
@@ -62,7 +62,7 @@ @@ -62,7 +62,7 @@
62 } 62 }
63 } 63 }
64 64
65 - .content { 65 + .content-index {
66 margin-top: 170px; 66 margin-top: 170px;
67 67
68 .search { 68 .search {
@@ -241,4 +241,109 @@ @@ -241,4 +241,109 @@
241 } 241 }
242 } 242 }
243 } 243 }
  244 +
  245 + .hide {
  246 + display: none;
  247 + }
  248 +
  249 + .category-content {
  250 + .category-container {
  251 + margin-bottom: 100px;
  252 + }
  253 +
  254 + .content {
  255 + background: #f8f8f8;
  256 + overflow: hidden;
  257 + position: relative;
  258 +
  259 + &.hide {
  260 + display: none;
  261 + }
  262 + }
  263 +
  264 + .primary-level {
  265 + float: left;
  266 + box-sizing: border-box;
  267 + width: 45%;
  268 +
  269 + > li {
  270 + height: 89px;
  271 + line-height: 89px;
  272 + padding: 0 32px;
  273 + white-space: nowrap;
  274 + overflow: hidden;
  275 + text-overflow: ellipsis;
  276 +
  277 + &.focus {
  278 + background-color: #fff;
  279 + }
  280 +
  281 + &.highlight {
  282 + background-color: #eee;
  283 + }
  284 + }
  285 + }
  286 +
  287 + .sub-level-container {
  288 + float: left;
  289 + overflow-x: auto;
  290 + box-sizing: border-box;
  291 + background: #fff;
  292 + width: 55%;
  293 + height: 100%;
  294 + }
  295 +
  296 + .sub-level {
  297 + width: 100%;
  298 +
  299 + &.hide {
  300 + display: none;
  301 + }
  302 +
  303 + > li {
  304 + box-sizing: border-box;
  305 + height: 89px;
  306 + line-height: 89px;
  307 + border-bottom: 1px solid #e6e6e6;
  308 + padding-left: 20px;
  309 +
  310 + &.highlight {
  311 + background: #eee;
  312 + }
  313 +
  314 + &:last-child {
  315 + border-bottom: none;
  316 + }
  317 + }
  318 +
  319 + a {
  320 + display: block;
  321 + height: 100%;
  322 + width: 100%;
  323 + color: #000;
  324 + }
  325 + }
  326 + }
  327 +
  328 + .resources {
  329 +
  330 + .recommend-content-five {
  331 + margin-top: -1px;
  332 + width: 100%;
  333 +
  334 + a {
  335 + height: 218px;
  336 + width: 50%;
  337 + outline: none;
  338 + color: #000;
  339 + text-decoration: none;
  340 + float: left;
  341 + }
  342 + }
  343 +
  344 + .focus-floor {
  345 + overflow: hidden;
  346 + width: 100%;
  347 + }
  348 + }
244 } 349 }