Merge remote-tracking branch 'origin/develop' 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));
         }
 

@@ -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);
     }
 }

 <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;

 <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>

@@ -130,7 +130,7 @@
                     title: title,
                     des: des,
                     img: img,
-                    url: `//m.yohoblk.com/editorial/${id}.html`
+                    url: `http://m.yohoblk.com/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: `http://m.yohoblk.com/editorial/${this.article.id}.html`
                 });
             }
         },