...
|
...
|
@@ -14,7 +14,13 @@ export default { |
|
|
name: 'ResourceBox',
|
|
|
data() {
|
|
|
return {
|
|
|
componentStatus: {}
|
|
|
componentStatus: {},
|
|
|
waiting: [],
|
|
|
pageNameMap: {
|
|
|
'channel.home': 'FP_BLK_Home_h5',
|
|
|
'channel.channelHome.channelMen': 'FP_BLK_MenHome_h5',
|
|
|
'channel.channelHome.channelWomen': 'FP_BLK_WomenHome_h5',
|
|
|
}
|
|
|
};
|
|
|
},
|
|
|
computed: {
|
...
|
...
|
@@ -27,7 +33,7 @@ export default { |
|
|
}
|
|
|
},
|
|
|
['yoho.visible'](visible) {
|
|
|
if (visible && this.$yoho && this.$yoho.isiOS) {
|
|
|
if (visible && this.$yoho) {
|
|
|
this.checkReport(void 0, true);
|
|
|
}
|
|
|
}
|
...
|
...
|
@@ -43,6 +49,14 @@ export default { |
|
|
this.$scrollEl.addEventListener('scroll', this.scrollEvent);
|
|
|
this.checkReport(void 0, true);
|
|
|
}
|
|
|
|
|
|
// 每隔三秒钟上报一次数据
|
|
|
setInterval(() => {
|
|
|
if (this.waiting.length) {
|
|
|
this.report(this.waiting);
|
|
|
this.waiting = [];
|
|
|
}
|
|
|
}, 3000);
|
|
|
},
|
|
|
destroyed() {
|
|
|
if (this.$scrollEl) {
|
...
|
...
|
@@ -50,43 +64,115 @@ export default { |
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
report(param) {
|
|
|
|
|
|
const prefix = this.yoho.env.isiOS ? 'i' : (this.yoho.env.isAndroid ? 'a' : '');
|
|
|
_.each(param, item => {
|
|
|
if (this.pageNameMap[item.P_NAME]) {
|
|
|
item.P_NAME = this.pageNameMap[item.P_NAME];
|
|
|
}
|
|
|
item.P_NAME = `${prefix}${item.P_NAME}`;
|
|
|
});
|
|
|
|
|
|
this.$store.dispatch(REPORT_YAS, {
|
|
|
params: {
|
|
|
appop: 'YB_SHOW_EVENT',
|
|
|
param
|
|
|
}
|
|
|
});
|
|
|
},
|
|
|
checkReport(evt, isInit) {
|
|
|
if (isInit) {
|
|
|
this.componentStatus = {};
|
|
|
}
|
|
|
_.each(this.$children, (component, index) => {
|
|
|
const visiable = this.isVisiable(component.$el, this.$scrollEl);
|
|
|
const visible = this.isVisible(component.$el, this.$scrollEl);
|
|
|
|
|
|
if (visiable && (this.componentStatus[index] !== visiable || isInit)) {
|
|
|
this.report(component, index + 1);
|
|
|
if (visible && (this.componentStatus[index] !== visible || isInit)) {
|
|
|
this.record(component, index + 1, isInit);
|
|
|
}
|
|
|
this.componentStatus[index] = visiable;
|
|
|
this.componentStatus[index] = visible;
|
|
|
});
|
|
|
},
|
|
|
report(component, index) {
|
|
|
record(component, index) {
|
|
|
const reportData = _.get(component, '$options.propsData.value');
|
|
|
|
|
|
// 区分不通组件记录以楼层内item为单位、而不是以整个楼层为单位组织数据上报
|
|
|
let param;
|
|
|
if (reportData) {
|
|
|
const param = {
|
|
|
P_NAME: this.$route.name,
|
|
|
F_NAME: reportData.template_name,
|
|
|
F_ID: reportData.template_id,
|
|
|
F_INDEX: index
|
|
|
};
|
|
|
switch (reportData.template_name) {
|
|
|
case 'twoPicture':
|
|
|
param = [];
|
|
|
_.each(reportData.data.list, (item, idx) => {
|
|
|
param.push({
|
|
|
P_NAME: this.$route.name,
|
|
|
F_NAME: reportData.template_name,
|
|
|
F_ID: reportData.template_id,
|
|
|
F_INDEX: index,
|
|
|
I_INDEX: idx + 1,
|
|
|
ACTION_URL: item.url
|
|
|
});
|
|
|
});
|
|
|
break;
|
|
|
|
|
|
case 'focus':
|
|
|
// 由于focus自动轮播的特殊性、上报数据由focus直接调用父组件方法
|
|
|
// 修改waiting数组所以这里不做数据监测
|
|
|
break;
|
|
|
|
|
|
case 'tfGoodsList':
|
|
|
// 楼层内存在多个item, 交给子组件各自检测
|
|
|
let visible = component.checkReqFromParent();
|
|
|
if (visible.length) {
|
|
|
param = [];
|
|
|
_.each(visible, item => {
|
|
|
param.push(Object.assign(item, {
|
|
|
P_NAME: this.$route.name,
|
|
|
F_NAME: reportData.template_name,
|
|
|
F_ID: reportData.template_id,
|
|
|
F_INDEX: index,
|
|
|
}));
|
|
|
});
|
|
|
}
|
|
|
break;
|
|
|
|
|
|
case 'newSingleImage':
|
|
|
param = {
|
|
|
P_NAME: this.$route.name,
|
|
|
F_NAME: reportData.template_name,
|
|
|
F_ID: reportData.template_id,
|
|
|
F_INDEX: index,
|
|
|
I_INDEX: 1,
|
|
|
ACTION_URL: reportData.data.list[0].url
|
|
|
};
|
|
|
break;
|
|
|
default:
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
this.$store.dispatch(REPORT_YAS, {
|
|
|
params: {
|
|
|
appop: 'YB_SHOW_EVENT',
|
|
|
param
|
|
|
}
|
|
|
});
|
|
|
if (param) {
|
|
|
_.isArray(param) ? (this.waiting = this.waiting.concat(param)) : this.waiting.push(param);
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
isVisiable($el, $parent) {
|
|
|
isVisible($el, $parent) {
|
|
|
const rect = $el.getBoundingClientRect();
|
|
|
const parentRect = $parent.getBoundingClientRect();
|
|
|
|
|
|
return ((parentRect.top >= rect.top && parentRect.top <= (rect.top + rect.height)) ||
|
|
|
((parentRect.top + parentRect.height) >= rect.top && (parentRect.top + parentRect.height) <= (rect.top + rect.height)) ||
|
|
|
(rect.top >= parentRect.top && (rect.top + rect.height) <= (parentRect.top + parentRect.height)));
|
|
|
((parentRect.top + parentRect.height) >= rect.top && (parentRect.top + parentRect.height) <= (rect.top + rect.height)) ||
|
|
|
(rect.top >= parentRect.top && (rect.top + rect.height) <= (parentRect.top + parentRect.height)));
|
|
|
},
|
|
|
checkReqFromChild(index) {
|
|
|
// 重置子组件显示状态方可重新记录
|
|
|
this.componentStatus[index] = false;
|
|
|
this.checkReport();
|
|
|
},
|
|
|
focusComponentDataRecord(index, param) {
|
|
|
if (this.componentStatus[index] && document.visibilityState === 'visible') {
|
|
|
this.waiting.push(param);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
</script> |
|
|
\ No newline at end of file |
|
|
</script> |
...
|
...
|
|