完善 focus

@@ -2,6 +2,8 @@ const Vue = require('yoho-vue');
 const tab = require('channel/tab.vue');
 const resources = require('channel/resources.vue');
 
+require('common/vue-filter');
+
 new Vue({
     el: '#app',
     components: {

@@ -14,7 +14,7 @@ Vue.filter('resize', (value, width, height, model)=>{
         const dict = {
             '{width}': width,
             '{height}': height,
-            '{model}': model || 2
+            '{mode}': model || 2
         };
 
         return dict[$0];

 <template>
     <div class="resources">
         <template v-for="floor in resources">
-            <div class="focus" v-if="floor.focus">
-                <focus :list="floor.data"></focus>
+            <div class="focus" v-if="floor.focus" v-bind:style="{height: '182px'}">
+                <focus v-bind:list="floor.data"></focus>
             </div>
             <div class="title-image" v-if="floor.titleImage">
                 <title-image></title-image>

 <template>
-    <swipe class="my-swipe">
-        <swipe-item v-for="item in list" class="aaaa">
+    <swipe class="swipe swipe-{{list.length}}">
+        <swipe-item v-for="item in list" v-bind:style="{backgroundColor: item.bgColor}">
             <a href="{{item.url}}" title="{{item.title}}">
-                <img src="{{item.src}}">
+                <img v-bind:src="item.src | resize 750 365">
             </a>
         </swipe-item>
     </swipe>
@@ -22,5 +22,40 @@
 </script>
 
 <style>
+    .focus {
+        .swipe {
+            height: 100%;
+        }
+
+        .swipe-1 {
+            .swipe-indicators {
+                display: none;
+            }
+        }
+
+        .swipe-item {
+            img {
+                width: 100%;
+                height: 100%;
+            }
+        }
 
+        .swipe-indicators {
+            left: initial;
+            right: 20px;
+        }
+
+        .swipe-indicator {
+            width: 8px;
+            height: 8px;
+            background: #ccc;
+            opacity: 1;
+
+            &.active {
+                width: 12px;
+                height: 12px;
+                background: #fff;
+            }
+        }
+    }
 </style>

 <template>
-    <div class="focus">
+    <div class="xss">
         title-image
     </div>
 </template>