Merge branch 'develop' of git.yoho.cn:fe/xianyu-ufo-app-web into develop

baoss
Commit e023f323de540e95248f6f01071f29dd4cdc76e8 2 parents b588ae3b 7c484d8f
Showing 11 changed files with 237 additions and 95 deletions
apps/components/order-promotion-list/promotion-list.vue
apps/pages/category/category.vue
apps/pages/home/coupon/list.vue
apps/pages/home/favorite/favorite.vue
apps/pages/home/news/components/list.vue
apps/pages/list/components/productList.vue
apps/pages/list/filtrate.vue
apps/pages/list/list.vue
apps/pages/order/buyer-ask-order.vue
apps/pages/order/seller-ask-order.vue
apps/pages/product/components/activity-list-sheet.vue
--- a/apps/components/order-promotion-list/promotion-list.vue
View file @e023f32
+++ b/apps/components/order-promotion-list/promotion-list.vue
View file @e023f32
@@ -165,6 +165,7 @@ export default {
 .coupon-name {
   font-size: 24px;
+  font-weight: bold;
   color: #002b47;
   margin-bottom: 10px;
 }
--- a/apps/pages/category/category.vue
View file @e023f32
+++ b/apps/pages/category/category.vue
View file @e023f32
@@ -4,20 +4,19 @@
             <div class="left-content">
                 <Scroll>
                     <div class="category-left-item-root"
-                         v-for="(item, index) in categoryParent"
-                         :key="index"
-                         :data-id="item"
-                         @click="onClick(item)">
-                            <div :class="{'category-left-item-select-flag' : item.isSelect }"></div>
-                            <p
-                              class="category-left-item-title"
-                              :class="{'category-left-item-select' : item.isSelect }">
-                            {{item.name}}
-                            </p>
+                      v-for="(item, index) in categoryParent"
+                      :key="index"
+                      :class="{'category-left-item-select-flag' : item.isSelect }"
+                      :data-id="item"
+                      @click="onClick(item)">
+                      <p
+                        class="category-left-item-title"
+                        :class="{'category-left-item-select' : item.isSelect }">
+                        {{item.name}}
+                      </p>
                     </div>
                 </Scroll>
             </div>
-            <div class="left-right-split-line"></div>
             <div class="right-content">
                 <Scroll>
                     <div v-for="(itemSub, index) in categorySubList" :key="index">
@@ -35,8 +34,8 @@
                                       :width="60"
                                       :height="60"
                                     />
-                                    <p class="item-title">{{item.name}}</p>
                                 </div>
+                                <p class="item-title">{{item.name}}</p>
                                 <LayoutLink v-if="item.isShow" class="item-a-div" :href="item.link"></LayoutLink>
                             </div>
                         </div>
@@ -114,22 +113,19 @@ export default {
       background-color: #FFFFFF;
     }
-    .left-right-split-line {
-      height: 100%;
-      width: 2px;
-      background-color: #EEEEEE;
-    }
-
     .left-content {
-      width: 30%;
+      width: 28%;
       height: 100%;
+      border-right: 1px solid #EEEEEE;
+      flex-shrink: 0;
     }
     .right-content {
       display: flex;
       flex-direction: column;
-      width: 70%;
+      flex-grow: 1;
       height: 100%;
+      margin: 0 20px;
     }
     .category-left-item-root {
@@ -139,6 +135,7 @@ export default {
       align-items: center;
       height: 104px;
       line-height: 104px;
+      position: relative;
     }
     .category-left-item-title {
@@ -154,17 +151,19 @@ export default {
     }
     .category-left-item-select {
-      font-size: 48px;
+      font-size: 44px;
       color: #000000;
     }
-    .category-left-item-select-flag {
-      width: 9px;
+    .category-left-item-select-flag:before {
+      content: "";
+      width: 6px;
       height: 48px;
-      margin-bottom: 10px;
-      margin-top: 10px;
+      position: absolute;
+      left: 0;
+      top: 50%;
+      margin-top: -24px;
       background-color: #000000;
-      justify-self: flex-start;
     }
     .category-sub-root {
@@ -182,21 +181,17 @@ export default {
     .item-div {
       position: relative;
-      display: flex;
       flex: 0 0 33%;
-      height: 195px;
+      padding: 20px 0;
     }
     .item-imge-div {
-      height: 100%;
       width: 100%;
+      height: 130px;
       display: flex;
-      flex-direction: column;
-      justify-content: space-between;
-      position: absolute;
-      z-index: 1;
-      padding-top: 20px;
-      padding-bottom: 20px;
+      align-items: center;
+      justify-content: center;
+      position: relative;
     }
     .item-imge {
@@ -213,7 +208,6 @@ export default {
       display: -webkit-box;
       -webkit-box-orient: vertical;
       overflow: hidden;
-
     }
     .item-a-div {
--- a/apps/pages/home/coupon/list.vue
View file @e023f32
+++ b/apps/pages/home/coupon/list.vue
View file @e023f32
 <template>
-  <LayoutApp>
+  <LayoutApp title="我的优惠券">
     <div class="tab">
       <div class="item right-line" :class="type ==='unused' ?  'item-selected' : 'item-default'"
            @click="onChangeList('unused')">未使用{{unused.total && '('+ unused.total + ')' || null}}
@@ -84,7 +84,8 @@ export default {
         bounce: {
           top: false
         },
-        pullUpLoad: true
+        pullUpLoad: true,
+        pullDownRefresh: false
       },
       type: 'unused',
       list: [],
@@ -218,6 +219,7 @@ export default {
       .item-price {
         font-size: 72px;
+        font-weight: bold;
         color: #002B47;
       }
--- a/apps/pages/home/favorite/favorite.vue
View file @e023f32
+++ b/apps/pages/home/favorite/favorite.vue
View file @e023f32
 <template>
-  <LayoutApp :show-back="true" :title="title">
-    <Scroll 
-            ref="scrolllist"
-            :scroll-events="['scroll-end','scroll']"
-            @scroll-end="fetchList(isMore)"
-            v-if="favoriteProductList.list.length"
-            class="fav-scroll-bg"
-            >
+  <LayoutApp :show-back="true" :title="title" class="favorite-wrapper">
+    <Scroll
+      ref="scrolllist"
+      :scroll-events="['scroll-end', 'scroll']"
+      @scroll-end="fetchList(isMore)"
+      v-if="favoriteProductList.list.length"
+      class="fav-scroll-bg"
+    >
       <ProductList :list="favoriteProductList.list"></ProductList>
     </Scroll>
     <!-- <empty-list v-show="!isShowEmpty" /> -->
-    <UfoNoItem :tip="`暂无数据`" v-else></UfoNoItem>
+    <UfoNoItem class="empty" :tip="`暂无数据`" v-else></UfoNoItem>
   </LayoutApp>
 </template>
 <script>
-import ProductList from '../../list/components/productList';
+import ProductList from "../../list/components/productList";
 import EmptyList from "../../order/order-list/components/empty";
-import UfoNoItem from '../../../components/ufo-no-item'
-import {Scroll} from 'cube-ui';
-import {createNamespacedHelpers} from 'vuex';
+import UfoNoItem from "../../../components/ufo-no-item";
+import { Scroll } from "cube-ui";
+import { createNamespacedHelpers } from "vuex";
-const {mapState, mapActions} = createNamespacedHelpers('home/favorite');
+const { mapState, mapActions } = createNamespacedHelpers("home/favorite");
 export default {
-  name: 'list',
+  name: "list",
   components: {
     ProductList,
     Scroll,
@@ -34,22 +34,22 @@ export default {
     return {
       scrollToY: -200,
       scrollToTime: 700,
-      scrollToEasing: 'bounce',
+      scrollToEasing: "bounce",
       scrollToEasingOptions: [
         {
-          text: 'bounce',
-          value: 'bounce'
+          text: "bounce",
+          value: "bounce"
         },
         {
-          text: 'swipe',
-          value: 'swipe'
+          text: "swipe",
+          value: "swipe"
         },
         {
-          text: 'swipeBounce',
-          value: 'swipeBounce'
+          text: "swipeBounce",
+          value: "swipeBounce"
         }
       ],
-      title: '我的收藏',
+      title: "我的收藏",
       scrollOptions: {
         bounce: {
           top: false
@@ -62,39 +62,38 @@ export default {
   // mounted() {
   //   this.fetchFavoriteList();
   // },
-  activated(){
-    console.log('favorite====activated')
+  activated() {
+    console.log("favorite====activated");
     let params = {
-      isReset: true,
+      isReset: true
     };
-    
-    this.fetchFavoriteList({isReset: true});
+
+    this.fetchFavoriteList({ isReset: true });
     // this.scrollToTop();
   },
   methods: {
-    ...mapActions(['fetchFavoriteList']),
+    ...mapActions(["fetchFavoriteList"]),
     scrollToTop() {
       // let height = this.$refs.scroll.scrollHeight
-      console.log(this.$refs)
-      console.log(this.$refs.scrolllist)
+      console.log(this.$refs);
+      console.log(this.$refs.scrolllist);
       this.$refs.scroll.scrollTo(
         0,
         this.scrollToY,
         this.scrollToTime,
         ease[this.scrollToEasing]
-      )
+      );
     },
     async fetchList(isMore) {
-      if(this.isMore){
+      if (this.isMore) {
         let params = {
-          isReset: false,
+          isReset: false
         };
-        await this.fetchFavoriteList({isReset: false});
+        await this.fetchFavoriteList({ isReset: false });
       }
-      
-    },
+    }
     // scroll({ y }) {
     //   const height = this.$refs.banner.$el.offsetHeight + this.$refs.header.offsetHeight;
@@ -105,15 +104,27 @@ export default {
     //   }
     // }
   },
-  
+
   computed: {
-    ...mapState(['favoriteProductList','isMore']),
-  },
+    ...mapState(["favoriteProductList", "isMore"])
+  }
 };
 </script>
-<style scoped>
-  .fav-scroll-bg {
-    background-color: #f5f5f5;
+<style lang="scss" scoped>
+.favorite-wrapper {
+  /deep/ .layout-context {
+    display: flex;
+    flex-direction: column;
   }
+
+  .empty {
+    flex: 1;
+  }
+}
+
+.fav-scroll-bg {
+  background-color: #f5f5f5;
+}
 </style>
+
--- a/apps/pages/home/news/components/list.vue
View file @e023f32
+++ b/apps/pages/home/news/components/list.vue
View file @e023f32
@@ -36,6 +36,7 @@ export default {
   .news-list-title {
     margin-top: 60px;
     font-size: 40px;
+    font-weight: bold;
     color: #000000;
   }
   .news-list-content {
--- a/apps/pages/list/components/productList.vue
View file @e023f32
+++ b/apps/pages/list/components/productList.vue
View file @e023f32
 <template>
   <div class="bg">
-    <div class="item" v-if="list.length" v-for="(product,index) in list" @click="goDetail(product)"
+    <div class="product-list-item" v-if="list.length" v-for="(product,index) in list" @click="goDetail(product, index)"
          :key="index" :class="(index) % 2 === 0 && 'magrin-right'">
       <div class="item-top">
         <div class="item-price">
@@ -21,15 +21,87 @@ import ImgSize from '../../../components/img-size';
 export default {
   props: {
     list: Array,
+    param: Object,
+  },
+  data: function() {
+    return {
+      yasFirstId: 0,
+    };
   },
   methods: {
-    goDetail(product) {
+    goDetail(product, index) {
+      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.param, I_INDEX: i + index, PRD_ID: value.id});
+        });
+        console.log(DATA)
+        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
+      console.log({...this.param, I_INDEX: index, PRD_ID: id })
+      this.$store.dispatch('reportYas', {
+        params: {
+          param: {...this.param, I_INDEX: index, PRD_ID: id },
+          appop: 'XY_UFO_SHOW_EVENT'
+        }
+      });
     }
   },
   components: {
@@ -44,7 +116,7 @@ export default {
     margin-right: 14px;
   }
-  .item {
+  .product-list-item {
     border-radius: 16px;
     width: 344px;
     padding: 24px;
--- a/apps/pages/list/filtrate.vue
View file @e023f32
+++ b/apps/pages/list/filtrate.vue
View file @e023f32
@@ -169,7 +169,6 @@ export default {
         for (let key in filter) {
           filterParams[key] = filter[key];
         }
-        console.log(filterParams);
         this.filterParams = filterParams;
       }
     },
--- a/apps/pages/list/list.vue
View file @e023f32
+++ b/apps/pages/list/list.vue
View file @e023f32
@@ -19,12 +19,14 @@
         </div>
       </div>
       <Scroll ref="scroll" class="product-list" v-show="!productList.isEmpty"
+              :scroll-events="['scroll-end']"
               :options="scrollOptions"
               :data="productList.list"
+              @scroll-end="scrollHandler"
               @pulling-up="onPullingUp">
-        <ProductList :list="productList.list"></ProductList>
+        <ProductList ref="product" :list="productList.list" :param="yasParams"></ProductList>
       </Scroll>
-      <EmptyList class="empty-wrapper product-list" :tip="`暂无数据`" v-show="productList.isEmpty" >
+      <EmptyList class="empty-wrapper product-list" :tip="`暂无数据`" v-show="productList.isEmpty">
       </EmptyList>
     </LayoutApp>
     <Filtrate ref="filtrate"></Filtrate>
@@ -48,19 +50,21 @@ export default {
     Filtrate,
     EmptyList
   },
-  data() {
+  data: function () {
     return {
       scrollOptions: {
         bounce: {
           top: false
         },
-        pullUpLoad: true
+        pullUpLoad: true,
+        pullDownRefresh: false
       },
       fixed: false,
       selectedType: 2, // tab类型高亮
       priceDesc: true,
       arrowImage: '',
       title: '',
+      yasParams: {P_NAME: 'XY_UFOSearchList', TYPE_ID: 1},
       productList: {
         showErrorPage: false,
         isFetching: false,
@@ -98,6 +102,7 @@ export default {
     this.changeArrow();
     let params = {...this.$route.query};
+    this.setYasParam({param: params, tab: {index: 1, name: '人气'}});
     if (params.title) {
       this.title = params.title;
       delete params.title;
@@ -120,6 +125,12 @@ export default {
       await this.fetchList();
     },
+    scrollHandler({y}) {
+      let height = -y;
+
+      this.$refs.product.yasShowEvent(height);
+    },
+
     // 查询商品列表
     fetchList: async function(params) {
       let searchParams = this.searchParams;
@@ -190,18 +201,21 @@ export default {
       this.selectedType = flag;
       if (flag === 1) {
+        this.setYasParam({tab: {index: 2, name: '价格'}});
         this.priceDesc = !this.priceDesc;
-        params.order = this.priceDesc ? 'p_desc' : 'p_asc';
+        params.order = this.priceDesc ? 'availableNowPrice:asc' : 'availableNowPrice:desc';
       } else if (flag === 2) {
+        this.setYasParam({tab: {index: 1, name: '人气'}});
         this.priceDesc = true;
         params.order = 'sale_desc';
       } else if (flag === 3) {
+        this.setYasParam({tab: {index: 3, name: '新品'}});
         this.priceDesc = true;
         params.order = 'st_desc';
       }
       params.isReset = true;
       this.fetchList(params);
-      this.$refs.scroll.scrollTo(0, 0, 300)
+      this.$refs.scroll.scrollTo(0, 0, 300);
       this.changeArrow();
     },
     goSearch() {
@@ -215,7 +229,43 @@ export default {
     },
     goFilter() {
       this.$refs.filtrate.show();
-    }
+    },
+    setYasParam: function({param, tab}) {
+      if (param && typeof param === 'object' && Object.keys(param).length) {
+        let P_NAME = 'XY_UFOSearchList', TYPE_ID = 1;
+
+        for (let key in param) {
+          if (key === 'brand' && param[key] && param.type !== 6) {
+            P_NAME = 'XY_UFOBrandList';
+            TYPE_ID = 3;
+          }
+          if (key === 'series' && param[key] && param.type !== 6) {
+            P_NAME = 'XY_UFOSeriesList';
+            TYPE_ID = 2;
+          }
+          if (key === 'productPool' && param[key] && param.type !== 6) {
+            P_NAME = 'XY_UFOProductPoolList';
+            TYPE_ID = 4;
+          }
+          if (!param[key]) {
+            delete param[key];
+          }
+        }
+        Object.assign(this.yasParams, {
+          P_NAME,
+          P_PARAM: JSON.stringify(param),
+          TYPE_ID,
+          TAB_ID: this.tabIndex || '',
+          TAB_NAME: this.tabName || ''
+        });
+      }
+
+      if(tab && typeof tab === 'object' && Object.keys(tab).length) {
+        this.yasParams.TAB_ID = tab.index;
+        this.yasParams.TAB_NAME = tab.name;
+      }
+    },
+
   }
 };
 </script>
--- a/apps/pages/order/buyer-ask-order.vue
View file @e023f32
+++ b/apps/pages/order/buyer-ask-order.vue
View file @e023f32
 <!--买家求购确认页-->
 <template>
   <LayoutApp :show-back="true" title="出价求购">
+    <Scroll :options="options">
     <div class="body" ref="body">
+
 <div class="topContainer">
       <!--<div class="topView">-->
         <!--<div class="title"></div>-->
@@ -73,6 +75,7 @@
       <div class="line"></div>
 </div>
+
     </div>
     <div class="bottomContainer">
       <OrderAgree :value="isAgreeTerms" @input="isAgreeTerms = !isAgreeTerms" class="agree-wrapper" :desc="agreeDesc" :url="url"></OrderAgree>
@@ -80,12 +83,13 @@
         <YohoButton class="submit-btn" :txt="submitText" :disable="!isAgreeTerms"  @click="submitClick"></YohoButton>
       </div>
     </div>
+    </Scroll>
   </LayoutApp>
 </template>
 <script>
-import {Input, Button} from 'cube-ui';
+import {Input, Button, Scroll} from 'cube-ui';
 import OrderAddress from './components/confirm/address';
 import DayChoose from './components/askorder/day-choose';
 import OrderAgree from './components/confirm/agree';
@@ -103,6 +107,7 @@ export default {
     Input,
     OrderAddress,
     Button,
+    Scroll,
   },
   data() {
     return {
@@ -111,6 +116,7 @@ export default {
       url: 'https://activity.yoho.cn/feature/6775.html?share_id=9481&title=%E9%97%B2%E9%B1%BC%E4%B9%B0%E5%AE%B6%E5%8D%8F%E8%AE%AE',
       agreeDesc: '有货买家协议',
       submitText: '提交',
+      options: {pullDownRefresh: false}
     };
   },
--- a/apps/pages/order/seller-ask-order.vue
View file @e023f32
+++ b/apps/pages/order/seller-ask-order.vue
View file @e023f32
 <!--卖家求购变现-->
 <template>
   <LayoutApp :show-back="true" title="变现">
+    <Scroll :options="options">
     <div class="body">
       <!--<TitleComp txt="变现"></TitleComp>-->
+
       <ProductInfo :data="originProductData" class="product-info" :priceType="'现货最高求购价：'"></ProductInfo>
       <div class="inputView">
         <span class="inputViewIcon">
@@ -13,13 +15,16 @@
       <OrderMargin class="order-item order-margin" :data="computeTip" :url="url" :superSell="isEntry" ></OrderMargin>
       <OrderFee  class="order-item" :data="computeTip"></OrderFee>
       <AddressInfo :data="addressInfo" class="order-item"></AddressInfo>
+
     </div>
+    </Scroll>
     <div class="footer">
       <OrderAgree :value="isAgreeTerms" @input="isAgreeTerms = !isAgreeTerms" class="agree-wrapper" :desc="agreeDesc" :url="url"></OrderAgree>
       <div class="btn-wrapper">
         <YohoButton :txt="submitText"class="submit-btn" :disable="!isAgreeTerms"  @click="submitClick"></YohoButton>
       </div>
     </div>
+
   </LayoutApp>
 </template>
@@ -64,6 +69,7 @@ export default {
       url: 'http://m.yohobuy.com/activity/student/detail/renzhen?openby:yohobuy={\"action\":\"go.h5\",\"params\":{\"url\":\"https://activity.yoho.cn/feature/3187.html?title=卖家协议\"}}',
       isEntry: false,
       submitText: '提交',
+      options: {pullDownRefresh: false},
     };
   },
--- a/apps/pages/product/components/activity-list-sheet.vue
View file @e023f32
+++ b/apps/pages/product/components/activity-list-sheet.vue
View file @e023f32
@@ -66,7 +66,7 @@ export default {
     }
     span {
-      font-size: 0.8em;
+      font-size: 0.7em;
       line-height: 1.4;
       border: 1px solid #f00;;
       color: #f00;
@@ -91,7 +91,7 @@ export default {
     .sub {
       color: #999;
-      font-size: 0.8em;
+      font-size: 22px;
     }
   }
 </style>