fix

@@ -138,6 +138,12 @@ export default {
         this.sortItem = item;
         this.sortItem = item;
         let id = item.id;
         let id = item.id;
         let name = item.name;
         let name = item.name;
+        let subList ;
+        if (id === '-1') {
+          subList = this.fetchBrandList({ id });
+        } else {
+          subList = this.fetchCategorySubList({ id, name });
+        }
 
 
         this.$store.dispatch('reportYas', {
         this.$store.dispatch('reportYas', {
           params: {
           params: {
@@ -148,13 +154,7 @@ export default {
             }
             }
           }
           }
         });
         });
-        this.reportYas(scrollHeight);
-        let subList ;
-        if (id === '-1') {
-          subList = this.fetchBrandList({ id });
-        } else {
-          subList = this.fetchCategorySubList({ id, name });
-        }
+        this.reportYas();
       }
       }
     },
     },
     goProductList(item, index, itemSub) {
     goProductList(item, index, itemSub) {

@@ -112,15 +112,17 @@ export default {
   computed: {
   computed: {
     ...mapState(['channelList']),
     ...mapState(['channelList']),
     navList() {
     navList() {
-      this.$nextTick(() => {
-        this.refreshProductList(this.active);
-      });
       return get(find(this.channelList.list, ['template_name', 'guessLike']), 'data') || [];
       return get(find(this.channelList.list, ['template_name', 'guessLike']), 'data') || [];
     }
     }
   },
   },
   watch: {
   watch: {
     'channelList.list': function() {
     'channelList.list': function() {
       this.init();
       this.init();
+    },
+    navList() {
+      this.$nextTick(() => {
+        this.refreshProductList(this.active);
+      });
     }
     }
   },
   },
   activated() {
   activated() {
@@ -140,6 +142,9 @@ export default {
   async serverPrefetch() {
   async serverPrefetch() {
     return this.fetchChannelList();
     return this.fetchChannelList();
   },
   },
+  mounted() {
+    this.refreshProductList(this.active);
+  },
   methods: {
   methods: {
     ...mapActions(['fetchChannelList']),
     ...mapActions(['fetchChannelList']),
     ...mapActionsList(['fetchProductList']),
     ...mapActionsList(['fetchProductList']),
@@ -205,7 +210,7 @@ export default {
      },
      },
      setYasParam: function(params) {
      setYasParam: function(params) {
       let {total, list} = this.productList;
       let {total, list} = this.productList;
-      
+
       if (params && typeof params === 'object' && Object.keys(params).length) {
       if (params && typeof params === 'object' && Object.keys(params).length) {
         let P_NAME = 'XY_UFOSearchList', TYPE_ID = 1, P_PARAM = '', PRD_LIST = [];
         let P_NAME = 'XY_UFOSearchList', TYPE_ID = 1, P_PARAM = '', PRD_LIST = [];
         for (let item of list) {
         for (let item of list) {
@@ -276,7 +281,7 @@ export default {
       //   this.$refs.scroll.forceUpdate();
       //   this.$refs.scroll.forceUpdate();
       //   return;
       //   return;
       // }
       // }
-      
+
       await this.fetchList(this.selectedCategory);
       await this.fetchList(this.selectedCategory);
       this.$refs.scroll.forceUpdate();
       this.$refs.scroll.forceUpdate();
     },
     },
@@ -455,7 +460,7 @@ export default {
     position: relative;
     position: relative;
     z-index: 1;
     z-index: 1;
   }
   }
-  
+
   .channel-no-item {
   .channel-no-item {
     padding-top: 200px;
     padding-top: 200px;
   }
   }

+<template>
+  <div class="bg">
+    <div class="product-list-item"  @click="goDetail(product, itemIndex)"
+         :key="itemIndex" :class="(itemIndex) % 2 === 0 && 'magrin-right'">
+      <div class="item-top">
+        <div class="item-price">
+          <span class="price-flag">{{product[priceKey] && '¥'}}</span><span>{{product[priceKey] || ' '}}</span>
+        </div>
+        <div class="item-sales">{{product.sales && product.sales + '人付款'}}</div>
+      </div>
+      <ImgSize class="item-imge" :src="product.default_images" :width="274" :height="274"/>
+      <div class="item-name">{{product.product_name}}</div>
+    </div>
+  </div>
+</template>
+
+<script>
+  import {Scroll} from 'cube-ui';
+  import ImgSize from '../../../components/img-size';
+
+  export default {
+    props: {
+      list: Array,
+      product: Object,
+      itemIndex: Number,
+      yasParams: Object,
+      priceKey: {
+        type: String,
+        default: 'available_now_price',
+      },
+    },
+    data: function() {
+      return {
+        yasFirstId: 0,
+      };
+    },
+    methods: {
+      goDetail(product, index) {
+        if (this.yasParams && Object.keys(this.yasParams).length) {
+          this.yasDetail(product.id, index);
+        }
+        this.$router.push({
+          name: 'ProductDetail',
+          params: {
+            productId: product.id,
+          }
+        });
+      },
+      yasShowEvent(height) {
+        // 获取列表单个元素高度
+        let index = 0;
+
+        if (height) {
+          // 获取第一个曝光元素
+          let item = document.querySelector('.product-list-item');
+          let itemHeight = item.offsetHeight;
+          let row = parseInt((height - 12) / itemHeight) + 1;
+
+          index = row * 2 - 2;
+        }
+
+        // 获取曝光列表
+        let list = [];
+
+        for (let i = 0; i < 6; i++) {
+          if (this.list[i + index]) {
+            list.push(this.list[i + index]);
+          }
+        }
+
+        // 判断是否是重复曝光
+        if (list.length && list[0].id !== this.yasFirstId) {
+          this.yasFirstId = list[0].id;
+
+          // 1.P_NAME：页面名称，XY_UFOSearchList，XY_UFOSeriesList，XY_UFOBrandList、XY_UFOProductPoolList等；
+          // 2.TYPE_ID：列表页入口类型，1-搜索结果页，2-系列，3-品牌，4-商品池；
+          // 3.P_PARAM：页面参数，搜索关键词，系列ID，品牌ID，商品池ID；
+          // 4.TAB_ID：tab切id，1-人气，2-价格，3-新品；
+          // 5.TAB_NAME：tab切名称，人气，价格，新品；
+          // 6.I_INDEX：曝光顺序；
+          // 7.PRD_ID：商品id；
+          let DATA = [];
+
+          list.map((value, i) => {
+            DATA.push({...this.yasParams, I_INDEX: i + index, PRD_ID: value.id});
+          });
+          this.$store.dispatch('reportYas', {
+            params: {
+              param: {DATA},
+              appop: 'XY_UFO_SHOW_EVENT'
+            }
+          });
+        }
+      },
+
+      yasDetail(id, index) {
+        // XY_UFO_PRD_LIST_C
+        // 1.P_NAME：页面名称，XY_UFOSearchList，XY_UFOSeriesList，XY_UFOBrandList、XY_UFOProductPoolList等；
+        // 2.TYPE_ID：列表页入口类型，1-搜索结果页，2-系列，3-品牌，4-商品池；
+        // 3.P_PARAM：页面参数，搜索关键词，系列ID，品牌ID，商品池ID；
+        // 4.TAB_ID：tab切id，1-人气，2-价格，3-新品；
+        // 5.TAB_NAME：tab切名称，人气，价格，新品；
+        // 6.I_INDEX：商品顺序号，从1开始递增；
+        // 7.PRD_ID：商品id
+        this.$store.dispatch('reportYas', {
+          params: {
+            param: {...this.yasParams, I_INDEX: index, PRD_ID: id },
+            appop: 'XY_UFO_PRD_LIST_C'
+          }
+        });
+      }
+    },
+    components: {
+      ImgSize,
+      Scroll,
+    }
+  };
+</script>
+
+<style lang="scss" scoped>
+  .magrin-right {
+    margin-right: 14px;
+  }
+
+  .product-list-item {
+    border-radius: 16px;
+    width: 344px;
+    padding: 24px 24px 32px;
+    // height: 498px;
+    background: #fff;
+    margin-bottom: 16px;
+  }
+
+  .item-top {
+    height: 40px;
+    display: flex;
+    justify-content: space-between;
+    margin-bottom: 32px;
+    align-items: center;
+  }
+
+  .item-price {
+    color: #d0021b;
+    font-size: 32px;
+    vertical-align: center;
+  }
+
+  .item-imge {
+    width: 274px;
+    height: 274px;
+    margin: 0 10px;
+  }
+
+  .item-name {
+    font-size: 24px;
+    color: #000;
+    letter-spacing: 0;
+    line-height: 40px;
+    margin-top: 14px;
+    word-break: break-all;
+    display: -webkit-box;
+    -webkit-line-clamp: 2;
+    -webkit-box-orient: vertical;
+    overflow: hidden;
+  }
+
+  .item-sales {
+    font-size: 22px;
+    color: #999;
+  }
+
+  .price-flag {
+    font-size: 24px;
+  }
+
+  .bg {
+    padding: 24px;
+    display: flex;
+    flex-wrap: wrap;
+  }
+</style>