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

@@ -36,8 +36,6 @@
     "request-promise": "^3.0.0",
     "serve-favicon": "^2.3.0",
     "uuid": "^2.0.2",
-    "vue-loader": "^8.5.3",
-    "vue-touch": "^1.1.0",
     "winston": "^2.2.0",
     "winston-daily-rotate-file": "^1.1.4",
     "yoho-md5": "^2.0.0",

@@ -254,7 +254,7 @@
                 this.$set('cateNavRightData', this.cateNavLeftData ? this.cateNavLeftData[0].sub : []);
 
                 this.$set('rightAll', this.cateNavLeftData ? {
-                    sortId: this.cateNavLeftData[0].relationParameter.sort,
+                    sortId: this.cateNavLeftData[0].sub.map(sort=>sort.relationParameter.sort).join(','),
                     categoryName: this.cateNavLeftData[0].categoryName
                 } : {});
             }

@@ -29,7 +29,7 @@
     };
 </script>
 <style>
-    .header {
+    .header-wrap {
         box-sizing: content-box;
         position: fixed;
         top: 0;

 <template>
     <ul class="feature-options">
         <li v-for="item in options">
-            <button :class="{ 'button-solid': item.value &&  value.value === item.value}"
+            <button :class="isSelected(item)"
                     :disabled="item.disabled"
                     @click="selectOption(item)"
                     class="button feature-button">
@@ -50,6 +50,18 @@
             selectOption: function(opt) {
                 this.value = opt;
                 this.$parent.$emit(`feature:${this.name}.select`, opt);
+            },
+
+            isSelected(item) {
+                let bool = false;
+
+                if (this.value) {
+                    bool = this.value.value === item.value;
+                }
+
+                return {
+                    'button-solid': bool
+                };
             }
         }
     };

@@ -184,6 +184,19 @@
     module.exports = {
         init() {
         },
+        data() {
+            return {
+                colors: [],
+                sizes: [],
+                colorSizes: {},
+                thumbnails: {},
+                selection: {
+                    color: null,
+                    size: null,
+                    thumbnail: ''
+                }
+            };
+        },
         props: {
             /** 是否可见 */
             isVisible: Boolean,
@@ -224,7 +237,7 @@
                     // 缩略图
                     thumbnails[goods.colorId] = goods.colorImage;
 
-                    // 更新颜色对应尺码  生成colorId 与 size的 映射
+                    // 生成colorId 与 size的 映射
                     colorSizes[goods.colorId] = goods.goodsSizeBoList.map((size)=> {
                         if (!stocks[goods.colorId]) {
                             stocks[goods.colorId] = 0;
@@ -249,10 +262,9 @@
                                 };
 
                             }
-
-                            // 计算所有尺码的库存
-                            stocks[goods.colorId] += size.goodsSizeStorageNum;
                         }
+                        // 计算所有尺码的库存
+                        stocks[goods.colorId] += size.goodsSizeStorageNum;
 
                         return {
                             text: size.sizeName,
@@ -269,6 +281,10 @@
                     };
                 });
 
+                if (!selection.color) {
+                    this.selection.color = selection.color = this.colors[0];
+                }
+
                 this.sizes = colorSizes[selection.color.value];
                 this.colorSizes = colorSizes;
                 this.thumbnails = thumbnails;
@@ -278,19 +294,6 @@
                 this.$emit('feature:size.select', selection.size);
             }
         },
-        data() {
-            return {
-                colors: [],
-                sizes: [],
-                colorSizes: {},
-                thumbnails: {},
-                selection: {
-                    color: null,
-                    size: null,
-                    thumbnail: ''
-                }
-            };
-        },
         components: {
             featureOptions: require('./feature-options.vue')
         },
@@ -306,21 +309,26 @@
 
             // 选择颜色
             this.$on('feature:color.select', (opt)=> {
-                const selection = {
-                    color: opt,
-                    size: ((color, size)=> {
-                        // 切换颜色后选择匹配的尺码
-                        const sizes = this.colorSizes[color];
+                let setSelectedSize = function(color, size) {
+                    const sizes = self.colorSizes[color.value];
+
+                    if (!size) {
+                        let canSelectSizes = sizes.filter(item => {
+                            return item.disabled === false;
+                        });
 
+                        return canSelectSizes.length ? canSelectSizes[0] : null;
+                    } else {
+                        // 切换颜色后选择匹配的尺码
                         if (sizes && sizes.length > 0) {
                             const oldSizes = sizes.filter((item) => {
-                                return item.value === size;
+                                return item.value === size.value;
                             });
 
                             if (oldSizes && oldSizes.length > 0) {
-                                const newSizes = this.colorSizes[opt.value];
+                                const newSizes = self.colorSizes[opt.value];
 
-                                const matchedSize = newSizes.filter((item)=> {
+                                const matchedSize = newSizes.filter((item) => {
                                     return !item.disabled && item.text === oldSizes[0].text;
                                 });
 
@@ -329,9 +337,12 @@
                                 }
                             }
                         }
+                    }
+                };
 
-                        return null;
-                    })(self.selection.color.value, self.selection.size.value),
+                const selection = {
+                    color: opt,
+                    size: setSelectedSize(self.selection.color, self.selection.size),
 
                     thumbnail: this.thumbnails[opt.value]
                 };

@@ -442,7 +442,7 @@
                         productSku: selection.size.value,
                         buyNumber: 1
                     }).then((result)=> {
-                        if (yoho.goShopingKey && result.data.shopping_key) {
+                        if (yoho.goShopingKey && result.data && result.data.shopping_key) {
                             yoho.goShopingKey({shoppingKey: result.data.shopping_key});
                         }
 
@@ -450,13 +450,12 @@
                         // TODO: 商品已下架 后台暂未实现
                         if (result.code === 200) {
                             this.cartCount = result.data.goods_count;
-                            this.showFeatureSelector = false;
 
                             selector.playAnimation();
-                        } else {
-                            this.showFeatureSelector = false;
-                            tip('系统异常,请稍后重试');
-                        }
+                        } 
+
+                        this.showFeatureSelector = false;
+                        tip(result.message);
                     });
                 }
             };

 <template>
-    <div class="top-nav">
-        <a class="left no-intercept" href="javascript:void(0);" @click="yoho.goBack()">
-            <span class="icon icon-left"></span>
-        </a>
-
-        <a class="right no-intercept" href="javascript:void(0);" @click="share()">
-            <span class="icon icon-share"></span>
-        </a>
-    </div>
+    <cheader :title="sortName" class="top-nav">
+        <i class="icon icon-share" slot="right" @click="share()"></i>
+    </cheader>
 </template>
 <style>
     .top-nav {
-        position: fixed;
-        z-index: 10;
-        font-size: 50px;
-        padding: 30px;
-        width: 100%;
-        top: 40px;
-
-        .left {
-            float: left;
-        }
+        background-color: transparent;
 
-        .right {
-            float: right;
+        .header-gap {
+            display: none;
         }
-
     }
 </style>
 <script>
     const yoho = require('yoho');
+    const cheader = require('component/header.vue');
 
     module.exports = {
         data() {
@@ -41,6 +26,9 @@
             title: String,
             img: String
         },
+        components: {
+            cheader
+        },
         methods: {
             share: function() {
                 yoho.goShare({