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

@@ -55,7 +55,7 @@ const getBrandListData = params => {
     let finalResult = {};
 
     return brandApi.getBrandListOriginData(params).then(result => {
-        if (result.data) {
+        if (result && result.data) {
             Object.assign(finalResult, handleBrandList(result.data.all_list));
         }
 

@@ -12,7 +12,7 @@ const helpers = global.yoho.helpers;
  */
 const component = {
     index: (req, res, next) => {
-        const uid = req.user.uid;
+        const uid = req.user.uid || '6228593';
 
         if (!uid && req.xhr) {
             return res.json({

 'use strict';
 const api = global.yoho.API;
 const serviceAPI = global.yoho.ServiceAPI;
+const favApi = global.yoho.FavAPI;
 const Promise = require('bluebird');
 const helpers = global.yoho.helpers;
 
@@ -46,6 +47,11 @@ const _getInfoNumData = (uid) => {
         method: 'app.address.gethidden' // 用户地址的数据
     }, {
         code: 200
+    }), favApi.get('brower', {
+        method: 'app.favorite.getFavoriteCount', // 获取用户收藏商品总数
+        uid: uid
+    }, {
+        code: 200
     })]).then(data => {
         const res = {
             wait_pay_num: '',
@@ -66,6 +72,13 @@ const _getInfoNumData = (uid) => {
             }
         }
 
+        // 收藏商品数另外调接口
+        if (data[2] && data[2].data && data[2].data.product_favorite_total > 0) {
+            res.product_favorite_total = data[2].data.product_favorite_total > 99 ? '99+' :
+                data[2].data.product_favorite_total;
+        }
+
+
         return Object.assign(res, {
             address_num: data[1].data && data[1].data.length ? data[1].data.length : ''
         });

@@ -22,7 +22,8 @@ module.exports = {
         // service: 'http://service-test1.yohops.com:9999/'
 
         api: 'http://dev-api.yohops.com:9999/',
-        service: 'http://dev-service.yohops.com:9999/'
+        service: 'http://dev-service.yohops.com:9999/',
+        favApi: 'http://192.168.102.31:8092/'
     },
     subDomains: {
         host: '.m.yohoblk.com',
@@ -74,7 +75,8 @@ if (isProduction) {
         appName: 'm.yohoblk.com',
         domains: {
             api: 'http://api.yoho.yohoops.org/',
-            service: 'http://service.yoho.yohoops.org/'
+            service: 'http://service.yoho.yohoops.org/',
+            favApi: 'http://192.168.102.31:8092/'
         },
         memcache: {
             master: ['memcache1.yohoops.org:12111', 'memcache2.yohoops.org:12111', 'memcache3.yohoops.org:12111'],
@@ -94,7 +96,8 @@ if (isProduction) {
             // service: 'http://dev-service.yohops.com:9999/'
 
             api: 'http://api-test1.yohops.com:9999/',
-            service: 'http://service-test1.yohops.com:9999/'
+            service: 'http://service-test1.yohops.com:9999/',
+            favApi: 'http://192.168.102.31:8092/'
         },
         memcache: {
             master: ['127.0.0.1:12111'],

@@ -39,7 +39,7 @@
     "winston": "^2.2.0",
     "winston-daily-rotate-file": "^1.1.4",
     "yoho-md5": "^2.0.0",
-    "yoho-node-lib": "0.0.34"
+    "yoho-node-lib": "0.0.37"
   },
   "devDependencies": {
     "autoprefixer": "^6.4.0",
@@ -70,6 +70,7 @@
     "postcss-crip": "^2.0.0",
     "postcss-position": "^0.5.0",
     "postcss-pxtorem": "^3.3.1",
+    "postcss-scss": "^0.1.9",
     "postcss-short": "^1.4.0",
     "postcss-sprites": "^3.3.0",
     "postcss-use": "^2.2.0",

@@ -39,9 +39,6 @@ const dist = {
     font: `${distRoot}/assets/font`
 };
 
-// webpack 内嵌的样式中的雪碧图，写文件的时候会有冲突，这边使用单实例
-let postcssSprites;
-
 /**
  * postcss plugins for both dev and pro
  * @parem et Symbol
@@ -96,12 +93,9 @@ const postcssPlugin = (et) => {
         });
     }
 
-    if (!postcssSprites) {
-        postcssSprites = require('postcss-sprites').default(sprites);
-    }
     plugins = [
         require('precss'),
-        postcssSprites,
+        require('postcss-sprites').default(sprites),
         require('postcss-assets')(assets),
         require('postcss-calc'),
         require('postcss-pxtorem')({
@@ -149,7 +143,9 @@ gulp.task('dist', ['ge'], () => {
 gulp.task('postcss-dev', () => {
     return gulp.src('scss/index.css')
         .pipe(sourcemaps.init())
-        .pipe(postcss(postcssPlugin(env.dev)))
+        .pipe(postcss(postcssPlugin(env.dev), {
+            parser: require('postcss-scss')
+        }))
         .pipe(sourcemaps.write('.'))
         .pipe(gulp.dest('css/'));
 });
@@ -177,7 +173,9 @@ gulp.task('font', () => {
 // postcss compile in pro
 gulp.task('postcss', ['assets'], () => {
     return gulp.src('scss/index.css')
-        .pipe(postcss(postcssPlugin(env.pro)))
+        .pipe(postcss(postcssPlugin(env.pro), {
+            parser: require('postcss-scss')
+        }))
         .pipe(cssnano({
             safe: true
         }))
@@ -189,7 +187,12 @@ gulp.task('webpack-dev-server', () => {
     const devConfig = Object.assign({}, webpackConfig, {
         devtool: '#inline-source-map',
         vue: {
-            postcss: postcssPlugin(env.dev),
+            postcss: {
+                plugins: postcssPlugin(env.dev),
+                options: {
+                    parser: require('postcss-scss')
+                }
+            },
             autoprefixer: false,
             loaders: {
                 css: ExtractTextPlugin.extract(['css?-url'])
@@ -219,7 +222,12 @@ gulp.task('webpack-dev-server', () => {
 gulp.task('webpack', ['assets'], (done) => {
     const proConfig = Object.assign({}, webpackConfig, {
         vue: {
-            postcss: postcssPlugin(env.pro),
+            postcss: {
+                plugins: postcssPlugin(env.dev),
+                options: {
+                    parser: require('postcss-scss')
+                }
+            },
             autoprefixer: false,
             loaders: {
                 css: ExtractTextPlugin.extract(['css?-url'])

@@ -7,9 +7,9 @@
 *,
 *:before,
 *:after {
+    box-sizing: border-box;
     margin: 0;
     padding: 0;
-    box-sizing: border-box;
     -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 }
 
@@ -44,8 +44,8 @@ ul {
     position: relative;
     margin-right: auto;
     margin-left: auto;
-    width: 100%;
     max-width: 750px;
+    width: 100%;
 }
 
 .text-center {
@@ -79,21 +79,37 @@ ul {
 
 .ellipsis {
     overflow: hidden;
-    white-space: nowrap;
     text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+img[lazy] {
+    transition: all 200ms;
+}
+
+img[lazy=loading] {
+    opacity: 0.2;
+}
+
+img[lazy=error] {
+    opacity: 0;
+}
+
+img[lazy=loaded] {
+    opacity: 1;
 }
 
 @define-mixin line-clamp {
     display: -webkit-box;
-    -webkit-box-orient: vertical;
     overflow: hidden;
     word-break: break-all;
+    -webkit-box-orient: vertical;
 }
 
 @for $i from 1 to 3 {
     .line-clamp-$i { /* stylelint-disable-line */
-        -webkit-line-clamp: $(i);
-
         @mixin line-clamp ;
+
+        -webkit-line-clamp: $(i);
     }
 }

 @charset "utf-8";
+
 @import "common/index";
 @import "example/index";
 @import "me/index";

@@ -19,10 +19,15 @@
 <style>
     .brand-list-box {
         width: 100%;
+        padding: 0 30px;
 
         .per-brand-box {
             .index {
-                padding: 20px;
+                padding: 18px 0;
+
+                a {
+                    font-size: 36px;
+                }
             }
         }
 

@@ -19,10 +19,11 @@
             background-color: #fff;
             text-align: center;
             color: #b0b0b0;
-            height: 55px;
+            height: 56px;
             width: 92%;
             font-size: 28px;
             padding: 5px 0;
+            border-radius: 8px;
         }
 
     }

 <template>
     <div v-if="channel.length" class="channel-tab">
-        <div class="channel" v-for="(index, item) in channel" v-bind:class="{focus: index === current}" v-on:click="changeChannel(index)" v-bind:style="{width: (1 / channel.length) * 100 + '%'}">
+        <div class="channel ellipsis" v-for="(index, item) in channel" v-bind:class="{focus: index === current}" v-on:click="changeChannel(index)" v-bind:style="{width: (1 / channel.length) * 100 + '%'}">
             <span class="name">{{item.name | uppercase}}</span>
         </div>
     </div>
@@ -76,7 +76,7 @@
         width: 100%;
         max-width: 750px;
         height: 90px;
-        font-size: 24px;
+        font-size: 26px;
         text-align: center;
         background: #fff;
         transform: translate(-50%, 0);
@@ -84,7 +84,7 @@
         .channel {
             display: inline-block;
             line-height: 90px;
-            color: #999;
+            color: #b0b0b0;
 
             &.focus {
                 color: #000;
@@ -92,7 +92,7 @@
         }
 
         .name {
-            padding: 9px 0;
+            padding: 12px 0;
 
             &.focus {
                 border-bottom: 4px solid #000;

@@ -36,7 +36,7 @@
         right: 0;
         left: 0;
         z-index: 210;
-        padding: 20px 30px;
+        padding: 20px 34px;
         height: 70px;
         max-width: 750px;
         margin-left: auto;
@@ -44,6 +44,7 @@
         line-height: 70px;
         font-size: 48px;
         background-color: #fff;
+        border-bottom: 1px solid #eee;
         color: #000;
 
         .icon,
@@ -57,6 +58,7 @@
         text-align: center;
         margin-left: auto;
         margin-right: auto;
+        font-size: 42px;
         overflow: hidden;
         white-space: nowrap;
         text-overflow: ellipsis;
@@ -68,14 +70,10 @@
 
     .blk-header-right {
         float: right;
-
-        .icon {
-            margin-left: 30px;
-        }
     }
 
     .blk-header-gap {
-        height: 100px;
+        height: calc(70 + 20 * 2 + 1)px;
         background-color: transparent;
     }
 
@@ -85,7 +83,7 @@
         }
 
         .blk-header-gap {
-            height: calc(70 + 60 + 10)px;
+            height: calc(70 + 20 * 2 + 40 + 1)px;
         }
     }
 </style>

@@ -11,8 +11,10 @@
                     <h2 class="card-label">
                         <a href="{{item | goodsUrl}}" class="line-clamp-2">{{item.productName}}</a>
                     </h2>
-                    <span class="good-price" :class="{'old-price': item.marketPrice}" v-if="item.marketPrice">¥ {{item.marketPrice | toFixed}}</span>
-                    <span class="good-price" :class="{'sale-price': item.marketPrice}">¥ {{item.salesPrice | toFixed}}</span>
+                    <div class="good-price-box clearfix">
+                        <span class="good-price" :class="{'old-price': item.marketPrice}" v-if="item.marketPrice">¥ {{item.marketPrice | toFixed}}</span>
+                        <span class="good-price" :class="{'sale-price': item.marketPrice}">¥ {{item.salesPrice | toFixed}}</span>
+                    </div>
                 </div>
             </li>
         </ul>
@@ -73,13 +75,16 @@
             float: left;
             width: 372px;
             margin-right: 6px;
+
             &:nth-child(2n) {
                 margin-right: 0;
             }
         }
+
         .card-pic {
             width: 100%;
             height: 499px;
+
             a,
             img {
                 display: block;
@@ -87,6 +92,7 @@
                 height: 100%;
             }
         }
+
         .card-bd {
             min-height: 180px;
             margin-left: 30px;
@@ -95,6 +101,7 @@
             text-align: center;
             font-size: 24px;
         }
+
         .card-label {
             margin: 0 0 10px;
             font-size: 24px;
@@ -103,17 +110,21 @@
         }
     }
 
+    .good-price-box {
+        white-space: nowrap;
+    }
+
     .good-price {
+        display: inline-block;
+        width: 50%;
         color: #b0b0b0;
-        margin-right: 10px;
-        &:last-of-type {
-            margin-right: 0;
-        }
+
         &.old-price {
             text-decoration: line-through;
         }
+
         &.sale-price {
-            color: $red;
+            color: #d0021b;
         }
     }
 
@@ -122,6 +133,7 @@
         margin-top: 380px;
         color: #b0b0b0;
         text-align: center;
+
         .icon-search {
             display: inline-block;
             font-size: 200px;

@@ -51,6 +51,7 @@ module.exports = {
     margin: 0;
     padding: 25px 0;
     color: $grey;
+    background-color: #fff;
 }
 
 .order-item {
@@ -59,6 +60,7 @@ module.exports = {
     width: 25%;
     float: left;
     text-align: center;
+
     &:after {
         content: "|";
         position: absolute;
@@ -66,12 +68,15 @@ module.exports = {
         color: $grey;
         font-size: 28px;
     }
+
     &:last-of-type:after {
         display: none;
     }
+
     .order-name {
         font-size: 28px;
     }
+
     .order-icon {
         position: relative;
         margin-left: 10px;
@@ -82,6 +87,7 @@ module.exports = {
             top: 0;
         }
     }
+
     &.active {
         color: $black;
     }

 <template>
-    <div class="focus">
+    <div class="focus-floor">
         <swipe class="swipe swipe-{{floor.length}}">
             <swipe-item v-for="item in floor" v-bind:style="{backgroundColor: item.bgColor}">
                 <a href="{{item.url}}" title="{{item.title}}">
@@ -24,8 +24,11 @@
 </script>
 
 <style>
-    .focus {
+    .focus-floor {
+        border-bottom: 1px solid #eee;
+
         .swipe {
+            position: relative;
             height: 100%;
         }
 
@@ -39,6 +42,7 @@
             a {
                 display: block;
             }
+
             img {
                 width: 100%;
                 height: 100%;
@@ -47,7 +51,7 @@
 
         .swipe-indicators {
             left: initial;
-            right: 20px;
+            right: -30px;
         }
 
         .swipe-indicator {

@@ -31,8 +31,10 @@
             position: absolute;
             top: 0;
             right: 0;
-            width: 100px;
+            max-width: 200px;
             height: 100px;
+            padding: 0 30px 0 0;
+            overflow: hidden;
         }
     }
 </style>

@@ -6,7 +6,7 @@
 <style>
     .list-box {
         position: fixed;
-        width: 45px;
+        width: 30px;
         margin: 0;
         padding: 6px 0;
         right: 0;

@@ -49,7 +49,7 @@
         </div>
     </div>
 </template>
-<style class="scss">
+<style>
     $bgcolor: #fff;
 
     .editorial-page {

@@ -4,7 +4,7 @@
         <div v-for="editorial in editorialList" class="editorial-box">
             <div class="img">
                 <a href='{{"/editorial/" + editorial.id + ".html"}}'>
-                    <img v-lazy="editorial.src | resize 750 470" alt="" />
+                    <img v-lazy="editorial.src | resize 750 469" alt="" />
                 </a>
             </div>
             <div class="title"><a class="line-clamp-2" href='{{"/editorial/" + editorial.id + ".html"}}'>{{editorial.title}}</a></div>
@@ -37,7 +37,8 @@
 
         .title {
             background: #fff;
-            font-size: 32px;
+            font-size: 42px;
+            line-height: 43px;
             font-weight: 700;
             padding: 10px 20px;
         }
@@ -45,7 +46,9 @@
         .editorial-des {
             background: #fff;
             padding: 10px 20px;
-            color: #939393;
+            color: #b0b0b0;
+            font-size: 28px;
+            line-height: 32px;
         }
 
         hr {
@@ -56,7 +59,8 @@
         .bottom {
             padding: 10px 20px;
             background: #fff;
-            color: #939393;
+            color: #b0b0b0;
+            font-size: 24px;
 
             .share {
                 float: right;
@@ -78,7 +82,7 @@
             return {
                 contentCode: contentCode.editorial.all,
                 editorialList: [],
-                page: 0,
+                page: 1,
                 scrollDisabled: false,
                 channel: qs.channel
             };
@@ -109,8 +113,12 @@
                         } else if (result.data.list.length > 0) {
                             this.editorialList = result.data.list;
                         }
-                        this.page++;
-                        this.scrollDisabled = false;
+
+                        // 如果未加载完，继续翻页加载
+                        if (result.data.list.length > 0) {
+                            this.page++;
+                            this.scrollDisabled = false;
+                        }
                     } else {
                         tip('没有了...');
                     }
@@ -120,13 +128,13 @@
             },
 
             /* 分享资讯 */
-            share(title, des, img, url) {
+            share(title, des, img, id) {
                 img = util.getImgUrl(img, 300, 300, 2);
                 yoho.goShare({
                     title: title,
                     des: des,
                     img: img,
-                    url: `//m.yohoblk.com/editorial/${id}.html`
+                    url: `${location.origin}/editorial/${id}.html`
                 });
             }
         },

@@ -95,7 +95,7 @@
                     title: this.article.articleTitle,
                     des: '优质精选,BLK潮流资讯为你呈现',
                     img: util.getImgUrl(this.article.coverImage, 300, 300, 2),
-                    url: `//m.yohoblk.com/editorial/${this.article.id}.html`
+                    url: `${location.origin}/editorial/${this.article.id}.html`
                 });
             }
         },

@@ -7,6 +7,7 @@
     .top-nav {
         .blk-header {
             background-color: transparent;
+            border-bottom: 0;
         }
 
         .blk-header-gap {

@@ -3,7 +3,6 @@
         <cheader title="新品抢先看">
             <i class="icon icon-filter" slot="right" @click="openFilter"></i>
         </cheader>
-        <order :config="orderConfig" :val="order" v-if="enableOrder"></order>
         <List :data="productList"  :empty="empty"></List>
         <Filter :config="filterConfig" action="/product/list.json" v-ref:filter></Filter>
     </div>
@@ -17,7 +16,6 @@
     const bus = require('common/vue-bus');
     const tip = require('common/tip');
     const cheader = require('component/header.vue');
-    const order = require('component/product/order.vue');
     const list = require('component/product/list.vue');
     const filter = require('component/product/filter.vue');
 
@@ -32,12 +30,10 @@
         data: function() {
             return {
                 sortName: locationQuery.sort_name,
-                orderConfig: [],
                 filterConfig: null,
 
                 // query
                 url: '/product/new.json',
-                order: '',
                 filter: {},
                 page: 0, // 未搜索 page=0; 全部加载完 page = totalPage; 无数据: page !=0 && productList.length=0
                 totalPage: null,
@@ -46,8 +42,7 @@
                 productList: [],
 
                 // state
-                inSearching: false, // 请求中
-                enableOrder: false
+                inSearching: false // 请求中
             };
         },
         computed: {
@@ -58,7 +53,6 @@
         components: {
             cheader,
             list,
-            order,
             filter
         },
         methods: {
@@ -78,7 +72,6 @@
 
                 this.inSearching = true;
                 return $.get(this.url, Object.assign({
-                    order: this.order,
                     page: nextPage
                 }, this.filter, locationQuery))
                     .done(res => {
@@ -118,10 +111,6 @@
             }
         },
         watch: {
-            /* order 和 filter 改变 都会触发 重新搜索 */
-            order: function() {
-                this.research();
-            },
             filter: function() {
                 this.research();
             }
@@ -135,11 +124,6 @@
                 self.search();
             });
 
-            bus.$on('order.change', function({val}) {
-                console.log(val);
-                self.order = val;
-            });
-
             /**
              * 筛选组件 筛选值变更，触发 filter.change事件
              *  1. 重新搜索
@@ -158,12 +142,7 @@
                 self.$refs.filter.isVisible = false;
             });
 
-            this.search()
-                .then(()=>{
-                    if (self.productList.length) {
-                        self.enableOrder = true;
-                    }
-                });
+            this.search();
         }
     };
 

@@ -14,6 +14,7 @@
         .blk-header {
             background-color: transparent;
             color: #fff;
+            border-bottom: 0;
         }
 
         .blk-header-gap {
@@ -116,7 +117,7 @@
         },
         created() {
             this.domain = this.shareData.domain;
-            window.onscroll = this.changeTopStatus.bind(this);
+            window.onscroll = this.changeTopStatus;
         }
     };
 </script>