fe / yohoblk-wap · Commits

Go to a project

Authored by 李奇
Commit 6e1777449cbeb9a42f792c5bbebc8f4a97c7f8bd 1 parent cbedf798

检索页商品跳转详情添加上报参数

Inline Side-by-side
Showing 6 changed files with 60 additions and 31 deletions
@@ -76,7 +76,7 @@ function GoodHrefBinding(el, binding) { @@ -76,7 +76,7 @@ function GoodHrefBinding(el, binding) {
76 if (binding.value === binding.oldValue) { 76 if (binding.value === binding.oldValue) {
77 return; 77 return;
78 } 78 }
79 - let {product_id, goods_id, cn_alphabet, product_skn} = binding.value; 79 + let {product_id, goods_id, cn_alphabet, product_skn, from_page_name, from_page_param} = binding.value;
80 80
81 if (!binding.modifiers.collect) { 81 if (!binding.modifiers.collect) {
82 goods_id = binding.value.goods_list.length ? binding.value.goods_list[0].goods_id : ''; 82 goods_id = binding.value.goods_list.length ? binding.value.goods_list[0].goods_id : '';
@@ -87,7 +87,9 @@ function GoodHrefBinding(el, binding) { @@ -87,7 +87,9 @@ function GoodHrefBinding(el, binding) {
87 let goParams = { 87 let goParams = {
88 action: 'go.productDetail', 88 action: 'go.productDetail',
89 params: { 89 params: {
90 - product_skn: product_skn 90 + product_skn: product_skn,
  91 + from_page_name,
  92 + from_page_param
91 } 93 }
92 }; 94 };
93 95
@@ -14,7 +14,7 @@ @@ -14,7 +14,7 @@
14 pageName: { 14 pageName: {
15 type: String 15 type: String
16 }, 16 },
17 - pageParams: { 17 + pageParam: {
18 type: String 18 type: String
19 }, 19 },
20 index: { 20 index: {
@@ -36,13 +36,12 @@ @@ -36,13 +36,12 @@
36 // 元素由不可见变为可见则记录，否则不记录 36 // 元素由不可见变为可见则记录，否则不记录
37 if (!this.isVisiable && visible) { 37 if (!this.isVisiable && visible) {
38 const param = { 38 const param = {
39 - P_NAME: this.pageName, // 页面名称  
40 - P_PARAM: this.pageParams, // 页面参数 39 + P_NAME: this.pageName || '', // 页面名称
  40 + P_PARAM: this.pageParam || '', // 页面参数
41 I_INDEX: this.index, // 内部item的序号 41 I_INDEX: this.index, // 内部item的序号
42 PRD_SKN: this.productSkn // 商品SKN （可选） 42 PRD_SKN: this.productSkn // 商品SKN （可选）
43 }; 43 };
44 44
45 - console.log('push')  
46 this.waitingReport.push(param); 45 this.waitingReport.push(param);
47 } 46 }
48 this.isVisiable = visible; 47 this.isVisiable = visible;
@@ -11,7 +11,10 @@ @@ -11,7 +11,10 @@
11 export default { 11 export default {
12 name: 'Exposure', 12 name: 'Exposure',
13 props: { 13 props: {
14 - topClassName: String 14 + topClassName: {
  15 + type: String,
  16 + default: 'top-filter'
  17 + }
15 }, 18 },
16 data() { 19 data() {
17 return { 20 return {
@@ -43,26 +46,28 @@ @@ -43,26 +46,28 @@
43 created() { 46 created() {
44 }, 47 },
45 mounted() { 48 mounted() {
46 - const filterRect = document.querySelector(`.${this.topClassName}`).getBoundingClientRect(); 49 + let timer = setInterval(() => {
  50 + const filterRect = document.querySelector(`.${this.topClassName}`).getBoundingClientRect();
47 51
48 - // 可见区域顶部距离视口的上边的距离  
49 - this.viewArea.top = filterRect.bottom; 52 + // 可见区域顶部距离视口的上边的距离
  53 + this.viewArea.top = filterRect.bottom;
50 54
51 - // 可见区域底部距离视口的上边的距离  
52 - this.viewArea.bottom = window.screen.height; 55 + // 可见区域底部距离视口的上边的距离
  56 + this.viewArea.bottom = window.screen.height;
53 57
54 - this.$scrollEl = window;  
55 - this.scrollEvent = util.throttle(500, this.checkReport);  
56 - if (this.$scrollEl) {  
57 - this.$scrollEl.addEventListener('scroll', this.scrollEvent); 58 + this.$scrollEl = window;
  59 + this.scrollEvent = util.throttle(500, this.checkReport);
  60 + if (this.$scrollEl) {
  61 + this.$scrollEl.addEventListener('scroll', this.scrollEvent);
  62 +
  63 + }
  64 +
  65 + if (this.$children.length) {
  66 + clearInterval(timer);
  67 + this.checkReport(void 0, true);
  68 + }
  69 + }, 500);
58 70
59 - let timer = setInterval(() => {  
60 - if (this.$children.length) {  
61 - clearInterval(timer);  
62 - this.checkReport(void 0, true);  
63 - }  
64 - }, 500);  
65 - }  
66 setInterval(() => { 71 setInterval(() => {
67 _.each(_.filter(this.$children, child => child.$options.name === 'ExposureItem'), child => child.report()); 72 _.each(_.filter(this.$children, child => child.$options.name === 'ExposureItem'), child => child.report());
68 }, 3000); 73 }, 3000);
1 <template> 1 <template>
2 <div class="goods-box" v-infinite-scroll="fetch" infinite-scroll-disable="disableFetch" :infinite-scroll-distance="1200"> 2 <div class="goods-box" v-infinite-scroll="fetch" infinite-scroll-disable="disableFetch" :infinite-scroll-distance="1200">
3 <ul class="cardlist card-large clearfix"> 3 <ul class="cardlist card-large clearfix">
4 - <exposure> 4 + <exposure :top-class-name="topClassName">
5 <li class="card" v-for="(item, index) in data" :key="item.product_skn" 5 <li class="card" v-for="(item, index) in data" :key="item.product_skn"
6 @click="clickProduct(item, index)"> 6 @click="clickProduct(item, index)">
7 - <exposure-item page-name="test" page-params="params" :index="index" 7 + <exposure-item :page-name="reportPageName" :page-param="reportPageParam" :index="index"
8 :product-skn="item.product_skn"> 8 :product-skn="item.product_skn">
9 <div class="card-pic"> 9 <div class="card-pic">
10 <a v-good-href="item" :class="hrefClass"> 10 <a v-good-href="item" :class="hrefClass">
@@ -57,9 +57,15 @@ export default { @@ -57,9 +57,15 @@ export default {
57 /* 开启滚动加载 */ 57 /* 开启滚动加载 */
58 disableFetch: Boolean, 58 disableFetch: Boolean,
59 59
  60 + topClassName: String,
  61 +
60 // 数据 62 // 数据
61 data: Array, 63 data: Array,
62 - state: [Number, Object] // -1: 无数据 0: 全部加载完 1: 正在加载 64 + state: [Number, Object], // -1: 无数据 0: 全部加载完 1: 正在加载
  65 +
  66 + // for yas report
  67 + reportPageName: String,
  68 + reportPageParam: String,
63 }, 69 },
64 computed: { 70 computed: {
65 // 空列表: data.length === 0 71 // 空列表: data.length === 0
@@ -67,6 +73,12 @@ export default { @@ -67,6 +73,12 @@ export default {
67 return !this.data.length; 73 return !this.data.length;
68 } 74 }
69 }, 75 },
  76 + watch: {
  77 + reportPageName(v) {
  78 + console.log(v)
  79 + }
  80 +
  81 + },
70 mounted() { 82 mounted() {
71 const $scrollEl = this.getScrollEventTarget(this.$el); 83 const $scrollEl = this.getScrollEventTarget(this.$el);
72 84
1 <template> 1 <template>
2 <div class="goods"> 2 <div class="goods">
3 - <product-list :data="productList"></product-list> 3 + <product-list :data="productList" top-class-name="channel-tab"></product-list>
4 </div> 4 </div>
5 </template> 5 </template>
6 6
1 <template> 1 <template>
2 <div> 2 <div>
3 <filter-box :val="order" :filter="filterConfig" v-if="enableOrder" :search-page="true"></filter-box> 3 <filter-box :val="order" :filter="filterConfig" v-if="enableOrder" :search-page="true"></filter-box>
4 - <product-list :data="productList" :state="listState" class="list-items" @click-product="clickProduct"></product-list> 4 + <product-list :data="productList" :state="listState" class="list-items"
  5 + @click-product="clickProduct" :report-page-name="pageName"
  6 + :report-page-param="query"></product-list>
5 </div> 7 </div>
6 </template> 8 </template>
7 <script> 9 <script>
8 import Vue from 'vue'; 10 import Vue from 'vue';
  11 + import _ from 'lodash';
9 import $ from 'jquery'; 12 import $ from 'jquery';
10 import lazyload from 'vue-lazyload'; 13 import lazyload from 'vue-lazyload';
11 import infinitScroll from 'vue-infinite-scroll'; 14 import infinitScroll from 'vue-infinite-scroll';
@@ -37,7 +40,10 @@ @@ -37,7 +40,10 @@
37 inSearching: false, 40 inSearching: false,
38 enableOrder: false, 41 enableOrder: false,
39 filterConfig: null, 42 filterConfig: null,
40 - filter: {} 43 + filter: {},
  44 +
  45 + // for yas report
  46 + pageName: 'h5FP_search',
41 }; 47 };
42 }, 48 },
43 computed: { 49 computed: {
@@ -89,7 +95,6 @@ @@ -89,7 +95,6 @@
89 95
90 this.inSearching = true; 96 this.inSearching = true;
91 97
92 -  
93 return $.get(this.url, Object.assign({ 98 return $.get(this.url, Object.assign({
94 order: this.order, // 排序 信息 99 order: this.order, // 排序 信息
95 query: this.query, 100 query: this.query,
@@ -99,8 +104,14 @@ @@ -99,8 +104,14 @@
99 if (res.data) { 104 if (res.data) {
100 this.page = res.data.page; 105 this.page = res.data.page;
101 this.totalPage = res.data.page_total; 106 this.totalPage = res.data.page_total;
102 - this.productList = this.productList.concat(res.data.product_list);  
103 107
  108 + // yas report param injection
  109 + _.each(res.data.product_list, item => {
  110 + item.from_page_name = this.pageName;
  111 + item.from_page_param = this.query;
  112 + });
  113 +
  114 + this.productList = this.productList.concat(res.data.product_list);
104 if (!this.filterConfig) { 115 if (!this.filterConfig) {
105 this.filterConfig = res.data.filter; 116 this.filterConfig = res.data.filter;
106 } 117 }