fe / yohoblk-wap · Commits

Go to a project

Authored by 沈志敏
Commit 1e1664dabbd0c2b523e0c7cdd9621f76e8024495 2 parents 8273d5ad c5d2ebec

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

Inline Side-by-side
Showing 18 changed files with 87 additions and 117 deletions
@@ -3,17 +3,17 @@ Name | Path | Note @@ -3,17 +3,17 @@ Name | Path | Note
3 -------- | ------------------------------------ | --------- 3 -------- | ------------------------------------ | ---------
4 首页 | / | 4 首页 | / |
5 侧边栏 | /sidebar | 只有 app 使用 5 侧边栏 | /sidebar | 只有 app 使用
6 -品牌列表 | /brands | 6 +品牌列表 | /brand |
7 品类 | /cate | 7 品类 | /cate |
8 全部分类 | /cate-all | 8 全部分类 | /cate-all |
9 商品列表 | /list?sort=1 | 9 商品列表 | /list?sort=1 |
10 -品牌店铺 | /product/shop?domain=sctest1 |  
11 -品牌店铺分享页面 | /product/shop-share?domain=colormad | 10 +品牌店铺 | /brand/{domain} |
  11 +品牌店铺分享页面 | /brand/share/{domain} |
12 商品详情 | /product/{productId} | 12 商品详情 | /product/{productId} |
13 新品抢先看 | /new | 13 新品抢先看 | /new |
14 搜索页 | /search?query=xxx | 14 搜索页 | /search?query=xxx |
15 -资讯列表 | /news |  
16 -资讯详情 | /news/{newsId} | 15 +资讯列表 | /editorial/list |
  16 +资讯详情 | /editorial/{newsId} |
17 个人中心 | /me | 17 个人中心 | /me |
18 个人信息 | /me/mydetails | 18 个人信息 | /me/mydetails |
19 全部订单 | /me/order?type=1 | 19 全部订单 | /me/order?type=1 |
@@ -10,11 +10,7 @@ const api = global.yoho.API; @@ -10,11 +10,7 @@ const api = global.yoho.API;
10 const brandApi = require('./brand-api'); 10 const brandApi = require('./brand-api');
11 const logger = global.yoho.logger; 11 const logger = global.yoho.logger;
12 const _ = require('lodash'); 12 const _ = require('lodash');
13 -const querystring = require('querystring');  
14 -  
15 -const urlFormat = (path, qs) => {  
16 - return path + '?' + querystring.stringify(qs);  
17 -}; 13 +const camelCase = global.yoho.camelCase;
18 14
19 /** 15 /**
20 * 处理品牌一览品牌列表数据 16 * 处理品牌一览品牌列表数据
@@ -33,8 +29,6 @@ const handleBrandList = origin => { @@ -33,8 +29,6 @@ const handleBrandList = origin => {
33 _.forEach(value, (subValue) => { 29 _.forEach(value, (subValue) => {
34 brands.push({ 30 brands.push({
35 name: subValue.brand_name, 31 name: subValue.brand_name,
36 -  
37 - // link: helpers.urlFormat('/brand', {domain: subValue.brand_domain}),  
38 link: '/product/shop?domain=' + subValue.brand_domain, 32 link: '/product/shop?domain=' + subValue.brand_domain,
39 logo: subValue.brand_ico 33 logo: subValue.brand_ico
40 }); 34 });
@@ -78,77 +72,12 @@ const getBrandListData = params => { @@ -78,77 +72,12 @@ const getBrandListData = params => {
78 * @returns {*|Promise.<TResult>} 72 * @returns {*|Promise.<TResult>}
79 */ 73 */
80 const getCateListData = params => { 74 const getCateListData = params => {
81 - let finalResult = [];  
82 - let item = {};  
83 - let oneClass = [];  
84 - let subitem = {};  
85 - let genderArr = {  
86 - MEN男士: '1,3',  
87 - WOMEN女士: '2,3',  
88 - LIFESTYLE生活: '1,2,3'  
89 - };  
90 -  
91 return brandApi.getCateListData(params).then(result => { 75 return brandApi.getCateListData(params).then(result => {
92 -  
93 - if (result.code !== 200) {  
94 - return []; 76 + if (result.code === 200) {
  77 + return camelCase(result.data);
  78 + } else {
  79 + logger.error('getCateListData api code no 200 or data is null');
95 } 80 }
96 -  
97 - _.forEach(result.data, (category, categorykey) => {  
98 - oneClass = {name: categorykey, ca: []};  
99 -  
100 - _.forEach(category, (cate) => {  
101 - item = {  
102 - id: cate.category_id,  
103 - name: cate.category_name,  
104 - sort: cate.relation_parameter.sort,  
105 - sub: []  
106 - };  
107 - if (_.isEmpty(cate.sub)) {  
108 - item.url = urlFormat('/list', {  
109 - sort: item.sort,  
110 - sort_name: item.name,  
111 - gender: genderArr[categorykey]  
112 - });  
113 - oneClass.ca.push(item);  
114 - return true;// equal continue;  
115 - }  
116 -  
117 - // 有子分类的，首先添加一级分类  
118 - item.sub.push({  
119 - id: item.id,  
120 - name: '全部' + item.name,  
121 - sort: item.sort,  
122 - url: urlFormat('/list', {  
123 - sort: item.sort,  
124 - sort_name: item.name,  
125 - gender: genderArr[categorykey]  
126 - }),  
127 - sub: []  
128 - });  
129 -  
130 - _.forEach(cate.sub, (sub) => {  
131 - subitem = {  
132 - id: sub.category_id,  
133 - name: sub.category_name,  
134 - sort: sub.relation_parameter.sort,  
135 - url: ''  
136 - };  
137 - subitem.url = urlFormat('/list', {  
138 - sort: subitem.sort,  
139 - sort_name: subitem.name,  
140 - gender: genderArr[categorykey]  
141 - });  
142 - item.sub.push(subitem);  
143 - });  
144 -  
145 - oneClass.ca.push(item);  
146 - });  
147 -  
148 - finalResult.push(oneClass);  
149 - });  
150 -  
151 - return finalResult;  
152 }); 81 });
153 }; 82 };
154 83
@@ -15,7 +15,8 @@ module.exports = { @@ -15,7 +15,8 @@ module.exports = {
15 index: (req, res) => { 15 index: (req, res) => {
16 res.render('shop/index', { 16 res.render('shop/index', {
17 module: 'product', 17 module: 'product',
18 - page: 'shop' 18 + page: 'shop',
  19 + domain: req.params[0]
19 }); 20 });
20 }, 21 },
21 22
@@ -77,7 +78,8 @@ module.exports = { @@ -77,7 +78,8 @@ module.exports = {
77 shopShare: (req, res) => { 78 shopShare: (req, res) => {
78 res.render('shop/share', { 79 res.render('shop/share', {
79 module: 'product', 80 module: 'product',
80 - page: 'shop-share' 81 + page: 'shop-share',
  82 + domain: req.params[0]
81 }); 83 });
82 } 84 }
83 }; 85 };
@@ -32,11 +32,11 @@ router.get('/list.json', productList.fetchProducts); @@ -32,11 +32,11 @@ router.get('/list.json', productList.fetchProducts);
32 // 品牌店铺页面 32 // 品牌店铺页面
33 const shop = require(`${cRoot}/shop`); 33 const shop = require(`${cRoot}/shop`);
34 34
35 -router.get('/product/shop', shop.index); // 店铺首页 35 +router.get(/\/brand\/share\/(.*)/, shop.shopShare); // 品牌店铺分享页面
  36 +router.get(/\/brand\/(.*)/, shop.index); // 店铺首页
36 router.get('/product/shop/info.json', shop.getShopInfo); // 店铺介绍 37 router.get('/product/shop/info.json', shop.getShopInfo); // 店铺介绍
37 router.post('/product/shop/goods.json', shop.getBrandShopGoods); // 店铺商品列表 38 router.post('/product/shop/goods.json', shop.getBrandShopGoods); // 店铺商品列表
38 router.post('/product/shop/collect.json', shop.collectShop); // 收藏品牌店铺 39 router.post('/product/shop/collect.json', shop.collectShop); // 收藏品牌店铺
39 -router.get('/product/shop/share', shop.shopShare); // 品牌店铺分享页面  
40 40
41 // 商品详情controller 41 // 商品详情controller
42 const detail = require(`${cRoot}/detail`); 42 const detail = require(`${cRoot}/detail`);
1 -<div id="shop"> 1 +<div id="shop" data-domain="{{domain}}">
2 <shop-box></shop-box> 2 <shop-box></shop-box>
3 </div> 3 </div>
1 -<div id="share"> 1 +<div id="share" data-domain="{{domain}}">
2 <share-box></share-box> 2 <share-box></share-box>
3 </div> 3 </div>
  1 +/*
  2 +* @Author: Targaryen
  3 +* @Date: 2016-08-02 17:29:52
  4 +* @Last Modified by: Targaryen
  5 +* @Last Modified time: 2016-08-02 17:42:26
  6 +*/
  7 +
  8 +let Vue = require('vue');
  9 +
  10 +Vue.directive('lazy-html', function(html) {
  11 + html = html.replace(/<img [^>]*src=['"]([^'"]+)[^>]*>/gi, '<img v-lazy="\'$1\'">');
  12 + this.$el.innerHTML = html;
  13 + this.$vm.$compile(this.$el);
  14 +});
@@ -50,7 +50,7 @@ Vue.filter('clothingGenderIdentity', (value) => { @@ -50,7 +50,7 @@ Vue.filter('clothingGenderIdentity', (value) => {
50 * @param value brand domain 50 * @param value brand domain
51 */ 51 */
52 Vue.filter('brandUrl', (value) => { 52 Vue.filter('brandUrl', (value) => {
53 - return `/product/shop?domain=${value}`; 53 + return `/brand/${value}`;
54 }); 54 });
55 55
56 /** 56 /**
@@ -24,11 +24,8 @@ const cate = { @@ -24,11 +24,8 @@ const cate = {
24 lifestyle: '6f7b590ed3844e680d4052fc5c4d98ad' 24 lifestyle: '6f7b590ed3844e680d4052fc5c4d98ad'
25 }; 25 };
26 26
27 -/* TODO 资讯列表资源位 */  
28 const editorial = { 27 const editorial = {
29 - all: 'd4fdfcad1ec877d466d9780efaf4d296',  
30 - men: 'e1f8dce8cb9de1a0977479c13c4d3dcc',  
31 - women: '5c0b9963d8b75e6fd788a2b49402be14' 28 + all: '87e3b7ff41132fde5e061fb1c3899f84'
32 }; 29 };
33 30
34 module.exports = { 31 module.exports = {
@@ -3,11 +3,14 @@ const lazyload = require('vue-lazyload'); @@ -3,11 +3,14 @@ const lazyload = require('vue-lazyload');
3 3
4 const app = require('editorial/detail.vue'); 4 const app = require('editorial/detail.vue');
5 5
  6 +require('common/vue-filter');
  7 +require('common/vue-directive');
  8 +
  9 +Vue.use(lazyload);
  10 +
6 new Vue({ 11 new Vue({
7 el: '#app', 12 el: '#app',
8 components: { 13 components: {
9 app 14 app
10 } 15 }
11 }); 16 });
12 -  
13 -Vue.use(lazyload);  
@@ -3,7 +3,7 @@ @@ -3,7 +3,7 @@
3 <div class="cate-nav clearfix"> 3 <div class="cate-nav clearfix">
4 <ul> 4 <ul>
5 <li v-for="(index, cate) in brandCate" v-on:click='cateNavTopFun(index)' v-bind:class="{focus: index === topcurrent}" v-bind:style="{width: widthli + '%'}"> 5 <li v-for="(index, cate) in brandCate" v-on:click='cateNavTopFun(index)' v-bind:class="{focus: index === topcurrent}" v-bind:style="{width: widthli + '%'}">
6 - <span>{{cate.name}}</span> 6 + <span>{{index}}</span>
7 </li> 7 </li>
8 </ul> 8 </ul>
9 </div> 9 </div>
@@ -11,13 +11,14 @@ @@ -11,13 +11,14 @@
11 <div class="content" style="height: 522px;"> 11 <div class="content" style="height: 522px;">
12 <ul class="primary-level"> 12 <ul class="primary-level">
13 <li v-for="(index, ca) in cateNavLeftData" v-bind:class="{focus: index === leftcurrent}" class="p-level-item" v-on:click='cateNavLeftFun(index)'> 13 <li v-for="(index, ca) in cateNavLeftData" v-bind:class="{focus: index === leftcurrent}" class="p-level-item" v-on:click='cateNavLeftFun(index)'>
14 - <a href="{{ca.url}}">{{ca.name}}</a> 14 + <a v-if="ca.sub" href="/list?sort={{ca.categoryId}}&sort_name={{ca.categoryName}}&gender={{gender}}">{{ca.categoryName}}</a>
  15 + <a v-else="ca.sub">{{ca.categoryName}}</a>
15 </li> 16 </li>
16 </ul> 17 </ul>
17 <div class="sub-level-container"> 18 <div class="sub-level-container">
18 <ul class="sub-level"> 19 <ul class="sub-level">
19 <li v-for="sub in cateNavRightData"> 20 <li v-for="sub in cateNavRightData">
20 - <a href="{{sub.url}}">{{sub.name}}</a> 21 + <a href="/list?sort={{sub.categoryId}}&sort_name={{sub.categoryName}}&gender={{gender}}">{{sub.categoryName}}</a>
21 </li> 22 </li>
22 </ul> 23 </ul>
23 </div> 24 </div>
@@ -202,6 +203,12 @@ @@ -202,6 +203,12 @@
202 const contentCode = require('content-code'); 203 const contentCode = require('content-code');
203 const qs = require('yoho-qs'); 204 const qs = require('yoho-qs');
204 205
  206 + const genderCode = {
  207 + MEN男士: '1,3',
  208 + WOMEN女士: '2,3',
  209 + LIFESTYLE生活: '1,2,3'
  210 + };
  211 +
205 module.exports = { 212 module.exports = {
206 props: [], 213 props: [],
207 data() { 214 data() {
@@ -210,9 +217,10 @@ @@ -210,9 +217,10 @@
210 cateNavLeftData: [], 217 cateNavLeftData: [],
211 cateNavRightData: [], 218 cateNavRightData: [],
212 topcurrent: 0, 219 topcurrent: 0,
213 - widthli: 25, 220 + widthli: 33.33,
214 leftcurrent: 0, 221 leftcurrent: 0,
215 page: 'cate', 222 page: 'cate',
  223 + gender: '1,2,3',
216 contentCode: contentCode.brand[qs.channel || 'men'] 224 contentCode: contentCode.brand[qs.channel || 'men']
217 }; 225 };
218 }, 226 },
@@ -226,11 +234,10 @@ @@ -226,11 +234,10 @@
226 url: '/cate/list.json', 234 url: '/cate/list.json',
227 data: data 235 data: data
228 }).then(result => { 236 }).then(result => {
229 - if (result.length > 0) { 237 + if (result) {
230 this.brandCate = result; 238 this.brandCate = result;
231 - this.widthli = 100 / result.length;  
232 - this.cateNavLeftData = this.brandCate[0].ca;  
233 - this.cateNavRightData = this.cateNavLeftData[0].sub; 239 + this.cateNavLeftData = result['MEN男士'];
  240 + this.cateNavRightData = result['MEN男士'][0].sub;
234 } 241 }
235 }).fail(() => { 242 }).fail(() => {
236 tip('网络错误'); 243 tip('网络错误');
@@ -238,7 +245,8 @@ @@ -238,7 +245,8 @@
238 }, 245 },
239 cateNavTopFun(index) { 246 cateNavTopFun(index) {
240 this.topcurrent = index; 247 this.topcurrent = index;
241 - this.cateNavLeftData = this.brandCate[index].ca; 248 + this.gender = genderCode[index];
  249 + this.cateNavLeftData = this.brandCate[index];
242 this.cateNavRightData = this.cateNavLeftData[0].sub; 250 this.cateNavRightData = this.cateNavLeftData[0].sub;
243 }, 251 },
244 cateNavLeftFun(index) { 252 cateNavLeftFun(index) {
@@ -14,7 +14,7 @@ @@ -14,7 +14,7 @@
14 </div> 14 </div>
15 </div> 15 </div>
16 </div> 16 </div>
17 - <index-list v-bind:index-list="indexList"></index-list> 17 + <index-list class="index-list" v-bind:index-list="indexList"></index-list>
18 </template> 18 </template>
19 <style> 19 <style>
20 .brand-list-box { 20 .brand-list-box {
@@ -53,6 +53,10 @@ @@ -53,6 +53,10 @@
53 } 53 }
54 } 54 }
55 } 55 }
  56 +
  57 + .index-list {
  58 + top: 40px;
  59 + }
56 </style> 60 </style>
57 <script> 61 <script>
58 const $ = require('jquery'); 62 const $ = require('jquery');
1 <template> 1 <template>
2 - <div v-if="block.text" class="text-block">  
3 - {{{block.text.data.text}}} 2 + <div v-if="block.text" class="text-block a" v-lazy-html="block.text.data.text">
4 </div> 3 </div>
5 4
6 <div v-if="block.singleImage"> 5 <div v-if="block.singleImage">
@@ -8,7 +7,7 @@ @@ -8,7 +7,7 @@
8 <a :href="item.url"> 7 <a :href="item.url">
9 <img :title="item.title" 8 <img :title="item.title"
10 :alt="item.alt" 9 :alt="item.alt"
11 - :src="item.src | resize 750 469" width="375"/> 10 + v-lazy="item.src | resize 750 469" width="375"/>
12 </a> 11 </a>
13 </div> 12 </div>
14 </div> 13 </div>
@@ -182,8 +182,6 @@ @@ -182,8 +182,6 @@
182 const $ = require('jquery'); 182 const $ = require('jquery');
183 const yoho = require('yoho'); 183 const yoho = require('yoho');
184 184
185 -  
186 - require('common/vue-filter');  
187 module.exports = { 185 module.exports = {
188 components: { 186 components: {
189 'content-block': require('./content-block.vue'), 187 'content-block': require('./content-block.vue'),
@@ -40,6 +40,11 @@ @@ -40,6 +40,11 @@
40 font-size: 32px; 40 font-size: 32px;
41 font-weight: 700; 41 font-weight: 700;
42 padding: 10px 20px; 42 padding: 10px 20px;
  43 + text-overflow: ellipsis;
  44 + overflow-y: hidden;
  45 + display: -webkit-box;
  46 + -webkit-line-clamp: 2;
  47 + -webkit-box-orient: vertical;
43 } 48 }
44 49
45 .editorial-des { 50 .editorial-des {
@@ -77,7 +82,7 @@ @@ -77,7 +82,7 @@
77 module.exports = { 82 module.exports = {
78 data() { 83 data() {
79 return { 84 return {
80 - contentCode: contentCode.editorial[qs.channel || 'all'], 85 + contentCode: contentCode.editorial.all,
81 editorialList: [], 86 editorialList: [],
82 page: 0, 87 page: 0,
83 scrollDisabled: false 88 scrollDisabled: false
@@ -49,11 +49,13 @@ @@ -49,11 +49,13 @@
49 } 49 }
50 </style> 50 </style>
51 <script> 51 <script>
  52 + const $ = require('jquery');
52 const shareBottom = require('component/tool/share-bottom.vue'); 53 const shareBottom = require('component/tool/share-bottom.vue');
53 - const qs = require('yoho-qs');  
54 const tip = require('common/tip'); 54 const tip = require('common/tip');
55 const share = require('common/share'); 55 const share = require('common/share');
56 56
  57 + const $share = $('#share');
  58 +
57 module.exports = { 59 module.exports = {
58 60
59 data() { 61 data() {
@@ -77,7 +79,7 @@ @@ -77,7 +79,7 @@
77 getShopInfo() { 79 getShopInfo() {
78 $.get({ 80 $.get({
79 url: '/product/shop/info.json', 81 url: '/product/shop/info.json',
80 - data: { domain: qs.domain } 82 + data: { domain: $share.data('domain') }
81 }).done(result => { 83 }).done(result => {
82 this.shopInfo = result; 84 this.shopInfo = result;
83 }).fail(() => { 85 }).fail(() => {
@@ -22,6 +22,8 @@ @@ -22,6 +22,8 @@
22 const goodsList = require('component/product/list.vue'); 22 const goodsList = require('component/product/list.vue');
23 const filter = require('component/product/filter.vue'); 23 const filter = require('component/product/filter.vue');
24 24
  25 + const $shop = $('#shop');
  26 +
25 const shareSubTitle = '我在BLK发现了一个不错的品牌，赶快来看看吧！'; 27 const shareSubTitle = '我在BLK发现了一个不错的品牌，赶快来看看吧！';
26 let locationQuery = qs(decodeURIComponent(location.search.replace(/^\?/, ''))); 28 let locationQuery = qs(decodeURIComponent(location.search.replace(/^\?/, '')));
27 29
@@ -39,7 +41,9 @@ @@ -39,7 +41,9 @@
39 // query 41 // query
40 url: '/product/shop/goods.json', 42 url: '/product/shop/goods.json',
41 sort: '', 43 sort: '',
42 - filter: {}, 44 + filter: {
  45 + domain: $shop.data('domain')
  46 + },
43 page: 0, // page= 0 未搜索, 1 并且productList.length =0 没有数据, page = page_total 全部加载完 47 page: 0, // page= 0 未搜索, 1 并且productList.length =0 没有数据, page = page_total 全部加载完
44 totalPage: 3, 48 totalPage: 3,
45 49
@@ -67,7 +71,7 @@ @@ -67,7 +71,7 @@
67 $.get({ 71 $.get({
68 url: '/product/shop/info.json', 72 url: '/product/shop/info.json',
69 data: { 73 data: {
70 - domain: locationQuery.domain 74 + domain: $shop.data('domain')
71 } 75 }
72 }).done(result => { 76 }).done(result => {
73 if (result) { 77 if (result) {
@@ -76,7 +80,7 @@ @@ -76,7 +80,7 @@
76 this.shareData = { 80 this.shareData = {
77 title: result.shopName, 81 title: result.shopName,
78 des: shareSubTitle, 82 des: shareSubTitle,
79 - url: '/product/shop/share?domain=' + locationQuery.domain, 83 + url: '/brand/share/' + $shop.data('domain'),
80 img: result.shopBg, 84 img: result.shopBg,
81 isBlkShop: result.isBlkShop, 85 isBlkShop: result.isBlkShop,
82 domain: locationQuery.domain, 86 domain: locationQuery.domain,
@@ -148,7 +152,6 @@ @@ -148,7 +152,6 @@
148 bus.$on('sort.change', ({ 152 bus.$on('sort.change', ({
149 val 153 val
150 }) => { 154 }) => {
151 - console.log(val);  
152 this.sort = val; 155 this.sort = val;
153 }); 156 });
154 157
@@ -17,7 +17,7 @@ @@ -17,7 +17,7 @@
17 height: 80px; 17 height: 80px;
18 padding: 10px 20px; 18 padding: 10px 20px;
19 position: fixed; 19 position: fixed;
20 - top: 40px; 20 + top: 0;
21 left: 0; 21 left: 0;
22 z-index: 99; 22 z-index: 99;
23 color: #fff; 23 color: #fff;
@@ -55,6 +55,12 @@ @@ -55,6 +55,12 @@
55 top: 0; 55 top: 0;
56 padding: 55px 20px 10px; 56 padding: 55px 20px 10px;
57 } 57 }
  58 +
  59 + .ios {
  60 + .top-box {
  61 + top: 40px;
  62 + }
  63 + }
58 </style> 64 </style>
59 65
60 <script> 66 <script>