fix bug

@@ -251,7 +251,7 @@
             },
 
             categoryChangeHandler() {
-                if (!this.category.length) {
+                if (!this.category || !this.category.length) {
                     return;
                 }
 

@@ -6,7 +6,7 @@
                 <div class="brand-box" v-for="brand in item.brands">
                     <a href="{{brand.domain | brandUrl}}">
                         <div class="brand-logo">
-                            <img v-lazy="brand.logo | resize 150 150" alt="{{brand.name}}">
+                            <img v-lazy="brand.logo | resize 136 136" alt="{{brand.name}}">
                         </div>
                         <span class="brand-name">{{brand.name}}</span>
                     </a>
@@ -26,11 +26,16 @@
             background: #fff;
             padding: 0 30px;
             
+            &:not(:first-of-type) {
+                margin-top: 20px;
+            }
+
             .index {
-                padding: 18px 0;
+                height: 60px;
+                line-height: 60px;
 
                 a {
-                    font-size: 36px;
+                    font-size: 32px;
                 }
             }
         }
@@ -40,15 +45,17 @@
         }
 
         .brand-box {
-            width: 24%;
-            height: 180px;
+            width: 172px;
+            height: 162px;
             float: left;
             overflow: hidden;
             text-align: center;
-            margin: 0 0.5%;
+            margin-bottom: 20px;
 
             .brand-logo {
-                height: 150px;
+                margin: 0 auto;
+                width: 136px;
+                height: 136px;
                 overflow: hidden;
 
                 img {
@@ -57,7 +64,8 @@
             }
 
             .brand-name {
-                width: 100%;
+                width: 136px;
+                font-size: 18px;
                 color: #d0d0d0;
                 overflow: hidden;
                 white-space: nowrap;

@@ -2,9 +2,7 @@
     <div class="tab-top-fixed">
         <tab :page="page"></tab>
     </div>
-    <div class="resources">
     <resources :content-code.sync="contentCode"></resources>
-    </div>
 </template>
 <style>
     .tab-top-fixed {
@@ -16,10 +14,14 @@
     }
 
     .resources {
-        margin-top: 100px;
+        margin-top: 90px;
+
+        .recommend-content-five {
+            margin-top: -1px;
 
-        .recommend-content-five a {
-            height: 186px;
+            a {
+                height: 218px;
+            }
         }
     }
 </style>

@@ -81,6 +81,7 @@
         text-align: center;
         background: #fff;
         transform: translate(-50%, 0);
+        border-bottom: 1px solid #eee;
 
         .channel {
             display: inline-block;
@@ -99,11 +100,5 @@
                 border-bottom: 4px solid #000;
             }
         }
-
-        .focus {
-            .name {
-                border-bottom: 4px solid #000;
-            }
-        }
     }
 </style>

@@ -25,8 +25,6 @@
 
 <style>
     .focus-floor {
-        border-bottom: 1px solid #eee;
-
         .swipe {
             position: relative;
             height: 100%;

@@ -10,7 +10,6 @@
         margin: 0;
         padding: 6px 0;
         right: 0;
-        border-radius: 8px;
         background: #fff;
         opacity: 0.8;
         top: 0;